/* * jQuery Mobile Framework : listview plugin * Copyright (c) jQuery Project * Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses. * Note: Code is in draft form and is subject to change */ (function( $ ) { $.widget( "mobile.listview", $.mobile.widget, { options: { theme: "f", countTheme: "f", headerTheme: "b", groupingTheme: "b", splitTheme: "b", inset: false }, _create: function() { var parentID = this.element.closest( ".ui-page" ).attr( "id" ), o = this.options; //if it's a nested list, chunk it into ui-page items, recurse through them and call listview on each individual ul $( this.element.find( "ul,ol" ).get().reverse() ).each(function( i ) { var list = $( this ), id = parentID + "&" + jQuery.mobile.subPageUrlKey + "=listview-" + i, parent = list.parent(), title = parent.contents()[ 0 ].nodeValue, theme = list.data( "theme" ) || o.theme, countTheme = list.data( "count-theme" ) || o.countTheme; list.wrap( "
" ) .parent() .before( "

" + title + "

Back
" ) .parent() .attr({ id: id, "data-theme": theme, "data-count-theme": countTheme }) .appendTo( "body" ) .fixHeaderFooter() .find( ".ui-header a.ui-back" ) .buttonMarkup() .click(function() { history.go(-1); return false; }); parent.html( "" + title + "" ); }).listview(); //create listview markup this.element .addClass( "ui-listview" ) .find( "li" ) .each(function() { var $li = $( this ); if ( $li.is( ":has(img)" ) ) { $li.addClass( "ui-li-has-thumb" ); } if ( $li.is( ":has(.ui-li-aside)" ) ) { var aside = $li.find('.ui-li-aside'); aside.prependTo(aside.parent()); //shift aside to front for css float } $li.addClass( "ui-li" ); if( $li.find('a').length ){ $li .buttonMarkup({ wrapperEls: "div", shadow: false, corners: false, iconpos: "right", icon: "arrow-r", theme: o.theme }) .find( "a" ).eq( 0 ) .addClass( "ui-link-inherit" ); } else{ $li.addClass( "ui-li-grouping ui-btn ui-body-" + o.groupingTheme ); } }); if ( o.inset ) { this.element .addClass( "ui-listview-inset" ) .controlgroup({ shadow: true }); } this.element .find( "li" ).each(function() { //for split buttons $( this ).find( "a" ).eq( 1 ).each(function() { $( this ) .attr( "title", $( this ).text() ) .addClass( "ui-li-link-alt" ) .empty() .buttonMarkup({ shadow: false, corners: false, theme: o.theme }) .find( ".ui-btn-inner" ) .append( $( "" ).buttonMarkup({ shadow: true, corners: true, theme: o.splitTheme, iconpos: "notext", icon: "arrow-r" } ) ); //fix corners if ( o.inset ) { var closestLi = $( this ).closest( "li" ); if ( closestLi.is( "li:first-child" ) ) { $( this ).addClass( "ui-corner-tr" ); } else if ( closestLi.is( "li:last-child" ) ) { $( this ).addClass( "ui-corner-br" ); } } }); }) .find( "img") .addClass( "ui-li-thumb" ); if ( o.inset ) { this.element .find( "img" ) .filter( "li:first-child img" ) .addClass( "ui-corner-tl" ) .end() .filter( "li:last-child img" ) .addClass( "ui-corner-bl" ) .end(); } this.element .find( ".ui-li-count" ) .addClass( "ui-btn-up-" + o.countTheme + " ui-btn-corner-all" ) .end() .find( ":header" ) .addClass( "ui-li-heading" ) .end() .find( "p,ul,dl" ) .addClass( "ui-li-desc" ); // JS fallback for auto-numbering for OL elements if( !$.support.cssPseudoElement && this.element.is('ol') ){ var counter = 1; this.element.find('li').each(function(){ if( $(this).is('.ui-li-grouping') ){ //reset counter when a grouping heading is encountered counter = 1; } else { $(this) .find('.ui-link-inherit:first') .addClass('ui-li-jsnumbering') .prepend('' + counter++ + '. '); } }); } //tapping the whole LI triggers ajaxClick on the first link this.element.find( "li:has(a)" ).live( "tap", function(event) { if( !$(event.target).is('a') ){ $( this ).find( "a:first" ).ajaxClick(); return false; } }); } }); })( jQuery );