| @@ -0,0 +1,243 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <title>Theme inheritance - jQuery Mobile Tests</title> | ||
| <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"> | ||
| <link rel="shortcut icon" href="../../favicon.ico"> | ||
| <script src="../../../js/jquery.js"></script> | ||
| <script src="../../../js/"></script> | ||
| <script> | ||
| $( document ).on( "pagecreate", function() { | ||
| $( "#theme-selector input" ).on( "change", function( event ) { | ||
| var themeClass = $( "#theme-selector input:checked" ).attr( "id" ); | ||
| $( "#testpage" ).removeClass( "ui-page-theme-a ui-page-theme-b ui-page-theme-c" ).addClass( "ui-page-theme-" + themeClass ); | ||
| $( "#ui-body-test" ).removeClass( "ui-body-a ui-body-b ui-body-c" ).addClass( "ui-body-" + themeClass ); | ||
| $( "#ui-bar-test, #ui-bar-form" ).removeClass( "ui-bar-a ui-bar-b ui-bar-c" ).addClass( "ui-bar-" + themeClass ); | ||
| $( ".ui-collapsible-content" ).removeClass( "ui-body-a ui-body-b ui-body-c" ).addClass( "ui-body-" + themeClass ); | ||
| $( ".theme" ).text( themeClass ); | ||
| }); | ||
| $( "#opt-shadow input" ).on( "change", function( event ) { | ||
| if ( $( "#on" ).prop( "checked" ) ) { | ||
| $( "#testpage" ).removeClass( "noshadow" ); | ||
| } else if ( $( "#off" ).prop( "checked" ) ) { | ||
| $( "#testpage" ).addClass( "noshadow" ); | ||
| } | ||
| }); | ||
| }); | ||
| </script> | ||
| <style> | ||
| .noshadow * { | ||
| -webkit-box-shadow: none !important; | ||
| -moz-box-shadow: none !important; | ||
| box-shadow: none !important; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <div data-role="page" id="testpage"> | ||
| <div data-role="header"> | ||
| <h1>Theme inheritance</h1> | ||
| <a href="../../" data-role="button" data-rel="back" data-icon="back" data-iconpos="notext">Back</a> | ||
| <a href="#" data-role="button" data-icon="gear">Button</a> | ||
| </div><!-- /header --> | ||
| <div data-role="content"> | ||
| <form class="ui-mini"> | ||
| <div data-role="fieldcontain" id="theme-selector"> | ||
| <fieldset data-role="controlgroup" data-type="horizontal"> | ||
| <legend>Theme:</legend> | ||
| <label for="a">A</label> | ||
| <input type="radio" name="theme" id="a" checked> | ||
| <label for="b">B</label> | ||
| <input type="radio" name="theme" id="b"> | ||
| <label for="c">C</label> | ||
| <input type="radio" name="theme" id="c"> | ||
| </fieldset> | ||
| </div> | ||
| <div data-role="fieldcontain" id="opt-shadow"> | ||
| <fieldset data-role="controlgroup" data-type="horizontal"> | ||
| <legend>Shadow:</legend> | ||
| <label for="on">On</label> | ||
| <input type="radio" name="shadow" id="on" checked> | ||
| <label for="off">Off</label> | ||
| <input type="radio" name="shadow" id="off"> | ||
| </fieldset> | ||
| </div> | ||
| </form> | ||
| <div id="ui-body-test" class="ui-body ui-body-a ui-corner-all" style="margin-bottom:1em;"> | ||
| <p>I am a div with classes ui-body, ui-body-<span class="theme">a</span> and ui-corner-all.</p> | ||
| <p><a href="#">I am a link</a></p> | ||
| </div> | ||
| <div id="ui-bar-test" class="ui-bar ui-bar-a ui-corner-all" style="margin-bottom:1em;"> | ||
| <p>I am a div with classes ui-bar, ui-bar-<span class="theme">a</span> and ui-corner-all. <a href="#">I am a link</a></p> | ||
| </div> | ||
| <a href="#" data-role="button" data-inline="true" data-icon="arrow-r" data-iconpos="right">We</a> | ||
| <button data-inline="true" data-icon="arrow-r" data-iconpos="right">are</button> | ||
| <input type="button" value="buttons" data-inline="true" data-icon="arrow-r" data-iconpos="right"> | ||
| <ul data-role="listview" data-inset="true"> | ||
| <li>I</li> | ||
| <li data-role="list-divider">Divider<span class="ui-li-count">3</span></li> | ||
| <li>am</li> | ||
| <li>static<span class="ui-li-count">6</span></li> | ||
| </ul> | ||
| <ul data-role="listview" data-inset="true"> | ||
| <li><a href="#">We</a></li> | ||
| <li data-role="list-divider">Divider</li> | ||
| <li><a href="#">have<span class="ui-li-count">4</span></a></li> | ||
| <li><a href="#">links</a></li> | ||
| </ul> | ||
| <ul data-role="listview" data-split-icon="gear" data-inset="true"> | ||
| <li><a href="#"> | ||
| <img src="../../_assets/img/album-bb.jpg" /> | ||
| <h2>Broken Bells</h2> | ||
| <p>Broken Bells</p></a> | ||
| <a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a> | ||
| </li> | ||
| <li><a href="#"> | ||
| <img src="../../_assets/img/album-hc.jpg" /> | ||
| <h2>Warning</h2> | ||
| <p>Hot Chip</p></a> | ||
| <a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a> | ||
| </li> | ||
| <li><a href="#"> | ||
| <img src="../../_assets/img/album-bb.jpg" /> | ||
| <h2>Wolfgang Amadeus Phoenix</h2> | ||
| <p>Phoenix</p></a> | ||
| <a href="#purchase" data-rel="popup" data-position-to="window" data-transition="pop">Purchase album</a> | ||
| </li> | ||
| </ul> | ||
| <form> | ||
| <div data-role="fieldcontain"> | ||
| <label for="name2">Text Input:</label> | ||
| <input type="text" name="name2" id="name2" value="" data-clear-btn="true"> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="textarea2">Textarea:</label> | ||
| <textarea cols="40" rows="8" name="textarea2" id="textarea2"></textarea> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="flip2">Flip switch:</label> | ||
| <select name="flip2" id="flip2" data-role="slider"> | ||
| <option value="off">Off</option> | ||
| <option value="on">On</option> | ||
| </select> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="slider2">Slider:</label> | ||
| <input type="range" name="slider2" id="slider2" value="0" min="0" max="100" data-highlight="true"> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <fieldset data-role="controlgroup"> | ||
| <legend>Checkbox:</legend> | ||
| <input type="checkbox" name="checkbox-v-1a" id="checkbox-v-1a"> | ||
| <label for="checkbox-v-1a">One</label> | ||
| <input type="checkbox" name="checkbox-v-1b" id="checkbox-v-1b"> | ||
| <label for="checkbox-v-1b">Two</label> | ||
| <input type="checkbox" name="checkbox-v-1c" id="checkbox-v-1c"> | ||
| <label for="checkbox-v-1c">Three</label> | ||
| </fieldset> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <fieldset data-role="controlgroup" data-type="horizontal"> | ||
| <legend>Controlgroup:</legend> | ||
| <button data-icon="home" data-iconpos="right">One</button> | ||
| <input type="button" data-icon="back" data-iconpos="right" value="Two"> | ||
| <a href="#" data-role="button" data-icon="grid" data-iconpos="right">Three</a> | ||
| </fieldset> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="select-choice-1" class="select">Custom select:</label> | ||
| <select name="select-choice-1" id="select-choice-1" data-native-menu="false" multiple="multiple"> | ||
| <option value="standard">Standard: 7 day</option> | ||
| <option value="rush">Rush: 3 days</option> | ||
| <option value="express">Express: next day</option> | ||
| <option value="overnight">Overnight</option> | ||
| </select> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="submit-1">Send form:</label> | ||
| <input type="submit" id="submit-1" value="Send"> | ||
| </div> | ||
| </form> | ||
| <a href="#" data-role="button" data-icon="gear" class="ui-btn-active">Active button</a> | ||
| <p>Form inside static list:</p> | ||
| <form> | ||
| <ul data-role="listview" data-inset="true"> | ||
| <li data-role="fieldcontain"> | ||
| <label for="name3">Text Input:</label> | ||
| <input type="text" name="name3" id="name3" value="" data-clear-btn="true"> | ||
| </li> | ||
| <li data-role="fieldcontain"> | ||
| <label for="flip3">Flip switch:</label> | ||
| <select name="flip3" id="flip3" data-role="slider"> | ||
| <option value="off">Off</option> | ||
| <option value="on">On</option> | ||
| </select> | ||
| </li> | ||
| <li data-role="fieldcontain"> | ||
| <label for="slider3">Slider:</label> | ||
| <input type="range" name="slider3" id="slider3" value="0" min="0" max="100" data-highlight="true"> | ||
| </li> | ||
| </ul> | ||
| </form> | ||
| <div id="ui-bar-form" class="ui-bar ui-bar-a"> | ||
| <p>ui-bar-<span class="theme">a</span></p> | ||
| <div data-role="fieldcontain"> | ||
| <label for="name4">Text Input:</label> | ||
| <input type="text" name="name4" id="name4" value="" data-clear-btn="true"> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="flip4">Flip switch:</label> | ||
| <select name="flip4" id="flip4" data-role="slider"> | ||
| <option value="off">Off</option> | ||
| <option value="on">On</option> | ||
| </select> | ||
| </div> | ||
| <div data-role="fieldcontain"> | ||
| <label for="slider4">Slider:</label> | ||
| <input type="range" name="slider4" id="slider4" value="0" min="0" max="100" data-highlight="true"> | ||
| </div> | ||
| </div> | ||
| <div data-role="collapsible" data-content-theme="a"> | ||
| <h4>Heading</h4> | ||
| <p>I'm the collapsible content with a themed content block set to "<span class="theme">a</span>".</p> | ||
| </div> | ||
| <div data-role="collapsible-set" data-content-theme="a"> | ||
| <div data-role="collapsible"> | ||
| <h3>Section 1</h3> | ||
| <p>I'm the collapsible content for section 1</p> | ||
| </div> | ||
| <div data-role="collapsible"> | ||
| <h3>Section 2</h3> | ||
| <p>I'm the collapsible content for section 2</p> | ||
| </div> | ||
| <div data-role="collapsible"> | ||
| <h3>Section 3</h3> | ||
| <p>I'm the collapsible content for section 3</p> | ||
| </div> | ||
| </div> | ||
| </div><!-- /content --> | ||
| </div><!-- /page --> | ||
| </body> | ||
| </html> |
| @@ -0,0 +1 @@ | ||
| <div class="tabs-list-content">I am ajax tab content i was pulled in from ajax-content.php </div> |
| @@ -0,0 +1,87 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <title>Navbar - jQuery Mobile Demos</title> | ||
| <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"> | ||
| <link rel="stylesheet" href="../../_assets/css/jqm-demos.css"> | ||
| <link rel="shortcut icon" href="../../favicon.ico"> | ||
| <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700"> | ||
| <script src="../../../js/jquery.js"></script> | ||
| <script src="../../_assets/js/"></script> | ||
| <script src="../../../js/"></script> | ||
| </head> | ||
| <body> | ||
| <div data-role="page" class="jqm-demos" data-quicklinks="true"> | ||
|
|
||
| <div data-role="header" class="jqm-header"> | ||
| <h1 class="jqm-logo"><a href="../../"><img src="../../_assets/img/jquery-logo.png" alt="jQuery Mobile Framework"></a></h1> | ||
| <a href="#" class="jqm-navmenu-link" data-icon="bars" data-iconpos="notext">Navigation</a> | ||
| <a href="#" class="jqm-search-link" data-icon="search" data-iconpos="notext">Search</a> | ||
| <?php include( '../../search.php' ); ?> | ||
| </div><!-- /header --> | ||
|
|
||
| <div data-role="content" class="jqm-content"> | ||
|
|
||
| <h1>Tabs <a href="http://api.jquerymobile.com/navbar/" data-ajax="false" data-role="button" data-inline="true" data-mini="true" data-icon="arrow-r" data-iconpos="right" class="jqm-api-link">API</a></h1> | ||
|
|
||
| <p class="jqm-intro">The jQuery mobile tabs widget is actually just an extension of the jQuery ui tabs widget and takes all the same options and methods</p> | ||
| </p> | ||
| <h2>Use navbar for tabs</h2> | ||
| <div data-role="tabs" id="tabs"> | ||
| <div data-role="navbar"> | ||
| <ul> | ||
| <li><a href="#one" data-ajax="false">one</a></li> | ||
| <li><a href="#two" data-ajax="false">two</a></li> | ||
| <li><a href="ajax-content.php" data-ajax="false">three</a></li> | ||
| </ul> | ||
| </div> | ||
| <div id="one" class="ui-body-d ui-content"> | ||
| <h1>First tab contents</h1> | ||
| </div> | ||
| <div id="two"> | ||
| <ul data-role="listview" data-inset="true"> | ||
| <li><a href="#">Acura</a></li> | ||
| <li><a href="#">Audi</a></li> | ||
| <li><a href="#">BMW</a></li> | ||
| <li><a href="#">Cadillac</a></li> | ||
| <li><a href="#">Ferrari</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <h2>Use inset listview for tabs</h2> | ||
| <div data-role="tabs"> | ||
| <ul data-role="listview" data-inset="true" class="tabs-list-left"> | ||
| <li><a href="#one" data-ajax="false">one</a></li> | ||
| <li><a href="#two" data-ajax="false">two</a></li> | ||
| <li><a href="ajax-content.php" data-ajax="false">three</a></li> | ||
| </ul> | ||
| <div id="one" class="ui-body-d tabs-list-content"> | ||
| <h1>First tab contents</h1> | ||
| </div> | ||
|
|
||
| <ul id="two" class="tabs-list-content" data-role="listview" data-inset="true"> | ||
| <li><a href="#">Acura</a></li> | ||
| <li><a href="#">Audi</a></li> | ||
| <li><a href="#">BMW</a></li> | ||
| <li><a href="#">Cadillac</a></li> | ||
| <li><a href="#">Ferrari</a></li> | ||
| </ul> | ||
|
|
||
| </div> | ||
| <h2>Tabbed page content</h2> | ||
| <p>You can also use tabs to swap out an enitre pages content <a data-ajax="false" href="tabbed-content.php">Tabbed Content Pages</a></p> | ||
|
|
||
| </div><!-- /content --> | ||
|
|
||
| <div data-role="footer" class="jqm-footer"> | ||
| <p class="jqm-version"></p> | ||
| <p>Copyright 2013 The jQuery Foundation</p> | ||
| </div><!-- /footer --> | ||
|
|
||
| <?php include( '../../global-nav.php' ); ?> | ||
|
|
||
| </div><!-- /page --> | ||
| </body> | ||
| </html> |
| @@ -0,0 +1,45 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <head> | ||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <title>Navbar - jQuery Mobile Demos</title> | ||
| <link rel="stylesheet" href="../../../css/themes/default/jquery.mobile.css"> | ||
| <link rel="stylesheet" href="../../_assets/css/jqm-demos.css"> | ||
| <link rel="shortcut icon" href="../../favicon.ico"> | ||
| <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700"> | ||
| <script src="../../../js/jquery.js"></script> | ||
| <script src="../../../js/"></script> | ||
| </head> | ||
| <body> | ||
| <div data-role="page" class="jqm-demos" data-quicklinks="true"> | ||
| <div data-role="tabs"> | ||
| <div data-role="navbar"> | ||
| <ul> | ||
| <li><a href="#one" data-theme="a" data-ajax="false">one</a></li> | ||
| <li><a href="#two" data-theme="a" data-ajax="false">two</a></li> | ||
| <li><a href="ajax-content.php" data-theme="a" data-ajax="false">three</a></li> | ||
| </ul> | ||
| </div> | ||
| <div id="one" class="ui-content"> | ||
| <h1>First tab contents</h1> | ||
| </div> | ||
| <div id="two" class="ui-content"> | ||
| <ul data-role="listview"> | ||
| <li><a href="#">Acura</a></li> | ||
| <li><a href="#">Audi</a></li> | ||
| <li><a href="#">BMW</a></li> | ||
| <li><a href="#">Cadillac</a></li> | ||
| <li><a href="#">Ferrari</a></li> | ||
| </ul> | ||
| </div> | ||
| </div> | ||
| <div data-role="footer" class="jqm-footer"> | ||
| <p class="jqm-version"></p> | ||
| <p>Copyright 2013 The jQuery Foundation</p> | ||
| </div><!-- /footer --> | ||
| </div><!-- /page --> | ||
| </body> | ||
| </html> |
| @@ -1,345 +1,10 @@ | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| //>>group: exclude | ||
|
|
||
| define([ | ||
| "require", | ||
| "./jquery.mobile.defaults", | ||
| "./jquery.mobile.data", | ||
| "./jquery.mobile.helpers" | ||
| ]); | ||
| //>>excludeEnd("jqmBuildExclude"); | ||
| @@ -0,0 +1,108 @@ | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| //>>description: Mobile versions of Data functions to allow for namespaceing | ||
| //>>label: jqmData | ||
| //>>group: Core | ||
| //>>css.structure: ../css/structure/jquery.mobile.core.css | ||
| //>>css.theme: ../css/themes/default/jquery.mobile.theme.css | ||
|
|
||
| define( [ "jquery", "./jquery.mobile.ns", "json!../package.json" ], function( jQuery ) { | ||
| //>>excludeEnd("jqmBuildExclude"); | ||
| (function( $, window, undefined ) { | ||
| var nsNormalizeDict = {}, | ||
| // Monkey-patching Sizzle to filter the :jqmData selector | ||
| oldFind = $.find, | ||
| jqmDataRE = /:jqmData\(([^)]*)\)/g; | ||
|
|
||
| $.extend($.mobile, { | ||
|
|
||
| // Namespace used framework-wide for data-attrs. Default is no namespace | ||
|
|
||
| ns: "", | ||
|
|
||
| // Retrieve an attribute from an element and perform some massaging of the value | ||
|
|
||
| getAttribute: function( e, key, dns ) { | ||
| var value; | ||
|
|
||
| if ( dns ) { | ||
| key = "data-" + $.mobile.ns + key; | ||
| } | ||
|
|
||
| value = e.getAttribute( key ); | ||
|
|
||
| return value === "true" ? true : | ||
| value === "false" ? false : | ||
| value === null ? undefined : value; | ||
| }, | ||
|
|
||
| // Expose our cache for testing purposes. | ||
| nsNormalizeDict: nsNormalizeDict, | ||
|
|
||
| // Take a data attribute property, prepend the namespace | ||
| // and then camel case the attribute string. Add the result | ||
| // to our nsNormalizeDict so we don't have to do this again. | ||
| nsNormalize: function( prop ) { | ||
| return nsNormalizeDict[ prop ] || ( nsNormalizeDict[ prop ] = $.camelCase( $.mobile.ns + prop ) ); | ||
| }, | ||
|
|
||
| // Find the closest javascript page element to gather settings data jsperf test | ||
| // http://jsperf.com/single-complex-selector-vs-many-complex-selectors/edit | ||
| // possibly naive, but it shows that the parsing overhead for *just* the page selector vs | ||
| // the page and dialog selector is negligable. This could probably be speed up by | ||
| // doing a similar parent node traversal to the one found in the inherited theme code above | ||
| closestPageData: function( $target ) { | ||
| return $target | ||
| .closest( ":jqmData(role='page'), :jqmData(role='dialog')" ) | ||
| .data( "mobile-page" ); | ||
| } | ||
|
|
||
| }); | ||
| // Mobile version of data and removeData and hasData methods | ||
| // ensures all data is set and retrieved using jQuery Mobile's data namespace | ||
| $.fn.jqmData = function( prop, value ) { | ||
| var result; | ||
| if ( typeof prop !== "undefined" ) { | ||
| if ( prop ) { | ||
| prop = $.mobile.nsNormalize( prop ); | ||
| } | ||
|
|
||
| // undefined is permitted as an explicit input for the second param | ||
| // in this case it returns the value and does not set it to undefined | ||
| if( arguments.length < 2 || value === undefined ){ | ||
| result = this.data( prop ); | ||
| } else { | ||
| result = this.data( prop, value ); | ||
| } | ||
| } | ||
| return result; | ||
| }; | ||
|
|
||
| $.jqmData = function( elem, prop, value ) { | ||
| var result; | ||
| if ( typeof prop !== "undefined" ) { | ||
| result = $.data( elem, prop ? $.mobile.nsNormalize( prop ) : prop, value ); | ||
| } | ||
| return result; | ||
| }; | ||
|
|
||
| $.fn.jqmRemoveData = function( prop ) { | ||
| return this.removeData( $.mobile.nsNormalize( prop ) ); | ||
| }; | ||
|
|
||
| $.jqmRemoveData = function( elem, prop ) { | ||
| return $.removeData( elem, $.mobile.nsNormalize( prop ) ); | ||
| }; | ||
|
|
||
|
|
||
| $.find = function( selector, context, ret, extra ) { | ||
| selector = selector.replace( jqmDataRE, "[data-" + ( $.mobile.ns || "" ) + "$1]" ); | ||
|
|
||
| return oldFind.call( this, selector, context, ret, extra ); | ||
| }; | ||
|
|
||
| $.extend( $.find, oldFind ); | ||
|
|
||
| })( jQuery, this ); | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| }); | ||
| //>>excludeEnd("jqmBuildExclude"); |
| @@ -0,0 +1,90 @@ | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| //>>description: Default values for jQuery Mobile | ||
| //>>label: Defaults | ||
| //>>group: Core | ||
| //>>css.structure: ../css/structure/jquery.mobile.core.css | ||
| //>>css.theme: ../css/themes/default/jquery.mobile.theme.css | ||
|
|
||
| define( [ "jquery", "./jquery.mobile.ns", "json!../package.json" ], function( jQuery, ns, pkg, __version__ ) { | ||
| //>>excludeEnd("jqmBuildExclude"); | ||
| (function( $, window, undefined ) { | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| __version__ = ( pkg && pkg.version ) || "dev"; | ||
| //>>excludeEnd("jqmBuildExclude"); | ||
| $.extend($.mobile, { | ||
|
|
||
| // Version of the jQuery Mobile Framework | ||
| version: __version__, | ||
|
|
||
| // Define the url parameter used for referencing widget-generated sub-pages. | ||
| // Translates to to example.html&ui-page=subpageIdentifier | ||
| // hash segment before &ui-page= is used to make Ajax request | ||
| subPageUrlKey: "ui-page", | ||
|
|
||
| // Class assigned to page currently in view, and during transitions | ||
| activePageClass: "ui-page-active", | ||
|
|
||
| // Class used for "active" button state, from CSS framework | ||
| activeBtnClass: "ui-btn-active", | ||
|
|
||
| // Class used for "focus" form element state, from CSS framework | ||
| focusClass: "ui-focus", | ||
|
|
||
| // Automatically handle clicks and form submissions through Ajax, when same-domain | ||
| ajaxEnabled: true, | ||
|
|
||
| // Automatically load and show pages based on location.hash | ||
| hashListeningEnabled: true, | ||
|
|
||
| // disable to prevent jquery from bothering with links | ||
| linkBindingEnabled: true, | ||
|
|
||
| // Set default page transition - 'none' for no transitions | ||
| defaultPageTransition: "fade", | ||
|
|
||
| // Set maximum window width for transitions to apply - 'false' for no limit | ||
| maxTransitionWidth: false, | ||
|
|
||
| // Minimum scroll distance that will be remembered when returning to a page | ||
| minScrollBack: 250, | ||
|
|
||
| // DEPRECATED: the following property is no longer in use, but defined until 2.0 to prevent conflicts | ||
| touchOverflowEnabled: false, | ||
|
|
||
| // Set default dialog transition - 'none' for no transitions | ||
| defaultDialogTransition: "pop", | ||
|
|
||
| // Error response message - appears when an Ajax page request fails | ||
| pageLoadErrorMessage: "Error Loading Page", | ||
|
|
||
| // For error messages, which theme does the box uses? | ||
| pageLoadErrorMessageTheme: "e", | ||
|
|
||
| // replace calls to window.history.back with phonegaps navigation helper | ||
| // where it is provided on the window object | ||
| phonegapNavigationEnabled: false, | ||
|
|
||
| //automatically initialize the DOM when it's ready | ||
| autoInitializePage: true, | ||
|
|
||
| pushStateEnabled: true, | ||
|
|
||
| // allows users to opt in to ignoring content by marking a parent element as | ||
| // data-ignored | ||
| ignoreContentEnabled: false, | ||
|
|
||
| buttonMarkup: { | ||
| hoverDelay: 200 | ||
| }, | ||
|
|
||
| // disable the alteration of the dynamic base tag or links in the case | ||
| // that a dynamic base tag isn't supported | ||
| dynamicBaseEnabled: true, | ||
|
|
||
| // default the property to remove dependency on assignment in init module | ||
| pageContainer: $() | ||
| }); | ||
| })( jQuery, this ); | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| }); | ||
| //>>excludeEnd("jqmBuildExclude"); |
| @@ -0,0 +1,215 @@ | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| //>>description: Helper functions and refrences | ||
| //>>label: Helpers | ||
| //>>group: Core | ||
| //>>css.structure: ../css/structure/jquery.mobile.core.css | ||
| //>>css.theme: ../css/themes/default/jquery.mobile.theme.css | ||
|
|
||
| define( [ "jquery", "./jquery.mobile.ns", "json!../package.json" ], function( jQuery ) { | ||
| //>>excludeEnd("jqmBuildExclude"); | ||
| (function( $, window, undefined ) { | ||
|
|
||
| // jQuery.mobile configurable options | ||
| $.extend($.mobile, { | ||
| // define the window and the document objects | ||
| window: $( window ), | ||
| document: $( document ), | ||
|
|
||
| //TODO: Remove once we pull in UI Core | ||
| keyCode: { | ||
| BACKSPACE: 8, | ||
| COMMA: 188, | ||
| DELETE: 46, | ||
| DOWN: 40, | ||
| END: 35, | ||
| ENTER: 13, | ||
| ESCAPE: 27, | ||
| HOME: 36, | ||
| LEFT: 37, | ||
| PAGE_DOWN: 34, | ||
| PAGE_UP: 33, | ||
| PERIOD: 190, | ||
| RIGHT: 39, | ||
| SPACE: 32, | ||
| TAB: 9, | ||
| UP: 38 | ||
| }, | ||
|
|
||
| // Place to store various widget extensions | ||
| behaviors: {}, | ||
| // Scroll page vertically: scroll to 0 to hide iOS address bar, or pass a Y value | ||
| silentScroll: function( ypos ) { | ||
| if ( $.type( ypos ) !== "number" ) { | ||
| ypos = $.mobile.defaultHomeScroll; | ||
| } | ||
|
|
||
| // prevent scrollstart and scrollstop events | ||
| $.event.special.scrollstart.enabled = false; | ||
|
|
||
| setTimeout( function() { | ||
| window.scrollTo( 0, ypos ); | ||
| $.mobile.document.trigger( "silentscroll", { x: 0, y: ypos }); | ||
| }, 20 ); | ||
|
|
||
| setTimeout( function() { | ||
| $.event.special.scrollstart.enabled = true; | ||
| }, 150 ); | ||
| }, | ||
|
|
||
| // DEPRECATED in 1.4 | ||
| // Find the closest parent with a theme class on it. Note that | ||
| // we are not using $.fn.closest() on purpose here because this | ||
| // method gets called quite a bit and we need it to be as fast | ||
| // as possible. | ||
| getInheritedTheme: function( el, defaultTheme ) { | ||
| var e = el[ 0 ], | ||
| ltr = "", | ||
| re = /ui-(bar|body|overlay)-([a-z])\b/, | ||
| c, m; | ||
| while ( e ) { | ||
| c = e.className || ""; | ||
| if ( c && ( m = re.exec( c ) ) && ( ltr = m[ 2 ] ) ) { | ||
| // We found a parent with a theme class | ||
| // on it so bail from this loop. | ||
| break; | ||
| } | ||
|
|
||
| e = e.parentNode; | ||
| } | ||
| // Return the theme letter we found, if none, return the | ||
| // specified default. | ||
| return ltr || defaultTheme || "a"; | ||
| }, | ||
|
|
||
| // TODO the following $ and $.fn extensions can/probably should be moved into jquery.mobile.core.helpers | ||
| // | ||
|
|
||
| enhanceable: function( $set ) { | ||
| return this.haveParents( $set, "enhance" ); | ||
| }, | ||
|
|
||
| hijackable: function( $set ) { | ||
| return this.haveParents( $set, "ajax" ); | ||
| }, | ||
|
|
||
| haveParents: function( $set, attr ) { | ||
| if ( !$.mobile.ignoreContentEnabled ) { | ||
| return $set; | ||
| } | ||
|
|
||
| var count = $set.length, | ||
| $newSet = $(), | ||
| e, $element, excluded, | ||
| i, c; | ||
|
|
||
| for ( i = 0; i < count; i++ ) { | ||
| $element = $set.eq( i ); | ||
| excluded = false; | ||
| e = $set[ i ]; | ||
|
|
||
| while ( e ) { | ||
| c = e.getAttribute ? e.getAttribute( "data-" + $.mobile.ns + attr ) : ""; | ||
|
|
||
| if ( c === "false" ) { | ||
| excluded = true; | ||
| break; | ||
| } | ||
|
|
||
| e = e.parentNode; | ||
| } | ||
|
|
||
| if ( !excluded ) { | ||
| $newSet = $newSet.add( $element ); | ||
| } | ||
| } | ||
|
|
||
| return $newSet; | ||
| }, | ||
|
|
||
| getScreenHeight: function() { | ||
| // Native innerHeight returns more accurate value for this across platforms, | ||
| // jQuery version is here as a normalized fallback for platforms like Symbian | ||
| return window.innerHeight || $.mobile.window.height(); | ||
| }, | ||
|
|
||
| //simply set the active page's minimum height to screen height, depending on orientation | ||
| resetActivePageHeight: function( height ) { | ||
| var aPage = $( "." + $.mobile.activePageClass ), | ||
| aPageHeight = aPage.height(), | ||
| aPageOuterHeight = aPage.outerHeight( true ); | ||
|
|
||
| height = ( typeof height === "number" ) ? height : $.mobile.getScreenHeight(); | ||
|
|
||
| aPage.css( "min-height", height - ( aPageOuterHeight - aPageHeight ) ); | ||
| } | ||
| }); | ||
|
|
||
| $.fn.removeWithDependents = function() { | ||
| $.removeWithDependents( this ); | ||
| }; | ||
|
|
||
| $.removeWithDependents = function( elem ) { | ||
| var $elem = $( elem ); | ||
|
|
||
| ( $elem.jqmData( "dependents" ) || $() ).remove(); | ||
| $elem.remove(); | ||
| }; | ||
|
|
||
| $.fn.addDependents = function( newDependents ) { | ||
| $.addDependents( this , newDependents ); | ||
| }; | ||
|
|
||
| $.addDependents = function( elem, newDependents ) { | ||
| var $elem = $( elem ), | ||
| dependents = $elem.jqmData( "dependents" ) || $(); | ||
|
|
||
| $elem.jqmData( "dependents", $( dependents ).add( newDependents ) ); | ||
| }; | ||
|
|
||
| // note that this helper doesn't attempt to handle the callback | ||
| // or setting of an html element's text, its only purpose is | ||
| // to return the html encoded version of the text in all cases. (thus the name) | ||
| $.fn.getEncodedText = function() { | ||
| return $( "<a>" ).text( $( this ).text() ).html(); | ||
| }; | ||
|
|
||
| // fluent helper function for the mobile namespaced equivalent | ||
| $.fn.jqmEnhanceable = function() { | ||
| return $.mobile.enhanceable( this ); | ||
| }; | ||
|
|
||
| $.fn.jqmHijackable = function() { | ||
| return $.mobile.hijackable( this ); | ||
| }; | ||
|
|
||
| $.find.matches = function( expr, set ) { | ||
| return $.find( expr, null, null, set ); | ||
| }; | ||
|
|
||
| $.find.matchesSelector = function( node, expr ) { | ||
| return $.find( expr, null, null, [ node ] ).length > 0; | ||
| }; | ||
| //Needed for ui widgets | ||
| //TODO: Remove once ui core is pulled in | ||
| var uuid = 0, | ||
| runiqueId = /^ui-id-\d+$/; | ||
| $.fn.extend({ | ||
| uniqueId: function() { | ||
| return this.each(function() { | ||
| if ( !this.id ) { | ||
| this.id = "ui-id-" + (++uuid); | ||
| } | ||
| }); | ||
| }, | ||
| removeUniqueId: function() { | ||
| return this.each(function() { | ||
| if ( runiqueId.test( this.id ) ) { | ||
| $( this ).removeAttr( "id" ); | ||
| } | ||
| }); | ||
| } | ||
| }); | ||
| })( jQuery, this ); | ||
| //>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude); | ||
| }); | ||
| //>>excludeEnd("jqmBuildExclude"); |
| @@ -6,7 +6,9 @@ | ||
|
|
||
| define([ | ||
| "jquery", | ||
| "./jquery.mobile.defaults", | ||
| "./jquery.mobile.helpers", | ||
| "./jquery.mobile.data", | ||
| "./jquery.mobile.support", | ||
| "./events/navigate", | ||
| "./navigation/path", | ||
| @@ -11,6 +11,9 @@ requirejs.config({ | ||
| "jquery.ui.widget": { | ||
| deps: [ "jquery" ], | ||
| exports: "$.widget" | ||
| }, | ||
| "widgets/jquery.ui.tabs": { | ||
| deps: [ "jquery.ui.widget" ] | ||
| } | ||
| } | ||
| }); | ||
