author | Giulio Cesare Solaroli <giulio.cesare@clipperz.com> | 2013-04-21 15:55:07 (UTC) |
---|---|---|
committer | Giulio Cesare Solaroli <giulio.cesare@clipperz.com> | 2013-04-21 15:55:07 (UTC) |
commit | 959c262afc598c4eeb58fe8fccf90ea8305c0eec (patch) (unidiff) | |
tree | aae9cb7821e59704240751e5b2878a374d21ea91 /frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js | |
parent | 1906ddfb5d3887edeedaf8e07d14ad89abbd214d (diff) | |
download | clipperz-959c262afc598c4eeb58fe8fccf90ea8305c0eec.zip clipperz-959c262afc598c4eeb58fe8fccf90ea8305c0eec.tar.gz clipperz-959c262afc598c4eeb58fe8fccf90ea8305c0eec.tar.bz2 |
Updated mobile prototype
Diffstat (limited to 'frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js') (more/less context) (ignore whitespace changes)
-rw-r--r-- | frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js | 11113 |
1 files changed, 11113 insertions, 0 deletions
diff --git a/frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js b/frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js new file mode 100644 index 0000000..9ebe94b --- a/dev/null +++ b/frontend/gamma/js/JQuery/Mobile/1.3.0-rc.1/jquery.mobile.js | |||
@@ -0,0 +1,11113 @@ | |||
1 | /* | ||
2 | |||
3 | Copyright 2008-2013 Clipperz Srl | ||
4 | |||
5 | This file is part of Clipperz, the online password manager. | ||
6 | For further information about its features and functionalities please | ||
7 | refer to http://www.clipperz.com. | ||
8 | |||
9 | * Clipperz is free software: you can redistribute it and/or modify it | ||
10 | under the terms of the GNU Affero General Public License as published | ||
11 | by the Free Software Foundation, either version 3 of the License, or | ||
12 | (at your option) any later version. | ||
13 | |||
14 | * Clipperz is distributed in the hope that it will be useful, but | ||
15 | WITHOUT ANY WARRANTY; without even the implied warranty of | ||
16 | MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. | ||
17 | See the GNU Affero General Public License for more details. | ||
18 | |||
19 | * You should have received a copy of the GNU Affero General Public | ||
20 | License along with Clipperz. If not, see http://www.gnu.org/licenses/. | ||
21 | |||
22 | */ | ||
23 | |||
24 | /* | ||
25 | * jQuery Mobile Git Build: SHA1: 56a6976b89feddf34e163c3fcc7196ae0a44c1a0 <> Date: Mon Feb 4 08:28:28 2013 -0800 | ||
26 | * http://jquerymobile.com | ||
27 | * | ||
28 | * Copyright 2010, 2013 jQuery Foundation, Inc. and other contributors | ||
29 | * Released under the MIT license. | ||
30 | * http://jquery.org/license | ||
31 | * | ||
32 | */ | ||
33 | |||
34 | |||
35 | (function ( root, doc, factory ) { | ||
36 | if ( typeof define === "function" && define.amd ) { | ||
37 | // AMD. Register as an anonymous module. | ||
38 | define( [ "jquery" ], function ( $ ) { | ||
39 | factory( $, root, doc ); | ||
40 | return $.mobile; | ||
41 | }); | ||
42 | } else { | ||
43 | // Browser globals | ||
44 | factory( root.jQuery, root, doc ); | ||
45 | } | ||
46 | }( this, document, function ( jQuery, window, document, undefined ) { | ||
47 | (function( $ ) { | ||
48 | $.mobile = {}; | ||
49 | }( jQuery )); | ||
50 | (function( $, window, undefined ) { | ||
51 | |||
52 | var nsNormalizeDict = {}; | ||
53 | |||
54 | // jQuery.mobile configurable options | ||
55 | $.mobile = $.extend($.mobile, { | ||
56 | |||
57 | // Version of the jQuery Mobile Framework | ||
58 | version: "1.3.0-rc.1", | ||
59 | |||
60 | // Namespace used framework-wide for data-attrs. Default is no namespace | ||
61 | ns: "", | ||
62 | |||
63 | // Define the url parameter used for referencing widget-generated sub-pages. | ||
64 | // Translates to to example.html&ui-page=subpageIdentifier | ||
65 | // hash segment before &ui-page= is used to make Ajax request | ||
66 | subPageUrlKey: "ui-page", | ||
67 | |||
68 | // Class assigned to page currently in view, and during transitions | ||
69 | activePageClass: "ui-page-active", | ||
70 | |||
71 | // Class used for "active" button state, from CSS framework | ||
72 | activeBtnClass: "ui-btn-active", | ||
73 | |||
74 | // Class used for "focus" form element state, from CSS framework | ||
75 | focusClass: "ui-focus", | ||
76 | |||
77 | // Automatically handle clicks and form submissions through Ajax, when same-domain | ||
78 | ajaxEnabled: true, | ||
79 | |||
80 | // Automatically load and show pages based on location.hash | ||
81 | hashListeningEnabled: true, | ||
82 | |||
83 | // disable to prevent jquery from bothering with links | ||
84 | linkBindingEnabled: true, | ||
85 | |||
86 | // Set default page transition - 'none' for no transitions | ||
87 | defaultPageTransition: "fade", | ||
88 | |||
89 | // Set maximum window width for transitions to apply - 'false' for no limit | ||
90 | maxTransitionWidth: false, | ||
91 | |||
92 | // Minimum scroll distance that will be remembered when returning to a page | ||
93 | minScrollBack: 250, | ||
94 | |||
95 | // DEPRECATED: the following property is no longer in use, but defined until 2.0 to prevent conflicts | ||
96 | touchOverflowEnabled: false, | ||
97 | |||
98 | // Set default dialog transition - 'none' for no transitions | ||
99 | defaultDialogTransition: "pop", | ||
100 | |||
101 | // Error response message - appears when an Ajax page request fails | ||
102 | pageLoadErrorMessage: "Error Loading Page", | ||
103 | |||
104 | // For error messages, which theme does the box uses? | ||
105 | pageLoadErrorMessageTheme: "e", | ||
106 | |||
107 | // replace calls to window.history.back with phonegaps navigation helper | ||
108 | // where it is provided on the window object | ||
109 | phonegapNavigationEnabled: false, | ||
110 | |||
111 | //automatically initialize the DOM when it's ready | ||
112 | autoInitializePage: true, | ||
113 | |||
114 | pushStateEnabled: true, | ||
115 | |||
116 | // allows users to opt in to ignoring content by marking a parent element as | ||
117 | // data-ignored | ||
118 | ignoreContentEnabled: false, | ||
119 | |||
120 | // turn of binding to the native orientationchange due to android orientation behavior | ||
121 | orientationChangeEnabled: true, | ||
122 | |||
123 | buttonMarkup: { | ||
124 | hoverDelay: 200 | ||
125 | }, | ||
126 | |||
127 | // define the window and the document objects | ||
128 | window: $( window ), | ||
129 | document: $( document ), | ||
130 | |||
131 | // TODO might be useful upstream in jquery itself ? | ||
132 | keyCode: { | ||
133 | ALT: 18, | ||
134 | BACKSPACE: 8, | ||
135 | CAPS_LOCK: 20, | ||
136 | COMMA: 188, | ||
137 | COMMAND: 91, | ||
138 | COMMAND_LEFT: 91, // COMMAND | ||
139 | COMMAND_RIGHT: 93, | ||
140 | CONTROL: 17, | ||
141 | DELETE: 46, | ||
142 | DOWN: 40, | ||
143 | END: 35, | ||
144 | ENTER: 13, | ||
145 | ESCAPE: 27, | ||
146 | HOME: 36, | ||
147 | INSERT: 45, | ||
148 | LEFT: 37, | ||
149 | MENU: 93, // COMMAND_RIGHT | ||
150 | NUMPAD_ADD: 107, | ||
151 | NUMPAD_DECIMAL: 110, | ||
152 | NUMPAD_DIVIDE: 111, | ||
153 | NUMPAD_ENTER: 108, | ||
154 | NUMPAD_MULTIPLY: 106, | ||
155 | NUMPAD_SUBTRACT: 109, | ||
156 | PAGE_DOWN: 34, | ||
157 | PAGE_UP: 33, | ||
158 | PERIOD: 190, | ||
159 | RIGHT: 39, | ||
160 | SHIFT: 16, | ||
161 | SPACE: 32, | ||
162 | TAB: 9, | ||
163 | UP: 38, | ||
164 | WINDOWS: 91 // COMMAND | ||
165 | }, | ||
166 | |||
167 | // Place to store various widget extensions | ||
168 | behaviors: {}, | ||
169 | |||
170 | // Scroll page vertically: scroll to 0 to hide iOS address bar, or pass a Y value | ||
171 | silentScroll: function( ypos ) { | ||
172 | if ( $.type( ypos ) !== "number" ) { | ||
173 | ypos = $.mobile.defaultHomeScroll; | ||
174 | } | ||
175 | |||
176 | // prevent scrollstart and scrollstop events | ||
177 | $.event.special.scrollstart.enabled = false; | ||
178 | |||
179 | setTimeout( function() { | ||
180 | window.scrollTo( 0, ypos ); | ||
181 | $.mobile.document.trigger( "silentscroll", { x: 0, y: ypos }); | ||
182 | }, 20 ); | ||
183 | |||
184 | setTimeout( function() { | ||
185 | $.event.special.scrollstart.enabled = true; | ||
186 | }, 150 ); | ||
187 | }, | ||
188 | |||
189 | // Expose our cache for testing purposes. | ||
190 | nsNormalizeDict: nsNormalizeDict, | ||
191 | |||
192 | // Take a data attribute property, prepend the namespace | ||
193 | // and then camel case the attribute string. Add the result | ||
194 | // to our nsNormalizeDict so we don't have to do this again. | ||
195 | nsNormalize: function( prop ) { | ||
196 | if ( !prop ) { | ||
197 | return; | ||
198 | } | ||
199 | |||
200 | return nsNormalizeDict[ prop ] || ( nsNormalizeDict[ prop ] = $.camelCase( $.mobile.ns + prop ) ); | ||
201 | }, | ||
202 | |||
203 | // Find the closest parent with a theme class on it. Note that | ||
204 | // we are not using $.fn.closest() on purpose here because this | ||
205 | // method gets called quite a bit and we need it to be as fast | ||
206 | // as possible. | ||
207 | getInheritedTheme: function( el, defaultTheme ) { | ||
208 | var e = el[ 0 ], | ||
209 | ltr = "", | ||
210 | re = /ui-(bar|body|overlay)-([a-z])\b/, | ||
211 | c, m; | ||
212 | |||
213 | while ( e ) { | ||
214 | c = e.className || ""; | ||
215 | if ( c && ( m = re.exec( c ) ) && ( ltr = m[ 2 ] ) ) { | ||
216 | // We found a parent with a theme class | ||
217 | // on it so bail from this loop. | ||
218 | break; | ||
219 | } | ||
220 | |||
221 | e = e.parentNode; | ||
222 | } | ||
223 | |||
224 | // Return the theme letter we found, if none, return the | ||
225 | // specified default. | ||
226 | |||
227 | return ltr || defaultTheme || "a"; | ||
228 | }, | ||
229 | |||
230 | // TODO the following $ and $.fn extensions can/probably should be moved into jquery.mobile.core.helpers | ||
231 | // | ||
232 | // Find the closest javascript page element to gather settings data jsperf test | ||
233 | // http://jsperf.com/single-complex-selector-vs-many-complex-selectors/edit | ||
234 | // possibly naive, but it shows that the parsing overhead for *just* the page selector vs | ||
235 | // the page and dialog selector is negligable. This could probably be speed up by | ||
236 | // doing a similar parent node traversal to the one found in the inherited theme code above | ||
237 | closestPageData: function( $target ) { | ||
238 | return $target | ||
239 | .closest( ':jqmData(role="page"), :jqmData(role="dialog")' ) | ||
240 | .data( "mobile-page" ); | ||
241 | }, | ||
242 | |||
243 | enhanceable: function( $set ) { | ||
244 | return this.haveParents( $set, "enhance" ); | ||
245 | }, | ||
246 | |||
247 | hijackable: function( $set ) { | ||
248 | return this.haveParents( $set, "ajax" ); | ||
249 | }, | ||
250 | |||
251 | haveParents: function( $set, attr ) { | ||
252 | if ( !$.mobile.ignoreContentEnabled ) { | ||
253 | return $set; | ||
254 | } | ||
255 | |||
256 | var count = $set.length, | ||
257 | $newSet = $(), | ||
258 | e, $element, excluded; | ||
259 | |||
260 | for ( var i = 0; i < count; i++ ) { | ||
261 | $element = $set.eq( i ); | ||
262 | excluded = false; | ||
263 | e = $set[ i ]; | ||
264 | |||
265 | while ( e ) { | ||
266 | var c = e.getAttribute ? e.getAttribute( "data-" + $.mobile.ns + attr ) : ""; | ||
267 | |||
268 | if ( c === "false" ) { | ||
269 | excluded = true; | ||
270 | break; | ||
271 | } | ||
272 | |||
273 | e = e.parentNode; | ||
274 | } | ||
275 | |||
276 | if ( !excluded ) { | ||
277 | $newSet = $newSet.add( $element ); | ||
278 | } | ||
279 | } | ||
280 | |||
281 | return $newSet; | ||
282 | }, | ||
283 | |||
284 | getScreenHeight: function() { | ||
285 | // Native innerHeight returns more accurate value for this across platforms, | ||
286 | // jQuery version is here as a normalized fallback for platforms like Symbian | ||
287 | return window.innerHeight || $.mobile.window.height(); | ||
288 | } | ||
289 | }, $.mobile ); | ||
290 | |||
291 | // Mobile version of data and removeData and hasData methods | ||
292 | // ensures all data is set and retrieved using jQuery Mobile's data namespace | ||
293 | $.fn.jqmData = function( prop, value ) { | ||
294 | var result; | ||
295 | if ( typeof prop !== "undefined" ) { | ||
296 | if ( prop ) { | ||
297 | prop = $.mobile.nsNormalize( prop ); | ||
298 | } | ||
299 | |||
300 | // undefined is permitted as an explicit input for the second param | ||
301 | // in this case it returns the value and does not set it to undefined | ||
302 | if( arguments.length < 2 || value === undefined ){ | ||
303 | result = this.data( prop ); | ||
304 | } else { | ||
305 | result = this.data( prop, value ); | ||
306 | } | ||
307 | } | ||
308 | return result; | ||
309 | }; | ||
310 | |||
311 | $.jqmData = function( elem, prop, value ) { | ||
312 | var result; | ||
313 | if ( typeof prop !== "undefined" ) { | ||
314 | result = $.data( elem, prop ? $.mobile.nsNormalize( prop ) : prop, value ); | ||
315 | } | ||
316 | return result; | ||
317 | }; | ||
318 | |||
319 | $.fn.jqmRemoveData = function( prop ) { | ||
320 | return this.removeData( $.mobile.nsNormalize( prop ) ); | ||
321 | }; | ||
322 | |||
323 | $.jqmRemoveData = function( elem, prop ) { | ||
324 | return $.removeData( elem, $.mobile.nsNormalize( prop ) ); | ||
325 | }; | ||
326 | |||
327 | $.fn.removeWithDependents = function() { | ||
328 | $.removeWithDependents( this ); | ||
329 | }; | ||
330 | |||
331 | $.removeWithDependents = function( elem ) { | ||
332 | var $elem = $( elem ); | ||
333 | |||
334 | ( $elem.jqmData( 'dependents' ) || $() ).remove(); | ||
335 | $elem.remove(); | ||
336 | }; | ||
337 | |||
338 | $.fn.addDependents = function( newDependents ) { | ||
339 | $.addDependents( $( this ), newDependents ); | ||
340 | }; | ||
341 | |||
342 | $.addDependents = function( elem, newDependents ) { | ||
343 | var dependents = $( elem ).jqmData( 'dependents' ) || $(); | ||
344 | |||
345 | $( elem ).jqmData( 'dependents', $.merge( dependents, newDependents ) ); | ||
346 | }; | ||
347 | |||
348 | // note that this helper doesn't attempt to handle the callback | ||
349 | // or setting of an html elements text, its only purpose is | ||
350 | // to return the html encoded version of the text in all cases. (thus the name) | ||
351 | $.fn.getEncodedText = function() { | ||
352 | return $( "<div/>" ).text( $( this ).text() ).html(); | ||
353 | }; | ||
354 | |||
355 | // fluent helper function for the mobile namespaced equivalent | ||
356 | $.fn.jqmEnhanceable = function() { | ||
357 | return $.mobile.enhanceable( this ); | ||
358 | }; | ||
359 | |||
360 | $.fn.jqmHijackable = function() { | ||
361 | return $.mobile.hijackable( this ); | ||
362 | }; | ||
363 | |||
364 | // Monkey-patching Sizzle to filter the :jqmData selector | ||
365 | var oldFind = $.find, | ||
366 | jqmDataRE = /:jqmData\(([^)]*)\)/g; | ||
367 | |||
368 | $.find = function( selector, context, ret, extra ) { | ||
369 | selector = selector.replace( jqmDataRE, "[data-" + ( $.mobile.ns || "" ) + "$1]" ); | ||
370 | |||
371 | return oldFind.call( this, selector, context, ret, extra ); | ||
372 | }; | ||
373 | |||
374 | $.extend( $.find, oldFind ); | ||
375 | |||
376 | $.find.matches = function( expr, set ) { | ||
377 | return $.find( expr, null, null, set ); | ||
378 | }; | ||
379 | |||
380 | $.find.matchesSelector = function( node, expr ) { | ||
381 | return $.find( expr, null, null, [ node ] ).length > 0; | ||
382 | }; | ||
383 | })( jQuery, this ); | ||
384 | |||
385 | |||
386 | /*! | ||
387 | * jQuery UI Widget v1.10.0pre - 2012-11-13 (ff055a0c353c3c8ce6e5bfa07ad7cb03e8885bc5) | ||
388 | * http://jqueryui.com | ||
389 | * | ||
390 | * Copyright 2010, 2013 jQuery Foundation and other contributors | ||
391 | * Released under the MIT license. | ||
392 | * http://jquery.org/license | ||
393 | * | ||
394 | * http://api.jqueryui.com/jQuery.widget/ | ||
395 | */ | ||
396 | (function( $, undefined ) { | ||
397 | |||
398 | var uuid = 0, | ||
399 | slice = Array.prototype.slice, | ||
400 | _cleanData = $.cleanData; | ||
401 | $.cleanData = function( elems ) { | ||
402 | for ( var i = 0, elem; (elem = elems[i]) != null; i++ ) { | ||
403 | try { | ||
404 | $( elem ).triggerHandler( "remove" ); | ||
405 | // http://bugs.jquery.com/ticket/8235 | ||
406 | } catch( e ) {} | ||
407 | } | ||
408 | _cleanData( elems ); | ||
409 | }; | ||
410 | |||
411 | $.widget = function( name, base, prototype ) { | ||
412 | var fullName, existingConstructor, constructor, basePrototype, | ||
413 | namespace = name.split( "." )[ 0 ]; | ||
414 | |||
415 | name = name.split( "." )[ 1 ]; | ||
416 | fullName = namespace + "-" + name; | ||
417 | |||
418 | if ( !prototype ) { | ||
419 | prototype = base; | ||
420 | base = $.Widget; | ||
421 | } | ||
422 | |||
423 | // create selector for plugin | ||
424 | $.expr[ ":" ][ fullName.toLowerCase() ] = function( elem ) { | ||
425 | return !!$.data( elem, fullName ); | ||
426 | }; | ||
427 | |||
428 | $[ namespace ] = $[ namespace ] || {}; | ||
429 | existingConstructor = $[ namespace ][ name ]; | ||
430 | constructor = $[ namespace ][ name ] = function( options, element ) { | ||
431 | // allow instantiation without "new" keyword | ||
432 | if ( !this._createWidget ) { | ||
433 | return new constructor( options, element ); | ||
434 | } | ||
435 | |||
436 | // allow instantiation without initializing for simple inheritance | ||
437 | // must use "new" keyword (the code above always passes args) | ||
438 | if ( arguments.length ) { | ||
439 | this._createWidget( options, element ); | ||
440 | } | ||
441 | }; | ||
442 | // extend with the existing constructor to carry over any static properties | ||
443 | $.extend( constructor, existingConstructor, { | ||
444 | version: prototype.version, | ||
445 | // copy the object used to create the prototype in case we need to | ||
446 | // redefine the widget later | ||
447 | _proto: $.extend( {}, prototype ), | ||
448 | // track widgets that inherit from this widget in case this widget is | ||
449 | // redefined after a widget inherits from it | ||
450 | _childConstructors: [] | ||
451 | }); | ||
452 | |||
453 | basePrototype = new base(); | ||
454 | // we need to make the options hash a property directly on the new instance | ||
455 | // otherwise we'll modify the options hash on the prototype that we're | ||
456 | // inheriting from | ||
457 | basePrototype.options = $.widget.extend( {}, basePrototype.options ); | ||
458 | $.each( prototype, function( prop, value ) { | ||
459 | if ( $.isFunction( value ) ) { | ||
460 | prototype[ prop ] = (function() { | ||
461 | var _super = function() { | ||
462 | return base.prototype[ prop ].apply( this, arguments ); | ||
463 | }, | ||
464 | _superApply = function( args ) { | ||
465 | return base.prototype[ prop ].apply( this, args ); | ||
466 | }; | ||
467 | return function() { | ||
468 | var __super = this._super, | ||
469 | __superApply = this._superApply, | ||
470 | returnValue; | ||
471 | |||
472 | this._super = _super; | ||
473 | this._superApply = _superApply; | ||
474 | |||
475 | returnValue = value.apply( this, arguments ); | ||
476 | |||
477 | this._super = __super; | ||
478 | this._superApply = __superApply; | ||
479 | |||
480 | return returnValue; | ||
481 | }; | ||
482 | })(); | ||
483 | } | ||
484 | }); | ||
485 | constructor.prototype = $.widget.extend( basePrototype, { | ||
486 | // TODO: remove support for widgetEventPrefix | ||
487 | // always use the name + a colon as the prefix, e.g., draggable:start | ||
488 | // don't prefix for widgets that aren't DOM-based | ||
489 | widgetEventPrefix: existingConstructor ? basePrototype.widgetEventPrefix : name | ||
490 | }, prototype, { | ||
491 | constructor: constructor, | ||
492 | namespace: namespace, | ||
493 | widgetName: name, | ||
494 | widgetFullName: fullName | ||
495 | }); | ||
496 | |||
497 | // If this widget is being redefined then we need to find all widgets that | ||
498 | // are inheriting from it and redefine all of them so that they inherit from | ||
499 | // the new version of this widget. We're essentially trying to replace one | ||
500 | // level in the prototype chain. | ||
501 | if ( existingConstructor ) { | ||
502 | $.each( existingConstructor._childConstructors, function( i, child ) { | ||
503 | var childPrototype = child.prototype; | ||
504 | |||
505 | // redefine the child widget using the same prototype that was | ||
506 | // originally used, but inherit from the new version of the base | ||
507 | $.widget( childPrototype.namespace + "." + childPrototype.widgetName, constructor, child._proto ); | ||
508 | }); | ||
509 | // remove the list of existing child constructors from the old constructor | ||
510 | // so the old child constructors can be garbage collected | ||
511 | delete existingConstructor._childConstructors; | ||
512 | } else { | ||
513 | base._childConstructors.push( constructor ); | ||
514 | } | ||
515 | |||
516 | $.widget.bridge( name, constructor ); | ||
517 | }; | ||
518 | |||
519 | $.widget.extend = function( target ) { | ||
520 | var input = slice.call( arguments, 1 ), | ||
521 | inputIndex = 0, | ||
522 | inputLength = input.length, | ||
523 | key, | ||
524 | value; | ||
525 | for ( ; inputIndex < inputLength; inputIndex++ ) { | ||
526 | for ( key in input[ inputIndex ] ) { | ||
527 | value = input[ inputIndex ][ key ]; | ||
528 | if ( input[ inputIndex ].hasOwnProperty( key ) && value !== undefined ) { | ||
529 | // Clone objects | ||
530 | if ( $.isPlainObject( value ) ) { | ||
531 | target[ key ] = $.isPlainObject( target[ key ] ) ? | ||
532 | $.widget.extend( {}, target[ key ], value ) : | ||
533 | // Don't extend strings, arrays, etc. with objects | ||
534 | $.widget.extend( {}, value ); | ||
535 | // Copy everything else by reference | ||
536 | } else { | ||
537 | target[ key ] = value; | ||
538 | } | ||
539 | } | ||
540 | } | ||
541 | } | ||
542 | return target; | ||
543 | }; | ||
544 | |||
545 | $.widget.bridge = function( name, object ) { | ||
546 | var fullName = object.prototype.widgetFullName || name; | ||
547 | $.fn[ name ] = function( options ) { | ||
548 | var isMethodCall = typeof options === "string", | ||
549 | args = slice.call( arguments, 1 ), | ||
550 | returnValue = this; | ||
551 | |||
552 | // allow multiple hashes to be passed on init | ||
553 | options = !isMethodCall && args.length ? | ||
554 | $.widget.extend.apply( null, [ options ].concat(args) ) : | ||
555 | options; | ||
556 | |||
557 | if ( isMethodCall ) { | ||
558 | this.each(function() { | ||
559 | var methodValue, | ||
560 | instance = $.data( this, fullName ); | ||
561 | if ( !instance ) { | ||
562 | return $.error( "cannot call methods on " + name + " prior to initialization; " + | ||
563 | "attempted to call method '" + options + "'" ); | ||
564 | } | ||
565 | if ( !$.isFunction( instance[options] ) || options.charAt( 0 ) === "_" ) { | ||
566 | return $.error( "no such method '" + options + "' for " + name + " widget instance" ); | ||
567 | } | ||
568 | methodValue = instance[ options ].apply( instance, args ); | ||
569 | if ( methodValue !== instance && methodValue !== undefined ) { | ||
570 | returnValue = methodValue && methodValue.jquery ? | ||
571 | returnValue.pushStack( methodValue.get() ) : | ||
572 | methodValue; | ||
573 | return false; | ||
574 | } | ||
575 | }); | ||
576 | } else { | ||
577 | this.each(function() { | ||
578 | var instance = $.data( this, fullName ); | ||
579 | if ( instance ) { | ||
580 | instance.option( options || {} )._init(); | ||
581 | } else { | ||
582 | $.data( this, fullName, new object( options, this ) ); | ||
583 | } | ||
584 | }); | ||
585 | } | ||
586 | |||
587 | return returnValue; | ||
588 | }; | ||
589 | }; | ||
590 | |||
591 | $.Widget = function( /* options, element */ ) {}; | ||
592 | $.Widget._childConstructors = []; | ||
593 | |||
594 | $.Widget.prototype = { | ||
595 | widgetName: "widget", | ||
596 | widgetEventPrefix: "", | ||
597 | defaultElement: "<div>", | ||
598 | options: { | ||
599 | disabled: false, | ||
600 | |||
601 | // callbacks | ||
602 | create: null | ||
603 | }, | ||
604 | _createWidget: function( options, element ) { | ||
605 | element = $( element || this.defaultElement || this )[ 0 ]; | ||
606 | this.element = $( element ); | ||
607 | this.uuid = uuid++; | ||
608 | this.eventNamespace = "." + this.widgetName + this.uuid; | ||
609 | this.options = $.widget.extend( {}, | ||
610 | this.options, | ||
611 | this._getCreateOptions(), | ||
612 | options ); | ||
613 | |||
614 | this.bindings = $(); | ||
615 | this.hoverable = $(); | ||
616 | this.focusable = $(); | ||
617 | |||
618 | if ( element !== this ) { | ||
619 | $.data( element, this.widgetFullName, this ); | ||
620 | this._on( true, this.element, { | ||
621 | remove: function( event ) { | ||
622 | if ( event.target === element ) { | ||
623 | this.destroy(); | ||
624 | } | ||
625 | } | ||
626 | }); | ||
627 | this.document = $( element.style ? | ||
628 | // element within the document | ||
629 | element.ownerDocument : | ||
630 | // element is window or document | ||
631 | element.document || element ); | ||
632 | this.window = $( this.document[0].defaultView || this.document[0].parentWindow ); | ||
633 | } | ||
634 | |||
635 | this._create(); | ||
636 | this._trigger( "create", null, this._getCreateEventData() ); | ||
637 | this._init(); | ||
638 | }, | ||
639 | _getCreateOptions: $.noop, | ||
640 | _getCreateEventData: $.noop, | ||
641 | _create: $.noop, | ||
642 | _init: $.noop, | ||
643 | |||
644 | destroy: function() { | ||
645 | this._destroy(); | ||
646 | // we can probably remove the unbind calls in 2.0 | ||
647 | // all event bindings should go through this._on() | ||
648 | this.element | ||
649 | .unbind( this.eventNamespace ) | ||
650 | // 1.9 BC for #7810 | ||
651 | // TODO remove dual storage | ||
652 | .removeData( this.widgetName ) | ||
653 | .removeData( this.widgetFullName ) | ||
654 | // support: jquery <1.6.3 | ||
655 | // http://bugs.jquery.com/ticket/9413 | ||
656 | .removeData( $.camelCase( this.widgetFullName ) ); | ||
657 | this.widget() | ||
658 | .unbind( this.eventNamespace ) | ||
659 | .removeAttr( "aria-disabled" ) | ||
660 | .removeClass( | ||
661 | this.widgetFullName + "-disabled " + | ||
662 | "ui-state-disabled" ); | ||
663 | |||
664 | // clean up events and states | ||
665 | this.bindings.unbind( this.eventNamespace ); | ||
666 | this.hoverable.removeClass( "ui-state-hover" ); | ||
667 | this.focusable.removeClass( "ui-state-focus" ); | ||
668 | }, | ||
669 | _destroy: $.noop, | ||
670 | |||
671 | widget: function() { | ||
672 | return this.element; | ||
673 | }, | ||
674 | |||
675 | option: function( key, value ) { | ||
676 | var options = key, | ||
677 | parts, | ||
678 | curOption, | ||
679 | i; | ||
680 | |||
681 | if ( arguments.length === 0 ) { | ||
682 | // don't return a reference to the internal hash | ||
683 | return $.widget.extend( {}, this.options ); | ||
684 | } | ||
685 | |||
686 | if ( typeof key === "string" ) { | ||
687 | // handle nested keys, e.g., "foo.bar" => { foo: { bar: ___ } } | ||
688 | options = {}; | ||
689 | parts = key.split( "." ); | ||
690 | key = parts.shift(); | ||
691 | if ( parts.length ) { | ||
692 | curOption = options[ key ] = $.widget.extend( {}, this.options[ key ] ); | ||
693 | for ( i = 0; i < parts.length - 1; i++ ) { | ||
694 | curOption[ parts[ i ] ] = curOption[ parts[ i ] ] || {}; | ||
695 | curOption = curOption[ parts[ i ] ]; | ||
696 | } | ||
697 | key = parts.pop(); | ||
698 | if ( value === undefined ) { | ||
699 | return curOption[ key ] === undefined ? null : curOption[ key ]; | ||
700 | } | ||
701 | curOption[ key ] = value; | ||
702 | } else { | ||
703 | if ( value === undefined ) { | ||
704 | return this.options[ key ] === undefined ? null : this.options[ key ]; | ||
705 | } | ||
706 | options[ key ] = value; | ||
707 | } | ||
708 | } | ||
709 | |||
710 | this._setOptions( options ); | ||
711 | |||
712 | return this; | ||
713 | }, | ||
714 | _setOptions: function( options ) { | ||
715 | var key; | ||
716 | |||
717 | for ( key in options ) { | ||
718 | this._setOption( key, options[ key ] ); | ||
719 | } | ||
720 | |||
721 | return this; | ||
722 | }, | ||
723 | _setOption: function( key, value ) { | ||
724 | this.options[ key ] = value; | ||
725 | |||
726 | if ( key === "disabled" ) { | ||
727 | this.widget() | ||
728 | .toggleClass( this.widgetFullName + "-disabled ui-state-disabled", !!value ) | ||
729 | .attr( "aria-disabled", value ); | ||
730 | this.hoverable.removeClass( "ui-state-hover" ); | ||
731 | this.focusable.removeClass( "ui-state-focus" ); | ||
732 | } | ||
733 | |||
734 | return this; | ||
735 | }, | ||
736 | |||
737 | enable: function() { | ||
738 | return this._setOption( "disabled", false ); | ||
739 | }, | ||
740 | disable: function() { | ||
741 | return this._setOption( "disabled", true ); | ||
742 | }, | ||
743 | |||
744 | _on: function( suppressDisabledCheck, element, handlers ) { | ||
745 | var delegateElement, | ||
746 | instance = this; | ||
747 | |||
748 | // no suppressDisabledCheck flag, shuffle arguments | ||
749 | if ( typeof suppressDisabledCheck !== "boolean" ) { | ||
750 | handlers = element; | ||
751 | element = suppressDisabledCheck; | ||
752 | suppressDisabledCheck = false; | ||
753 | } | ||
754 | |||
755 | // no element argument, shuffle and use this.element | ||
756 | if ( !handlers ) { | ||
757 | handlers = element; | ||
758 | element = this.element; | ||
759 | delegateElement = this.widget(); | ||
760 | } else { | ||
761 | // accept selectors, DOM elements | ||
762 | element = delegateElement = $( element ); | ||
763 | this.bindings = this.bindings.add( element ); | ||
764 | } | ||
765 | |||
766 | $.each( handlers, function( event, handler ) { | ||
767 | function handlerProxy() { | ||
768 | // allow widgets to customize the disabled handling | ||
769 | // - disabled as an array instead of boolean | ||
770 | // - disabled class as method for disabling individual parts | ||
771 | if ( !suppressDisabledCheck && | ||
772 | ( instance.options.disabled === true || | ||
773 | $( this ).hasClass( "ui-state-disabled" ) ) ) { | ||
774 | return; | ||
775 | } | ||
776 | return ( typeof handler === "string" ? instance[ handler ] : handler ) | ||
777 | .apply( instance, arguments ); | ||
778 | } | ||
779 | |||
780 | // copy the guid so direct unbinding works | ||
781 | if ( typeof handler !== "string" ) { | ||
782 | handlerProxy.guid = handler.guid = | ||
783 | handler.guid || handlerProxy.guid || $.guid++; | ||
784 | } | ||
785 | |||
786 | var match = event.match( /^(\w+)\s*(.*)$/ ), | ||
787 | eventName = match[1] + instance.eventNamespace, | ||
788 | selector = match[2]; | ||
789 | if ( selector ) { | ||
790 | delegateElement.delegate( selector, eventName, handlerProxy ); | ||
791 | } else { | ||
792 | element.bind( eventName, handlerProxy ); | ||
793 | } | ||
794 | }); | ||
795 | }, | ||
796 | |||
797 | _off: function( element, eventName ) { | ||
798 | eventName = (eventName || "").split( " " ).join( this.eventNamespace + " " ) + this.eventNamespace; | ||
799 | element.unbind( eventName ).undelegate( eventName ); | ||
800 | }, | ||
801 | |||
802 | _delay: function( handler, delay ) { | ||
803 | function handlerProxy() { | ||
804 | return ( typeof handler === "string" ? instance[ handler ] : handler ) | ||
805 | .apply( instance, arguments ); | ||
806 | } | ||
807 | var instance = this; | ||
808 | return setTimeout( handlerProxy, delay || 0 ); | ||
809 | }, | ||
810 | |||
811 | _hoverable: function( element ) { | ||
812 | this.hoverable = this.hoverable.add( element ); | ||
813 | this._on( element, { | ||
814 | mouseenter: function( event ) { | ||
815 | $( event.currentTarget ).addClass( "ui-state-hover" ); | ||
816 | }, | ||
817 | mouseleave: function( event ) { | ||
818 | $( event.currentTarget ).removeClass( "ui-state-hover" ); | ||
819 | } | ||
820 | }); | ||
821 | }, | ||
822 | |||
823 | _focusable: function( element ) { | ||
824 | this.focusable = this.focusable.add( element ); | ||
825 | this._on( element, { | ||
826 | focusin: function( event ) { | ||
827 | $( event.currentTarget ).addClass( "ui-state-focus" ); | ||
828 | }, | ||
829 | focusout: function( event ) { | ||
830 | $( event.currentTarget ).removeClass( "ui-state-focus" ); | ||
831 | } | ||
832 | }); | ||
833 | }, | ||
834 | |||
835 | _trigger: function( type, event, data ) { | ||
836 | var prop, orig, | ||
837 | callback = this.options[ type ]; | ||
838 | |||
839 | data = data || {}; | ||
840 | event = $.Event( event ); | ||
841 | event.type = ( type === this.widgetEventPrefix ? | ||
842 | type : | ||
843 | this.widgetEventPrefix + type ).toLowerCase(); | ||
844 | // the original event may come from any element | ||
845 | // so we need to reset the target on the new event | ||
846 | event.target = this.element[ 0 ]; | ||
847 | |||
848 | // copy original event properties over to the new event | ||
849 | orig = event.originalEvent; | ||
850 | if ( orig ) { | ||
851 | for ( prop in orig ) { | ||
852 | if ( !( prop in event ) ) { | ||
853 | event[ prop ] = orig[ prop ]; | ||
854 | } | ||
855 | } | ||
856 | } | ||
857 | |||
858 | this.element.trigger( event, data ); | ||
859 | return !( $.isFunction( callback ) && | ||
860 | callback.apply( this.element[0], [ event ].concat( data ) ) === false || | ||
861 | event.isDefaultPrevented() ); | ||
862 | } | ||
863 | }; | ||
864 | |||
865 | $.each( { show: "fadeIn", hide: "fadeOut" }, function( method, defaultEffect ) { | ||
866 | $.Widget.prototype[ "_" + method ] = function( element, options, callback ) { | ||
867 | if ( typeof options === "string" ) { | ||
868 | options = { effect: options }; | ||
869 | } | ||
870 | var hasOptions, | ||
871 | effectName = !options ? | ||
872 | method : | ||
873 | options === true || typeof options === "number" ? | ||
874 | defaultEffect : | ||
875 | options.effect || defaultEffect; | ||
876 | options = options || {}; | ||
877 | if ( typeof options === "number" ) { | ||
878 | options = { duration: options }; | ||
879 | } | ||
880 | hasOptions = !$.isEmptyObject( options ); | ||
881 | options.complete = callback; | ||
882 | if ( options.delay ) { | ||
883 | element.delay( options.delay ); | ||
884 | } | ||
885 | if ( hasOptions && $.effects && $.effects.effect[ effectName ] ) { | ||
886 | element[ method ]( options ); | ||
887 | } else if ( effectName !== method && element[ effectName ] ) { | ||
888 | element[ effectName ]( options.duration, options.easing, callback ); | ||
889 | } else { | ||
890 | element.queue(function( next ) { | ||
891 | $( this )[ method ](); | ||
892 | if ( callback ) { | ||
893 | callback.call( element[ 0 ] ); | ||
894 | } | ||
895 | next(); | ||
896 | }); | ||
897 | } | ||
898 | }; | ||
899 | }); | ||
900 | |||
901 | })( jQuery ); | ||
902 | |||
903 | (function( $, undefined ) { | ||
904 | |||
905 | $.widget( "mobile.widget", { | ||
906 | // decorate the parent _createWidget to trigger `widgetinit` for users | ||
907 | // who wish to do post post `widgetcreate` alterations/additions | ||
908 | // | ||
909 | // TODO create a pull request for jquery ui to trigger this event | ||
910 | // in the original _createWidget | ||
911 | _createWidget: function() { | ||
912 | $.Widget.prototype._createWidget.apply( this, arguments ); | ||
913 | this._trigger( 'init' ); | ||
914 | }, | ||
915 | |||
916 | _getCreateOptions: function() { | ||
917 | |||
918 | var elem = this.element, | ||
919 | options = {}; | ||
920 | |||
921 | $.each( this.options, function( option ) { | ||
922 | |||
923 | var value = elem.jqmData( option.replace( /[A-Z]/g, function( c ) { | ||
924 | return "-" + c.toLowerCase(); | ||
925 | }) | ||
926 | ); | ||
927 | |||
928 | if ( value !== undefined ) { | ||
929 | options[ option ] = value; | ||
930 | } | ||
931 | }); | ||
932 | |||
933 | return options; | ||
934 | }, | ||
935 | |||
936 | enhanceWithin: function( target, useKeepNative ) { | ||
937 | this.enhance( $( this.options.initSelector, $( target )), useKeepNative ); | ||
938 | }, | ||
939 | |||
940 | enhance: function( targets, useKeepNative ) { | ||
941 | var page, keepNative, $widgetElements = $( targets ), self = this; | ||
942 | |||
943 | // if ignoreContentEnabled is set to true the framework should | ||
944 | // only enhance the selected elements when they do NOT have a | ||
945 | // parent with the data-namespace-ignore attribute | ||
946 | $widgetElements = $.mobile.enhanceable( $widgetElements ); | ||
947 | |||
948 | if ( useKeepNative && $widgetElements.length ) { | ||
949 | // TODO remove dependency on the page widget for the keepNative. | ||
950 | // Currently the keepNative value is defined on the page prototype so | ||
951 | // the method is as well | ||
952 | page = $.mobile.closestPageData( $widgetElements ); | ||
953 | keepNative = ( page && page.keepNativeSelector()) || ""; | ||
954 | |||
955 | $widgetElements = $widgetElements.not( keepNative ); | ||
956 | } | ||
957 | |||
958 | $widgetElements[ this.widgetName ](); | ||
959 | }, | ||
960 | |||
961 | raise: function( msg ) { | ||
962 | throw "Widget [" + this.widgetName + "]: " + msg; | ||
963 | } | ||
964 | }); | ||
965 | |||
966 | })( jQuery ); | ||
967 | |||
968 | |||
969 | (function( $, window ) { | ||
970 | // DEPRECATED | ||
971 | // NOTE global mobile object settings | ||
972 | $.extend( $.mobile, { | ||
973 | // DEPRECATED Should the text be visble in the loading message? | ||
974 | loadingMessageTextVisible: undefined, | ||
975 | |||
976 | // DEPRECATED When the text is visible, what theme does the loading box use? | ||
977 | loadingMessageTheme: undefined, | ||
978 | |||
979 | // DEPRECATED default message setting | ||
980 | loadingMessage: undefined, | ||
981 | |||
982 | // DEPRECATED | ||
983 | // Turn on/off page loading message. Theme doubles as an object argument | ||
984 | // with the following shape: { theme: '', text: '', html: '', textVisible: '' } | ||
985 | // NOTE that the $.mobile.loading* settings and params past the first are deprecated | ||
986 | showPageLoadingMsg: function( theme, msgText, textonly ) { | ||
987 | $.mobile.loading( 'show', theme, msgText, textonly ); | ||
988 | }, | ||
989 | |||
990 | // DEPRECATED | ||
991 | hidePageLoadingMsg: function() { | ||
992 | $.mobile.loading( 'hide' ); | ||
993 | }, | ||
994 | |||
995 | loading: function() { | ||
996 | this.loaderWidget.loader.apply( this.loaderWidget, arguments ); | ||
997 | } | ||
998 | }); | ||
999 | |||
1000 | // TODO move loader class down into the widget settings | ||
1001 | var loaderClass = "ui-loader", $html = $( "html" ), $window = $.mobile.window; | ||
1002 | |||
1003 | $.widget( "mobile.loader", { | ||
1004 | // NOTE if the global config settings are defined they will override these | ||
1005 | // options | ||
1006 | options: { | ||
1007 | // the theme for the loading message | ||
1008 | theme: "a", | ||
1009 | |||
1010 | // whether the text in the loading message is shown | ||
1011 | textVisible: false, | ||
1012 | |||
1013 | // custom html for the inner content of the loading message | ||
1014 | html: "", | ||
1015 | |||
1016 | // the text to be displayed when the popup is shown | ||
1017 | text: "loading" | ||
1018 | }, | ||
1019 | |||
1020 | defaultHtml: "<div class='" + loaderClass + "'>" + | ||
1021 | "<span class='ui-icon ui-icon-loading'></span>" + | ||
1022 | "<h1></h1>" + | ||
1023 | "</div>", | ||
1024 | |||
1025 | // For non-fixed supportin browsers. Position at y center (if scrollTop supported), above the activeBtn (if defined), or just 100px from top | ||
1026 | fakeFixLoader: function() { | ||
1027 | var activeBtn = $( "." + $.mobile.activeBtnClass ).first(); | ||
1028 | |||
1029 | this.element | ||
1030 | .css({ | ||
1031 | top: $.support.scrollTop && $window.scrollTop() + $window.height() / 2 || | ||
1032 | activeBtn.length && activeBtn.offset().top || 100 | ||
1033 | }); | ||
1034 | }, | ||
1035 | |||
1036 | // check position of loader to see if it appears to be "fixed" to center | ||
1037 | // if not, use abs positioning | ||
1038 | checkLoaderPosition: function() { | ||
1039 | var offset = this.element.offset(), | ||
1040 | scrollTop = $window.scrollTop(), | ||
1041 | screenHeight = $.mobile.getScreenHeight(); | ||
1042 | |||
1043 | if ( offset.top < scrollTop || ( offset.top - scrollTop ) > screenHeight ) { | ||
1044 | this.element.addClass( "ui-loader-fakefix" ); | ||
1045 | this.fakeFixLoader(); | ||
1046 | $window | ||
1047 | .unbind( "scroll", this.checkLoaderPosition ) | ||
1048 | .bind( "scroll", $.proxy( this.fakeFixLoader, this ) ); | ||
1049 | } | ||
1050 | }, | ||
1051 | |||
1052 | resetHtml: function() { | ||
1053 | this.element.html( $( this.defaultHtml ).html() ); | ||
1054 | }, | ||
1055 | |||
1056 | // Turn on/off page loading message. Theme doubles as an object argument | ||
1057 | // with the following shape: { theme: '', text: '', html: '', textVisible: '' } | ||
1058 | // NOTE that the $.mobile.loading* settings and params past the first are deprecated | ||
1059 | // TODO sweet jesus we need to break some of this out | ||
1060 | show: function( theme, msgText, textonly ) { | ||
1061 | var textVisible, message, $header, loadSettings; | ||
1062 | |||
1063 | this.resetHtml(); | ||
1064 | |||
1065 | // use the prototype options so that people can set them globally at | ||
1066 | // mobile init. Consistency, it's what's for dinner | ||
1067 | if ( $.type(theme) === "object" ) { | ||
1068 | loadSettings = $.extend( {}, this.options, theme ); | ||
1069 | |||
1070 | // prefer object property from the param then the old theme setting | ||
1071 | theme = loadSettings.theme || $.mobile.loadingMessageTheme; | ||
1072 | } else { | ||
1073 | loadSettings = this.options; | ||
1074 | |||
1075 | // here we prefer the them value passed as a string argument, then | ||
1076 | // we prefer the global option because we can't use undefined default | ||
1077 | // prototype options, then the prototype option | ||
1078 | theme = theme || $.mobile.loadingMessageTheme || loadSettings.theme; | ||
1079 | } | ||
1080 | |||
1081 | // set the message text, prefer the param, then the settings object | ||
1082 | // then loading message | ||
1083 | message = msgText || $.mobile.loadingMessage || loadSettings.text; | ||
1084 | |||
1085 | // prepare the dom | ||
1086 | $html.addClass( "ui-loading" ); | ||
1087 | |||
1088 | if ( $.mobile.loadingMessage !== false || loadSettings.html ) { | ||
1089 | // boolean values require a bit more work :P, supports object properties | ||
1090 | // and old settings | ||
1091 | if ( $.mobile.loadingMessageTextVisible !== undefined ) { | ||
1092 | textVisible = $.mobile.loadingMessageTextVisible; | ||
1093 | } else { | ||
1094 | textVisible = loadSettings.textVisible; | ||
1095 | } | ||
1096 | |||
1097 | // add the proper css given the options (theme, text, etc) | ||
1098 | // Force text visibility if the second argument was supplied, or | ||
1099 | // if the text was explicitly set in the object args | ||
1100 | this.element.attr("class", loaderClass + | ||
1101 | " ui-corner-all ui-body-" + theme + | ||
1102 | " ui-loader-" + ( textVisible || msgText || theme.text ? "verbose" : "default" ) + | ||
1103 | ( loadSettings.textonly || textonly ? " ui-loader-textonly" : "" ) ); | ||
1104 | |||
1105 | // TODO verify that jquery.fn.html is ok to use in both cases here | ||
1106 | // this might be overly defensive in preventing unknowing xss | ||
1107 | // if the html attribute is defined on the loading settings, use that | ||
1108 | // otherwise use the fallbacks from above | ||
1109 | if ( loadSettings.html ) { | ||
1110 | this.element.html( loadSettings.html ); | ||
1111 | } else { | ||
1112 | this.element.find( "h1" ).text( message ); | ||
1113 | } | ||
1114 | |||
1115 | // attach the loader to the DOM | ||
1116 | this.element.appendTo( $.mobile.pageContainer ); | ||
1117 | |||
1118 | // check that the loader is visible | ||
1119 | this.checkLoaderPosition(); | ||
1120 | |||
1121 | // on scroll check the loader position | ||
1122 | $window.bind( "scroll", $.proxy( this.checkLoaderPosition, this ) ); | ||
1123 | } | ||
1124 | }, | ||
1125 | |||
1126 | hide: function() { | ||
1127 | $html.removeClass( "ui-loading" ); | ||
1128 | |||
1129 | if ( $.mobile.loadingMessage ) { | ||
1130 | this.element.removeClass( "ui-loader-fakefix" ); | ||
1131 | } | ||
1132 | |||
1133 | $.mobile.window.unbind( "scroll", this.fakeFixLoader ); | ||
1134 | $.mobile.window.unbind( "scroll", this.checkLoaderPosition ); | ||
1135 | } | ||
1136 | }); | ||
1137 | |||
1138 | $window.bind( 'pagecontainercreate', function() { | ||
1139 | $.mobile.loaderWidget = $.mobile.loaderWidget || $( $.mobile.loader.prototype.defaultHtml ).loader(); | ||
1140 | }); | ||
1141 | })(jQuery, this); | ||
1142 | |||
1143 | |||
1144 | (function( $, undefined ) { | ||
1145 | |||
1146 | /*! matchMedia() polyfill - Test a CSS media type/query in JS. Authors & copyright (c) 2012: Scott Jehl, Paul Irish, Nicholas Zakas. Dual MIT/BSD license */ | ||
1147 | window.matchMedia = window.matchMedia || (function( doc, undefined ) { | ||
1148 | |||
1149 | |||
1150 | |||
1151 | var bool, | ||
1152 | docElem = doc.documentElement, | ||
1153 | refNode = docElem.firstElementChild || docElem.firstChild, | ||
1154 | // fakeBody required for <FF4 when executed in <head> | ||
1155 | fakeBody = doc.createElement( "body" ), | ||
1156 | div = doc.createElement( "div" ); | ||
1157 | |||
1158 | div.id = "mq-test-1"; | ||
1159 | div.style.cssText = "position:absolute;top:-100em"; | ||
1160 | fakeBody.style.background = "none"; | ||
1161 | fakeBody.appendChild(div); | ||
1162 | |||
1163 | return function(q){ | ||
1164 | |||
1165 | div.innerHTML = "­<style media=\"" + q + "\"> #mq-test-1 { width: 42px; }</style>"; | ||
1166 | |||
1167 | docElem.insertBefore( fakeBody, refNode ); | ||
1168 | bool = div.offsetWidth === 42; | ||
1169 | docElem.removeChild( fakeBody ); | ||
1170 | |||
1171 | return { | ||
1172 | matches: bool, | ||
1173 | media: q | ||
1174 | }; | ||
1175 | |||
1176 | }; | ||
1177 | |||
1178 | }( document )); | ||
1179 | |||
1180 | // $.mobile.media uses matchMedia to return a boolean. | ||
1181 | $.mobile.media = function( q ) { | ||
1182 | return window.matchMedia( q ).matches; | ||
1183 | }; | ||
1184 | |||
1185 | })(jQuery); | ||
1186 | |||
1187 | (function( $, undefined ) { | ||
1188 | var support = { | ||
1189 | touch: "ontouchend" in document | ||
1190 | }; | ||
1191 | |||
1192 | $.mobile.support = $.mobile.support || {}; | ||
1193 | $.extend( $.support, support ); | ||
1194 | $.extend( $.mobile.support, support ); | ||
1195 | }( jQuery )); | ||
1196 | |||
1197 | (function( $, undefined ) { | ||
1198 | $.extend( $.support, { | ||
1199 | orientation: "orientation" in window && "onorientationchange" in window | ||
1200 | }); | ||
1201 | }( jQuery )); | ||
1202 | |||
1203 | (function( $, undefined ) { | ||
1204 | |||
1205 | // thx Modernizr | ||
1206 | function propExists( prop ) { | ||
1207 | var uc_prop = prop.charAt( 0 ).toUpperCase() + prop.substr( 1 ), | ||
1208 | props = ( prop + " " + vendors.join( uc_prop + " " ) + uc_prop ).split( " " ); | ||
1209 | |||
1210 | for ( var v in props ) { | ||
1211 | if ( fbCSS[ props[ v ] ] !== undefined ) { | ||
1212 | return true; | ||
1213 | } | ||
1214 | } | ||
1215 | } | ||
1216 | |||
1217 | var fakeBody = $( "<body>" ).prependTo( "html" ), | ||
1218 | fbCSS = fakeBody[ 0 ].style, | ||
1219 | vendors = [ "Webkit", "Moz", "O" ], | ||
1220 | webos = "palmGetResource" in window, //only used to rule out scrollTop | ||
1221 | opera = window.opera, | ||
1222 | operamini = window.operamini && ({}).toString.call( window.operamini ) === "[object OperaMini]", | ||
1223 | bb = window.blackberry && !propExists( "-webkit-transform" ); //only used to rule out box shadow, as it's filled opaque on BB 5 and lower | ||
1224 | |||
1225 | |||
1226 | function validStyle( prop, value, check_vend ) { | ||
1227 | var div = document.createElement( 'div' ), | ||
1228 | uc = function( txt ) { | ||
1229 | return txt.charAt( 0 ).toUpperCase() + txt.substr( 1 ); | ||
1230 | }, | ||
1231 | vend_pref = function( vend ) { | ||
1232 | if( vend === "" ) { | ||
1233 | return ""; | ||
1234 | } else { | ||
1235 | return "-" + vend.charAt( 0 ).toLowerCase() + vend.substr( 1 ) + "-"; | ||
1236 | } | ||
1237 | }, | ||
1238 | check_style = function( vend ) { | ||
1239 | var vend_prop = vend_pref( vend ) + prop + ": " + value + ";", | ||
1240 | uc_vend = uc( vend ), | ||
1241 | propStyle = uc_vend + ( uc_vend === "" ? prop : uc( prop ) ); | ||
1242 | |||
1243 | div.setAttribute( "style", vend_prop ); | ||
1244 | |||
1245 | if ( !!div.style[ propStyle ] ) { | ||
1246 | ret = true; | ||
1247 | } | ||
1248 | }, | ||
1249 | check_vends = check_vend ? check_vend : vendors, | ||
1250 | ret; | ||
1251 | |||
1252 | for( var i = 0; i < check_vends.length; i++ ) { | ||
1253 | check_style( check_vends[i] ); | ||
1254 | } | ||
1255 | return !!ret; | ||
1256 | } | ||
1257 | |||
1258 | function transform3dTest() { | ||
1259 | var mqProp = "transform-3d", | ||
1260 | // Because the `translate3d` test below throws false positives in Android: | ||
1261 | ret = $.mobile.media( "(-" + vendors.join( "-" + mqProp + "),(-" ) + "-" + mqProp + "),(" + mqProp + ")" ); | ||
1262 | |||
1263 | if( ret ) { | ||
1264 | return !!ret; | ||
1265 | } | ||
1266 | |||
1267 | var el = document.createElement( "div" ), | ||
1268 | transforms = { | ||
1269 | // We’re omitting Opera for the time being; MS uses unprefixed. | ||
1270 | 'MozTransform':'-moz-transform', | ||
1271 | 'transform':'transform' | ||
1272 | }; | ||
1273 | |||
1274 | fakeBody.append( el ); | ||
1275 | |||
1276 | for ( var t in transforms ) { | ||
1277 | if( el.style[ t ] !== undefined ){ | ||
1278 | el.style[ t ] = 'translate3d( 100px, 1px, 1px )'; | ||
1279 | ret = window.getComputedStyle( el ).getPropertyValue( transforms[ t ] ); | ||
1280 | } | ||
1281 | } | ||
1282 | return ( !!ret && ret !== "none" ); | ||
1283 | } | ||
1284 | |||
1285 | // Test for dynamic-updating base tag support ( allows us to avoid href,src attr rewriting ) | ||
1286 | function baseTagTest() { | ||
1287 | var fauxBase = location.protocol + "//" + location.host + location.pathname + "ui-dir/", | ||
1288 | base = $( "head base" ), | ||
1289 | fauxEle = null, | ||
1290 | href = "", | ||
1291 | link, rebase; | ||
1292 | |||
1293 | if ( !base.length ) { | ||
1294 | base = fauxEle = $( "<base>", { "href": fauxBase }).appendTo( "head" ); | ||
1295 | } else { | ||
1296 | href = base.attr( "href" ); | ||
1297 | } | ||
1298 | |||
1299 | link = $( "<a href='testurl' />" ).prependTo( fakeBody ); | ||
1300 | rebase = link[ 0 ].href; | ||
1301 | base[ 0 ].href = href || location.pathname; | ||
1302 | |||
1303 | if ( fauxEle ) { | ||
1304 | fauxEle.remove(); | ||
1305 | } | ||
1306 | return rebase.indexOf( fauxBase ) === 0; | ||
1307 | } | ||
1308 | |||
1309 | // Thanks Modernizr | ||
1310 | function cssPointerEventsTest() { | ||
1311 | var element = document.createElement( 'x' ), | ||
1312 | documentElement = document.documentElement, | ||
1313 | getComputedStyle = window.getComputedStyle, | ||
1314 | supports; | ||
1315 | |||
1316 | if ( !( 'pointerEvents' in element.style ) ) { | ||
1317 | return false; | ||
1318 | } | ||
1319 | |||
1320 | element.style.pointerEvents = 'auto'; | ||
1321 | element.style.pointerEvents = 'x'; | ||
1322 | documentElement.appendChild( element ); | ||
1323 | supports = getComputedStyle && | ||
1324 | getComputedStyle( element, '' ).pointerEvents === 'auto'; | ||
1325 | documentElement.removeChild( element ); | ||
1326 | return !!supports; | ||
1327 | } | ||
1328 | |||
1329 | function boundingRect() { | ||
1330 | var div = document.createElement( "div" ); | ||
1331 | return typeof div.getBoundingClientRect !== "undefined"; | ||
1332 | } | ||
1333 | |||
1334 | // non-UA-based IE version check by James Padolsey, modified by jdalton - from http://gist.github.com/527683 | ||
1335 | // allows for inclusion of IE 6+, including Windows Mobile 7 | ||
1336 | $.extend( $.mobile, { browser: {} } ); | ||
1337 | $.mobile.browser.oldIE = (function() { | ||
1338 | var v = 3, | ||
1339 | div = document.createElement( "div" ), | ||
1340 | a = div.all || []; | ||
1341 | |||
1342 | do { | ||
1343 | div.innerHTML = "<!--[if gt IE " + ( ++v ) + "]><br><![endif]-->"; | ||
1344 | } while( a[0] ); | ||
1345 | |||
1346 | return v > 4 ? v : !v; | ||
1347 | })(); | ||
1348 | |||
1349 | function fixedPosition() { | ||
1350 | var w = window, | ||
1351 | ua = navigator.userAgent, | ||
1352 | platform = navigator.platform, | ||
1353 | // Rendering engine is Webkit, and capture major version | ||
1354 | wkmatch = ua.match( /AppleWebKit\/([0-9]+)/ ), | ||
1355 | wkversion = !!wkmatch && wkmatch[ 1 ], | ||
1356 | ffmatch = ua.match( /Fennec\/([0-9]+)/ ), | ||
1357 | ffversion = !!ffmatch && ffmatch[ 1 ], | ||
1358 | operammobilematch = ua.match( /Opera Mobi\/([0-9]+)/ ), | ||
1359 | omversion = !!operammobilematch && operammobilematch[ 1 ]; | ||
1360 | |||
1361 | if( | ||
1362 | // iOS 4.3 and older : Platform is iPhone/Pad/Touch and Webkit version is less than 534 (ios5) | ||
1363 | ( ( platform.indexOf( "iPhone" ) > -1 || platform.indexOf( "iPad" ) > -1 || platform.indexOf( "iPod" ) > -1 ) && wkversion && wkversion < 534 ) || | ||
1364 | // Opera Mini | ||
1365 | ( w.operamini && ({}).toString.call( w.operamini ) === "[object OperaMini]" ) || | ||
1366 | ( operammobilematch && omversion < 7458 )|| | ||
1367 | //Android lte 2.1: Platform is Android and Webkit version is less than 533 (Android 2.2) | ||
1368 | ( ua.indexOf( "Android" ) > -1 && wkversion && wkversion < 533 ) || | ||
1369 | // Firefox Mobile before 6.0 - | ||
1370 | ( ffversion && ffversion < 6 ) || | ||
1371 | // WebOS less than 3 | ||
1372 | ( "palmGetResource" in window && wkversion && wkversion < 534 )|| | ||
1373 | // MeeGo | ||
1374 | ( ua.indexOf( "MeeGo" ) > -1 && ua.indexOf( "NokiaBrowser/8.5.0" ) > -1 ) ) { | ||
1375 | return false; | ||
1376 | } | ||
1377 | |||
1378 | return true; | ||
1379 | } | ||
1380 | |||
1381 | $.extend( $.support, { | ||
1382 | cssTransitions: "WebKitTransitionEvent" in window || | ||
1383 | validStyle( 'transition', 'height 100ms linear', [ "Webkit", "Moz", "" ] ) && | ||
1384 | !$.mobile.browser.oldIE && !opera, | ||
1385 | |||
1386 | // Note, Chrome for iOS has an extremely quirky implementation of popstate. | ||
1387 | // We've chosen to take the shortest path to a bug fix here for issue #5426 | ||
1388 | // See the following link for information about the regex chosen | ||
1389 | // https://developers.google.com/chrome/mobile/docs/user-agent#chrome_for_ios_user-agent | ||
1390 | pushState: "pushState" in history && | ||
1391 | "replaceState" in history && | ||
1392 | ( window.navigator.userAgent.search(/CriOS/) === -1 ), | ||
1393 | |||
1394 | mediaquery: $.mobile.media( "only all" ), | ||
1395 | cssPseudoElement: !!propExists( "content" ), | ||
1396 | touchOverflow: !!propExists( "overflowScrolling" ), | ||
1397 | cssTransform3d: transform3dTest(), | ||
1398 | boxShadow: !!propExists( "boxShadow" ) && !bb, | ||
1399 | fixedPosition: fixedPosition(), | ||
1400 | scrollTop: ("pageXOffset" in window || | ||
1401 | "scrollTop" in document.documentElement || | ||
1402 | "scrollTop" in fakeBody[ 0 ]) && !webos && !operamini, | ||
1403 | |||
1404 | dynamicBaseTag: baseTagTest(), | ||
1405 | cssPointerEvents: cssPointerEventsTest(), | ||
1406 | boundingRect: boundingRect() | ||
1407 | }); | ||
1408 | |||
1409 | fakeBody.remove(); | ||
1410 | |||
1411 | |||
1412 | // $.mobile.ajaxBlacklist is used to override ajaxEnabled on platforms that have known conflicts with hash history updates (BB5, Symbian) | ||
1413 | // or that generally work better browsing in regular http for full page refreshes (Opera Mini) | ||
1414 | // Note: This detection below is used as a last resort. | ||
1415 | // We recommend only using these detection methods when all other more reliable/forward-looking approaches are not possible | ||
1416 | var nokiaLTE7_3 = (function() { | ||
1417 | |||
1418 | var ua = window.navigator.userAgent; | ||
1419 | |||
1420 | //The following is an attempt to match Nokia browsers that are running Symbian/s60, with webkit, version 7.3 or older | ||
1421 | return ua.indexOf( "Nokia" ) > -1 && | ||
1422 | ( ua.indexOf( "Symbian/3" ) > -1 || ua.indexOf( "Series60/5" ) > -1 ) && | ||
1423 | ua.indexOf( "AppleWebKit" ) > -1 && | ||
1424 | ua.match( /(BrowserNG|NokiaBrowser)\/7\.[0-3]/ ); | ||
1425 | })(); | ||
1426 | |||
1427 | // Support conditions that must be met in order to proceed | ||
1428 | // default enhanced qualifications are media query support OR IE 7+ | ||
1429 | |||
1430 | $.mobile.gradeA = function() { | ||
1431 | return ( $.support.mediaquery || $.mobile.browser.oldIE && $.mobile.browser.oldIE >= 7 ) && ( $.support.boundingRect || $.fn.jquery.match(/1\.[0-7+]\.[0-9+]?/) !== null ); | ||
1432 | }; | ||
1433 | |||
1434 | $.mobile.ajaxBlacklist = | ||
1435 | // BlackBerry browsers, pre-webkit | ||
1436 | window.blackberry && !window.WebKitPoint || | ||
1437 | // Opera Mini | ||
1438 | operamini || | ||
1439 | // Symbian webkits pre 7.3 | ||
1440 | nokiaLTE7_3; | ||
1441 | |||
1442 | // Lastly, this workaround is the only way we've found so far to get pre 7.3 Symbian webkit devices | ||
1443 | // to render the stylesheets when they're referenced before this script, as we'd recommend doing. | ||
1444 | // This simply reappends the CSS in place, which for some reason makes it apply | ||
1445 | if ( nokiaLTE7_3 ) { | ||
1446 | $(function() { | ||
1447 | $( "head link[rel='stylesheet']" ).attr( "rel", "alternate stylesheet" ).attr( "rel", "stylesheet" ); | ||
1448 | }); | ||
1449 | } | ||
1450 | |||
1451 | // For ruling out shadows via css | ||
1452 | if ( !$.support.boxShadow ) { | ||
1453 | $( "html" ).addClass( "ui-mobile-nosupport-boxshadow" ); | ||
1454 | } | ||
1455 | |||
1456 | })( jQuery ); | ||
1457 | |||
1458 | |||
1459 | (function( $, undefined ) { | ||
1460 | var $win = $.mobile.window, self, history; | ||
1461 | |||
1462 | $.event.special.navigate = self = { | ||
1463 | bound: false, | ||
1464 | |||
1465 | pushStateEnabled: true, | ||
1466 | |||
1467 | originalEventName: undefined, | ||
1468 | |||
1469 | // If pushstate support is present and push state support is defined to | ||
1470 | // be true on the mobile namespace. | ||
1471 | isPushStateEnabled: function() { | ||
1472 | return $.support.pushState && | ||
1473 | $.mobile.pushStateEnabled === true && | ||
1474 | this.isHashChangeEnabled(); | ||
1475 | }, | ||
1476 | |||
1477 | // !! assumes mobile namespace is present | ||
1478 | isHashChangeEnabled: function() { | ||
1479 | return $.mobile.hashListeningEnabled === true; | ||
1480 | }, | ||
1481 | |||
1482 | // TODO a lot of duplication between popstate and hashchange | ||
1483 | popstate: function( event ) { | ||
1484 | var newEvent = new $.Event( "navigate" ), | ||
1485 | beforeNavigate = new $.Event( "beforenavigate" ), | ||
1486 | state = event.originalEvent.state || {}, | ||
1487 | href = location.href; | ||
1488 | |||
1489 | $win.trigger( beforeNavigate ); | ||
1490 | |||
1491 | if( beforeNavigate.isDefaultPrevented() ){ | ||
1492 | return; | ||
1493 | } | ||
1494 | |||
1495 | if( event.historyState ){ | ||
1496 | $.extend(state, event.historyState); | ||
1497 | } | ||
1498 | |||
1499 | // Make sure the original event is tracked for the end | ||
1500 | // user to inspect incase they want to do something special | ||
1501 | newEvent.originalEvent = event; | ||
1502 | |||
1503 | // NOTE we let the current stack unwind because any assignment to | ||
1504 | // location.hash will stop the world and run this event handler. By | ||
1505 | // doing this we create a similar behavior to hashchange on hash | ||
1506 | // assignment | ||
1507 | setTimeout(function() { | ||
1508 | $win.trigger( newEvent, { | ||
1509 | state: state | ||
1510 | }); | ||
1511 | }, 0); | ||
1512 | }, | ||
1513 | |||
1514 | hashchange: function( event, data ) { | ||
1515 | var newEvent = new $.Event( "navigate" ), | ||
1516 | beforeNavigate = new $.Event( "beforenavigate" ); | ||
1517 | |||
1518 | $win.trigger( beforeNavigate ); | ||
1519 | |||
1520 | if( beforeNavigate.isDefaultPrevented() ){ | ||
1521 | return; | ||
1522 | } | ||
1523 | |||
1524 | // Make sure the original event is tracked for the end | ||
1525 | // user to inspect incase they want to do something special | ||
1526 | newEvent.originalEvent = event; | ||
1527 | |||
1528 | // Trigger the hashchange with state provided by the user | ||
1529 | // that altered the hash | ||
1530 | $win.trigger( newEvent, { | ||
1531 | // Users that want to fully normalize the two events | ||
1532 | // will need to do history management down the stack and | ||
1533 | // add the state to the event before this binding is fired | ||
1534 | // TODO consider allowing for the explicit addition of callbacks | ||
1535 | // to be fired before this value is set to avoid event timing issues | ||
1536 | state: event.hashchangeState || {} | ||
1537 | }); | ||
1538 | }, | ||
1539 | |||
1540 | // TODO We really only want to set this up once | ||
1541 | // but I'm not clear if there's a beter way to achieve | ||
1542 | // this with the jQuery special event structure | ||
1543 | setup: function( data, namespaces ) { | ||
1544 | if( self.bound ) { | ||
1545 | return; | ||
1546 | } | ||
1547 | |||
1548 | self.bound = true; | ||
1549 | |||
1550 | if( self.isPushStateEnabled() ) { | ||
1551 | self.originalEventName = "popstate"; | ||
1552 | $win.bind( "popstate.navigate", self.popstate ); | ||
1553 | } else if ( self.isHashChangeEnabled() ){ | ||
1554 | self.originalEventName = "hashchange"; | ||
1555 | $win.bind( "hashchange.navigate", self.hashchange ); | ||
1556 | } | ||
1557 | } | ||
1558 | }; | ||
1559 | })( jQuery ); | ||
1560 | |||
1561 | |||
1562 | |||
1563 | (function( $, undefined ) { | ||
1564 | var path, documentBase, $base, dialogHashKey = "&ui-state=dialog"; | ||
1565 | |||
1566 | $.mobile.path = path = { | ||
1567 | uiStateKey: "&ui-state", | ||
1568 | |||
1569 | // This scary looking regular expression parses an absolute URL or its relative | ||
1570 | // variants (protocol, site, document, query, and hash), into the various | ||
1571 | // components (protocol, host, path, query, fragment, etc that make up the | ||
1572 | // URL as well as some other commonly used sub-parts. When used with RegExp.exec() | ||
1573 | // or String.match, it parses the URL into a results array that looks like this: | ||
1574 | // | ||
1575 | // [0]: http://jblas:password@mycompany.com:8080/mail/inbox?msg=1234&type=unread#msg-content | ||
1576 | // [1]: http://jblas:password@mycompany.com:8080/mail/inbox?msg=1234&type=unread | ||
1577 | // [2]: http://jblas:password@mycompany.com:8080/mail/inbox | ||
1578 | // [3]: http://jblas:password@mycompany.com:8080 | ||
1579 | // [4]: http: | ||
1580 | // [5]: // | ||
1581 | // [6]: jblas:password@mycompany.com:8080 | ||
1582 | // [7]: jblas:password | ||
1583 | // [8]: jblas | ||
1584 | // [9]: password | ||
1585 | // [10]: mycompany.com:8080 | ||
1586 | // [11]: mycompany.com | ||
1587 | // [12]: 8080 | ||
1588 | // [13]: /mail/inbox | ||
1589 | // [14]: /mail/ | ||
1590 | // [15]: inbox | ||
1591 | // [16]: ?msg=1234&type=unread | ||
1592 | // [17]: #msg-content | ||
1593 | // | ||
1594 | urlParseRE: /^\s*(((([^:\/#\?]+:)?(?:(\/\/)((?:(([^:@\/#\?]+)(?:\:([^:@\/#\?]+))?)@)?(([^:\/#\?\]\[]+|\[[^\/\]@#?]+\])(?:\:([0-9]+))?))?)?)?((\/?(?:[^\/\?#]+\/+)*)([^\?#]*)))?(\?[^#]+)?)(#.*)?/, | ||
1595 | |||
1596 | // Abstraction to address xss (Issue #4787) by removing the authority in | ||
1597 | // browsers that autodecode it. All references to location.href should be | ||
1598 | // replaced with a call to this method so that it can be dealt with properly here | ||
1599 | getLocation: function( url ) { | ||
1600 | var uri = url ? this.parseUrl( url ) : location, | ||
1601 | hash = this.parseUrl( url || location.href ).hash; | ||
1602 | |||
1603 | // mimic the browser with an empty string when the hash is empty | ||
1604 | hash = hash === "#" ? "" : hash; | ||
1605 | |||
1606 | // Make sure to parse the url or the location object for the hash because using location.hash | ||
1607 | // is autodecoded in firefox, the rest of the url should be from the object (location unless | ||
1608 | // we're testing) to avoid the inclusion of the authority | ||
1609 | return uri.protocol + "//" + uri.host + uri.pathname + uri.search + hash; | ||
1610 | }, | ||
1611 | |||
1612 | parseLocation: function() { | ||
1613 | return this.parseUrl( this.getLocation() ); | ||
1614 | }, | ||
1615 | |||
1616 | //Parse a URL into a structure that allows easy access to | ||
1617 | //all of the URL components by name. | ||
1618 | parseUrl: function( url ) { | ||
1619 | // If we're passed an object, we'll assume that it is | ||
1620 | // a parsed url object and just return it back to the caller. | ||
1621 | if ( $.type( url ) === "object" ) { | ||
1622 | return url; | ||
1623 | } | ||
1624 | |||
1625 | var matches = path.urlParseRE.exec( url || "" ) || []; | ||
1626 | |||
1627 | // Create an object that allows the caller to access the sub-matches | ||
1628 | // by name. Note that IE returns an empty string instead of undefined, | ||
1629 | // like all other browsers do, so we normalize everything so its consistent | ||
1630 | // no matter what browser we're running on. | ||
1631 | return { | ||
1632 | href: matches[ 0 ] || "", | ||
1633 | hrefNoHash: matches[ 1 ] || "", | ||
1634 | hrefNoSearch: matches[ 2 ] || "", | ||
1635 | domain: matches[ 3 ] || "", | ||
1636 | protocol: matches[ 4 ] || "", | ||
1637 | doubleSlash: matches[ 5 ] || "", | ||
1638 | authority: matches[ 6 ] || "", | ||
1639 | username: matches[ 8 ] || "", | ||
1640 | password: matches[ 9 ] || "", | ||
1641 | host: matches[ 10 ] || "", | ||
1642 | hostname: matches[ 11 ] || "", | ||
1643 | port: matches[ 12 ] || "", | ||
1644 | pathname: matches[ 13 ] || "", | ||
1645 | directory: matches[ 14 ] || "", | ||
1646 | filename: matches[ 15 ] || "", | ||
1647 | search: matches[ 16 ] || "", | ||
1648 | hash: matches[ 17 ] || "" | ||
1649 | }; | ||
1650 | }, | ||
1651 | |||
1652 | //Turn relPath into an asbolute path. absPath is | ||
1653 | //an optional absolute path which describes what | ||
1654 | //relPath is relative to. | ||
1655 | makePathAbsolute: function( relPath, absPath ) { | ||
1656 | if ( relPath && relPath.charAt( 0 ) === "/" ) { | ||
1657 | return relPath; | ||
1658 | } | ||
1659 | |||
1660 | relPath = relPath || ""; | ||
1661 | absPath = absPath ? absPath.replace( /^\/|(\/[^\/]*|[^\/]+)$/g, "" ) : ""; | ||
1662 | |||
1663 | var absStack = absPath ? absPath.split( "/" ) : [], | ||
1664 | relStack = relPath.split( "/" ); | ||
1665 | for ( var i = 0; i < relStack.length; i++ ) { | ||
1666 | var d = relStack[ i ]; | ||
1667 | switch ( d ) { | ||
1668 | case ".": | ||
1669 | break; | ||
1670 | case "..": | ||
1671 | if ( absStack.length ) { | ||
1672 | absStack.pop(); | ||
1673 | } | ||
1674 | break; | ||
1675 | default: | ||
1676 | absStack.push( d ); | ||
1677 | break; | ||
1678 | } | ||
1679 | } | ||
1680 | return "/" + absStack.join( "/" ); | ||
1681 | }, | ||
1682 | |||
1683 | //Returns true if both urls have the same domain. | ||
1684 | isSameDomain: function( absUrl1, absUrl2 ) { | ||
1685 | return path.parseUrl( absUrl1 ).domain === path.parseUrl( absUrl2 ).domain; | ||
1686 | }, | ||
1687 | |||
1688 | //Returns true for any relative variant. | ||
1689 | isRelativeUrl: function( url ) { | ||
1690 | // All relative Url variants have one thing in common, no protocol. | ||
1691 | return path.parseUrl( url ).protocol === ""; | ||
1692 | }, | ||
1693 | |||
1694 | //Returns true for an absolute url. | ||
1695 | isAbsoluteUrl: function( url ) { | ||
1696 | return path.parseUrl( url ).protocol !== ""; | ||
1697 | }, | ||
1698 | |||
1699 | //Turn the specified realtive URL into an absolute one. This function | ||
1700 | //can handle all relative variants (protocol, site, document, query, fragment). | ||
1701 | makeUrlAbsolute: function( relUrl, absUrl ) { | ||
1702 | if ( !path.isRelativeUrl( relUrl ) ) { | ||
1703 | return relUrl; | ||
1704 | } | ||
1705 | |||
1706 | if ( absUrl === undefined ) { | ||
1707 | absUrl = this.documentBase; | ||
1708 | } | ||
1709 | |||
1710 | var relObj = path.parseUrl( relUrl ), | ||
1711 | absObj = path.parseUrl( absUrl ), | ||
1712 | protocol = relObj.protocol || absObj.protocol, | ||
1713 | doubleSlash = relObj.protocol ? relObj.doubleSlash : ( relObj.doubleSlash || absObj.doubleSlash ), | ||
1714 | authority = relObj.authority || absObj.authority, | ||
1715 | hasPath = relObj.pathname !== "", | ||
1716 | pathname = path.makePathAbsolute( relObj.pathname || absObj.filename, absObj.pathname ), | ||
1717 | search = relObj.search || ( !hasPath && absObj.search ) || "", | ||
1718 | hash = relObj.hash; | ||
1719 | |||
1720 | return protocol + doubleSlash + authority + pathname + search + hash; | ||
1721 | }, | ||
1722 | |||
1723 | //Add search (aka query) params to the specified url. | ||
1724 | addSearchParams: function( url, params ) { | ||
1725 | var u = path.parseUrl( url ), | ||
1726 | p = ( typeof params === "object" ) ? $.param( params ) : params, | ||
1727 | s = u.search || "?"; | ||
1728 | return u.hrefNoSearch + s + ( s.charAt( s.length - 1 ) !== "?" ? "&" : "" ) + p + ( u.hash || "" ); | ||
1729 | }, | ||
1730 | |||
1731 | convertUrlToDataUrl: function( absUrl ) { | ||
1732 | var u = path.parseUrl( absUrl ); | ||
1733 | if ( path.isEmbeddedPage( u ) ) { | ||
1734 | // For embedded pages, remove the dialog hash key as in getFilePath(), | ||
1735 | // and remove otherwise the Data Url won't match the id of the embedded Page. | ||
1736 | return u.hash | ||
1737 | .split( dialogHashKey )[0] | ||
1738 | .replace( /^#/, "" ) | ||
1739 | .replace( /\?.*$/, "" ); | ||
1740 | } else if ( path.isSameDomain( u, this.documentBase ) ) { | ||
1741 | return u.hrefNoHash.replace( this.documentBase.domain, "" ).split( dialogHashKey )[0]; | ||
1742 | } | ||
1743 | |||
1744 | return window.decodeURIComponent(absUrl); | ||
1745 | }, | ||
1746 | |||
1747 | //get path from current hash, or from a file path | ||
1748 | get: function( newPath ) { | ||
1749 | if ( newPath === undefined ) { | ||
1750 | newPath = path.parseLocation().hash; | ||
1751 | } | ||
1752 | return path.stripHash( newPath ).replace( /[^\/]*\.[^\/*]+$/, '' ); | ||
1753 | }, | ||
1754 | |||
1755 | //set location hash to path | ||
1756 | set: function( path ) { | ||
1757 | location.hash = path; | ||
1758 | }, | ||
1759 | |||
1760 | //test if a given url (string) is a path | ||
1761 | //NOTE might be exceptionally naive | ||
1762 | isPath: function( url ) { | ||
1763 | return ( /\// ).test( url ); | ||
1764 | }, | ||
1765 | |||
1766 | //return a url path with the window's location protocol/hostname/pathname removed | ||
1767 | clean: function( url ) { | ||
1768 | return url.replace( this.documentBase.domain, "" ); | ||
1769 | }, | ||
1770 | |||
1771 | //just return the url without an initial # | ||
1772 | stripHash: function( url ) { | ||
1773 | return url.replace( /^#/, "" ); | ||
1774 | }, | ||
1775 | |||
1776 | stripQueryParams: function( url ) { | ||
1777 | return url.replace( /\?.*$/, "" ); | ||
1778 | }, | ||
1779 | |||
1780 | //remove the preceding hash, any query params, and dialog notations | ||
1781 | cleanHash: function( hash ) { | ||
1782 | return path.stripHash( hash.replace( /\?.*$/, "" ).replace( dialogHashKey, "" ) ); | ||
1783 | }, | ||
1784 | |||
1785 | isHashValid: function( hash ) { | ||
1786 | return ( /^#[^#]+$/ ).test( hash ); | ||
1787 | }, | ||
1788 | |||
1789 | //check whether a url is referencing the same domain, or an external domain or different protocol | ||
1790 | //could be mailto, etc | ||
1791 | isExternal: function( url ) { | ||
1792 | var u = path.parseUrl( url ); | ||
1793 | return u.protocol && u.domain !== this.documentUrl.domain ? true : false; | ||
1794 | }, | ||
1795 | |||
1796 | hasProtocol: function( url ) { | ||
1797 | return ( /^(:?\w+:)/ ).test( url ); | ||
1798 | }, | ||
1799 | |||
1800 | isEmbeddedPage: function( url ) { | ||
1801 | var u = path.parseUrl( url ); | ||
1802 | |||
1803 | //if the path is absolute, then we need to compare the url against | ||
1804 | //both the this.documentUrl and the documentBase. The main reason for this | ||
1805 | //is that links embedded within external documents will refer to the | ||
1806 | //application document, whereas links embedded within the application | ||
1807 | //document will be resolved against the document base. | ||
1808 | if ( u.protocol !== "" ) { | ||
1809 | return ( !this.isPath(u.hash) && u.hash && ( u.hrefNoHash === this.documentUrl.hrefNoHash || ( this.documentBaseDiffers && u.hrefNoHash === this.documentBase.hrefNoHash ) ) ); | ||
1810 | } | ||
1811 | return ( /^#/ ).test( u.href ); | ||
1812 | }, | ||
1813 | |||
1814 | squash: function( url, resolutionUrl ) { | ||
1815 | var state, href, cleanedUrl, search, stateIndex, | ||
1816 | isPath = this.isPath( url ), | ||
1817 | uri = this.parseUrl( url ), | ||
1818 | preservedHash = uri.hash, | ||
1819 | uiState = ""; | ||
1820 | |||
1821 | // produce a url against which we can resole the provided path | ||
1822 | resolutionUrl = resolutionUrl || (path.isPath(url) ? path.getLocation() : path.getDocumentUrl()); | ||
1823 | |||
1824 | // If the url is anything but a simple string, remove any preceding hash | ||
1825 | // eg #foo/bar -> foo/bar | ||
1826 | // #foo -> #foo | ||
1827 | cleanedUrl = isPath ? path.stripHash( url ) : url; | ||
1828 | |||
1829 | // If the url is a full url with a hash check if the parsed hash is a path | ||
1830 | // if it is, strip the #, and use it otherwise continue without change | ||
1831 | cleanedUrl = path.isPath( uri.hash ) ? path.stripHash( uri.hash ) : cleanedUrl; | ||
1832 | |||
1833 | // Split the UI State keys off the href | ||
1834 | stateIndex = cleanedUrl.indexOf( this.uiStateKey ); | ||
1835 | |||
1836 | // store the ui state keys for use | ||
1837 | if( stateIndex > -1 ){ | ||
1838 | uiState = cleanedUrl.slice( stateIndex ); | ||
1839 | cleanedUrl = cleanedUrl.slice( 0, stateIndex ); | ||
1840 | } | ||
1841 | |||
1842 | // make the cleanedUrl absolute relative to the resolution url | ||
1843 | href = path.makeUrlAbsolute( cleanedUrl, resolutionUrl ); | ||
1844 | |||
1845 | // grab the search from the resolved url since parsing from | ||
1846 | // the passed url may not yield the correct result | ||
1847 | search = this.parseUrl( href ).search; | ||
1848 | |||
1849 | // TODO all this crap is terrible, clean it up | ||
1850 | if ( isPath ) { | ||
1851 | // reject the hash if it's a path or it's just a dialog key | ||
1852 | if( path.isPath( preservedHash ) || preservedHash.replace("#", "").indexOf( this.uiStateKey ) === 0) { | ||
1853 | preservedHash = ""; | ||
1854 | } | ||
1855 | |||
1856 | // Append the UI State keys where it exists and it's been removed | ||
1857 | // from the url | ||
1858 | if( uiState && preservedHash.indexOf( this.uiStateKey ) === -1){ | ||
1859 | preservedHash += uiState; | ||
1860 | } | ||
1861 | |||
1862 | // make sure that pound is on the front of the hash | ||
1863 | if( preservedHash.indexOf( "#" ) === -1 && preservedHash !== "" ){ | ||
1864 | preservedHash = "#" + preservedHash; | ||
1865 | } | ||
1866 | |||
1867 | // reconstruct each of the pieces with the new search string and hash | ||
1868 | href = path.parseUrl( href ); | ||
1869 | href = href.protocol + "//" + href.host + href.pathname + search + preservedHash; | ||
1870 | } else { | ||
1871 | href += href.indexOf( "#" ) > -1 ? uiState : "#" + uiState; | ||
1872 | } | ||
1873 | |||
1874 | return href; | ||
1875 | }, | ||
1876 | |||
1877 | isPreservableHash: function( hash ) { | ||
1878 | return hash.replace( "#", "" ).indexOf( this.uiStateKey ) === 0; | ||
1879 | } | ||
1880 | }; | ||
1881 | |||
1882 | path.documentUrl = path.parseLocation(); | ||
1883 | |||
1884 | $base = $( "head" ).find( "base" ); | ||
1885 | |||
1886 | path.documentBase = $base.length ? | ||
1887 | path.parseUrl( path.makeUrlAbsolute( $base.attr( "href" ), path.documentUrl.href ) ) : | ||
1888 | path.documentUrl; | ||
1889 | |||
1890 | path.documentBaseDiffers = (path.documentUrl.hrefNoHash !== path.documentBase.hrefNoHash); | ||
1891 | |||
1892 | //return the original document url | ||
1893 | path.getDocumentUrl = function( asParsedObject ) { | ||
1894 | return asParsedObject ? $.extend( {}, path.documentUrl ) : path.documentUrl.href; | ||
1895 | }; | ||
1896 | |||
1897 | //return the original document base url | ||
1898 | path.getDocumentBase = function( asParsedObject ) { | ||
1899 | return asParsedObject ? $.extend( {}, path.documentBase ) : path.documentBase.href; | ||
1900 | }; | ||
1901 | })( jQuery ); | ||
1902 | |||
1903 | |||
1904 | |||
1905 | (function( $, undefined ) { | ||
1906 | var path = $.mobile.path; | ||
1907 | |||
1908 | $.mobile.History = function( stack, index ) { | ||
1909 | this.stack = stack || []; | ||
1910 | this.activeIndex = index || 0; | ||
1911 | }; | ||
1912 | |||
1913 | $.extend($.mobile.History.prototype, { | ||
1914 | getActive: function() { | ||
1915 | return this.stack[ this.activeIndex ]; | ||
1916 | }, | ||
1917 | |||
1918 | getLast: function() { | ||
1919 | return this.stack[ this.previousIndex ]; | ||
1920 | }, | ||
1921 | |||
1922 | getNext: function() { | ||
1923 | return this.stack[ this.activeIndex + 1 ]; | ||
1924 | }, | ||
1925 | |||
1926 | getPrev: function() { | ||
1927 | return this.stack[ this.activeIndex - 1 ]; | ||
1928 | }, | ||
1929 | |||
1930 | // addNew is used whenever a new page is added | ||
1931 | add: function( url, data ){ | ||
1932 | data = data || {}; | ||
1933 | |||
1934 | //if there's forward history, wipe it | ||
1935 | if ( this.getNext() ) { | ||
1936 | this.clearForward(); | ||
1937 | } | ||
1938 | |||
1939 | // if the hash is included in the data make sure the shape | ||
1940 | // is consistent for comparison | ||
1941 | if( data.hash && data.hash.indexOf( "#" ) === -1) { | ||
1942 | data.hash = "#" + data.hash; | ||
1943 | } | ||
1944 | |||
1945 | data.url = url; | ||
1946 | this.stack.push( data ); | ||
1947 | this.activeIndex = this.stack.length - 1; | ||
1948 | }, | ||
1949 | |||
1950 | //wipe urls ahead of active index | ||
1951 | clearForward: function() { | ||
1952 | this.stack = this.stack.slice( 0, this.activeIndex + 1 ); | ||
1953 | }, | ||
1954 | |||
1955 | find: function( url, stack, earlyReturn ) { | ||
1956 | stack = stack || this.stack; | ||
1957 | |||
1958 | var entry, i, length = stack.length, index; | ||
1959 | |||
1960 | for ( i = 0; i < length; i++ ) { | ||
1961 | entry = stack[i]; | ||
1962 | |||
1963 | if ( decodeURIComponent(url) === decodeURIComponent(entry.url) || | ||
1964 | decodeURIComponent(url) === decodeURIComponent(entry.hash) ) { | ||
1965 | index = i; | ||
1966 | |||
1967 | if( earlyReturn ) { | ||
1968 | return index; | ||
1969 | } | ||
1970 | } | ||
1971 | } | ||
1972 | |||
1973 | return index; | ||
1974 | }, | ||
1975 | |||
1976 | closest: function( url ) { | ||
1977 | var closest, a = this.activeIndex; | ||
1978 | |||
1979 | // First, take the slice of the history stack before the current index and search | ||
1980 | // for a url match. If one is found, we'll avoid avoid looking through forward history | ||
1981 | // NOTE the preference for backward history movement is driven by the fact that | ||
1982 | // most mobile browsers only have a dedicated back button, and users rarely use | ||
1983 | // the forward button in desktop browser anyhow | ||
1984 | closest = this.find( url, this.stack.slice(0, a) ); | ||
1985 | |||
1986 | // If nothing was found in backward history check forward. The `true` | ||
1987 | // value passed as the third parameter causes the find method to break | ||
1988 | // on the first match in the forward history slice. The starting index | ||
1989 | // of the slice must then be added to the result to get the element index | ||
1990 | // in the original history stack :( :( | ||
1991 | // | ||
1992 | // TODO this is hyper confusing and should be cleaned up (ugh so bad) | ||
1993 | if( closest === undefined ) { | ||
1994 | closest = this.find( url, this.stack.slice(a), true ); | ||
1995 | closest = closest === undefined ? closest : closest + a; | ||
1996 | } | ||
1997 | |||
1998 | return closest; | ||
1999 | }, | ||
2000 | |||
2001 | direct: function( opts ) { | ||
2002 | var newActiveIndex = this.closest( opts.url ), a = this.activeIndex; | ||
2003 | |||
2004 | // save new page index, null check to prevent falsey 0 result | ||
2005 | // record the previous index for reference | ||
2006 | if( newActiveIndex !== undefined ) { | ||
2007 | this.activeIndex = newActiveIndex; | ||
2008 | this.previousIndex = a; | ||
2009 | } | ||
2010 | |||
2011 | // invoke callbacks where appropriate | ||
2012 | // | ||
2013 | // TODO this is also convoluted and confusing | ||
2014 | if ( newActiveIndex < a ) { | ||
2015 | ( opts.present || opts.back || $.noop )( this.getActive(), 'back' ); | ||
2016 | } else if ( newActiveIndex > a ) { | ||
2017 | ( opts.present || opts.forward || $.noop )( this.getActive(), 'forward' ); | ||
2018 | } else if ( newActiveIndex === undefined && opts.missing ){ | ||
2019 | opts.missing( this.getActive() ); | ||
2020 | } | ||
2021 | } | ||
2022 | }); | ||
2023 | })( jQuery ); | ||
2024 | |||
2025 | |||
2026 | (function( $, undefined ) { | ||
2027 | var path = $.mobile.path; | ||
2028 | |||
2029 | $.mobile.Navigator = function( history ) { | ||
2030 | this.history = history; | ||
2031 | this.ignoreInitialHashChange = true; | ||
2032 | |||
2033 | // This ensures that browsers which don't fire the initial popstate | ||
2034 | // like opera don't have further hash assignment popstates blocked | ||
2035 | setTimeout($.proxy(function() { | ||
2036 | this.ignoreInitialHashChange = false; | ||
2037 | }, this), 200); | ||
2038 | |||
2039 | $.mobile.window.bind({ | ||
2040 | "popstate.history": $.proxy( this.popstate, this ), | ||
2041 | "hashchange.history": $.proxy( this.hashchange, this ) | ||
2042 | }); | ||
2043 | }; | ||
2044 | |||
2045 | $.extend($.mobile.Navigator.prototype, { | ||
2046 | squash: function( url, data ) { | ||
2047 | var state, href, hash = path.isPath(url) ? path.stripHash(url) : url; | ||
2048 | |||
2049 | href = path.squash( url ); | ||
2050 | |||
2051 | // make sure to provide this information when it isn't explicitly set in the | ||
2052 | // data object that was passed to the squash method | ||
2053 | state = $.extend({ | ||
2054 | hash: hash, | ||
2055 | url: href | ||
2056 | }, data); | ||
2057 | |||
2058 | // replace the current url with the new href and store the state | ||
2059 | // Note that in some cases we might be replacing an url with the | ||
2060 | // same url. We do this anyways because we need to make sure that | ||
2061 | // all of our history entries have a state object associated with | ||
2062 | // them. This allows us to work around the case where $.mobile.back() | ||
2063 | // is called to transition from an external page to an embedded page. | ||
2064 | // In that particular case, a hashchange event is *NOT* generated by the browser. | ||
2065 | // Ensuring each history entry has a state object means that onPopState() | ||
2066 | // will always trigger our hashchange callback even when a hashchange event | ||
2067 | // is not fired. | ||
2068 | window.history.replaceState( state, state.title || document.title, href ); | ||
2069 | |||
2070 | return state; | ||
2071 | }, | ||
2072 | |||
2073 | hash: function( url, href ) { | ||
2074 | var parsed, loc, hash; | ||
2075 | |||
2076 | // Grab the hash for recording. If the passed url is a path | ||
2077 | // we used the parsed version of the squashed url to reconstruct, | ||
2078 | // otherwise we assume it's a hash and store it directly | ||
2079 | parsed = path.parseUrl( url ); | ||
2080 | loc = path.parseLocation(); | ||
2081 | |||
2082 | if( loc.pathname + loc.search === parsed.pathname + parsed.search ) { | ||
2083 | // If the pathname and search of the passed url is identical to the current loc | ||
2084 | // then we must use the hash. Otherwise there will be no event | ||
2085 | // eg, url = "/foo/bar?baz#bang", location.href = "http://example.com/foo/bar?baz" | ||
2086 | hash = parsed.hash ? parsed.hash : parsed.pathname + parsed.search; | ||
2087 | } else if ( path.isPath(url) ) { | ||
2088 | var resolved = path.parseUrl( href ); | ||
2089 | // If the passed url is a path, make it domain relative and remove any trailing hash | ||
2090 | hash = resolved.pathname + resolved.search + (path.isPreservableHash( resolved.hash )? resolved.hash.replace( "#", "" ) : ""); | ||
2091 | } else { | ||
2092 | hash = url; | ||
2093 | } | ||
2094 | |||
2095 | return hash; | ||
2096 | }, | ||
2097 | |||
2098 | // TODO reconsider name | ||
2099 | go: function( url, data, noEvents ) { | ||
2100 | var state, href, hash, popstateEvent, | ||
2101 | isPopStateEvent = $.event.special.navigate.isPushStateEnabled(); | ||
2102 | |||
2103 | // Get the url as it would look squashed on to the current resolution url | ||
2104 | href = path.squash( url ); | ||
2105 | |||
2106 | // sort out what the hash sould be from the url | ||
2107 | hash = this.hash( url, href ); | ||
2108 | |||
2109 | // Here we prevent the next hash change or popstate event from doing any | ||
2110 | // history management. In the case of hashchange we don't swallow it | ||
2111 | // if there will be no hashchange fired (since that won't reset the value) | ||
2112 | // and will swallow the following hashchange | ||
2113 | if( noEvents && hash !== path.stripHash(path.parseLocation().hash) ) { | ||
2114 | this.preventNextHashChange = noEvents; | ||
2115 | } | ||
2116 | |||
2117 | // IMPORTANT in the case where popstate is supported the event will be triggered | ||
2118 | // directly, stopping further execution - ie, interupting the flow of this | ||
2119 | // method call to fire bindings at this expression. Below the navigate method | ||
2120 | // there is a binding to catch this event and stop its propagation. | ||
2121 | // | ||
2122 | // We then trigger a new popstate event on the window with a null state | ||
2123 | // so that the navigate events can conclude their work properly | ||
2124 | // | ||
2125 | // if the url is a path we want to preserve the query params that are available on | ||
2126 | // the current url. | ||
2127 | this.preventHashAssignPopState = true; | ||
2128 | window.location.hash = hash; | ||
2129 | |||
2130 | // If popstate is enabled and the browser triggers `popstate` events when the hash | ||
2131 | // is set (this often happens immediately in browsers like Chrome), then the | ||
2132 | // this flag will be set to false already. If it's a browser that does not trigger | ||
2133 | // a `popstate` on hash assignement or `replaceState` then we need avoid the branch | ||
2134 | // that swallows the event created by the popstate generated by the hash assignment | ||
2135 | // At the time of this writing this happens with Opera 12 and some version of IE | ||
2136 | this.preventHashAssignPopState = false; | ||
2137 | |||
2138 | state = $.extend({ | ||
2139 | url: href, | ||
2140 | hash: hash, | ||
2141 | title: document.title | ||
2142 | }, data); | ||
2143 | |||
2144 | if( isPopStateEvent ) { | ||
2145 | popstateEvent = new $.Event( "popstate" ); | ||
2146 | popstateEvent.originalEvent = { | ||
2147 | type: "popstate", | ||
2148 | state: null | ||
2149 | }; | ||
2150 | |||
2151 | this.squash( url, state ); | ||
2152 | |||
2153 | // Trigger a new faux popstate event to replace the one that we | ||
2154 | // caught that was triggered by the hash setting above. | ||
2155 | if( !noEvents ) { | ||
2156 | this.ignorePopState = true; | ||
2157 | $.mobile.window.trigger( popstateEvent ); | ||
2158 | } | ||
2159 | } | ||
2160 | |||
2161 | // record the history entry so that the information can be included | ||
2162 | // in hashchange event driven navigate events in a similar fashion to | ||
2163 | // the state that's provided by popstate | ||
2164 | this.history.add( state.url, state ); | ||
2165 | }, | ||
2166 | |||
2167 | |||
2168 | // This binding is intended to catch the popstate events that are fired | ||
2169 | // when execution of the `$.navigate` method stops at window.location.hash = url; | ||
2170 | // and completely prevent them from propagating. The popstate event will then be | ||
2171 | // retriggered after execution resumes | ||
2172 | // | ||
2173 | // TODO grab the original event here and use it for the synthetic event in the | ||
2174 | // second half of the navigate execution that will follow this binding | ||
2175 | popstate: function( event ) { | ||
2176 | var active, hash, state, closestIndex; | ||
2177 | |||
2178 | // Partly to support our test suite which manually alters the support | ||
2179 | // value to test hashchange. Partly to prevent all around weirdness | ||
2180 | if( !$.event.special.navigate.isPushStateEnabled() ){ | ||
2181 | return; | ||
2182 | } | ||
2183 | |||
2184 | // If this is the popstate triggered by the actual alteration of the hash | ||
2185 | // prevent it completely. History is tracked manually | ||
2186 | if( this.preventHashAssignPopState ) { | ||
2187 | this.preventHashAssignPopState = false; | ||
2188 | event.stopImmediatePropagation(); | ||
2189 | return; | ||
2190 | } | ||
2191 | |||
2192 | // if this is the popstate triggered after the `replaceState` call in the go | ||
2193 | // method, then simply ignore it. The history entry has already been captured | ||
2194 | if( this.ignorePopState ) { | ||
2195 | this.ignorePopState = false; | ||
2196 | return; | ||
2197 | } | ||
2198 | |||
2199 | // If there is no state, and the history stack length is one were | ||
2200 | // probably getting the page load popstate fired by browsers like chrome | ||
2201 | // avoid it and set the one time flag to false | ||
2202 | if( !event.originalEvent.state && | ||
2203 | this.history.stack.length === 1 && | ||
2204 | this.ignoreInitialHashChange ) { | ||
2205 | this.ignoreInitialHashChange = false; | ||
2206 | |||
2207 | return; | ||
2208 | } | ||
2209 | |||
2210 | // account for direct manipulation of the hash. That is, we will receive a popstate | ||
2211 | // when the hash is changed by assignment, and it won't have a state associated. We | ||
2212 | // then need to squash the hash. See below for handling of hash assignment that | ||
2213 | // matches an existing history entry | ||
2214 | // TODO it might be better to only add to the history stack | ||
2215 | // when the hash is adjacent to the active history entry | ||
2216 | hash = path.parseLocation().hash; | ||
2217 | if( !event.originalEvent.state && hash ) { | ||
2218 | // squash the hash that's been assigned on the URL with replaceState | ||
2219 | // also grab the resulting state object for storage | ||
2220 | state = this.squash( hash ); | ||
2221 | |||
2222 | // record the new hash as an additional history entry | ||
2223 | // to match the browser's treatment of hash assignment | ||
2224 | this.history.add( state.url, state ); | ||
2225 | |||
2226 | // pass the newly created state information | ||
2227 | // along with the event | ||
2228 | event.historyState = state; | ||
2229 | |||
2230 | // do not alter history, we've added a new history entry | ||
2231 | // so we know where we are | ||
2232 | return; | ||
2233 | } | ||
2234 | |||
2235 | // If all else fails this is a popstate that comes from the back or forward buttons | ||
2236 | // make sure to set the state of our history stack properly, and record the directionality | ||
2237 | this.history.direct({ | ||
2238 | url: (event.originalEvent.state || {}).url || hash, | ||
2239 | |||
2240 | // When the url is either forward or backward in history include the entry | ||
2241 | // as data on the event object for merging as data in the navigate event | ||
2242 | present: function( historyEntry, direction ) { | ||
2243 | // make sure to create a new object to pass down as the navigate event data | ||
2244 | event.historyState = $.extend({}, historyEntry); | ||
2245 | event.historyState.direction = direction; | ||
2246 | } | ||
2247 | }); | ||
2248 | }, | ||
2249 | |||
2250 | // NOTE must bind before `navigate` special event hashchange binding otherwise the | ||
2251 | // navigation data won't be attached to the hashchange event in time for those | ||
2252 | // bindings to attach it to the `navigate` special event | ||
2253 | // TODO add a check here that `hashchange.navigate` is bound already otherwise it's | ||
2254 | // broken (exception?) | ||
2255 | hashchange: function( event ) { | ||
2256 | var history, hash; | ||
2257 | |||
2258 | // If hashchange listening is explicitly disabled or pushstate is supported | ||
2259 | // avoid making use of the hashchange handler. | ||
2260 | if(!$.event.special.navigate.isHashChangeEnabled() || | ||
2261 | $.event.special.navigate.isPushStateEnabled() ) { | ||
2262 | return; | ||
2263 | } | ||
2264 | |||
2265 | // On occasion explicitly want to prevent the next hash from propogating because we only | ||
2266 | // with to alter the url to represent the new state do so here | ||
2267 | if( this.preventNextHashChange ){ | ||
2268 | this.preventNextHashChange = false; | ||
2269 | event.stopImmediatePropagation(); | ||
2270 | return; | ||
2271 | } | ||
2272 | |||
2273 | history = this.history; | ||
2274 | hash = path.parseLocation().hash; | ||
2275 | |||
2276 | // If this is a hashchange caused by the back or forward button | ||
2277 | // make sure to set the state of our history stack properly | ||
2278 | this.history.direct({ | ||
2279 | url: hash, | ||
2280 | |||
2281 | // When the url is either forward or backward in history include the entry | ||
2282 | // as data on the event object for merging as data in the navigate event | ||
2283 | present: function( historyEntry, direction ) { | ||
2284 | // make sure to create a new object to pass down as the navigate event data | ||
2285 | event.hashchangeState = $.extend({}, historyEntry); | ||
2286 | event.hashchangeState.direction = direction; | ||
2287 | }, | ||
2288 | |||
2289 | // When we don't find a hash in our history clearly we're aiming to go there | ||
2290 | // record the entry as new for future traversal | ||
2291 | // | ||
2292 | // NOTE it's not entirely clear that this is the right thing to do given that we | ||
2293 | // can't know the users intention. It might be better to explicitly _not_ | ||
2294 | // support location.hash assignment in preference to $.navigate calls | ||
2295 | // TODO first arg to add should be the href, but it causes issues in identifying | ||
2296 | // embeded pages | ||
2297 | missing: function() { | ||
2298 | history.add( hash, { | ||
2299 | hash: hash, | ||
2300 | title: document.title | ||
2301 | }); | ||
2302 | } | ||
2303 | }); | ||
2304 | } | ||
2305 | }); | ||
2306 | })( jQuery ); | ||
2307 | |||
2308 | |||
2309 | |||
2310 | (function( $, undefined ) { | ||
2311 | // TODO consider queueing navigation activity until previous activities have completed | ||
2312 | // so that end users don't have to think about it. Punting for now | ||
2313 | // TODO !! move the event bindings into callbacks on the navigate event | ||
2314 | $.mobile.navigate = function( url, data, noEvents ) { | ||
2315 | $.mobile.navigate.navigator.go( url, data, noEvents ); | ||
2316 | }; | ||
2317 | |||
2318 | // expose the history on the navigate method in anticipation of full integration with | ||
2319 | // existing navigation functionalty that is tightly coupled to the history information | ||
2320 | $.mobile.navigate.history = new $.mobile.History(); | ||
2321 | |||
2322 | // instantiate an instance of the navigator for use within the $.navigate method | ||
2323 | $.mobile.navigate.navigator = new $.mobile.Navigator( $.mobile.navigate.history ); | ||
2324 | |||
2325 | var loc = $.mobile.path.parseLocation(); | ||
2326 | $.mobile.navigate.history.add( loc.href, {hash: loc.hash} ); | ||
2327 | })( jQuery ); | ||
2328 | |||
2329 | |||
2330 | // This plugin is an experiment for abstracting away the touch and mouse | ||
2331 | // events so that developers don't have to worry about which method of input | ||
2332 | // the device their document is loaded on supports. | ||
2333 | // | ||
2334 | // The idea here is to allow the developer to register listeners for the | ||
2335 | // basic mouse events, such as mousedown, mousemove, mouseup, and click, | ||
2336 | // and the plugin will take care of registering the correct listeners | ||
2337 | // behind the scenes to invoke the listener at the fastest possible time | ||
2338 | // for that device, while still retaining the order of event firing in | ||
2339 | // the traditional mouse environment, should multiple handlers be registered | ||
2340 | // on the same element for different events. | ||
2341 | // | ||
2342 | // The current version exposes the following virtual events to jQuery bind methods: | ||
2343 | // "vmouseover vmousedown vmousemove vmouseup vclick vmouseout vmousecancel" | ||
2344 | |||
2345 | (function( $, window, document, undefined ) { | ||
2346 | |||
2347 | var dataPropertyName = "virtualMouseBindings", | ||
2348 | touchTargetPropertyName = "virtualTouchID", | ||
2349 | virtualEventNames = "vmouseover vmousedown vmousemove vmouseup vclick vmouseout vmousecancel".split( " " ), | ||
2350 | touchEventProps = "clientX clientY pageX pageY screenX screenY".split( " " ), | ||
2351 | mouseHookProps = $.event.mouseHooks ? $.event.mouseHooks.props : [], | ||
2352 | mouseEventProps = $.event.props.concat( mouseHookProps ), | ||
2353 | activeDocHandlers = {}, | ||
2354 | resetTimerID = 0, | ||
2355 | startX = 0, | ||
2356 | startY = 0, | ||
2357 | didScroll = false, | ||
2358 | clickBlockList = [], | ||
2359 | blockMouseTriggers = false, | ||
2360 | blockTouchTriggers = false, | ||
2361 | eventCaptureSupported = "addEventListener" in document, | ||
2362 | $document = $( document ), | ||
2363 | nextTouchID = 1, | ||
2364 | lastTouchID = 0, threshold; | ||
2365 | |||
2366 | $.vmouse = { | ||
2367 | moveDistanceThreshold: 10, | ||
2368 | clickDistanceThreshold: 10, | ||
2369 | resetTimerDuration: 1500 | ||
2370 | }; | ||
2371 | |||
2372 | function getNativeEvent( event ) { | ||
2373 | |||
2374 | while ( event && typeof event.originalEvent !== "undefined" ) { | ||
2375 | event = event.originalEvent; | ||
2376 | } | ||
2377 | return event; | ||
2378 | } | ||
2379 | |||
2380 | function createVirtualEvent( event, eventType ) { | ||
2381 | |||
2382 | var t = event.type, | ||
2383 | oe, props, ne, prop, ct, touch, i, j, len; | ||
2384 | |||
2385 | event = $.Event( event ); | ||
2386 | event.type = eventType; | ||
2387 | |||
2388 | oe = event.originalEvent; | ||
2389 | props = $.event.props; | ||
2390 | |||
2391 | // addresses separation of $.event.props in to $.event.mouseHook.props and Issue 3280 | ||
2392 | // https://github.com/jquery/jquery-mobile/issues/3280 | ||
2393 | if ( t.search( /^(mouse|click)/ ) > -1 ) { | ||
2394 | props = mouseEventProps; | ||
2395 | } | ||
2396 | |||
2397 | // copy original event properties over to the new event | ||
2398 | // this would happen if we could call $.event.fix instead of $.Event | ||
2399 | // but we don't have a way to force an event to be fixed multiple times | ||
2400 | if ( oe ) { | ||
2401 | for ( i = props.length, prop; i; ) { | ||
2402 | prop = props[ --i ]; | ||
2403 | event[ prop ] = oe[ prop ]; | ||
2404 | } | ||
2405 | } | ||
2406 | |||
2407 | // make sure that if the mouse and click virtual events are generated | ||
2408 | // without a .which one is defined | ||
2409 | if ( t.search(/mouse(down|up)|click/) > -1 && !event.which ) { | ||
2410 | event.which = 1; | ||
2411 | } | ||
2412 | |||
2413 | if ( t.search(/^touch/) !== -1 ) { | ||
2414 | ne = getNativeEvent( oe ); | ||
2415 | t = ne.touches; | ||
2416 | ct = ne.changedTouches; | ||
2417 | touch = ( t && t.length ) ? t[0] : ( ( ct && ct.length ) ? ct[ 0 ] : undefined ); | ||
2418 | |||
2419 | if ( touch ) { | ||
2420 | for ( j = 0, len = touchEventProps.length; j < len; j++) { | ||
2421 | prop = touchEventProps[ j ]; | ||
2422 | event[ prop ] = touch[ prop ]; | ||
2423 | } | ||
2424 | } | ||
2425 | } | ||
2426 | |||
2427 | return event; | ||
2428 | } | ||
2429 | |||
2430 | function getVirtualBindingFlags( element ) { | ||
2431 | |||
2432 | var flags = {}, | ||
2433 | b, k; | ||
2434 | |||
2435 | while ( element ) { | ||
2436 | |||
2437 | b = $.data( element, dataPropertyName ); | ||
2438 | |||
2439 | for ( k in b ) { | ||
2440 | if ( b[ k ] ) { | ||
2441 | flags[ k ] = flags.hasVirtualBinding = true; | ||
2442 | } | ||
2443 | } | ||
2444 | element = element.parentNode; | ||
2445 | } | ||
2446 | return flags; | ||
2447 | } | ||
2448 | |||
2449 | function getClosestElementWithVirtualBinding( element, eventType ) { | ||
2450 | var b; | ||
2451 | while ( element ) { | ||
2452 | |||
2453 | b = $.data( element, dataPropertyName ); | ||
2454 | |||
2455 | if ( b && ( !eventType || b[ eventType ] ) ) { | ||
2456 | return element; | ||
2457 | } | ||
2458 | element = element.parentNode; | ||
2459 | } | ||
2460 | return null; | ||
2461 | } | ||
2462 | |||
2463 | function enableTouchBindings() { | ||
2464 | blockTouchTriggers = false; | ||
2465 | } | ||
2466 | |||
2467 | function disableTouchBindings() { | ||
2468 | blockTouchTriggers = true; | ||
2469 | } | ||
2470 | |||
2471 | function enableMouseBindings() { | ||
2472 | lastTouchID = 0; | ||
2473 | clickBlockList.length = 0; | ||
2474 | blockMouseTriggers = false; | ||
2475 | |||
2476 | // When mouse bindings are enabled, our | ||
2477 | // touch bindings are disabled. | ||
2478 | disableTouchBindings(); | ||
2479 | } | ||
2480 | |||
2481 | function disableMouseBindings() { | ||
2482 | // When mouse bindings are disabled, our | ||
2483 | // touch bindings are enabled. | ||
2484 | enableTouchBindings(); | ||
2485 | } | ||
2486 | |||
2487 | function startResetTimer() { | ||
2488 | clearResetTimer(); | ||
2489 | resetTimerID = setTimeout( function() { | ||
2490 | resetTimerID = 0; | ||
2491 | enableMouseBindings(); | ||
2492 | }, $.vmouse.resetTimerDuration ); | ||
2493 | } | ||
2494 | |||
2495 | function clearResetTimer() { | ||
2496 | if ( resetTimerID ) { | ||
2497 | clearTimeout( resetTimerID ); | ||
2498 | resetTimerID = 0; | ||
2499 | } | ||
2500 | } | ||
2501 | |||
2502 | function triggerVirtualEvent( eventType, event, flags ) { | ||
2503 | var ve; | ||
2504 | |||
2505 | if ( ( flags && flags[ eventType ] ) || | ||
2506 | ( !flags && getClosestElementWithVirtualBinding( event.target, eventType ) ) ) { | ||
2507 | |||
2508 | ve = createVirtualEvent( event, eventType ); | ||
2509 | |||
2510 | $( event.target).trigger( ve ); | ||
2511 | } | ||
2512 | |||
2513 | return ve; | ||
2514 | } | ||
2515 | |||
2516 | function mouseEventCallback( event ) { | ||
2517 | var touchID = $.data( event.target, touchTargetPropertyName ); | ||
2518 | |||
2519 | if ( !blockMouseTriggers && ( !lastTouchID || lastTouchID !== touchID ) ) { | ||
2520 | var ve = triggerVirtualEvent( "v" + event.type, event ); | ||
2521 | if ( ve ) { | ||
2522 | if ( ve.isDefaultPrevented() ) { | ||
2523 | event.preventDefault(); | ||
2524 | } | ||
2525 | if ( ve.isPropagationStopped() ) { | ||
2526 | event.stopPropagation(); | ||
2527 | } | ||
2528 | if ( ve.isImmediatePropagationStopped() ) { | ||
2529 | event.stopImmediatePropagation(); | ||
2530 | } | ||
2531 | } | ||
2532 | } | ||
2533 | } | ||
2534 | |||
2535 | function handleTouchStart( event ) { | ||
2536 | |||
2537 | var touches = getNativeEvent( event ).touches, | ||
2538 | target, flags; | ||
2539 | |||
2540 | if ( touches && touches.length === 1 ) { | ||
2541 | |||
2542 | target = event.target; | ||
2543 | flags = getVirtualBindingFlags( target ); | ||
2544 | |||
2545 | if ( flags.hasVirtualBinding ) { | ||
2546 | |||
2547 | lastTouchID = nextTouchID++; | ||
2548 | $.data( target, touchTargetPropertyName, lastTouchID ); | ||
2549 | |||
2550 | clearResetTimer(); | ||
2551 | |||
2552 | disableMouseBindings(); | ||
2553 | didScroll = false; | ||
2554 | |||
2555 | var t = getNativeEvent( event ).touches[ 0 ]; | ||
2556 | startX = t.pageX; | ||
2557 | startY = t.pageY; | ||
2558 | |||
2559 | triggerVirtualEvent( "vmouseover", event, flags ); | ||
2560 | triggerVirtualEvent( "vmousedown", event, flags ); | ||
2561 | } | ||
2562 | } | ||
2563 | } | ||
2564 | |||
2565 | function handleScroll( event ) { | ||
2566 | if ( blockTouchTriggers ) { | ||
2567 | return; | ||
2568 | } | ||
2569 | |||
2570 | if ( !didScroll ) { | ||
2571 | triggerVirtualEvent( "vmousecancel", event, getVirtualBindingFlags( event.target ) ); | ||
2572 | } | ||
2573 | |||
2574 | didScroll = true; | ||
2575 | startResetTimer(); | ||
2576 | } | ||
2577 | |||
2578 | function handleTouchMove( event ) { | ||
2579 | if ( blockTouchTriggers ) { | ||
2580 | return; | ||
2581 | } | ||
2582 | |||
2583 | var t = getNativeEvent( event ).touches[ 0 ], | ||
2584 | didCancel = didScroll, | ||
2585 | moveThreshold = $.vmouse.moveDistanceThreshold, | ||
2586 | flags = getVirtualBindingFlags( event.target ); | ||
2587 | |||
2588 | didScroll = didScroll || | ||
2589 | ( Math.abs( t.pageX - startX ) > moveThreshold || | ||
2590 | Math.abs( t.pageY - startY ) > moveThreshold ); | ||
2591 | |||
2592 | |||
2593 | if ( didScroll && !didCancel ) { | ||
2594 | triggerVirtualEvent( "vmousecancel", event, flags ); | ||
2595 | } | ||
2596 | |||
2597 | triggerVirtualEvent( "vmousemove", event, flags ); | ||
2598 | startResetTimer(); | ||
2599 | } | ||
2600 | |||
2601 | function handleTouchEnd( event ) { | ||
2602 | if ( blockTouchTriggers ) { | ||
2603 | return; | ||
2604 | } | ||
2605 | |||
2606 | disableTouchBindings(); | ||
2607 | |||
2608 | var flags = getVirtualBindingFlags( event.target ), | ||
2609 | t; | ||
2610 | triggerVirtualEvent( "vmouseup", event, flags ); | ||
2611 | |||
2612 | if ( !didScroll ) { | ||
2613 | var ve = triggerVirtualEvent( "vclick", event, flags ); | ||
2614 | if ( ve && ve.isDefaultPrevented() ) { | ||
2615 | // The target of the mouse events that follow the touchend | ||
2616 | // event don't necessarily match the target used during the | ||
2617 | // touch. This means we need to rely on coordinates for blocking | ||
2618 | // any click that is generated. | ||
2619 | t = getNativeEvent( event ).changedTouches[ 0 ]; | ||
2620 | clickBlockList.push({ | ||
2621 | touchID: lastTouchID, | ||
2622 | x: t.clientX, | ||
2623 | y: t.clientY | ||
2624 | }); | ||
2625 | |||
2626 | // Prevent any mouse events that follow from triggering | ||
2627 | // virtual event notifications. | ||
2628 | blockMouseTriggers = true; | ||
2629 | } | ||
2630 | } | ||
2631 | triggerVirtualEvent( "vmouseout", event, flags); | ||
2632 | didScroll = false; | ||
2633 | |||
2634 | startResetTimer(); | ||
2635 | } | ||
2636 | |||
2637 | function hasVirtualBindings( ele ) { | ||
2638 | var bindings = $.data( ele, dataPropertyName ), | ||
2639 | k; | ||
2640 | |||
2641 | if ( bindings ) { | ||
2642 | for ( k in bindings ) { | ||
2643 | if ( bindings[ k ] ) { | ||
2644 | return true; | ||
2645 | } | ||
2646 | } | ||
2647 | } | ||
2648 | return false; | ||
2649 | } | ||
2650 | |||
2651 | function dummyMouseHandler() {} | ||
2652 | |||
2653 | function getSpecialEventObject( eventType ) { | ||
2654 | var realType = eventType.substr( 1 ); | ||
2655 | |||
2656 | return { | ||
2657 | setup: function( data, namespace ) { | ||
2658 | // If this is the first virtual mouse binding for this element, | ||
2659 | // add a bindings object to its data. | ||
2660 | |||
2661 | if ( !hasVirtualBindings( this ) ) { | ||
2662 | $.data( this, dataPropertyName, {} ); | ||
2663 | } | ||
2664 | |||
2665 | // If setup is called, we know it is the first binding for this | ||
2666 | // eventType, so initialize the count for the eventType to zero. | ||
2667 | var bindings = $.data( this, dataPropertyName ); | ||
2668 | bindings[ eventType ] = true; | ||
2669 | |||
2670 | // If this is the first virtual mouse event for this type, | ||
2671 | // register a global handler on the document. | ||
2672 | |||
2673 | activeDocHandlers[ eventType ] = ( activeDocHandlers[ eventType ] || 0 ) + 1; | ||
2674 | |||
2675 | if ( activeDocHandlers[ eventType ] === 1 ) { | ||
2676 | $document.bind( realType, mouseEventCallback ); | ||
2677 | } | ||
2678 | |||
2679 | // Some browsers, like Opera Mini, won't dispatch mouse/click events | ||
2680 | // for elements unless they actually have handlers registered on them. | ||
2681 | // To get around this, we register dummy handlers on the elements. | ||
2682 | |||
2683 | $( this ).bind( realType, dummyMouseHandler ); | ||
2684 | |||
2685 | // For now, if event capture is not supported, we rely on mouse handlers. | ||
2686 | if ( eventCaptureSupported ) { | ||
2687 | // If this is the first virtual mouse binding for the document, | ||
2688 | // register our touchstart handler on the document. | ||
2689 | |||
2690 | activeDocHandlers[ "touchstart" ] = ( activeDocHandlers[ "touchstart" ] || 0) + 1; | ||
2691 | |||
2692 | if ( activeDocHandlers[ "touchstart" ] === 1 ) { | ||
2693 | $document.bind( "touchstart", handleTouchStart ) | ||
2694 | .bind( "touchend", handleTouchEnd ) | ||
2695 | |||
2696 | // On touch platforms, touching the screen and then dragging your finger | ||
2697 | // causes the window content to scroll after some distance threshold is | ||
2698 | // exceeded. On these platforms, a scroll prevents a click event from being | ||
2699 | // dispatched, and on some platforms, even the touchend is suppressed. To | ||
2700 | // mimic the suppression of the click event, we need to watch for a scroll | ||
2701 | // event. Unfortunately, some platforms like iOS don't dispatch scroll | ||
2702 | // events until *AFTER* the user lifts their finger (touchend). This means | ||
2703 | // we need to watch both scroll and touchmove events to figure out whether | ||
2704 | // or not a scroll happenens before the touchend event is fired. | ||
2705 | |||
2706 | .bind( "touchmove", handleTouchMove ) | ||
2707 | .bind( "scroll", handleScroll ); | ||
2708 | } | ||
2709 | } | ||
2710 | }, | ||
2711 | |||
2712 | teardown: function( data, namespace ) { | ||
2713 | // If this is the last virtual binding for this eventType, | ||
2714 | // remove its global handler from the document. | ||
2715 | |||
2716 | --activeDocHandlers[ eventType ]; | ||
2717 | |||
2718 | if ( !activeDocHandlers[ eventType ] ) { | ||
2719 | $document.unbind( realType, mouseEventCallback ); | ||
2720 | } | ||
2721 | |||
2722 | if ( eventCaptureSupported ) { | ||
2723 | // If this is the last virtual mouse binding in existence, | ||
2724 | // remove our document touchstart listener. | ||
2725 | |||
2726 | --activeDocHandlers[ "touchstart" ]; | ||
2727 | |||
2728 | if ( !activeDocHandlers[ "touchstart" ] ) { | ||
2729 | $document.unbind( "touchstart", handleTouchStart ) | ||
2730 | .unbind( "touchmove", handleTouchMove ) | ||
2731 | .unbind( "touchend", handleTouchEnd ) | ||
2732 | .unbind( "scroll", handleScroll ); | ||
2733 | } | ||
2734 | } | ||
2735 | |||
2736 | var $this = $( this ), | ||
2737 | bindings = $.data( this, dataPropertyName ); | ||
2738 | |||
2739 | // teardown may be called when an element was | ||
2740 | // removed from the DOM. If this is the case, | ||
2741 | // jQuery core may have already stripped the element | ||
2742 | // of any data bindings so we need to check it before | ||
2743 | // using it. | ||
2744 | if ( bindings ) { | ||
2745 | bindings[ eventType ] = false; | ||
2746 | } | ||
2747 | |||
2748 | // Unregister the dummy event handler. | ||
2749 | |||
2750 | $this.unbind( realType, dummyMouseHandler ); | ||
2751 | |||
2752 | // If this is the last virtual mouse binding on the | ||
2753 | // element, remove the binding data from the element. | ||
2754 | |||
2755 | if ( !hasVirtualBindings( this ) ) { | ||
2756 | $this.removeData( dataPropertyName ); | ||
2757 | } | ||
2758 | } | ||
2759 | }; | ||
2760 | } | ||
2761 | |||
2762 | // Expose our custom events to the jQuery bind/unbind mechanism. | ||
2763 | |||
2764 | for ( var i = 0; i < virtualEventNames.length; i++ ) { | ||
2765 | $.event.special[ virtualEventNames[ i ] ] = getSpecialEventObject( virtualEventNames[ i ] ); | ||
2766 | } | ||
2767 | |||
2768 | // Add a capture click handler to block clicks. | ||
2769 | // Note that we require event capture support for this so if the device | ||
2770 | // doesn't support it, we punt for now and rely solely on mouse events. | ||
2771 | if ( eventCaptureSupported ) { | ||
2772 | document.addEventListener( "click", function( e ) { | ||
2773 | var cnt = clickBlockList.length, | ||
2774 | target = e.target, | ||
2775 | x, y, ele, i, o, touchID; | ||
2776 | |||
2777 | if ( cnt ) { | ||
2778 | x = e.clientX; | ||
2779 | y = e.clientY; | ||
2780 | threshold = $.vmouse.clickDistanceThreshold; | ||
2781 | |||
2782 | // The idea here is to run through the clickBlockList to see if | ||
2783 | // the current click event is in the proximity of one of our | ||
2784 | // vclick events that had preventDefault() called on it. If we find | ||
2785 | // one, then we block the click. | ||
2786 | // | ||
2787 | // Why do we have to rely on proximity? | ||
2788 | // | ||
2789 | // Because the target of the touch event that triggered the vclick | ||
2790 | // can be different from the target of the click event synthesized | ||
2791 | // by the browser. The target of a mouse/click event that is syntehsized | ||
2792 | // from a touch event seems to be implementation specific. For example, | ||
2793 | // some browsers will fire mouse/click events for a link that is near | ||
2794 | // a touch event, even though the target of the touchstart/touchend event | ||
2795 | // says the user touched outside the link. Also, it seems that with most | ||
2796 | // browsers, the target of the mouse/click event is not calculated until the | ||
2797 | // time it is dispatched, so if you replace an element that you touched | ||
2798 | // with another element, the target of the mouse/click will be the new | ||
2799 | // element underneath that point. | ||
2800 | // | ||
2801 | // Aside from proximity, we also check to see if the target and any | ||
2802 | // of its ancestors were the ones that blocked a click. This is necessary | ||
2803 | // because of the strange mouse/click target calculation done in the | ||
2804 | // Android 2.1 browser, where if you click on an element, and there is a | ||
2805 | // mouse/click handler on one of its ancestors, the target will be the | ||
2806 | // innermost child of the touched element, even if that child is no where | ||
2807 | // near the point of touch. | ||
2808 | |||
2809 | ele = target; | ||
2810 | |||
2811 | while ( ele ) { | ||
2812 | for ( i = 0; i < cnt; i++ ) { | ||
2813 | o = clickBlockList[ i ]; | ||
2814 | touchID = 0; | ||
2815 | |||
2816 | if ( ( ele === target && Math.abs( o.x - x ) < threshold && Math.abs( o.y - y ) < threshold ) || | ||
2817 | $.data( ele, touchTargetPropertyName ) === o.touchID ) { | ||
2818 | // XXX: We may want to consider removing matches from the block list | ||
2819 | // instead of waiting for the reset timer to fire. | ||
2820 | e.preventDefault(); | ||
2821 | e.stopPropagation(); | ||
2822 | return; | ||
2823 | } | ||
2824 | } | ||
2825 | ele = ele.parentNode; | ||
2826 | } | ||
2827 | } | ||
2828 | }, true); | ||
2829 | } | ||
2830 | })( jQuery, window, document ); | ||
2831 | |||
2832 | |||
2833 | (function( $, window, undefined ) { | ||
2834 | var $document = $( document ); | ||
2835 | |||
2836 | // add new event shortcuts | ||
2837 | $.each( ( "touchstart touchmove touchend " + | ||
2838 | "tap taphold " + | ||
2839 | "swipe swipeleft swiperight " + | ||
2840 | "scrollstart scrollstop" ).split( " " ), function( i, name ) { | ||
2841 | |||
2842 | $.fn[ name ] = function( fn ) { | ||
2843 | return fn ? this.bind( name, fn ) : this.trigger( name ); | ||
2844 | }; | ||
2845 | |||
2846 | // jQuery < 1.8 | ||
2847 | if ( $.attrFn ) { | ||
2848 | $.attrFn[ name ] = true; | ||
2849 | } | ||
2850 | }); | ||
2851 | |||
2852 | var supportTouch = $.mobile.support.touch, | ||
2853 | scrollEvent = "touchmove scroll", | ||
2854 | touchStartEvent = supportTouch ? "touchstart" : "mousedown", | ||
2855 | touchStopEvent = supportTouch ? "touchend" : "mouseup", | ||
2856 | touchMoveEvent = supportTouch ? "touchmove" : "mousemove"; | ||
2857 | |||
2858 | function triggerCustomEvent( obj, eventType, event ) { | ||
2859 | var originalType = event.type; | ||
2860 | event.type = eventType; | ||
2861 | $.event.dispatch.call( obj, event ); | ||
2862 | event.type = originalType; | ||
2863 | } | ||
2864 | |||
2865 | // also handles scrollstop | ||
2866 | $.event.special.scrollstart = { | ||
2867 | |||
2868 | enabled: true, | ||
2869 | |||
2870 | setup: function() { | ||
2871 | |||
2872 | var thisObject = this, | ||
2873 | $this = $( thisObject ), | ||
2874 | scrolling, | ||
2875 | timer; | ||
2876 | |||
2877 | function trigger( event, state ) { | ||
2878 | scrolling = state; | ||
2879 | triggerCustomEvent( thisObject, scrolling ? "scrollstart" : "scrollstop", event ); | ||
2880 | } | ||
2881 | |||
2882 | // iPhone triggers scroll after a small delay; use touchmove instead | ||
2883 | $this.bind( scrollEvent, function( event ) { | ||
2884 | |||
2885 | if ( !$.event.special.scrollstart.enabled ) { | ||
2886 | return; | ||
2887 | } | ||
2888 | |||
2889 | if ( !scrolling ) { | ||
2890 | trigger( event, true ); | ||
2891 | } | ||
2892 | |||
2893 | clearTimeout( timer ); | ||
2894 | timer = setTimeout( function() { | ||
2895 | trigger( event, false ); | ||
2896 | }, 50 ); | ||
2897 | }); | ||
2898 | } | ||
2899 | }; | ||
2900 | |||
2901 | // also handles taphold | ||
2902 | $.event.special.tap = { | ||
2903 | tapholdThreshold: 750, | ||
2904 | |||
2905 | setup: function() { | ||
2906 | var thisObject = this, | ||
2907 | $this = $( thisObject ); | ||
2908 | |||
2909 | $this.bind( "vmousedown", function( event ) { | ||
2910 | |||
2911 | if ( event.which && event.which !== 1 ) { | ||
2912 | return false; | ||
2913 | } | ||
2914 | |||
2915 | var origTarget = event.target, | ||
2916 | origEvent = event.originalEvent, | ||
2917 | timer; | ||
2918 | |||
2919 | function clearTapTimer() { | ||
2920 | clearTimeout( timer ); | ||
2921 | } | ||
2922 | |||
2923 | function clearTapHandlers() { | ||
2924 | clearTapTimer(); | ||
2925 | |||
2926 | $this.unbind( "vclick", clickHandler ) | ||
2927 | .unbind( "vmouseup", clearTapTimer ); | ||
2928 | $document.unbind( "vmousecancel", clearTapHandlers ); | ||
2929 | } | ||
2930 | |||
2931 | function clickHandler( event ) { | ||
2932 | clearTapHandlers(); | ||
2933 | |||
2934 | // ONLY trigger a 'tap' event if the start target is | ||
2935 | // the same as the stop target. | ||
2936 | if ( origTarget === event.target ) { | ||
2937 | triggerCustomEvent( thisObject, "tap", event ); | ||
2938 | } | ||
2939 | } | ||
2940 | |||
2941 | $this.bind( "vmouseup", clearTapTimer ) | ||
2942 | .bind( "vclick", clickHandler ); | ||
2943 | $document.bind( "vmousecancel", clearTapHandlers ); | ||
2944 | |||
2945 | timer = setTimeout( function() { | ||
2946 | triggerCustomEvent( thisObject, "taphold", $.Event( "taphold", { target: origTarget } ) ); | ||
2947 | }, $.event.special.tap.tapholdThreshold ); | ||
2948 | }); | ||
2949 | } | ||
2950 | }; | ||
2951 | |||
2952 | // also handles swipeleft, swiperight | ||
2953 | $.event.special.swipe = { | ||
2954 | scrollSupressionThreshold: 30, // More than this horizontal displacement, and we will suppress scrolling. | ||
2955 | |||
2956 | durationThreshold: 1000, // More time than this, and it isn't a swipe. | ||
2957 | |||
2958 | horizontalDistanceThreshold: 30, // Swipe horizontal displacement must be more than this. | ||
2959 | |||
2960 | verticalDistanceThreshold: 75, // Swipe vertical displacement must be less than this. | ||
2961 | |||
2962 | start: function( event ) { | ||
2963 | var data = event.originalEvent.touches ? | ||
2964 | event.originalEvent.touches[ 0 ] : event; | ||
2965 | return { | ||
2966 | time: ( new Date() ).getTime(), | ||
2967 | coords: [ data.pageX, data.pageY ], | ||
2968 | origin: $( event.target ) | ||
2969 | }; | ||
2970 | }, | ||
2971 | |||
2972 | stop: function( event ) { | ||
2973 | var data = event.originalEvent.touches ? | ||
2974 | event.originalEvent.touches[ 0 ] : event; | ||
2975 | return { | ||
2976 | time: ( new Date() ).getTime(), | ||
2977 | coords: [ data.pageX, data.pageY ] | ||
2978 | }; | ||
2979 | }, | ||
2980 | |||
2981 | handleSwipe: function( start, stop ) { | ||
2982 | if ( stop.time - start.time < $.event.special.swipe.durationThreshold && | ||
2983 | Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.horizontalDistanceThreshold && | ||
2984 | Math.abs( start.coords[ 1 ] - stop.coords[ 1 ] ) < $.event.special.swipe.verticalDistanceThreshold ) { | ||
2985 | |||
2986 | start.origin.trigger( "swipe" ) | ||
2987 | .trigger( start.coords[0] > stop.coords[ 0 ] ? "swipeleft" : "swiperight" ); | ||
2988 | } | ||
2989 | }, | ||
2990 | |||
2991 | setup: function() { | ||
2992 | var thisObject = this, | ||
2993 | $this = $( thisObject ); | ||
2994 | |||
2995 | $this.bind( touchStartEvent, function( event ) { | ||
2996 | var start = $.event.special.swipe.start( event ), | ||
2997 | stop; | ||
2998 | |||
2999 | function moveHandler( event ) { | ||
3000 | if ( !start ) { | ||
3001 | return; | ||
3002 | } | ||
3003 | |||
3004 | stop = $.event.special.swipe.stop( event ); | ||
3005 | |||
3006 | // prevent scrolling | ||
3007 | if ( Math.abs( start.coords[ 0 ] - stop.coords[ 0 ] ) > $.event.special.swipe.scrollSupressionThreshold ) { | ||
3008 | event.preventDefault(); | ||
3009 | } | ||
3010 | } | ||
3011 | |||
3012 | $this.bind( touchMoveEvent, moveHandler ) | ||
3013 | .one( touchStopEvent, function() { | ||
3014 | $this.unbind( touchMoveEvent, moveHandler ); | ||
3015 | |||
3016 | if ( start && stop ) { | ||
3017 | $.event.special.swipe.handleSwipe( start, stop ); | ||
3018 | } | ||
3019 | start = stop = undefined; | ||
3020 | }); | ||
3021 | }); | ||
3022 | } | ||
3023 | }; | ||
3024 | $.each({ | ||
3025 | scrollstop: "scrollstart", | ||
3026 | taphold: "tap", | ||
3027 | swipeleft: "swipe", | ||
3028 | swiperight: "swipe" | ||
3029 | }, function( event, sourceEvent ) { | ||
3030 | |||
3031 | $.event.special[ event ] = { | ||
3032 | setup: function() { | ||
3033 | $( this ).bind( sourceEvent, $.noop ); | ||
3034 | } | ||
3035 | }; | ||
3036 | }); | ||
3037 | |||
3038 | })( jQuery, this ); | ||
3039 | |||
3040 | |||
3041 | // throttled resize event | ||
3042 | (function( $ ) { | ||
3043 | $.event.special.throttledresize = { | ||
3044 | setup: function() { | ||
3045 | $( this ).bind( "resize", handler ); | ||
3046 | }, | ||
3047 | teardown: function() { | ||
3048 | $( this ).unbind( "resize", handler ); | ||
3049 | } | ||
3050 | }; | ||
3051 | |||
3052 | var throttle = 250, | ||
3053 | handler = function() { | ||
3054 | curr = ( new Date() ).getTime(); | ||
3055 | diff = curr - lastCall; | ||
3056 | |||
3057 | if ( diff >= throttle ) { | ||
3058 | |||
3059 | lastCall = curr; | ||
3060 | $( this ).trigger( "throttledresize" ); | ||
3061 | |||
3062 | } else { | ||
3063 | |||
3064 | if ( heldCall ) { | ||
3065 | clearTimeout( heldCall ); | ||
3066 | } | ||
3067 | |||
3068 | // Promise a held call will still execute | ||
3069 | heldCall = setTimeout( handler, throttle - diff ); | ||
3070 | } | ||
3071 | }, | ||
3072 | lastCall = 0, | ||
3073 | heldCall, | ||
3074 | curr, | ||
3075 | diff; | ||
3076 | })( jQuery ); | ||
3077 | |||
3078 | (function( $, window ) { | ||
3079 | var win = $( window ), | ||
3080 | event_name = "orientationchange", | ||
3081 | special_event, | ||
3082 | get_orientation, | ||
3083 | last_orientation, | ||
3084 | initial_orientation_is_landscape, | ||
3085 | initial_orientation_is_default, | ||
3086 | portrait_map = { "0": true, "180": true }; | ||
3087 | |||
3088 | // It seems that some device/browser vendors use window.orientation values 0 and 180 to | ||
3089 | // denote the "default" orientation. For iOS devices, and most other smart-phones tested, | ||
3090 | // the default orientation is always "portrait", but in some Android and RIM based tablets, | ||
3091 | // the default orientation is "landscape". The following code attempts to use the window | ||
3092 | // dimensions to figure out what the current orientation is, and then makes adjustments | ||
3093 | // to the to the portrait_map if necessary, so that we can properly decode the | ||
3094 | // window.orientation value whenever get_orientation() is called. | ||
3095 | // | ||
3096 | // Note that we used to use a media query to figure out what the orientation the browser | ||
3097 | // thinks it is in: | ||
3098 | // | ||
3099 | // initial_orientation_is_landscape = $.mobile.media("all and (orientation: landscape)"); | ||
3100 | // | ||
3101 | // but there was an iPhone/iPod Touch bug beginning with iOS 4.2, up through iOS 5.1, | ||
3102 | // where the browser *ALWAYS* applied the landscape media query. This bug does not | ||
3103 | // happen on iPad. | ||
3104 | |||
3105 | if ( $.support.orientation ) { | ||
3106 | |||
3107 | // Check the window width and height to figure out what the current orientation | ||
3108 | // of the device is at this moment. Note that we've initialized the portrait map | ||
3109 | // values to 0 and 180, *AND* we purposely check for landscape so that if we guess | ||
3110 | // wrong, , we default to the assumption that portrait is the default orientation. | ||
3111 | // We use a threshold check below because on some platforms like iOS, the iPhone | ||
3112 | // form-factor can report a larger width than height if the user turns on the | ||
3113 | // developer console. The actual threshold value is somewhat arbitrary, we just | ||
3114 | // need to make sure it is large enough to exclude the developer console case. | ||
3115 | |||
3116 | var ww = window.innerWidth || win.width(), | ||
3117 | wh = window.innerHeight || win.height(), | ||
3118 | landscape_threshold = 50; | ||
3119 | |||
3120 | initial_orientation_is_landscape = ww > wh && ( ww - wh ) > landscape_threshold; | ||
3121 | |||
3122 | |||
3123 | // Now check to see if the current window.orientation is 0 or 180. | ||
3124 | initial_orientation_is_default = portrait_map[ window.orientation ]; | ||
3125 | |||
3126 | // If the initial orientation is landscape, but window.orientation reports 0 or 180, *OR* | ||
3127 | // if the initial orientation is portrait, but window.orientation reports 90 or -90, we | ||
3128 | // need to flip our portrait_map values because landscape is the default orientation for | ||
3129 | // this device/browser. | ||
3130 | if ( ( initial_orientation_is_landscape && initial_orientation_is_default ) || ( !initial_orientation_is_landscape && !initial_orientation_is_default ) ) { | ||
3131 | portrait_map = { "-90": true, "90": true }; | ||
3132 | } | ||
3133 | } | ||
3134 | |||
3135 | $.event.special.orientationchange = $.extend( {}, $.event.special.orientationchange, { | ||
3136 | setup: function() { | ||
3137 | // If the event is supported natively, return false so that jQuery | ||
3138 | // will bind to the event using DOM methods. | ||
3139 | if ( $.support.orientation && !$.event.special.orientationchange.disabled ) { | ||
3140 | return false; | ||
3141 | } | ||
3142 | |||
3143 | // Get the current orientation to avoid initial double-triggering. | ||
3144 | last_orientation = get_orientation(); | ||
3145 | |||
3146 | // Because the orientationchange event doesn't exist, simulate the | ||
3147 | // event by testing window dimensions on resize. | ||
3148 | win.bind( "throttledresize", handler ); | ||
3149 | }, | ||
3150 | teardown: function() { | ||
3151 | // If the event is not supported natively, return false so that | ||
3152 | // jQuery will unbind the event using DOM methods. | ||
3153 | if ( $.support.orientation && !$.event.special.orientationchange.disabled ) { | ||
3154 | return false; | ||
3155 | } | ||
3156 | |||
3157 | // Because the orientationchange event doesn't exist, unbind the | ||
3158 | // resize event handler. | ||
3159 | win.unbind( "throttledresize", handler ); | ||
3160 | }, | ||
3161 | add: function( handleObj ) { | ||
3162 | // Save a reference to the bound event handler. | ||
3163 | var old_handler = handleObj.handler; | ||
3164 | |||
3165 | |||
3166 | handleObj.handler = function( event ) { | ||
3167 | // Modify event object, adding the .orientation property. | ||
3168 | event.orientation = get_orientation(); | ||
3169 | |||
3170 | // Call the originally-bound event handler and return its result. | ||
3171 | return old_handler.apply( this, arguments ); | ||
3172 | }; | ||
3173 | } | ||
3174 | }); | ||
3175 | |||
3176 | // If the event is not supported natively, this handler will be bound to | ||
3177 | // the window resize event to simulate the orientationchange event. | ||
3178 | function handler() { | ||
3179 | // Get the current orientation. | ||
3180 | var orientation = get_orientation(); | ||
3181 | |||
3182 | if ( orientation !== last_orientation ) { | ||
3183 | // The orientation has changed, so trigger the orientationchange event. | ||
3184 | last_orientation = orientation; | ||
3185 | win.trigger( event_name ); | ||
3186 | } | ||
3187 | } | ||
3188 | |||
3189 | // Get the current page orientation. This method is exposed publicly, should it | ||
3190 | // be needed, as jQuery.event.special.orientationchange.orientation() | ||
3191 | $.event.special.orientationchange.orientation = get_orientation = function() { | ||
3192 | var isPortrait = true, elem = document.documentElement; | ||
3193 | |||
3194 | // prefer window orientation to the calculation based on screensize as | ||
3195 | // the actual screen resize takes place before or after the orientation change event | ||
3196 | // has been fired depending on implementation (eg android 2.3 is before, iphone after). | ||
3197 | // More testing is required to determine if a more reliable method of determining the new screensize | ||
3198 | // is possible when orientationchange is fired. (eg, use media queries + element + opacity) | ||
3199 | if ( $.support.orientation ) { | ||
3200 | // if the window orientation registers as 0 or 180 degrees report | ||
3201 | // portrait, otherwise landscape | ||
3202 | isPortrait = portrait_map[ window.orientation ]; | ||
3203 | } else { | ||
3204 | isPortrait = elem && elem.clientWidth / elem.clientHeight < 1.1; | ||
3205 | } | ||
3206 | |||
3207 | return isPortrait ? "portrait" : "landscape"; | ||
3208 | }; | ||
3209 | |||
3210 | $.fn[ event_name ] = function( fn ) { | ||
3211 | return fn ? this.bind( event_name, fn ) : this.trigger( event_name ); | ||
3212 | }; | ||
3213 | |||
3214 | // jQuery < 1.8 | ||
3215 | if ( $.attrFn ) { | ||
3216 | $.attrFn[ event_name ] = true; | ||
3217 | } | ||
3218 | |||
3219 | }( jQuery, this )); | ||
3220 | |||
3221 | |||
3222 | |||
3223 | (function( $, undefined ) { | ||
3224 | |||
3225 | $.widget( "mobile.page", $.mobile.widget, { | ||
3226 | options: { | ||
3227 | theme: "c", | ||
3228 | domCache: false, | ||
3229 | keepNativeDefault: ":jqmData(role='none'), :jqmData(role='nojs')" | ||
3230 | }, | ||
3231 | |||
3232 | _create: function() { | ||
3233 | // if false is returned by the callbacks do not create the page | ||
3234 | if ( this._trigger( "beforecreate" ) === false ) { | ||
3235 | return false; | ||
3236 | } | ||
3237 | |||
3238 | this.element | ||
3239 | .attr( "tabindex", "0" ) | ||
3240 | .addClass( "ui-page ui-body-" + this.options.theme ); | ||
3241 | |||
3242 | this._on( this.element, { | ||
3243 | pagebeforehide: "removeContainerBackground", | ||
3244 | pagebeforeshow: "_handlePageBeforeShow" | ||
3245 | }); | ||
3246 | }, | ||
3247 | |||
3248 | _handlePageBeforeShow: function( e ) { | ||
3249 | this.setContainerBackground(); | ||
3250 | }, | ||
3251 | |||
3252 | removeContainerBackground: function() { | ||
3253 | $.mobile.pageContainer.removeClass( "ui-overlay-" + $.mobile.getInheritedTheme( this.element.parent() ) ); | ||
3254 | }, | ||
3255 | |||
3256 | // set the page container background to the page theme | ||
3257 | setContainerBackground: function( theme ) { | ||
3258 | if ( this.options.theme ) { | ||
3259 | $.mobile.pageContainer.addClass( "ui-overlay-" + ( theme || this.options.theme ) ); | ||
3260 | } | ||
3261 | }, | ||
3262 | |||
3263 | keepNativeSelector: function() { | ||
3264 | var options = this.options, | ||
3265 | keepNativeDefined = options.keepNative && $.trim( options.keepNative ); | ||
3266 | |||
3267 | if ( keepNativeDefined && options.keepNative !== options.keepNativeDefault ) { | ||
3268 | return [options.keepNative, options.keepNativeDefault].join( ", " ); | ||
3269 | } | ||
3270 | |||
3271 | return options.keepNativeDefault; | ||
3272 | } | ||
3273 | }); | ||
3274 | })( jQuery ); | ||
3275 | |||
3276 | // Script: jQuery hashchange event | ||
3277 | // | ||
3278 | // *Version: 1.3, Last updated: 7/21/2010* | ||
3279 | // | ||
3280 | // Project Home - http://benalman.com/projects/jquery-hashchange-plugin/ | ||
3281 | // GitHub - http://github.com/cowboy/jquery-hashchange/ | ||
3282 | // Source - http://github.com/cowboy/jquery-hashchange/raw/master/jquery.ba-hashchange.js | ||
3283 | // (Minified) - http://github.com/cowboy/jquery-hashchange/raw/master/jquery.ba-hashchange.min.js (0.8kb gzipped) | ||
3284 | // | ||
3285 | // About: License | ||
3286 | // | ||
3287 | // Copyright (c) 2010 "Cowboy" Ben Alman, | ||
3288 | // Dual licensed under the MIT and GPL licenses. | ||
3289 | // http://benalman.com/about/license/ | ||
3290 | // | ||
3291 | // About: Examples | ||
3292 | // | ||
3293 | // These working examples, complete with fully commented code, illustrate a few | ||
3294 | // ways in which this plugin can be used. | ||
3295 | // | ||
3296 | // hashchange event - http://benalman.com/code/projects/jquery-hashchange/examples/hashchange/ | ||
3297 | // document.domain - http://benalman.com/code/projects/jquery-hashchange/examples/document_domain/ | ||
3298 | // | ||
3299 | // About: Support and Testing | ||
3300 | // | ||
3301 | // Information about what version or versions of jQuery this plugin has been | ||
3302 | // tested with, what browsers it has been tested in, and where the unit tests | ||
3303 | // reside (so you can test it yourself). | ||
3304 | // | ||
3305 | // jQuery Versions - 1.2.6, 1.3.2, 1.4.1, 1.4.2 | ||
3306 | // Browsers Tested - Internet Explorer 6-8, Firefox 2-4, Chrome 5-6, Safari 3.2-5, | ||
3307 | // Opera 9.6-10.60, iPhone 3.1, Android 1.6-2.2, BlackBerry 4.6-5. | ||
3308 | // Unit Tests - http://benalman.com/code/projects/jquery-hashchange/unit/ | ||
3309 | // | ||
3310 | // About: Known issues | ||
3311 | // | ||
3312 | // While this jQuery hashchange event implementation is quite stable and | ||
3313 | // robust, there are a few unfortunate browser bugs surrounding expected | ||
3314 | // hashchange event-based behaviors, independent of any JavaScript | ||
3315 | // window.onhashchange abstraction. See the following examples for more | ||
3316 | // information: | ||
3317 | // | ||
3318 | // Chrome: Back Button - http://benalman.com/code/projects/jquery-hashchange/examples/bug-chrome-back-button/ | ||
3319 | // Firefox: Remote XMLHttpRequest - http://benalman.com/code/projects/jquery-hashchange/examples/bug-firefox-remote-xhr/ | ||
3320 | // WebKit: Back Button in an Iframe - http://benalman.com/code/projects/jquery-hashchange/examples/bug-webkit-hash-iframe/ | ||
3321 | // Safari: Back Button from a different domain - http://benalman.com/code/projects/jquery-hashchange/examples/bug-safari-back-from-diff-domain/ | ||
3322 | // | ||
3323 | // Also note that should a browser natively support the window.onhashchange | ||
3324 | // event, but not report that it does, the fallback polling loop will be used. | ||
3325 | // | ||
3326 | // About: Release History | ||
3327 | // | ||
3328 | // 1.3 - (7/21/2010) Reorganized IE6/7 Iframe code to make it more | ||
3329 | // "removable" for mobile-only development. Added IE6/7 document.title | ||
3330 | // support. Attempted to make Iframe as hidden as possible by using | ||
3331 | // techniques from http://www.paciellogroup.com/blog/?p=604. Added | ||
3332 | // support for the "shortcut" format $(window).hashchange( fn ) and | ||
3333 | // $(window).hashchange() like jQuery provides for built-in events. | ||
3334 | // Renamed jQuery.hashchangeDelay to <jQuery.fn.hashchange.delay> and | ||
3335 | // lowered its default value to 50. Added <jQuery.fn.hashchange.domain> | ||
3336 | // and <jQuery.fn.hashchange.src> properties plus document-domain.html | ||
3337 | // file to address access denied issues when setting document.domain in | ||
3338 | // IE6/7. | ||
3339 | // 1.2 - (2/11/2010) Fixed a bug where coming back to a page using this plugin | ||
3340 | // from a page on another domain would cause an error in Safari 4. Also, | ||
3341 | // IE6/7 Iframe is now inserted after the body (this actually works), | ||
3342 | // which prevents the page from scrolling when the event is first bound. | ||
3343 | // Event can also now be bound before DOM ready, but it won't be usable | ||
3344 | // before then in IE6/7. | ||
3345 | // 1.1 - (1/21/2010) Incorporated document.documentMode test to fix IE8 bug | ||
3346 | // where browser version is incorrectly reported as 8.0, despite | ||
3347 | // inclusion of the X-UA-Compatible IE=EmulateIE7 meta tag. | ||
3348 | // 1.0 - (1/9/2010) Initial Release. Broke out the jQuery BBQ event.special | ||
3349 | // window.onhashchange functionality into a separate plugin for users | ||
3350 | // who want just the basic event & back button support, without all the | ||
3351 | // extra awesomeness that BBQ provides. This plugin will be included as | ||
3352 | // part of jQuery BBQ, but also be available separately. | ||
3353 | |||
3354 | (function( $, window, undefined ) { | ||
3355 | // Reused string. | ||
3356 | var str_hashchange = 'hashchange', | ||
3357 | |||
3358 | // Method / object references. | ||
3359 | doc = document, | ||
3360 | fake_onhashchange, | ||
3361 | special = $.event.special, | ||
3362 | |||
3363 | // Does the browser support window.onhashchange? Note that IE8 running in | ||
3364 | // IE7 compatibility mode reports true for 'onhashchange' in window, even | ||
3365 | // though the event isn't supported, so also test document.documentMode. | ||
3366 | doc_mode = doc.documentMode, | ||
3367 | supports_onhashchange = 'on' + str_hashchange in window && ( doc_mode === undefined || doc_mode > 7 ); | ||
3368 | |||
3369 | // Get location.hash (or what you'd expect location.hash to be) sans any | ||
3370 | // leading #. Thanks for making this necessary, Firefox! | ||
3371 | function get_fragment( url ) { | ||
3372 | url = url || location.href; | ||
3373 | return '#' + url.replace( /^[^#]*#?(.*)$/, '$1' ); | ||
3374 | }; | ||
3375 | |||
3376 | // Method: jQuery.fn.hashchange | ||
3377 | // | ||
3378 | // Bind a handler to the window.onhashchange event or trigger all bound | ||
3379 | // window.onhashchange event handlers. This behavior is consistent with | ||
3380 | // jQuery's built-in event handlers. | ||
3381 | // | ||
3382 | // Usage: | ||
3383 | // | ||
3384 | // > jQuery(window).hashchange( [ handler ] ); | ||
3385 | // | ||
3386 | // Arguments: | ||
3387 | // | ||
3388 | // handler - (Function) Optional handler to be bound to the hashchange | ||
3389 | // event. This is a "shortcut" for the more verbose form: | ||
3390 | // jQuery(window).bind( 'hashchange', handler ). If handler is omitted, | ||
3391 | // all bound window.onhashchange event handlers will be triggered. This | ||
3392 | // is a shortcut for the more verbose | ||
3393 | // jQuery(window).trigger( 'hashchange' ). These forms are described in | ||
3394 | // the <hashchange event> section. | ||
3395 | // | ||
3396 | // Returns: | ||
3397 | // | ||
3398 | // (jQuery) The initial jQuery collection of elements. | ||
3399 | |||
3400 | // Allow the "shortcut" format $(elem).hashchange( fn ) for binding and | ||
3401 | // $(elem).hashchange() for triggering, like jQuery does for built-in events. | ||
3402 | $.fn[ str_hashchange ] = function( fn ) { | ||
3403 | return fn ? this.bind( str_hashchange, fn ) : this.trigger( str_hashchange ); | ||
3404 | }; | ||
3405 | |||
3406 | // Property: jQuery.fn.hashchange.delay | ||
3407 | // | ||
3408 | // The numeric interval (in milliseconds) at which the <hashchange event> | ||
3409 | // polling loop executes. Defaults to 50. | ||
3410 | |||
3411 | // Property: jQuery.fn.hashchange.domain | ||
3412 | // | ||
3413 | // If you're setting document.domain in your JavaScript, and you want hash | ||
3414 | // history to work in IE6/7, not only must this property be set, but you must | ||
3415 | // also set document.domain BEFORE jQuery is loaded into the page. This | ||
3416 | // property is only applicable if you are supporting IE6/7 (or IE8 operating | ||
3417 | // in "IE7 compatibility" mode). | ||
3418 | // | ||
3419 | // In addition, the <jQuery.fn.hashchange.src> property must be set to the | ||
3420 | // path of the included "document-domain.html" file, which can be renamed or | ||
3421 | // modified if necessary (note that the document.domain specified must be the | ||
3422 | // same in both your main JavaScript as well as in this file). | ||
3423 | // | ||
3424 | // Usage: | ||
3425 | // | ||
3426 | // jQuery.fn.hashchange.domain = document.domain; | ||
3427 | |||
3428 | // Property: jQuery.fn.hashchange.src | ||
3429 | // | ||
3430 | // If, for some reason, you need to specify an Iframe src file (for example, | ||
3431 | // when setting document.domain as in <jQuery.fn.hashchange.domain>), you can | ||
3432 | // do so using this property. Note that when using this property, history | ||
3433 | // won't be recorded in IE6/7 until the Iframe src file loads. This property | ||
3434 | // is only applicable if you are supporting IE6/7 (or IE8 operating in "IE7 | ||
3435 | // compatibility" mode). | ||
3436 | // | ||
3437 | // Usage: | ||
3438 | // | ||
3439 | // jQuery.fn.hashchange.src = 'path/to/file.html'; | ||
3440 | |||
3441 | $.fn[ str_hashchange ].delay = 50; | ||
3442 | /* | ||
3443 | $.fn[ str_hashchange ].domain = null; | ||
3444 | $.fn[ str_hashchange ].src = null; | ||
3445 | */ | ||
3446 | |||
3447 | // Event: hashchange event | ||
3448 | // | ||
3449 | // Fired when location.hash changes. In browsers that support it, the native | ||
3450 | // HTML5 window.onhashchange event is used, otherwise a polling loop is | ||
3451 | // initialized, running every <jQuery.fn.hashchange.delay> milliseconds to | ||
3452 | // see if the hash has changed. In IE6/7 (and IE8 operating in "IE7 | ||
3453 | // compatibility" mode), a hidden Iframe is created to allow the back button | ||
3454 | // and hash-based history to work. | ||
3455 | // | ||
3456 | // Usage as described in <jQuery.fn.hashchange>: | ||
3457 | // | ||
3458 | // > // Bind an event handler. | ||
3459 | // > jQuery(window).hashchange( function(e) { | ||
3460 | // > var hash = location.hash; | ||
3461 | // > ... | ||
3462 | // > }); | ||
3463 | // > | ||
3464 | // > // Manually trigger the event handler. | ||
3465 | // > jQuery(window).hashchange(); | ||
3466 | // | ||
3467 | // A more verbose usage that allows for event namespacing: | ||
3468 | // | ||
3469 | // > // Bind an event handler. | ||
3470 | // > jQuery(window).bind( 'hashchange', function(e) { | ||
3471 | // > var hash = location.hash; | ||
3472 | // > ... | ||
3473 | // > }); | ||
3474 | // > | ||
3475 | // > // Manually trigger the event handler. | ||
3476 | // > jQuery(window).trigger( 'hashchange' ); | ||
3477 | // | ||
3478 | // Additional Notes: | ||
3479 | // | ||
3480 | // * The polling loop and Iframe are not created until at least one handler | ||
3481 | // is actually bound to the 'hashchange' event. | ||
3482 | // * If you need the bound handler(s) to execute immediately, in cases where | ||
3483 | // a location.hash exists on page load, via bookmark or page refresh for | ||
3484 | // example, use jQuery(window).hashchange() or the more verbose | ||
3485 | // jQuery(window).trigger( 'hashchange' ). | ||
3486 | // * The event can be bound before DOM ready, but since it won't be usable | ||
3487 | // before then in IE6/7 (due to the necessary Iframe), recommended usage is | ||
3488 | // to bind it inside a DOM ready handler. | ||
3489 | |||
3490 | // Override existing $.event.special.hashchange methods (allowing this plugin | ||
3491 | // to be defined after jQuery BBQ in BBQ's source code). | ||
3492 | special[ str_hashchange ] = $.extend( special[ str_hashchange ], { | ||
3493 | |||
3494 | // Called only when the first 'hashchange' event is bound to window. | ||
3495 | setup: function() { | ||
3496 | // If window.onhashchange is supported natively, there's nothing to do.. | ||
3497 | if ( supports_onhashchange ) { return false; } | ||
3498 | |||
3499 | // Otherwise, we need to create our own. And we don't want to call this | ||
3500 | // until the user binds to the event, just in case they never do, since it | ||
3501 | // will create a polling loop and possibly even a hidden Iframe. | ||
3502 | $( fake_onhashchange.start ); | ||
3503 | }, | ||
3504 | |||
3505 | // Called only when the last 'hashchange' event is unbound from window. | ||
3506 | teardown: function() { | ||
3507 | // If window.onhashchange is supported natively, there's nothing to do.. | ||
3508 | if ( supports_onhashchange ) { return false; } | ||
3509 | |||
3510 | // Otherwise, we need to stop ours (if possible). | ||
3511 | $( fake_onhashchange.stop ); | ||
3512 | } | ||
3513 | |||
3514 | }); | ||
3515 | |||
3516 | // fake_onhashchange does all the work of triggering the window.onhashchange | ||
3517 | // event for browsers that don't natively support it, including creating a | ||
3518 | // polling loop to watch for hash changes and in IE 6/7 creating a hidden | ||
3519 | // Iframe to enable back and forward. | ||
3520 | fake_onhashchange = (function() { | ||
3521 | var self = {}, | ||
3522 | timeout_id, | ||
3523 | |||
3524 | // Remember the initial hash so it doesn't get triggered immediately. | ||
3525 | last_hash = get_fragment(), | ||
3526 | |||
3527 | fn_retval = function( val ) { return val; }, | ||
3528 | history_set = fn_retval, | ||
3529 | history_get = fn_retval; | ||
3530 | |||
3531 | // Start the polling loop. | ||
3532 | self.start = function() { | ||
3533 | timeout_id || poll(); | ||
3534 | }; | ||
3535 | |||
3536 | // Stop the polling loop. | ||
3537 | self.stop = function() { | ||
3538 | timeout_id && clearTimeout( timeout_id ); | ||
3539 | timeout_id = undefined; | ||
3540 | }; | ||
3541 | |||
3542 | // This polling loop checks every $.fn.hashchange.delay milliseconds to see | ||
3543 | // if location.hash has changed, and triggers the 'hashchange' event on | ||
3544 | // window when necessary. | ||
3545 | function poll() { | ||
3546 | var hash = get_fragment(), | ||
3547 | history_hash = history_get( last_hash ); | ||
3548 | |||
3549 | if ( hash !== last_hash ) { | ||
3550 | history_set( last_hash = hash, history_hash ); | ||
3551 | |||
3552 | $(window).trigger( str_hashchange ); | ||
3553 | |||
3554 | } else if ( history_hash !== last_hash ) { | ||
3555 | location.href = location.href.replace( /#.*/, '' ) + history_hash; | ||
3556 | } | ||
3557 | |||
3558 | timeout_id = setTimeout( poll, $.fn[ str_hashchange ].delay ); | ||
3559 | }; | ||
3560 | |||
3561 | // vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv | ||
3562 | // vvvvvvvvvvvvvvvvvvv REMOVE IF NOT SUPPORTING IE6/7/8 vvvvvvvvvvvvvvvvvvv | ||
3563 | // vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv | ||
3564 | window.attachEvent && !window.addEventListener && !supports_onhashchange && (function() { | ||
3565 | // Not only do IE6/7 need the "magical" Iframe treatment, but so does IE8 | ||
3566 | // when running in "IE7 compatibility" mode. | ||
3567 | |||
3568 | var iframe, | ||
3569 | iframe_src; | ||
3570 | |||
3571 | // When the event is bound and polling starts in IE 6/7, create a hidden | ||
3572 | // Iframe for history handling. | ||
3573 | self.start = function() { | ||
3574 | if ( !iframe ) { | ||
3575 | iframe_src = $.fn[ str_hashchange ].src; | ||
3576 | iframe_src = iframe_src && iframe_src + get_fragment(); | ||
3577 | |||
3578 | // Create hidden Iframe. Attempt to make Iframe as hidden as possible | ||
3579 | // by using techniques from http://www.paciellogroup.com/blog/?p=604. | ||
3580 | iframe = $('<iframe tabindex="-1" title="empty"/>').hide() | ||
3581 | |||
3582 | // When Iframe has completely loaded, initialize the history and | ||
3583 | // start polling. | ||
3584 | .one( 'load', function() { | ||
3585 | iframe_src || history_set( get_fragment() ); | ||
3586 | poll(); | ||
3587 | }) | ||
3588 | |||
3589 | // Load Iframe src if specified, otherwise nothing. | ||
3590 | .attr( 'src', iframe_src || 'javascript:0' ) | ||
3591 | |||
3592 | // Append Iframe after the end of the body to prevent unnecessary | ||
3593 | // initial page scrolling (yes, this works). | ||
3594 | .insertAfter( 'body' )[0].contentWindow; | ||
3595 | |||
3596 | // Whenever `document.title` changes, update the Iframe's title to | ||
3597 | // prettify the back/next history menu entries. Since IE sometimes | ||
3598 | // errors with "Unspecified error" the very first time this is set | ||
3599 | // (yes, very useful) wrap this with a try/catch block. | ||
3600 | doc.onpropertychange = function() { | ||
3601 | try { | ||
3602 | if ( event.propertyName === 'title' ) { | ||
3603 | iframe.document.title = doc.title; | ||
3604 | } | ||
3605 | } catch(e) {} | ||
3606 | }; | ||
3607 | |||
3608 | } | ||
3609 | }; | ||
3610 | |||
3611 | // Override the "stop" method since an IE6/7 Iframe was created. Even | ||
3612 | // if there are no longer any bound event handlers, the polling loop | ||
3613 | // is still necessary for back/next to work at all! | ||
3614 | self.stop = fn_retval; | ||
3615 | |||
3616 | // Get history by looking at the hidden Iframe's location.hash. | ||
3617 | history_get = function() { | ||
3618 | return get_fragment( iframe.location.href ); | ||
3619 | }; | ||
3620 | |||
3621 | // Set a new history item by opening and then closing the Iframe | ||
3622 | // document, *then* setting its location.hash. If document.domain has | ||
3623 | // been set, update that as well. | ||
3624 | history_set = function( hash, history_hash ) { | ||
3625 | var iframe_doc = iframe.document, | ||
3626 | domain = $.fn[ str_hashchange ].domain; | ||
3627 | |||
3628 | if ( hash !== history_hash ) { | ||
3629 | // Update Iframe with any initial `document.title` that might be set. | ||
3630 | iframe_doc.title = doc.title; | ||
3631 | |||
3632 | // Opening the Iframe's document after it has been closed is what | ||
3633 | // actually adds a history entry. | ||
3634 | iframe_doc.open(); | ||
3635 | |||
3636 | // Set document.domain for the Iframe document as well, if necessary. | ||
3637 | domain && iframe_doc.write( '<script>document.domain="' + domain + '"</script>' ); | ||
3638 | |||
3639 | iframe_doc.close(); | ||
3640 | |||
3641 | // Update the Iframe's hash, for great justice. | ||
3642 | iframe.location.hash = hash; | ||
3643 | } | ||
3644 | }; | ||
3645 | |||
3646 | })(); | ||
3647 | // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ | ||
3648 | // ^^^^^^^^^^^^^^^^^^^ REMOVE IF NOT SUPPORTING IE6/7/8 ^^^^^^^^^^^^^^^^^^^ | ||
3649 | // ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ | ||
3650 | |||
3651 | return self; | ||
3652 | })(); | ||
3653 | |||
3654 | })(jQuery,this); | ||
3655 | |||
3656 | (function( $, window, undefined ) { | ||
3657 | |||
3658 | var createHandler = function( sequential ) { | ||
3659 | |||
3660 | // Default to sequential | ||
3661 | if ( sequential === undefined ) { | ||
3662 | sequential = true; | ||
3663 | } | ||
3664 | |||
3665 | return function( name, reverse, $to, $from ) { | ||
3666 | |||
3667 | var deferred = new $.Deferred(), | ||
3668 | reverseClass = reverse ? " reverse" : "", | ||
3669 | active= $.mobile.urlHistory.getActive(), | ||
3670 | toScroll = active.lastScroll || $.mobile.defaultHomeScroll, | ||
3671 | screenHeight = $.mobile.getScreenHeight(), | ||
3672 | maxTransitionOverride = $.mobile.maxTransitionWidth !== false && $.mobile.window.width() > $.mobile.maxTransitionWidth, | ||
3673 | none = !$.support.cssTransitions || maxTransitionOverride || !name || name === "none" || Math.max( $.mobile.window.scrollTop(), toScroll ) > $.mobile.getMaxScrollForTransition(), | ||
3674 | toPreClass = " ui-page-pre-in", | ||
3675 | toggleViewportClass = function() { | ||
3676 | $.mobile.pageContainer.toggleClass( "ui-mobile-viewport-transitioning viewport-" + name ); | ||
3677 | }, | ||
3678 | scrollPage = function() { | ||
3679 | // By using scrollTo instead of silentScroll, we can keep things better in order | ||
3680 | // Just to be precautios, disable scrollstart listening like silentScroll would | ||
3681 | $.event.special.scrollstart.enabled = false; | ||
3682 | |||
3683 | window.scrollTo( 0, toScroll ); | ||
3684 | |||
3685 | // reenable scrollstart listening like silentScroll would | ||
3686 | setTimeout( function() { | ||
3687 | $.event.special.scrollstart.enabled = true; | ||
3688 | }, 150 ); | ||
3689 | }, | ||
3690 | cleanFrom = function() { | ||
3691 | $from | ||
3692 | .removeClass( $.mobile.activePageClass + " out in reverse " + name ) | ||
3693 | .height( "" ); | ||
3694 | }, | ||
3695 | startOut = function() { | ||
3696 | // if it's not sequential, call the doneOut transition to start the TO page animating in simultaneously | ||
3697 | if ( !sequential ) { | ||
3698 | doneOut(); | ||
3699 | } | ||
3700 | else { | ||
3701 | $from.animationComplete( doneOut ); | ||
3702 | } | ||
3703 | |||
3704 | // Set the from page's height and start it transitioning out | ||
3705 | // Note: setting an explicit height helps eliminate tiling in the transitions | ||
3706 | $from | ||
3707 | .height( screenHeight + $.mobile.window.scrollTop() ) | ||
3708 | .addClass( name + " out" + reverseClass ); | ||
3709 | }, | ||
3710 | |||
3711 | doneOut = function() { | ||
3712 | |||
3713 | if ( $from && sequential ) { | ||
3714 | cleanFrom(); | ||
3715 | } | ||
3716 | |||
3717 | startIn(); | ||
3718 | }, | ||
3719 | |||
3720 | startIn = function() { | ||
3721 | |||
3722 | // Prevent flickering in phonegap container: see comments at #4024 regarding iOS | ||
3723 | $to.css( "z-index", -10 ); | ||
3724 | |||
3725 | $to.addClass( $.mobile.activePageClass + toPreClass ); | ||
3726 | |||
3727 | // Send focus to page as it is now display: block | ||
3728 | $.mobile.focusPage( $to ); | ||
3729 | |||
3730 | // Set to page height | ||
3731 | $to.height( screenHeight + toScroll ); | ||
3732 | |||
3733 | scrollPage(); | ||
3734 | |||
3735 | // Restores visibility of the new page: added together with $to.css( "z-index", -10 ); | ||
3736 | $to.css( "z-index", "" ); | ||
3737 | |||
3738 | if ( !none ) { | ||
3739 | $to.animationComplete( doneIn ); | ||
3740 | } | ||
3741 | |||
3742 | $to | ||
3743 | .removeClass( toPreClass ) | ||
3744 | .addClass( name + " in" + reverseClass ); | ||
3745 | |||
3746 | if ( none ) { | ||
3747 | doneIn(); | ||
3748 | } | ||
3749 | |||
3750 | }, | ||
3751 | |||
3752 | doneIn = function() { | ||
3753 | |||
3754 | if ( !sequential ) { | ||
3755 | |||
3756 | if ( $from ) { | ||
3757 | cleanFrom(); | ||
3758 | } | ||
3759 | } | ||
3760 | |||
3761 | $to | ||
3762 | .removeClass( "out in reverse " + name ) | ||
3763 | .height( "" ); | ||
3764 | |||
3765 | toggleViewportClass(); | ||
3766 | |||
3767 | // In some browsers (iOS5), 3D transitions block the ability to scroll to the desired location during transition | ||
3768 | // This ensures we jump to that spot after the fact, if we aren't there already. | ||
3769 | if ( $.mobile.window.scrollTop() !== toScroll ) { | ||
3770 | scrollPage(); | ||
3771 | } | ||
3772 | |||
3773 | deferred.resolve( name, reverse, $to, $from, true ); | ||
3774 | }; | ||
3775 | |||
3776 | toggleViewportClass(); | ||
3777 | |||
3778 | if ( $from && !none ) { | ||
3779 | startOut(); | ||
3780 | } | ||
3781 | else { | ||
3782 | doneOut(); | ||
3783 | } | ||
3784 | |||
3785 | return deferred.promise(); | ||
3786 | }; | ||
3787 | }; | ||
3788 | |||
3789 | // generate the handlers from the above | ||
3790 | var sequentialHandler = createHandler(), | ||
3791 | simultaneousHandler = createHandler( false ), | ||
3792 | defaultGetMaxScrollForTransition = function() { | ||
3793 | return $.mobile.getScreenHeight() * 3; | ||
3794 | }; | ||
3795 | |||
3796 | // Make our transition handler the public default. | ||
3797 | $.mobile.defaultTransitionHandler = sequentialHandler; | ||
3798 | |||
3799 | //transition handler dictionary for 3rd party transitions | ||
3800 | $.mobile.transitionHandlers = { | ||
3801 | "default": $.mobile.defaultTransitionHandler, | ||
3802 | "sequential": sequentialHandler, | ||
3803 | "simultaneous": simultaneousHandler | ||
3804 | }; | ||
3805 | |||
3806 | $.mobile.transitionFallbacks = {}; | ||
3807 | |||
3808 | // If transition is defined, check if css 3D transforms are supported, and if not, if a fallback is specified | ||
3809 | $.mobile._maybeDegradeTransition = function( transition ) { | ||
3810 | if ( transition && !$.support.cssTransform3d && $.mobile.transitionFallbacks[ transition ] ) { | ||
3811 | transition = $.mobile.transitionFallbacks[ transition ]; | ||
3812 | } | ||
3813 | |||
3814 | return transition; | ||
3815 | }; | ||
3816 | |||
3817 | // Set the getMaxScrollForTransition to default if no implementation was set by user | ||
3818 | $.mobile.getMaxScrollForTransition = $.mobile.getMaxScrollForTransition || defaultGetMaxScrollForTransition; | ||
3819 | })( jQuery, this ); | ||
3820 | |||
3821 | (function( $, undefined ) { | ||
3822 | |||
3823 | //define vars for interal use | ||
3824 | var $window = $.mobile.window, | ||
3825 | $html = $( 'html' ), | ||
3826 | $head = $( 'head' ), | ||
3827 | |||
3828 | // NOTE: path extensions dependent on core attributes. Moved here to remove deps from | ||
3829 | // $.mobile.path definition | ||
3830 | path = $.extend($.mobile.path, { | ||
3831 | |||
3832 | //return the substring of a filepath before the sub-page key, for making a server request | ||
3833 | getFilePath: function( path ) { | ||
3834 | var splitkey = '&' + $.mobile.subPageUrlKey; | ||
3835 | return path && path.split( splitkey )[0].split( dialogHashKey )[0]; | ||
3836 | }, | ||
3837 | |||
3838 | //check if the specified url refers to the first page in the main application document. | ||
3839 | isFirstPageUrl: function( url ) { | ||
3840 | // We only deal with absolute paths. | ||
3841 | var u = path.parseUrl( path.makeUrlAbsolute( url, this.documentBase ) ), | ||
3842 | |||
3843 | // Does the url have the same path as the document? | ||
3844 | samePath = u.hrefNoHash === this.documentUrl.hrefNoHash || ( this.documentBaseDiffers && u.hrefNoHash === this.documentBase.hrefNoHash ), | ||
3845 | |||
3846 | // Get the first page element. | ||
3847 | fp = $.mobile.firstPage, | ||
3848 | |||
3849 | // Get the id of the first page element if it has one. | ||
3850 | fpId = fp && fp[0] ? fp[0].id : undefined; | ||
3851 | |||
3852 | // The url refers to the first page if the path matches the document and | ||
3853 | // it either has no hash value, or the hash is exactly equal to the id of the | ||
3854 | // first page element. | ||
3855 | return samePath && ( !u.hash || u.hash === "#" || ( fpId && u.hash.replace( /^#/, "" ) === fpId ) ); | ||
3856 | }, | ||
3857 | |||
3858 | // Some embedded browsers, like the web view in Phone Gap, allow cross-domain XHR | ||
3859 | // requests if the document doing the request was loaded via the file:// protocol. | ||
3860 | // This is usually to allow the application to "phone home" and fetch app specific | ||
3861 | // data. We normally let the browser handle external/cross-domain urls, but if the | ||
3862 | // allowCrossDomainPages option is true, we will allow cross-domain http/https | ||
3863 | // requests to go through our page loading logic. | ||
3864 | isPermittedCrossDomainRequest: function( docUrl, reqUrl ) { | ||
3865 | return $.mobile.allowCrossDomainPages && | ||
3866 | docUrl.protocol === "file:" && | ||
3867 | reqUrl.search( /^https?:/ ) !== -1; | ||
3868 | } | ||
3869 | }), | ||
3870 | |||
3871 | //will be defined when a link is clicked and given an active class | ||
3872 | $activeClickedLink = null, | ||
3873 | |||
3874 | // resolved on domready | ||
3875 | domreadyDeferred = $.Deferred(), | ||
3876 | |||
3877 | //urlHistory is purely here to make guesses at whether the back or forward button was clicked | ||
3878 | //and provide an appropriate transition | ||
3879 | urlHistory = $.mobile.navigate.history, | ||
3880 | |||
3881 | //define first selector to receive focus when a page is shown | ||
3882 | focusable = "[tabindex],a,button:visible,select:visible,input", | ||
3883 | |||
3884 | //queue to hold simultanious page transitions | ||
3885 | pageTransitionQueue = [], | ||
3886 | |||
3887 | //indicates whether or not page is in process of transitioning | ||
3888 | isPageTransitioning = false, | ||
3889 | |||
3890 | //nonsense hash change key for dialogs, so they create a history entry | ||
3891 | dialogHashKey = "&ui-state=dialog", | ||
3892 | |||
3893 | //existing base tag? | ||
3894 | $base = $head.children( "base" ), | ||
3895 | |||
3896 | //tuck away the original document URL minus any fragment. | ||
3897 | documentUrl = path.documentUrl, | ||
3898 | |||
3899 | //if the document has an embedded base tag, documentBase is set to its | ||
3900 | //initial value. If a base tag does not exist, then we default to the documentUrl. | ||
3901 | documentBase = path.documentBase, | ||
3902 | |||
3903 | //cache the comparison once. | ||
3904 | documentBaseDiffers = path.documentBaseDiffers, | ||
3905 | |||
3906 | getScreenHeight = $.mobile.getScreenHeight; | ||
3907 | |||
3908 | //base element management, defined depending on dynamic base tag support | ||
3909 | var base = $.support.dynamicBaseTag ? { | ||
3910 | |||
3911 | //define base element, for use in routing asset urls that are referenced in Ajax-requested markup | ||
3912 | element: ( $base.length ? $base : $( "<base>", { href: documentBase.hrefNoHash } ).prependTo( $head ) ), | ||
3913 | |||
3914 | //set the generated BASE element's href attribute to a new page's base path | ||
3915 | set: function( href ) { | ||
3916 | href = path.parseUrl(href).hrefNoHash; | ||
3917 | base.element.attr( "href", path.makeUrlAbsolute( href, documentBase ) ); | ||
3918 | }, | ||
3919 | |||
3920 | //set the generated BASE element's href attribute to a new page's base path | ||
3921 | reset: function() { | ||
3922 | base.element.attr( "href", documentBase.hrefNoSearch ); | ||
3923 | } | ||
3924 | |||
3925 | } : undefined; | ||
3926 | |||
3927 | |||
3928 | //return the original document url | ||
3929 | $.mobile.getDocumentUrl = path.getDocumentUrl; | ||
3930 | |||
3931 | //return the original document base url | ||
3932 | $.mobile.getDocumentBase = path.getDocumentBase; | ||
3933 | |||
3934 | /* internal utility functions */ | ||
3935 | |||
3936 | // NOTE Issue #4950 Android phonegap doesn't navigate back properly | ||
3937 | // when a full page refresh has taken place. It appears that hashchange | ||
3938 | // and replacestate history alterations work fine but we need to support | ||
3939 | // both forms of history traversal in our code that uses backward history | ||
3940 | // movement | ||
3941 | $.mobile.back = function() { | ||
3942 | var nav = window.navigator; | ||
3943 | |||
3944 | // if the setting is on and the navigator object is | ||
3945 | // available use the phonegap navigation capability | ||
3946 | if( this.phonegapNavigationEnabled && | ||
3947 | nav && | ||
3948 | nav.app && | ||
3949 | nav.app.backHistory ){ | ||
3950 | nav.app.backHistory(); | ||
3951 | } else { | ||
3952 | window.history.back(); | ||
3953 | } | ||
3954 | }; | ||
3955 | |||
3956 | //direct focus to the page title, or otherwise first focusable element | ||
3957 | $.mobile.focusPage = function ( page ) { | ||
3958 | var autofocus = page.find( "[autofocus]" ), | ||
3959 | pageTitle = page.find( ".ui-title:eq(0)" ); | ||
3960 | |||
3961 | if ( autofocus.length ) { | ||
3962 | autofocus.focus(); | ||
3963 | return; | ||
3964 | } | ||
3965 | |||
3966 | if ( pageTitle.length ) { | ||
3967 | pageTitle.focus(); | ||
3968 | } else{ | ||
3969 | page.focus(); | ||
3970 | } | ||
3971 | }; | ||
3972 | |||
3973 | //remove active classes after page transition or error | ||
3974 | function removeActiveLinkClass( forceRemoval ) { | ||
3975 | if ( !!$activeClickedLink && ( !$activeClickedLink.closest( "." + $.mobile.activePageClass ).length || forceRemoval ) ) { | ||
3976 | $activeClickedLink.removeClass( $.mobile.activeBtnClass ); | ||
3977 | } | ||
3978 | $activeClickedLink = null; | ||
3979 | } | ||
3980 | |||
3981 | function releasePageTransitionLock() { | ||
3982 | isPageTransitioning = false; | ||
3983 | if ( pageTransitionQueue.length > 0 ) { | ||
3984 | $.mobile.changePage.apply( null, pageTransitionQueue.pop() ); | ||
3985 | } | ||
3986 | } | ||
3987 | |||
3988 | // Save the last scroll distance per page, before it is hidden | ||
3989 | var setLastScrollEnabled = true, | ||
3990 | setLastScroll, delayedSetLastScroll; | ||
3991 | |||
3992 | setLastScroll = function() { | ||
3993 | // this barrier prevents setting the scroll value based on the browser | ||
3994 | // scrolling the window based on a hashchange | ||
3995 | if ( !setLastScrollEnabled ) { | ||
3996 | return; | ||
3997 | } | ||
3998 | |||
3999 | var active = $.mobile.urlHistory.getActive(); | ||
4000 | |||
4001 | if ( active ) { | ||
4002 | var lastScroll = $window.scrollTop(); | ||
4003 | |||
4004 | // Set active page's lastScroll prop. | ||
4005 | // If the location we're scrolling to is less than minScrollBack, let it go. | ||
4006 | active.lastScroll = lastScroll < $.mobile.minScrollBack ? $.mobile.defaultHomeScroll : lastScroll; | ||
4007 | } | ||
4008 | }; | ||
4009 | |||
4010 | // bind to scrollstop to gather scroll position. The delay allows for the hashchange | ||
4011 | // event to fire and disable scroll recording in the case where the browser scrolls | ||
4012 | // to the hash targets location (sometimes the top of the page). once pagechange fires | ||
4013 | // getLastScroll is again permitted to operate | ||
4014 | delayedSetLastScroll = function() { | ||
4015 | setTimeout( setLastScroll, 100 ); | ||
4016 | }; | ||
4017 | |||
4018 | // disable an scroll setting when a hashchange has been fired, this only works | ||
4019 | // because the recording of the scroll position is delayed for 100ms after | ||
4020 | // the browser might have changed the position because of the hashchange | ||
4021 | $window.bind( $.support.pushState ? "popstate" : "hashchange", function() { | ||
4022 | setLastScrollEnabled = false; | ||
4023 | }); | ||
4024 | |||
4025 | // handle initial hashchange from chrome :( | ||
4026 | $window.one( $.support.pushState ? "popstate" : "hashchange", function() { | ||
4027 | setLastScrollEnabled = true; | ||
4028 | }); | ||
4029 | |||
4030 | // wait until the mobile page container has been determined to bind to pagechange | ||
4031 | $window.one( "pagecontainercreate", function() { | ||
4032 | // once the page has changed, re-enable the scroll recording | ||
4033 | $.mobile.pageContainer.bind( "pagechange", function() { | ||
4034 | |||
4035 | setLastScrollEnabled = true; | ||
4036 | |||
4037 | // remove any binding that previously existed on the get scroll | ||
4038 | // which may or may not be different than the scroll element determined for | ||
4039 | // this page previously | ||
4040 | $window.unbind( "scrollstop", delayedSetLastScroll ); | ||
4041 | |||
4042 | // determine and bind to the current scoll element which may be the window | ||
4043 | // or in the case of touch overflow the element with touch overflow | ||
4044 | $window.bind( "scrollstop", delayedSetLastScroll ); | ||
4045 | }); | ||
4046 | }); | ||
4047 | |||
4048 | // bind to scrollstop for the first page as "pagechange" won't be fired in that case | ||
4049 | $window.bind( "scrollstop", delayedSetLastScroll ); | ||
4050 | |||
4051 | // No-op implementation of transition degradation | ||
4052 | $.mobile._maybeDegradeTransition = $.mobile._maybeDegradeTransition || function( transition ) { | ||
4053 | return transition; | ||
4054 | }; | ||
4055 | |||
4056 | //function for transitioning between two existing pages | ||
4057 | function transitionPages( toPage, fromPage, transition, reverse ) { | ||
4058 | if ( fromPage ) { | ||
4059 | //trigger before show/hide events | ||
4060 | fromPage.data( "mobile-page" )._trigger( "beforehide", null, { nextPage: toPage } ); | ||
4061 | } | ||
4062 | |||
4063 | toPage.data( "mobile-page" )._trigger( "beforeshow", null, { prevPage: fromPage || $( "" ) } ); | ||
4064 | |||
4065 | //clear page loader | ||
4066 | $.mobile.hidePageLoadingMsg(); | ||
4067 | |||
4068 | transition = $.mobile._maybeDegradeTransition( transition ); | ||
4069 | |||
4070 | //find the transition handler for the specified transition. If there | ||
4071 | //isn't one in our transitionHandlers dictionary, use the default one. | ||
4072 | //call the handler immediately to kick-off the transition. | ||
4073 | var th = $.mobile.transitionHandlers[ transition || "default" ] || $.mobile.defaultTransitionHandler, | ||
4074 | promise = th( transition, reverse, toPage, fromPage ); | ||
4075 | |||
4076 | promise.done(function() { | ||
4077 | //trigger show/hide events | ||
4078 | if ( fromPage ) { | ||
4079 | fromPage.data( "mobile-page" )._trigger( "hide", null, { nextPage: toPage } ); | ||
4080 | } | ||
4081 | |||
4082 | //trigger pageshow, define prevPage as either fromPage or empty jQuery obj | ||
4083 | toPage.data( "mobile-page" )._trigger( "show", null, { prevPage: fromPage || $( "" ) } ); | ||
4084 | }); | ||
4085 | |||
4086 | return promise; | ||
4087 | } | ||
4088 | |||
4089 | //simply set the active page's minimum height to screen height, depending on orientation | ||
4090 | $.mobile.resetActivePageHeight = function resetActivePageHeight( height ) { | ||
4091 | var aPage = $( "." + $.mobile.activePageClass ), | ||
4092 | aPagePadT = parseFloat( aPage.css( "padding-top" ) ), | ||
4093 | aPagePadB = parseFloat( aPage.css( "padding-bottom" ) ), | ||
4094 | aPageBorderT = parseFloat( aPage.css( "border-top-width" ) ), | ||
4095 | aPageBorderB = parseFloat( aPage.css( "border-bottom-width" ) ); | ||
4096 | |||
4097 | height = ( typeof height === "number" )? height : getScreenHeight(); | ||
4098 | |||
4099 | aPage.css( "min-height", height - aPagePadT - aPagePadB - aPageBorderT - aPageBorderB ); | ||
4100 | }; | ||
4101 | |||
4102 | //shared page enhancements | ||
4103 | function enhancePage( $page, role ) { | ||
4104 | // If a role was specified, make sure the data-role attribute | ||
4105 | // on the page element is in sync. | ||
4106 | if ( role ) { | ||
4107 | $page.attr( "data-" + $.mobile.ns + "role", role ); | ||
4108 | } | ||
4109 | |||
4110 | //run page plugin | ||
4111 | $page.page(); | ||
4112 | } | ||
4113 | |||
4114 | // determine the current base url | ||
4115 | function findBaseWithDefault() { | ||
4116 | var closestBase = ( $.mobile.activePage && getClosestBaseUrl( $.mobile.activePage ) ); | ||
4117 | return closestBase || documentBase.hrefNoHash; | ||
4118 | } | ||
4119 | |||
4120 | /* exposed $.mobile methods */ | ||
4121 | |||
4122 | //animation complete callback | ||
4123 | $.fn.animationComplete = function( callback ) { | ||
4124 | if ( $.support.cssTransitions ) { | ||
4125 | return $( this ).one( 'webkitAnimationEnd animationend', callback ); | ||
4126 | } | ||
4127 | else{ | ||
4128 | // defer execution for consistency between webkit/non webkit | ||
4129 | setTimeout( callback, 0 ); | ||
4130 | return $( this ); | ||
4131 | } | ||
4132 | }; | ||
4133 | |||
4134 | //expose path object on $.mobile | ||
4135 | $.mobile.path = path; | ||
4136 | |||
4137 | //expose base object on $.mobile | ||
4138 | $.mobile.base = base; | ||
4139 | |||
4140 | //history stack | ||
4141 | $.mobile.urlHistory = urlHistory; | ||
4142 | |||
4143 | $.mobile.dialogHashKey = dialogHashKey; | ||
4144 | |||
4145 | //enable cross-domain page support | ||
4146 | $.mobile.allowCrossDomainPages = false; | ||
4147 | |||
4148 | $.mobile._bindPageRemove = function() { | ||
4149 | var page = $( this ); | ||
4150 | |||
4151 | // when dom caching is not enabled or the page is embedded bind to remove the page on hide | ||
4152 | if ( !page.data( "mobile-page" ).options.domCache && | ||
4153 | page.is( ":jqmData(external-page='true')" ) ) { | ||
4154 | |||
4155 | page.bind( 'pagehide.remove', function( e ) { | ||
4156 | var $this = $( this ), | ||
4157 | prEvent = new $.Event( "pageremove" ); | ||
4158 | |||
4159 | $this.trigger( prEvent ); | ||
4160 | |||
4161 | if ( !prEvent.isDefaultPrevented() ) { | ||
4162 | $this.removeWithDependents(); | ||
4163 | } | ||
4164 | }); | ||
4165 | } | ||
4166 | }; | ||
4167 | |||
4168 | // Load a page into the DOM. | ||
4169 | $.mobile.loadPage = function( url, options ) { | ||
4170 | // This function uses deferred notifications to let callers | ||
4171 | // know when the page is done loading, or if an error has occurred. | ||
4172 | var deferred = $.Deferred(), | ||
4173 | |||
4174 | // The default loadPage options with overrides specified by | ||
4175 | // the caller. | ||
4176 | settings = $.extend( {}, $.mobile.loadPage.defaults, options ), | ||
4177 | |||
4178 | // The DOM element for the page after it has been loaded. | ||
4179 | page = null, | ||
4180 | |||
4181 | // If the reloadPage option is true, and the page is already | ||
4182 | // in the DOM, dupCachedPage will be set to the page element | ||
4183 | // so that it can be removed after the new version of the | ||
4184 | // page is loaded off the network. | ||
4185 | dupCachedPage = null, | ||
4186 | |||
4187 | // The absolute version of the URL passed into the function. This | ||
4188 | // version of the URL may contain dialog/subpage params in it. | ||
4189 | absUrl = path.makeUrlAbsolute( url, findBaseWithDefault() ); | ||
4190 | |||
4191 | // If the caller provided data, and we're using "get" request, | ||
4192 | // append the data to the URL. | ||
4193 | if ( settings.data && settings.type === "get" ) { | ||
4194 | absUrl = path.addSearchParams( absUrl, settings.data ); | ||
4195 | settings.data = undefined; | ||
4196 | } | ||
4197 | |||
4198 | // If the caller is using a "post" request, reloadPage must be true | ||
4199 | if ( settings.data && settings.type === "post" ) { | ||
4200 | settings.reloadPage = true; | ||
4201 | } | ||
4202 | |||
4203 | // The absolute version of the URL minus any dialog/subpage params. | ||
4204 | // In otherwords the real URL of the page to be loaded. | ||
4205 | var fileUrl = path.getFilePath( absUrl ), | ||
4206 | |||
4207 | // The version of the Url actually stored in the data-url attribute of | ||
4208 | // the page. For embedded pages, it is just the id of the page. For pages | ||
4209 | // within the same domain as the document base, it is the site relative | ||
4210 | // path. For cross-domain pages (Phone Gap only) the entire absolute Url | ||
4211 | // used to load the page. | ||
4212 | dataUrl = path.convertUrlToDataUrl( absUrl ); | ||
4213 | |||
4214 | // Make sure we have a pageContainer to work with. | ||
4215 | settings.pageContainer = settings.pageContainer || $.mobile.pageContainer; | ||
4216 | |||
4217 | // Check to see if the page already exists in the DOM. | ||
4218 | // NOTE do _not_ use the :jqmData psuedo selector because parenthesis | ||
4219 | // are a valid url char and it breaks on the first occurence | ||
4220 | page = settings.pageContainer.children( "[data-" + $.mobile.ns +"url='" + dataUrl + "']" ); | ||
4221 | |||
4222 | // If we failed to find the page, check to see if the url is a | ||
4223 | // reference to an embedded page. If so, it may have been dynamically | ||
4224 | // injected by a developer, in which case it would be lacking a data-url | ||
4225 | // attribute and in need of enhancement. | ||
4226 | if ( page.length === 0 && dataUrl && !path.isPath( dataUrl ) ) { | ||
4227 | page = settings.pageContainer.children( "#" + dataUrl ) | ||
4228 | .attr( "data-" + $.mobile.ns + "url", dataUrl ) | ||
4229 | .jqmData( "url", dataUrl ); | ||
4230 | } | ||
4231 | |||
4232 | // If we failed to find a page in the DOM, check the URL to see if it | ||
4233 | // refers to the first page in the application. If it isn't a reference | ||
4234 | // to the first page and refers to non-existent embedded page, error out. | ||
4235 | if ( page.length === 0 ) { | ||
4236 | if ( $.mobile.firstPage && path.isFirstPageUrl( fileUrl ) ) { | ||
4237 | // Check to make sure our cached-first-page is actually | ||
4238 | // in the DOM. Some user deployed apps are pruning the first | ||
4239 | // page from the DOM for various reasons, we check for this | ||
4240 | // case here because we don't want a first-page with an id | ||
4241 | // falling through to the non-existent embedded page error | ||
4242 | // case. If the first-page is not in the DOM, then we let | ||
4243 | // things fall through to the ajax loading code below so | ||
4244 | // that it gets reloaded. | ||
4245 | if ( $.mobile.firstPage.parent().length ) { | ||
4246 | page = $( $.mobile.firstPage ); | ||
4247 | } | ||
4248 | } else if ( path.isEmbeddedPage( fileUrl ) ) { | ||
4249 | deferred.reject( absUrl, options ); | ||
4250 | return deferred.promise(); | ||
4251 | } | ||
4252 | } | ||
4253 | |||
4254 | // If the page we are interested in is already in the DOM, | ||
4255 | // and the caller did not indicate that we should force a | ||
4256 | // reload of the file, we are done. Otherwise, track the | ||
4257 | // existing page as a duplicated. | ||
4258 | if ( page.length ) { | ||
4259 | if ( !settings.reloadPage ) { | ||
4260 | enhancePage( page, settings.role ); | ||
4261 | deferred.resolve( absUrl, options, page ); | ||
4262 | return deferred.promise(); | ||
4263 | } | ||
4264 | dupCachedPage = page; | ||
4265 | } | ||
4266 | |||
4267 | var mpc = settings.pageContainer, | ||
4268 | pblEvent = new $.Event( "pagebeforeload" ), | ||
4269 | triggerData = { url: url, absUrl: absUrl, dataUrl: dataUrl, deferred: deferred, options: settings }; | ||
4270 | |||
4271 | // Let listeners know we're about to load a page. | ||
4272 | mpc.trigger( pblEvent, triggerData ); | ||
4273 | |||
4274 | // If the default behavior is prevented, stop here! | ||
4275 | if ( pblEvent.isDefaultPrevented() ) { | ||
4276 | return deferred.promise(); | ||
4277 | } | ||
4278 | |||
4279 | if ( settings.showLoadMsg ) { | ||
4280 | |||
4281 | // This configurable timeout allows cached pages a brief delay to load without showing a message | ||
4282 | var loadMsgDelay = setTimeout(function() { | ||
4283 | $.mobile.showPageLoadingMsg(); | ||
4284 | }, settings.loadMsgDelay ), | ||
4285 | |||
4286 | // Shared logic for clearing timeout and removing message. | ||
4287 | hideMsg = function() { | ||
4288 | |||
4289 | // Stop message show timer | ||
4290 | clearTimeout( loadMsgDelay ); | ||
4291 | |||
4292 | // Hide loading message | ||
4293 | $.mobile.hidePageLoadingMsg(); | ||
4294 | }; | ||
4295 | } | ||
4296 | |||
4297 | // Reset base to the default document base. | ||
4298 | if ( base ) { | ||
4299 | base.reset(); | ||
4300 | } | ||
4301 | |||
4302 | if ( !( $.mobile.allowCrossDomainPages || path.isSameDomain( documentUrl, absUrl ) ) ) { | ||
4303 | deferred.reject( absUrl, options ); | ||
4304 | } else { | ||
4305 | // Load the new page. | ||
4306 | $.ajax({ | ||
4307 | url: fileUrl, | ||
4308 | type: settings.type, | ||
4309 | data: settings.data, | ||
4310 | dataType: "html", | ||
4311 | success: function( html, textStatus, xhr ) { | ||
4312 | //pre-parse html to check for a data-url, | ||
4313 | //use it as the new fileUrl, base path, etc | ||
4314 | var all = $( "<div></div>" ), | ||
4315 | |||
4316 | //page title regexp | ||
4317 | newPageTitle = html.match( /<title[^>]*>([^<]*)/ ) && RegExp.$1, | ||
4318 | |||
4319 | // TODO handle dialogs again | ||
4320 | pageElemRegex = new RegExp( "(<[^>]+\\bdata-" + $.mobile.ns + "role=[\"']?page[\"']?[^>]*>)" ), | ||
4321 | dataUrlRegex = new RegExp( "\\bdata-" + $.mobile.ns + "url=[\"']?([^\"'>]*)[\"']?" ); | ||
4322 | |||
4323 | |||
4324 | // data-url must be provided for the base tag so resource requests can be directed to the | ||
4325 | // correct url. loading into a temprorary element makes these requests immediately | ||
4326 | if ( pageElemRegex.test( html ) && | ||
4327 | RegExp.$1 && | ||
4328 | dataUrlRegex.test( RegExp.$1 ) && | ||
4329 | RegExp.$1 ) { | ||
4330 | url = fileUrl = path.getFilePath( $( "<div>" + RegExp.$1 + "</div>" ).text() ); | ||
4331 | } | ||
4332 | |||
4333 | if ( base ) { | ||
4334 | base.set( fileUrl ); | ||
4335 | } | ||
4336 | |||
4337 | //workaround to allow scripts to execute when included in page divs | ||
4338 | all.get( 0 ).innerHTML = html; | ||
4339 | page = all.find( ":jqmData(role='page'), :jqmData(role='dialog')" ).first(); | ||
4340 | |||
4341 | //if page elem couldn't be found, create one and insert the body element's contents | ||
4342 | if ( !page.length ) { | ||
4343 | page = $( "<div data-" + $.mobile.ns + "role='page'>" + ( html.split( /<\/?body[^>]*>/gmi )[1] || "" ) + "</div>" ); | ||
4344 | } | ||
4345 | |||
4346 | if ( newPageTitle && !page.jqmData( "title" ) ) { | ||
4347 | if ( ~newPageTitle.indexOf( "&" ) ) { | ||
4348 | newPageTitle = $( "<div>" + newPageTitle + "</div>" ).text(); | ||
4349 | } | ||
4350 | page.jqmData( "title", newPageTitle ); | ||
4351 | } | ||
4352 | |||
4353 | //rewrite src and href attrs to use a base url | ||
4354 | if ( !$.support.dynamicBaseTag ) { | ||
4355 | var newPath = path.get( fileUrl ); | ||
4356 | page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() { | ||
4357 | var thisAttr = $( this ).is( '[href]' ) ? 'href' : | ||
4358 | $( this ).is( '[src]' ) ? 'src' : 'action', | ||
4359 | thisUrl = $( this ).attr( thisAttr ); | ||
4360 | |||
4361 | // XXX_jblas: We need to fix this so that it removes the document | ||
4362 | // base URL, and then prepends with the new page URL. | ||
4363 | //if full path exists and is same, chop it - helps IE out | ||
4364 | thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' ); | ||
4365 | |||
4366 | if ( !/^(\w+:|#|\/)/.test( thisUrl ) ) { | ||
4367 | $( this ).attr( thisAttr, newPath + thisUrl ); | ||
4368 | } | ||
4369 | }); | ||
4370 | } | ||
4371 | |||
4372 | //append to page and enhance | ||
4373 | // TODO taging a page with external to make sure that embedded pages aren't removed | ||
4374 | // by the various page handling code is bad. Having page handling code in many | ||
4375 | // places is bad. Solutions post 1.0 | ||
4376 | page | ||
4377 | .attr( "data-" + $.mobile.ns + "url", path.convertUrlToDataUrl( fileUrl ) ) | ||
4378 | .attr( "data-" + $.mobile.ns + "external-page", true ) | ||
4379 | .appendTo( settings.pageContainer ); | ||
4380 | |||
4381 | // wait for page creation to leverage options defined on widget | ||
4382 | page.one( 'pagecreate', $.mobile._bindPageRemove ); | ||
4383 | |||
4384 | enhancePage( page, settings.role ); | ||
4385 | |||
4386 | // Enhancing the page may result in new dialogs/sub pages being inserted | ||
4387 | // into the DOM. If the original absUrl refers to a sub-page, that is the | ||
4388 | // real page we are interested in. | ||
4389 | if ( absUrl.indexOf( "&" + $.mobile.subPageUrlKey ) > -1 ) { | ||
4390 | page = settings.pageContainer.children( "[data-" + $.mobile.ns +"url='" + dataUrl + "']" ); | ||
4391 | } | ||
4392 | |||
4393 | // Remove loading message. | ||
4394 | if ( settings.showLoadMsg ) { | ||
4395 | hideMsg(); | ||
4396 | } | ||
4397 | |||
4398 | // Add the page reference and xhr to our triggerData. | ||
4399 | triggerData.xhr = xhr; | ||
4400 | triggerData.textStatus = textStatus; | ||
4401 | triggerData.page = page; | ||
4402 | |||
4403 | // Let listeners know the page loaded successfully. | ||
4404 | settings.pageContainer.trigger( "pageload", triggerData ); | ||
4405 | |||
4406 | deferred.resolve( absUrl, options, page, dupCachedPage ); | ||
4407 | }, | ||
4408 | error: function( xhr, textStatus, errorThrown ) { | ||
4409 | //set base back to current path | ||
4410 | if ( base ) { | ||
4411 | base.set( path.get() ); | ||
4412 | } | ||
4413 | |||
4414 | // Add error info to our triggerData. | ||
4415 | triggerData.xhr = xhr; | ||
4416 | triggerData.textStatus = textStatus; | ||
4417 | triggerData.errorThrown = errorThrown; | ||
4418 | |||
4419 | var plfEvent = new $.Event( "pageloadfailed" ); | ||
4420 | |||
4421 | // Let listeners know the page load failed. | ||
4422 | settings.pageContainer.trigger( plfEvent, triggerData ); | ||
4423 | |||
4424 | // If the default behavior is prevented, stop here! | ||
4425 | // Note that it is the responsibility of the listener/handler | ||
4426 | // that called preventDefault(), to resolve/reject the | ||
4427 | // deferred object within the triggerData. | ||
4428 | if ( plfEvent.isDefaultPrevented() ) { | ||
4429 | return; | ||
4430 | } | ||
4431 | |||
4432 | // Remove loading message. | ||
4433 | if ( settings.showLoadMsg ) { | ||
4434 | |||
4435 | // Remove loading message. | ||
4436 | hideMsg(); | ||
4437 | |||
4438 | // show error message | ||
4439 | $.mobile.showPageLoadingMsg( $.mobile.pageLoadErrorMessageTheme, $.mobile.pageLoadErrorMessage, true ); | ||
4440 | |||
4441 | // hide after delay | ||
4442 | setTimeout( $.mobile.hidePageLoadingMsg, 1500 ); | ||
4443 | } | ||
4444 | |||
4445 | deferred.reject( absUrl, options ); | ||
4446 | } | ||
4447 | }); | ||
4448 | } | ||
4449 | |||
4450 | return deferred.promise(); | ||
4451 | }; | ||
4452 | |||
4453 | $.mobile.loadPage.defaults = { | ||
4454 | type: "get", | ||
4455 | data: undefined, | ||
4456 | reloadPage: false, | ||
4457 | role: undefined, // By default we rely on the role defined by the @data-role attribute. | ||
4458 | showLoadMsg: false, | ||
4459 | pageContainer: undefined, | ||
4460 | loadMsgDelay: 50 // This delay allows loads that pull from browser cache to occur without showing the loading message. | ||
4461 | }; | ||
4462 | |||
4463 | // Show a specific page in the page container. | ||
4464 | $.mobile.changePage = function( toPage, options ) { | ||
4465 | // If we are in the midst of a transition, queue the current request. | ||
4466 | // We'll call changePage() once we're done with the current transition to | ||
4467 | // service the request. | ||
4468 | if ( isPageTransitioning ) { | ||
4469 | pageTransitionQueue.unshift( arguments ); | ||
4470 | return; | ||
4471 | } | ||
4472 | |||
4473 | var settings = $.extend( {}, $.mobile.changePage.defaults, options ), isToPageString; | ||
4474 | |||
4475 | // Make sure we have a pageContainer to work with. | ||
4476 | settings.pageContainer = settings.pageContainer || $.mobile.pageContainer; | ||
4477 | |||
4478 | // Make sure we have a fromPage. | ||
4479 | settings.fromPage = settings.fromPage || $.mobile.activePage; | ||
4480 | |||
4481 | isToPageString = (typeof toPage === "string"); | ||
4482 | |||
4483 | var mpc = settings.pageContainer, | ||
4484 | pbcEvent = new $.Event( "pagebeforechange" ), | ||
4485 | triggerData = { toPage: toPage, options: settings }; | ||
4486 | |||
4487 | // NOTE: preserve the original target as the dataUrl value will be simplified | ||
4488 | // eg, removing ui-state, and removing query params from the hash | ||
4489 | // this is so that users who want to use query params have access to them | ||
4490 | // in the event bindings for the page life cycle See issue #5085 | ||
4491 | if ( isToPageString ) { | ||
4492 | // if the toPage is a string simply convert it | ||
4493 | triggerData.absUrl = path.makeUrlAbsolute( toPage, findBaseWithDefault() ); | ||
4494 | } else { | ||
4495 | // if the toPage is a jQuery object grab the absolute url stored | ||
4496 | // in the loadPage callback where it exists | ||
4497 | triggerData.absUrl = toPage.data( 'absUrl' ); | ||
4498 | } | ||
4499 | |||
4500 | // Let listeners know we're about to change the current page. | ||
4501 | mpc.trigger( pbcEvent, triggerData ); | ||
4502 | |||
4503 | // If the default behavior is prevented, stop here! | ||
4504 | if ( pbcEvent.isDefaultPrevented() ) { | ||
4505 | return; | ||
4506 | } | ||
4507 | |||
4508 | // We allow "pagebeforechange" observers to modify the toPage in the trigger | ||
4509 | // data to allow for redirects. Make sure our toPage is updated. | ||
4510 | // | ||
4511 | // We also need to re-evaluate whether it is a string, because an object can | ||
4512 | // also be replaced by a string | ||
4513 | |||
4514 | toPage = triggerData.toPage; | ||
4515 | isToPageString = (typeof toPage === "string"); | ||
4516 | |||
4517 | // Set the isPageTransitioning flag to prevent any requests from | ||
4518 | // entering this method while we are in the midst of loading a page | ||
4519 | // or transitioning. | ||
4520 | isPageTransitioning = true; | ||
4521 | |||
4522 | // If the caller passed us a url, call loadPage() | ||
4523 | // to make sure it is loaded into the DOM. We'll listen | ||
4524 | // to the promise object it returns so we know when | ||
4525 | // it is done loading or if an error ocurred. | ||
4526 | if ( isToPageString ) { | ||
4527 | // preserve the original target as the dataUrl value will be simplified | ||
4528 | // eg, removing ui-state, and removing query params from the hash | ||
4529 | // this is so that users who want to use query params have access to them | ||
4530 | // in the event bindings for the page life cycle See issue #5085 | ||
4531 | settings.target = toPage; | ||
4532 | |||
4533 | $.mobile.loadPage( toPage, settings ) | ||
4534 | .done(function( url, options, newPage, dupCachedPage ) { | ||
4535 | isPageTransitioning = false; | ||
4536 | options.duplicateCachedPage = dupCachedPage; | ||
4537 | |||
4538 | // store the original absolute url so that it can be provided | ||
4539 | // to events in the triggerData of the subsequent changePage call | ||
4540 | newPage.data( 'absUrl', triggerData.absUrl ); | ||
4541 | $.mobile.changePage( newPage, options ); | ||
4542 | }) | ||
4543 | .fail(function( url, options ) { | ||
4544 | isPageTransitioning = false; | ||
4545 | |||
4546 | //clear out the active button state | ||
4547 | removeActiveLinkClass( true ); | ||
4548 | |||
4549 | //release transition lock so navigation is free again | ||
4550 | releasePageTransitionLock(); | ||
4551 | settings.pageContainer.trigger( "pagechangefailed", triggerData ); | ||
4552 | }); | ||
4553 | return; | ||
4554 | } | ||
4555 | |||
4556 | // If we are going to the first-page of the application, we need to make | ||
4557 | // sure settings.dataUrl is set to the application document url. This allows | ||
4558 | // us to avoid generating a document url with an id hash in the case where the | ||
4559 | // first-page of the document has an id attribute specified. | ||
4560 | if ( toPage[ 0 ] === $.mobile.firstPage[ 0 ] && !settings.dataUrl ) { | ||
4561 | settings.dataUrl = documentUrl.hrefNoHash; | ||
4562 | } | ||
4563 | |||
4564 | // The caller passed us a real page DOM element. Update our | ||
4565 | // internal state and then trigger a transition to the page. | ||
4566 | var fromPage = settings.fromPage, | ||
4567 | url = ( settings.dataUrl && path.convertUrlToDataUrl( settings.dataUrl ) ) || toPage.jqmData( "url" ), | ||
4568 | // The pageUrl var is usually the same as url, except when url is obscured as a dialog url. pageUrl always contains the file path | ||
4569 | pageUrl = url, | ||
4570 | fileUrl = path.getFilePath( url ), | ||
4571 | active = urlHistory.getActive(), | ||
4572 | activeIsInitialPage = urlHistory.activeIndex === 0, | ||
4573 | historyDir = 0, | ||
4574 | pageTitle = document.title, | ||
4575 | isDialog = settings.role === "dialog" || toPage.jqmData( "role" ) === "dialog"; | ||
4576 | |||
4577 | |||
4578 | // By default, we prevent changePage requests when the fromPage and toPage | ||
4579 | // are the same element, but folks that generate content manually/dynamically | ||
4580 | // and reuse pages want to be able to transition to the same page. To allow | ||
4581 | // this, they will need to change the default value of allowSamePageTransition | ||
4582 | // to true, *OR*, pass it in as an option when they manually call changePage(). | ||
4583 | // It should be noted that our default transition animations assume that the | ||
4584 | // formPage and toPage are different elements, so they may behave unexpectedly. | ||
4585 | // It is up to the developer that turns on the allowSamePageTransitiona option | ||
4586 | // to either turn off transition animations, or make sure that an appropriate | ||
4587 | // animation transition is used. | ||
4588 | if ( fromPage && fromPage[0] === toPage[0] && !settings.allowSamePageTransition ) { | ||
4589 | isPageTransitioning = false; | ||
4590 | mpc.trigger( "pagechange", triggerData ); | ||
4591 | |||
4592 | // Even if there is no page change to be done, we should keep the urlHistory in sync with the hash changes | ||
4593 | if ( settings.fromHashChange ) { | ||
4594 | urlHistory.direct({ url: url }); | ||
4595 | } | ||
4596 | |||
4597 | return; | ||
4598 | } | ||
4599 | |||
4600 | // We need to make sure the page we are given has already been enhanced. | ||
4601 | enhancePage( toPage, settings.role ); | ||
4602 | |||
4603 | // If the changePage request was sent from a hashChange event, check to see if the | ||
4604 | // page is already within the urlHistory stack. If so, we'll assume the user hit | ||
4605 | // the forward/back button and will try to match the transition accordingly. | ||
4606 | if ( settings.fromHashChange ) { | ||
4607 | historyDir = options.direction === "back" ? -1 : 1; | ||
4608 | } | ||
4609 | |||
4610 | // Kill the keyboard. | ||
4611 | // XXX_jblas: We need to stop crawling the entire document to kill focus. Instead, | ||
4612 | // we should be tracking focus with a delegate() handler so we already have | ||
4613 | // the element in hand at this point. | ||
4614 | // Wrap this in a try/catch block since IE9 throw "Unspecified error" if document.activeElement | ||
4615 | // is undefined when we are in an IFrame. | ||
4616 | try { | ||
4617 | if ( document.activeElement && document.activeElement.nodeName.toLowerCase() !== 'body' ) { | ||
4618 | $( document.activeElement ).blur(); | ||
4619 | } else { | ||
4620 | $( "input:focus, textarea:focus, select:focus" ).blur(); | ||
4621 | } | ||
4622 | } catch( e ) {} | ||
4623 | |||
4624 | // Record whether we are at a place in history where a dialog used to be - if so, do not add a new history entry and do not change the hash either | ||
4625 | var alreadyThere = false; | ||
4626 | |||
4627 | // If we're displaying the page as a dialog, we don't want the url | ||
4628 | // for the dialog content to be used in the hash. Instead, we want | ||
4629 | // to append the dialogHashKey to the url of the current page. | ||
4630 | if ( isDialog && active ) { | ||
4631 | // on the initial page load active.url is undefined and in that case should | ||
4632 | // be an empty string. Moving the undefined -> empty string back into | ||
4633 | // urlHistory.addNew seemed imprudent given undefined better represents | ||
4634 | // the url state | ||
4635 | |||
4636 | // If we are at a place in history that once belonged to a dialog, reuse | ||
4637 | // this state without adding to urlHistory and without modifying the hash. | ||
4638 | // However, if a dialog is already displayed at this point, and we're | ||
4639 | // about to display another dialog, then we must add another hash and | ||
4640 | // history entry on top so that one may navigate back to the original dialog | ||
4641 | if ( active.url && | ||
4642 | active.url.indexOf( dialogHashKey ) > -1 && | ||
4643 | $.mobile.activePage && | ||
4644 | !$.mobile.activePage.is( ".ui-dialog" ) && | ||
4645 | urlHistory.activeIndex > 0 ) { | ||
4646 | settings.changeHash = false; | ||
4647 | alreadyThere = true; | ||
4648 | } | ||
4649 | |||
4650 | // Normally, we tack on a dialog hash key, but if this is the location of a stale dialog, | ||
4651 | // we reuse the URL from the entry | ||
4652 | url = ( active.url || "" ); | ||
4653 | |||
4654 | // account for absolute urls instead of just relative urls use as hashes | ||
4655 | if( !alreadyThere && url.indexOf("#") > -1 ) { | ||
4656 | url += dialogHashKey; | ||
4657 | } else { | ||
4658 | url += "#" + dialogHashKey; | ||
4659 | } | ||
4660 | |||
4661 | // tack on another dialogHashKey if this is the same as the initial hash | ||
4662 | // this makes sure that a history entry is created for this dialog | ||
4663 | if ( urlHistory.activeIndex === 0 && url === urlHistory.initialDst ) { | ||
4664 | url += dialogHashKey; | ||
4665 | } | ||
4666 | } | ||
4667 | |||
4668 | // if title element wasn't found, try the page div data attr too | ||
4669 | // If this is a deep-link or a reload ( active === undefined ) then just use pageTitle | ||
4670 | var newPageTitle = ( !active )? pageTitle : toPage.jqmData( "title" ) || toPage.children( ":jqmData(role='header')" ).find( ".ui-title" ).getEncodedText(); | ||
4671 | if ( !!newPageTitle && pageTitle === document.title ) { | ||
4672 | pageTitle = newPageTitle; | ||
4673 | } | ||
4674 | if ( !toPage.jqmData( "title" ) ) { | ||
4675 | toPage.jqmData( "title", pageTitle ); | ||
4676 | } | ||
4677 | |||
4678 | // Make sure we have a transition defined. | ||
4679 | settings.transition = settings.transition || | ||
4680 | ( ( historyDir && !activeIsInitialPage ) ? active.transition : undefined ) || | ||
4681 | ( isDialog ? $.mobile.defaultDialogTransition : $.mobile.defaultPageTransition ); | ||
4682 | |||
4683 | //add page to history stack if it's not back or forward | ||
4684 | if ( !historyDir && alreadyThere ) { | ||
4685 | urlHistory.getActive().pageUrl = pageUrl; | ||
4686 | } | ||
4687 | |||
4688 | // Set the location hash. | ||
4689 | if ( url && !settings.fromHashChange ) { | ||
4690 | var params; | ||
4691 | |||
4692 | // rebuilding the hash here since we loose it earlier on | ||
4693 | // TODO preserve the originally passed in path | ||
4694 | if( !path.isPath( url ) && url.indexOf( "#" ) < 0 ) { | ||
4695 | url = "#" + url; | ||
4696 | } | ||
4697 | |||
4698 | // TODO the property names here are just silly | ||
4699 | params = { | ||
4700 | transition: settings.transition, | ||
4701 | title: pageTitle, | ||
4702 | pageUrl: pageUrl, | ||
4703 | role: settings.role | ||
4704 | }; | ||
4705 | |||
4706 | if ( settings.changeHash !== false && $.mobile.hashListeningEnabled ) { | ||
4707 | $.mobile.navigate( url, params, true); | ||
4708 | } else if ( toPage[ 0 ] !== $.mobile.firstPage[ 0 ] ) { | ||
4709 | $.mobile.navigate.history.add( url, params ); | ||
4710 | } | ||
4711 | } | ||
4712 | |||
4713 | //set page title | ||
4714 | document.title = pageTitle; | ||
4715 | |||
4716 | //set "toPage" as activePage | ||
4717 | $.mobile.activePage = toPage; | ||
4718 | |||
4719 | // If we're navigating back in the URL history, set reverse accordingly. | ||
4720 | settings.reverse = settings.reverse || historyDir < 0; | ||
4721 | |||
4722 | transitionPages( toPage, fromPage, settings.transition, settings.reverse ) | ||
4723 | .done(function( name, reverse, $to, $from, alreadyFocused ) { | ||
4724 | removeActiveLinkClass(); | ||
4725 | |||
4726 | //if there's a duplicateCachedPage, remove it from the DOM now that it's hidden | ||
4727 | if ( settings.duplicateCachedPage ) { | ||
4728 | settings.duplicateCachedPage.remove(); | ||
4729 | } | ||
4730 | |||
4731 | // Send focus to the newly shown page. Moved from promise .done binding in transitionPages | ||
4732 | // itself to avoid ie bug that reports offsetWidth as > 0 (core check for visibility) | ||
4733 | // despite visibility: hidden addresses issue #2965 | ||
4734 | // https://github.com/jquery/jquery-mobile/issues/2965 | ||
4735 | if ( !alreadyFocused ) { | ||
4736 | $.mobile.focusPage( toPage ); | ||
4737 | } | ||
4738 | |||
4739 | releasePageTransitionLock(); | ||
4740 | mpc.trigger( "pagechange", triggerData ); | ||
4741 | }); | ||
4742 | }; | ||
4743 | |||
4744 | $.mobile.changePage.defaults = { | ||
4745 | transition: undefined, | ||
4746 | reverse: false, | ||
4747 | changeHash: true, | ||
4748 | fromHashChange: false, | ||
4749 | role: undefined, // By default we rely on the role defined by the @data-role attribute. | ||
4750 | duplicateCachedPage: undefined, | ||
4751 | pageContainer: undefined, | ||
4752 | showLoadMsg: true, //loading message shows by default when pages are being fetched during changePage | ||
4753 | dataUrl: undefined, | ||
4754 | fromPage: undefined, | ||
4755 | allowSamePageTransition: false | ||
4756 | }; | ||
4757 | |||
4758 | /* Event Bindings - hashchange, submit, and click */ | ||
4759 | function findClosestLink( ele ) | ||
4760 | { | ||
4761 | while ( ele ) { | ||
4762 | // Look for the closest element with a nodeName of "a". | ||
4763 | // Note that we are checking if we have a valid nodeName | ||
4764 | // before attempting to access it. This is because the | ||
4765 | // node we get called with could have originated from within | ||
4766 | // an embedded SVG document where some symbol instance elements | ||
4767 | // don't have nodeName defined on them, or strings are of type | ||
4768 | // SVGAnimatedString. | ||
4769 | if ( ( typeof ele.nodeName === "string" ) && ele.nodeName.toLowerCase() === "a" ) { | ||
4770 | break; | ||
4771 | } | ||
4772 | ele = ele.parentNode; | ||
4773 | } | ||
4774 | return ele; | ||
4775 | } | ||
4776 | |||
4777 | // The base URL for any given element depends on the page it resides in. | ||
4778 | function getClosestBaseUrl( ele ) | ||
4779 | { | ||
4780 | // Find the closest page and extract out its url. | ||
4781 | var url = $( ele ).closest( ".ui-page" ).jqmData( "url" ), | ||
4782 | base = documentBase.hrefNoHash; | ||
4783 | |||
4784 | if ( !url || !path.isPath( url ) ) { | ||
4785 | url = base; | ||
4786 | } | ||
4787 | |||
4788 | return path.makeUrlAbsolute( url, base); | ||
4789 | } | ||
4790 | |||
4791 | function maybeCreateHiddenInput( $el ) { | ||
4792 | var type = $el.attr( "type" ), | ||
4793 | name = $el.attr( "name" ); | ||
4794 | |||
4795 | if ( type !== "button" && type !== "reset" && name ) { | ||
4796 | // Add hidden input so the value of the clicked button will be recorded | ||
4797 | // in the submitted form data, but remove the hidden input from the form | ||
4798 | // after the value has been recorded so as to avoid multiple copies of it | ||
4799 | // preceding the original button. | ||
4800 | $.mobile.document.one( "submit", | ||
4801 | $.proxy( function() { this.remove(); }, | ||
4802 | $( "<input>", { | ||
4803 | type: "hidden", | ||
4804 | name: $el.attr( "name" ), | ||
4805 | value: $el.attr( "value" ) | ||
4806 | }).insertBefore( $el ) ) ); | ||
4807 | } | ||
4808 | } | ||
4809 | |||
4810 | //The following event bindings should be bound after mobileinit has been triggered | ||
4811 | //the following deferred is resolved in the init file | ||
4812 | $.mobile.navreadyDeferred = $.Deferred(); | ||
4813 | $.mobile._registerInternalEvents = function() { | ||
4814 | var getAjaxFormData = function( $form, calculateOnly ) { | ||
4815 | var type, target, url, ret = true; | ||
4816 | if ( !$.mobile.ajaxEnabled || | ||
4817 | // test that the form is, itself, ajax false | ||
4818 | $form.is( ":jqmData(ajax='false')" ) || | ||
4819 | // test that $.mobile.ignoreContentEnabled is set and | ||
4820 | // the form or one of it's parents is ajax=false | ||
4821 | !$form.jqmHijackable().length ) { | ||
4822 | return false; | ||
4823 | } | ||
4824 | |||
4825 | target = $form.attr( "target" ); | ||
4826 | url = $form.attr( "action" ); | ||
4827 | |||
4828 | // If no action is specified, browsers default to using the | ||
4829 | // URL of the document containing the form. Since we dynamically | ||
4830 | // pull in pages from external documents, the form should submit | ||
4831 | // to the URL for the source document of the page containing | ||
4832 | // the form. | ||
4833 | if ( !url ) { | ||
4834 | // Get the @data-url for the page containing the form. | ||
4835 | url = getClosestBaseUrl( $form ); | ||
4836 | if ( url === documentBase.hrefNoHash ) { | ||
4837 | // The url we got back matches the document base, | ||
4838 | // which means the page must be an internal/embedded page, | ||
4839 | // so default to using the actual document url as a browser | ||
4840 | // would. | ||
4841 | url = documentUrl.hrefNoSearch; | ||
4842 | } | ||
4843 | } | ||
4844 | |||
4845 | url = path.makeUrlAbsolute( url, getClosestBaseUrl( $form ) ); | ||
4846 | |||
4847 | if ( ( path.isExternal( url ) && !path.isPermittedCrossDomainRequest( documentUrl, url ) ) || target ) { | ||
4848 | return false; | ||
4849 | } | ||
4850 | |||
4851 | if ( !calculateOnly ) { | ||
4852 | type = $form.attr( "method" ); | ||
4853 | ret = { | ||
4854 | url: url, | ||
4855 | options: { | ||
4856 | type: type && type.length && type.toLowerCase() || "get", | ||
4857 | data: $form.serialize(), | ||
4858 | transition:$form.jqmData( "transition" ), | ||
4859 | reverse:$form.jqmData( "direction" ) === "reverse", | ||
4860 | reloadPage:true | ||
4861 | } | ||
4862 | }; | ||
4863 | } | ||
4864 | |||
4865 | return ret; | ||
4866 | }; | ||
4867 | |||
4868 | //bind to form submit events, handle with Ajax | ||
4869 | $.mobile.document.delegate( "form", "submit", function( event ) { | ||
4870 | var formData = getAjaxFormData( $( this ) ); | ||
4871 | |||
4872 | if ( formData ) { | ||
4873 | $.mobile.changePage( formData.url, formData.options ); | ||
4874 | event.preventDefault(); | ||
4875 | } | ||
4876 | }); | ||
4877 | |||
4878 | //add active state on vclick | ||
4879 | $.mobile.document.bind( "vclick", function( event ) { | ||
4880 | var $btn, btnEls, target = event.target, needClosest = false; | ||
4881 | // if this isn't a left click we don't care. Its important to note | ||
4882 | // that when the virtual event is generated it will create the which attr | ||
4883 | if ( event.which > 1 || !$.mobile.linkBindingEnabled ) { | ||
4884 | return; | ||
4885 | } | ||
4886 | |||
4887 | // If this is a vclick on a button, we must make sure its value will be | ||
4888 | // recorded in the resulting form data by adding a hidden input that | ||
4889 | // carries the button's value | ||
4890 | maybeCreateHiddenInput( $( target ) ); | ||
4891 | |||
4892 | // Try to find a target element to which the active class will be applied | ||
4893 | if ( $.data( target, "mobile-button" ) ) { | ||
4894 | // If the form will not be submitted via AJAX, do not add active class | ||
4895 | if ( !getAjaxFormData( $( target ).closest( "form" ), true ) ) { | ||
4896 | return; | ||
4897 | } | ||
4898 | // We will apply the active state to this button widget - the parent | ||
4899 | // of the input that was clicked will have the associated data | ||
4900 | if ( target.parentNode ) { | ||
4901 | target = target.parentNode; | ||
4902 | } | ||
4903 | } else { | ||
4904 | target = findClosestLink( target ); | ||
4905 | if ( !( target && path.parseUrl( target.getAttribute( "href" ) || "#" ).hash !== "#" ) ) { | ||
4906 | return; | ||
4907 | } | ||
4908 | |||
4909 | // TODO teach $.mobile.hijackable to operate on raw dom elements so the | ||
4910 | // link wrapping can be avoided | ||
4911 | if ( !$( target ).jqmHijackable().length ) { | ||
4912 | return; | ||
4913 | } | ||
4914 | } | ||
4915 | |||
4916 | // Avoid calling .closest by using the data set during .buttonMarkup() | ||
4917 | // List items have the button data in the parent of the element clicked | ||
4918 | if ( !!~target.className.indexOf( "ui-link-inherit" ) ) { | ||
4919 | if ( target.parentNode ) { | ||
4920 | btnEls = $.data( target.parentNode, "buttonElements" ); | ||
4921 | } | ||
4922 | // Otherwise, look for the data on the target itself | ||
4923 | } else { | ||
4924 | btnEls = $.data( target, "buttonElements" ); | ||
4925 | } | ||
4926 | // If found, grab the button's outer element | ||
4927 | if ( btnEls ) { | ||
4928 | target = btnEls.outer; | ||
4929 | } else { | ||
4930 | needClosest = true; | ||
4931 | } | ||
4932 | |||
4933 | $btn = $( target ); | ||
4934 | // If the outer element wasn't found by the our heuristics, use .closest() | ||
4935 | if ( needClosest ) { | ||
4936 | $btn = $btn.closest( ".ui-btn" ); | ||
4937 | } | ||
4938 | |||
4939 | if ( $btn.length > 0 && !$btn.hasClass( "ui-disabled" ) ) { | ||
4940 | removeActiveLinkClass( true ); | ||
4941 | $activeClickedLink = $btn; | ||
4942 | $activeClickedLink.addClass( $.mobile.activeBtnClass ); | ||
4943 | } | ||
4944 | }); | ||
4945 | |||
4946 | // click routing - direct to HTTP or Ajax, accordingly | ||
4947 | $.mobile.document.bind( "click", function( event ) { | ||
4948 | if ( !$.mobile.linkBindingEnabled || event.isDefaultPrevented() ) { | ||
4949 | return; | ||
4950 | } | ||
4951 | |||
4952 | var link = findClosestLink( event.target ), $link = $( link ), httpCleanup; | ||
4953 | |||
4954 | // If there is no link associated with the click or its not a left | ||
4955 | // click we want to ignore the click | ||
4956 | // TODO teach $.mobile.hijackable to operate on raw dom elements so the link wrapping | ||
4957 | // can be avoided | ||
4958 | if ( !link || event.which > 1 || !$link.jqmHijackable().length ) { | ||
4959 | return; | ||
4960 | } | ||
4961 | |||
4962 | //remove active link class if external (then it won't be there if you come back) | ||
4963 | httpCleanup = function() { | ||
4964 | window.setTimeout(function() { removeActiveLinkClass( true ); }, 200 ); | ||
4965 | }; | ||
4966 | |||
4967 | //if there's a data-rel=back attr, go back in history | ||
4968 | if ( $link.is( ":jqmData(rel='back')" ) ) { | ||
4969 | $.mobile.back(); | ||
4970 | return false; | ||
4971 | } | ||
4972 | |||
4973 | var baseUrl = getClosestBaseUrl( $link ), | ||
4974 | |||
4975 | //get href, if defined, otherwise default to empty hash | ||
4976 | href = path.makeUrlAbsolute( $link.attr( "href" ) || "#", baseUrl ); | ||
4977 | |||
4978 | //if ajax is disabled, exit early | ||
4979 | if ( !$.mobile.ajaxEnabled && !path.isEmbeddedPage( href ) ) { | ||
4980 | httpCleanup(); | ||
4981 | //use default click handling | ||
4982 | return; | ||
4983 | } | ||
4984 | |||
4985 | // XXX_jblas: Ideally links to application pages should be specified as | ||
4986 | // an url to the application document with a hash that is either | ||
4987 | // the site relative path or id to the page. But some of the | ||
4988 | // internal code that dynamically generates sub-pages for nested | ||
4989 | // lists and select dialogs, just write a hash in the link they | ||
4990 | // create. This means the actual URL path is based on whatever | ||
4991 | // the current value of the base tag is at the time this code | ||
4992 | // is called. For now we are just assuming that any url with a | ||
4993 | // hash in it is an application page reference. | ||
4994 | if ( href.search( "#" ) !== -1 ) { | ||
4995 | href = href.replace( /[^#]*#/, "" ); | ||
4996 | if ( !href ) { | ||
4997 | //link was an empty hash meant purely | ||
4998 | //for interaction, so we ignore it. | ||
4999 | event.preventDefault(); | ||
5000 | return; | ||
5001 | } else if ( path.isPath( href ) ) { | ||
5002 | //we have apath so make it the href we want to load. | ||
5003 | href = path.makeUrlAbsolute( href, baseUrl ); | ||
5004 | } else { | ||
5005 | //we have a simple id so use the documentUrl as its base. | ||
5006 | href = path.makeUrlAbsolute( "#" + href, documentUrl.hrefNoHash ); | ||
5007 | } | ||
5008 | } | ||
5009 | |||
5010 | // Should we handle this link, or let the browser deal with it? | ||
5011 | var useDefaultUrlHandling = $link.is( "[rel='external']" ) || $link.is( ":jqmData(ajax='false')" ) || $link.is( "[target]" ), | ||
5012 | |||
5013 | // Some embedded browsers, like the web view in Phone Gap, allow cross-domain XHR | ||
5014 | // requests if the document doing the request was loaded via the file:// protocol. | ||
5015 | // This is usually to allow the application to "phone home" and fetch app specific | ||
5016 | // data. We normally let the browser handle external/cross-domain urls, but if the | ||
5017 | // allowCrossDomainPages option is true, we will allow cross-domain http/https | ||
5018 | // requests to go through our page loading logic. | ||
5019 | |||
5020 | //check for protocol or rel and its not an embedded page | ||
5021 | //TODO overlap in logic from isExternal, rel=external check should be | ||
5022 | // moved into more comprehensive isExternalLink | ||
5023 | isExternal = useDefaultUrlHandling || ( path.isExternal( href ) && !path.isPermittedCrossDomainRequest( documentUrl, href ) ); | ||
5024 | |||
5025 | if ( isExternal ) { | ||
5026 | httpCleanup(); | ||
5027 | //use default click handling | ||
5028 | return; | ||
5029 | } | ||
5030 | |||
5031 | //use ajax | ||
5032 | var transition = $link.jqmData( "transition" ), | ||
5033 | reverse = $link.jqmData( "direction" ) === "reverse" || | ||
5034 | // deprecated - remove by 1.0 | ||
5035 | $link.jqmData( "back" ), | ||
5036 | |||
5037 | //this may need to be more specific as we use data-rel more | ||
5038 | role = $link.attr( "data-" + $.mobile.ns + "rel" ) || undefined; | ||
5039 | |||
5040 | $.mobile.changePage( href, { transition: transition, reverse: reverse, role: role, link: $link } ); | ||
5041 | event.preventDefault(); | ||
5042 | }); | ||
5043 | |||
5044 | //prefetch pages when anchors with data-prefetch are encountered | ||
5045 | $.mobile.document.delegate( ".ui-page", "pageshow.prefetch", function() { | ||
5046 | var urls = []; | ||
5047 | $( this ).find( "a:jqmData(prefetch)" ).each(function() { | ||
5048 | var $link = $( this ), | ||
5049 | url = $link.attr( "href" ); | ||
5050 | |||
5051 | if ( url && $.inArray( url, urls ) === -1 ) { | ||
5052 | urls.push( url ); | ||
5053 | |||
5054 | $.mobile.loadPage( url, { role: $link.attr( "data-" + $.mobile.ns + "rel" ) } ); | ||
5055 | } | ||
5056 | }); | ||
5057 | }); | ||
5058 | |||
5059 | $.mobile._handleHashChange = function( url, data ) { | ||
5060 | //find first page via hash | ||
5061 | var to = path.stripHash(url), | ||
5062 | //transition is false if it's the first page, undefined otherwise (and may be overridden by default) | ||
5063 | transition = $.mobile.urlHistory.stack.length === 0 ? "none" : undefined, | ||
5064 | |||
5065 | // default options for the changPage calls made after examining the current state | ||
5066 | // of the page and the hash, NOTE that the transition is derived from the previous | ||
5067 | // history entry | ||
5068 | changePageOptions = { | ||
5069 | changeHash: false, | ||
5070 | fromHashChange: true, | ||
5071 | reverse: data.direction === "back" | ||
5072 | }; | ||
5073 | |||
5074 | $.extend( changePageOptions, data, { | ||
5075 | transition: (urlHistory.getLast() || {}).transition || transition | ||
5076 | }); | ||
5077 | |||
5078 | // special case for dialogs | ||
5079 | if ( urlHistory.activeIndex > 0 && to.indexOf( dialogHashKey ) > -1 && urlHistory.initialDst !== to ) { | ||
5080 | |||
5081 | // If current active page is not a dialog skip the dialog and continue | ||
5082 | // in the same direction | ||
5083 | if ( $.mobile.activePage && !$.mobile.activePage.is( ".ui-dialog" ) ) { | ||
5084 | //determine if we're heading forward or backward and continue accordingly past | ||
5085 | //the current dialog | ||
5086 | if( data.direction === "back" ) { | ||
5087 | $.mobile.back(); | ||
5088 | } else { | ||
5089 | window.history.forward(); | ||
5090 | } | ||
5091 | |||
5092 | // prevent changePage call | ||
5093 | return; | ||
5094 | } else { | ||
5095 | // if the current active page is a dialog and we're navigating | ||
5096 | // to a dialog use the dialog objected saved in the stack | ||
5097 | to = data.pageUrl; | ||
5098 | var active = $.mobile.urlHistory.getActive(); | ||
5099 | |||
5100 | // make sure to set the role, transition and reversal | ||
5101 | // as most of this is lost by the domCache cleaning | ||
5102 | $.extend( changePageOptions, { | ||
5103 | role: active.role, | ||
5104 | transition: active.transition, | ||
5105 | reverse: data.direction === "back" | ||
5106 | }); | ||
5107 | } | ||
5108 | } | ||
5109 | |||
5110 | //if to is defined, load it | ||
5111 | if ( to ) { | ||
5112 | // At this point, 'to' can be one of 3 things, a cached page element from | ||
5113 | // a history stack entry, an id, or site-relative/absolute URL. If 'to' is | ||
5114 | // an id, we need to resolve it against the documentBase, not the location.href, | ||
5115 | // since the hashchange could've been the result of a forward/backward navigation | ||
5116 | // that crosses from an external page/dialog to an internal page/dialog. | ||
5117 | to = !path.isPath( to ) ? ( path.makeUrlAbsolute( '#' + to, documentBase ) ) : to; | ||
5118 | |||
5119 | // If we're about to go to an initial URL that contains a reference to a non-existent | ||
5120 | // internal page, go to the first page instead. We know that the initial hash refers to a | ||
5121 | // non-existent page, because the initial hash did not end up in the initial urlHistory entry | ||
5122 | if ( to === path.makeUrlAbsolute( '#' + urlHistory.initialDst, documentBase ) && | ||
5123 | urlHistory.stack.length && urlHistory.stack[0].url !== urlHistory.initialDst.replace( dialogHashKey, "" ) ) { | ||
5124 | to = $.mobile.firstPage; | ||
5125 | } | ||
5126 | |||
5127 | $.mobile.changePage( to, changePageOptions ); | ||
5128 | }else { | ||
5129 | |||
5130 | //there's no hash, go to the first page in the dom | ||
5131 | $.mobile.changePage( $.mobile.firstPage, changePageOptions ); | ||
5132 | } | ||
5133 | }; | ||
5134 | |||
5135 | // TODO roll the logic here into the handleHashChange method | ||
5136 | $window.bind( "navigate", function( e, data ) { | ||
5137 | var url = $.event.special.navigate.originalEventName.indexOf( "hashchange" ) > -1 ? data.state.hash : data.state.url; | ||
5138 | |||
5139 | if( !url ) { | ||
5140 | url = $.mobile.path.parseLocation().hash; | ||
5141 | } | ||
5142 | |||
5143 | if( !url || url === "#" || url.indexOf( "#" + $.mobile.path.uiStateKey ) === 0 ){ | ||
5144 | url = location.href; | ||
5145 | } | ||
5146 | |||
5147 | $.mobile._handleHashChange( url, data.state ); | ||
5148 | }); | ||
5149 | |||
5150 | //set page min-heights to be device specific | ||
5151 | $.mobile.document.bind( "pageshow", $.mobile.resetActivePageHeight ); | ||
5152 | $.mobile.window.bind( "throttledresize", $.mobile.resetActivePageHeight ); | ||
5153 | |||
5154 | };//navreadyDeferred done callback | ||
5155 | |||
5156 | $( function() { domreadyDeferred.resolve(); } ); | ||
5157 | |||
5158 | $.when( domreadyDeferred, $.mobile.navreadyDeferred ).done( function() { $.mobile._registerInternalEvents(); } ); | ||
5159 | })( jQuery ); | ||
5160 | |||
5161 | /* | ||
5162 | * fallback transition for flip in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5163 | */ | ||
5164 | |||
5165 | (function( $, window, undefined ) { | ||
5166 | |||
5167 | $.mobile.transitionFallbacks.flip = "fade"; | ||
5168 | |||
5169 | })( jQuery, this ); | ||
5170 | /* | ||
5171 | * fallback transition for flow in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5172 | */ | ||
5173 | |||
5174 | (function( $, window, undefined ) { | ||
5175 | |||
5176 | $.mobile.transitionFallbacks.flow = "fade"; | ||
5177 | |||
5178 | })( jQuery, this ); | ||
5179 | /* | ||
5180 | * fallback transition for pop in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5181 | */ | ||
5182 | |||
5183 | (function( $, window, undefined ) { | ||
5184 | |||
5185 | $.mobile.transitionFallbacks.pop = "fade"; | ||
5186 | |||
5187 | })( jQuery, this ); | ||
5188 | /* | ||
5189 | * fallback transition for slide in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5190 | */ | ||
5191 | |||
5192 | (function( $, window, undefined ) { | ||
5193 | |||
5194 | // Use the simultaneous transitions handler for slide transitions | ||
5195 | $.mobile.transitionHandlers.slide = $.mobile.transitionHandlers.simultaneous; | ||
5196 | |||
5197 | // Set the slide transitions's fallback to "fade" | ||
5198 | $.mobile.transitionFallbacks.slide = "fade"; | ||
5199 | |||
5200 | })( jQuery, this ); | ||
5201 | /* | ||
5202 | * fallback transition for slidedown in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5203 | */ | ||
5204 | |||
5205 | (function( $, window, undefined ) { | ||
5206 | |||
5207 | $.mobile.transitionFallbacks.slidedown = "fade"; | ||
5208 | |||
5209 | })( jQuery, this ); | ||
5210 | /* | ||
5211 | * fallback transition for slidefade in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5212 | */ | ||
5213 | |||
5214 | (function( $, window, undefined ) { | ||
5215 | |||
5216 | // Set the slide transitions's fallback to "fade" | ||
5217 | $.mobile.transitionFallbacks.slidefade = "fade"; | ||
5218 | |||
5219 | })( jQuery, this ); | ||
5220 | /* | ||
5221 | * fallback transition for slideup in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5222 | */ | ||
5223 | |||
5224 | (function( $, window, undefined ) { | ||
5225 | |||
5226 | $.mobile.transitionFallbacks.slideup = "fade"; | ||
5227 | |||
5228 | })( jQuery, this ); | ||
5229 | /* | ||
5230 | * fallback transition for turn in non-3D supporting browsers (which tend to handle complex transitions poorly in general | ||
5231 | */ | ||
5232 | |||
5233 | (function( $, window, undefined ) { | ||
5234 | |||
5235 | $.mobile.transitionFallbacks.turn = "fade"; | ||
5236 | |||
5237 | })( jQuery, this ); | ||
5238 | |||
5239 | (function( $, undefined ) { | ||
5240 | |||
5241 | $.mobile.page.prototype.options.degradeInputs = { | ||
5242 | color: false, | ||
5243 | date: false, | ||
5244 | datetime: false, | ||
5245 | "datetime-local": false, | ||
5246 | email: false, | ||
5247 | month: false, | ||
5248 | number: false, | ||
5249 | range: "number", | ||
5250 | search: "text", | ||
5251 | tel: false, | ||
5252 | time: false, | ||
5253 | url: false, | ||
5254 | week: false | ||
5255 | }; | ||
5256 | |||
5257 | |||
5258 | //auto self-init widgets | ||
5259 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
5260 | |||
5261 | var page = $.mobile.closestPageData( $( e.target ) ), options; | ||
5262 | |||
5263 | if ( !page ) { | ||
5264 | return; | ||
5265 | } | ||
5266 | |||
5267 | options = page.options; | ||
5268 | |||
5269 | // degrade inputs to avoid poorly implemented native functionality | ||
5270 | $( e.target ).find( "input" ).not( page.keepNativeSelector() ).each(function() { | ||
5271 | var $this = $( this ), | ||
5272 | type = this.getAttribute( "type" ), | ||
5273 | optType = options.degradeInputs[ type ] || "text"; | ||
5274 | |||
5275 | if ( options.degradeInputs[ type ] ) { | ||
5276 | var html = $( "<div>" ).html( $this.clone() ).html(), | ||
5277 | // In IE browsers, the type sometimes doesn't exist in the cloned markup, so we replace the closing tag instead | ||
5278 | hasType = html.indexOf( " type=" ) > -1, | ||
5279 | findstr = hasType ? /\s+type=["']?\w+['"]?/ : /\/?>/, | ||
5280 | repstr = " type=\"" + optType + "\" data-" + $.mobile.ns + "type=\"" + type + "\"" + ( hasType ? "" : ">" ); | ||
5281 | |||
5282 | $this.replaceWith( html.replace( findstr, repstr ) ); | ||
5283 | } | ||
5284 | }); | ||
5285 | |||
5286 | }); | ||
5287 | |||
5288 | })( jQuery ); | ||
5289 | |||
5290 | (function( $, window, undefined ) { | ||
5291 | |||
5292 | $.widget( "mobile.dialog", $.mobile.widget, { | ||
5293 | options: { | ||
5294 | closeBtn: "left", | ||
5295 | closeBtnText: "Close", | ||
5296 | overlayTheme: "a", | ||
5297 | corners: true, | ||
5298 | initSelector: ":jqmData(role='dialog')" | ||
5299 | }, | ||
5300 | |||
5301 | // Override the theme set by the page plugin on pageshow | ||
5302 | _handlePageBeforeShow: function() { | ||
5303 | this._isCloseable = true; | ||
5304 | if ( this.options.overlayTheme ) { | ||
5305 | this.element | ||
5306 | .page( "removeContainerBackground" ) | ||
5307 | .page( "setContainerBackground", this.options.overlayTheme ); | ||
5308 | } | ||
5309 | }, | ||
5310 | |||
5311 | _create: function() { | ||
5312 | var self = this, | ||
5313 | $el = this.element, | ||
5314 | cornerClass = !!this.options.corners ? " ui-corner-all" : "", | ||
5315 | dialogWrap = $( "<div/>", { | ||
5316 | "role" : "dialog", | ||
5317 | "class" : "ui-dialog-contain ui-overlay-shadow" + cornerClass | ||
5318 | }); | ||
5319 | |||
5320 | $el.addClass( "ui-dialog ui-overlay-" + this.options.overlayTheme ); | ||
5321 | |||
5322 | // Class the markup for dialog styling | ||
5323 | // Set aria role | ||
5324 | $el.wrapInner( dialogWrap ); | ||
5325 | |||
5326 | /* bind events | ||
5327 | - clicks and submits should use the closing transition that the dialog opened with | ||
5328 | unless a data-transition is specified on the link/form | ||
5329 | - if the click was on the close button, or the link has a data-rel="back" it'll go back in history naturally | ||
5330 | */ | ||
5331 | $el.bind( "vclick submit", function( event ) { | ||
5332 | var $target = $( event.target ).closest( event.type === "vclick" ? "a" : "form" ), | ||
5333 | active; | ||
5334 | |||
5335 | if ( $target.length && !$target.jqmData( "transition" ) ) { | ||
5336 | |||
5337 | active = $.mobile.urlHistory.getActive() || {}; | ||
5338 | |||
5339 | $target.attr( "data-" + $.mobile.ns + "transition", ( active.transition || $.mobile.defaultDialogTransition ) ) | ||
5340 | .attr( "data-" + $.mobile.ns + "direction", "reverse" ); | ||
5341 | } | ||
5342 | }); | ||
5343 | |||
5344 | this._on( $el, { | ||
5345 | pagebeforeshow: "_handlePageBeforeShow" | ||
5346 | }); | ||
5347 | |||
5348 | $.extend( this, { | ||
5349 | _createComplete: false | ||
5350 | }); | ||
5351 | |||
5352 | this._setCloseBtn( this.options.closeBtn ); | ||
5353 | }, | ||
5354 | |||
5355 | _setCloseBtn: function( value ) { | ||
5356 | var self = this, btn, location; | ||
5357 | |||
5358 | if ( this._headerCloseButton ) { | ||
5359 | this._headerCloseButton.remove(); | ||
5360 | this._headerCloseButton = null; | ||
5361 | } | ||
5362 | if ( value !== "none" ) { | ||
5363 | // Sanitize value | ||
5364 | location = ( value === "left" ? "left" : "right" ); | ||
5365 | btn = $( "<a href='#' class='ui-btn-" + location + "' data-" + $.mobile.ns + "icon='delete' data-" + $.mobile.ns + "iconpos='notext'>"+ this.options.closeBtnText + "</a>" ); | ||
5366 | this.element.children().find( ":jqmData(role='header')" ).first().prepend( btn ); | ||
5367 | if ( this._createComplete && $.fn.buttonMarkup ) { | ||
5368 | btn.buttonMarkup(); | ||
5369 | } | ||
5370 | this._createComplete = true; | ||
5371 | |||
5372 | // this must be an anonymous function so that select menu dialogs can replace | ||
5373 | // the close method. This is a change from previously just defining data-rel=back | ||
5374 | // on the button and letting nav handle it | ||
5375 | // | ||
5376 | // Use click rather than vclick in order to prevent the possibility of unintentionally | ||
5377 | // reopening the dialog if the dialog opening item was directly under the close button. | ||
5378 | btn.bind( "click", function() { | ||
5379 | self.close(); | ||
5380 | }); | ||
5381 | |||
5382 | this._headerCloseButton = btn; | ||
5383 | } | ||
5384 | }, | ||
5385 | |||
5386 | _setOption: function( key, value ) { | ||
5387 | if ( key === "closeBtn" ) { | ||
5388 | this._setCloseBtn( value ); | ||
5389 | this._super( key, value ); | ||
5390 | this.element.attr( "data-" + ( $.mobile.ns || "" ) + "close-btn", value ); | ||
5391 | } | ||
5392 | }, | ||
5393 | |||
5394 | // Close method goes back in history | ||
5395 | close: function() { | ||
5396 | var idx, dst, hist = $.mobile.navigate.history; | ||
5397 | |||
5398 | if ( this._isCloseable ) { | ||
5399 | this._isCloseable = false; | ||
5400 | // If the hash listening is enabled and there is at least one preceding history | ||
5401 | // entry it's ok to go back. Initial pages with the dialog hash state are an example | ||
5402 | // where the stack check is necessary | ||
5403 | if ( $.mobile.hashListeningEnabled && hist.activeIndex > 0 ) { | ||
5404 | $.mobile.back(); | ||
5405 | } else { | ||
5406 | idx = Math.max( 0, hist.activeIndex - 1 ); | ||
5407 | dst = hist.stack[ idx ].pageUrl || hist.stack[ idx ].url; | ||
5408 | hist.previousIndex = hist.activeIndex; | ||
5409 | hist.activeIndex = idx; | ||
5410 | if ( !$.mobile.path.isPath( dst ) ) { | ||
5411 | dst = $.mobile.path.makeUrlAbsolute( "#" + dst ); | ||
5412 | } | ||
5413 | |||
5414 | $.mobile.changePage( dst, { direction: "back", changeHash: false, fromHashChange: true } ); | ||
5415 | } | ||
5416 | } | ||
5417 | } | ||
5418 | }); | ||
5419 | |||
5420 | //auto self-init widgets | ||
5421 | $.mobile.document.delegate( $.mobile.dialog.prototype.options.initSelector, "pagecreate", function() { | ||
5422 | $.mobile.dialog.prototype.enhance( this ); | ||
5423 | }); | ||
5424 | |||
5425 | })( jQuery, this ); | ||
5426 | |||
5427 | (function( $, undefined ) { | ||
5428 | |||
5429 | $.mobile.page.prototype.options.backBtnText = "Back"; | ||
5430 | $.mobile.page.prototype.options.addBackBtn = false; | ||
5431 | $.mobile.page.prototype.options.backBtnTheme = null; | ||
5432 | $.mobile.page.prototype.options.headerTheme = "a"; | ||
5433 | $.mobile.page.prototype.options.footerTheme = "a"; | ||
5434 | $.mobile.page.prototype.options.contentTheme = null; | ||
5435 | |||
5436 | // NOTE bind used to force this binding to run before the buttonMarkup binding | ||
5437 | // which expects .ui-footer top be applied in its gigantic selector | ||
5438 | // TODO remove the buttonMarkup giant selector and move it to the various modules | ||
5439 | // on which it depends | ||
5440 | $.mobile.document.bind( "pagecreate", function( e ) { | ||
5441 | var $page = $( e.target ), | ||
5442 | o = $page.data( "mobile-page" ).options, | ||
5443 | pageRole = $page.jqmData( "role" ), | ||
5444 | pageTheme = o.theme; | ||
5445 | |||
5446 | $( ":jqmData(role='header'), :jqmData(role='footer'), :jqmData(role='content')", $page ) | ||
5447 | .jqmEnhanceable() | ||
5448 | .each(function() { | ||
5449 | |||
5450 | var $this = $( this ), | ||
5451 | role = $this.jqmData( "role" ), | ||
5452 | theme = $this.jqmData( "theme" ), | ||
5453 | contentTheme = theme || o.contentTheme || ( pageRole === "dialog" && pageTheme ), | ||
5454 | $headeranchors, | ||
5455 | leftbtn, | ||
5456 | rightbtn, | ||
5457 | backBtn; | ||
5458 | |||
5459 | $this.addClass( "ui-" + role ); | ||
5460 | |||
5461 | //apply theming and markup modifications to page,header,content,footer | ||
5462 | if ( role === "header" || role === "footer" ) { | ||
5463 | |||
5464 | var thisTheme = theme || ( role === "header" ? o.headerTheme : o.footerTheme ) || pageTheme; | ||
5465 | |||
5466 | $this | ||
5467 | //add theme class | ||
5468 | .addClass( "ui-bar-" + thisTheme ) | ||
5469 | // Add ARIA role | ||
5470 | .attr( "role", role === "header" ? "banner" : "contentinfo" ); | ||
5471 | |||
5472 | if ( role === "header") { | ||
5473 | // Right,left buttons | ||
5474 | $headeranchors= $this.children( "a, button" ); | ||
5475 | leftbtn= $headeranchors.hasClass( "ui-btn-left" ); | ||
5476 | rightbtn = $headeranchors.hasClass( "ui-btn-right" ); | ||
5477 | |||
5478 | leftbtn = leftbtn || $headeranchors.eq( 0 ).not( ".ui-btn-right" ).addClass( "ui-btn-left" ).length; | ||
5479 | |||
5480 | rightbtn = rightbtn || $headeranchors.eq( 1 ).addClass( "ui-btn-right" ).length; | ||
5481 | } | ||
5482 | |||
5483 | // Auto-add back btn on pages beyond first view | ||
5484 | if ( o.addBackBtn && | ||
5485 | role === "header" && | ||
5486 | $( ".ui-page" ).length > 1 && | ||
5487 | $page.jqmData( "url" ) !== $.mobile.path.stripHash( location.hash ) && | ||
5488 | !leftbtn ) { | ||
5489 | |||
5490 | backBtn = $( "<a href='javascript:void(0);' class='ui-btn-left' data-"+ $.mobile.ns +"rel='back' data-"+ $.mobile.ns +"icon='arrow-l'>"+ o.backBtnText +"</a>" ) | ||
5491 | // If theme is provided, override default inheritance | ||
5492 | .attr( "data-"+ $.mobile.ns +"theme", o.backBtnTheme || thisTheme ) | ||
5493 | .prependTo( $this ); | ||
5494 | } | ||
5495 | |||
5496 | // Page title | ||
5497 | $this.children( "h1, h2, h3, h4, h5, h6" ) | ||
5498 | .addClass( "ui-title" ) | ||
5499 | // Regardless of h element number in src, it becomes h1 for the enhanced page | ||
5500 | .attr({ | ||
5501 | "role": "heading", | ||
5502 | "aria-level": "1" | ||
5503 | }); | ||
5504 | |||
5505 | } else if ( role === "content" ) { | ||
5506 | if ( contentTheme ) { | ||
5507 | $this.addClass( "ui-body-" + ( contentTheme ) ); | ||
5508 | } | ||
5509 | |||
5510 | // Add ARIA role | ||
5511 | $this.attr( "role", "main" ); | ||
5512 | } | ||
5513 | }); | ||
5514 | }); | ||
5515 | |||
5516 | })( jQuery ); | ||
5517 | |||
5518 | (function( $, undefined ) { | ||
5519 | |||
5520 | $.mobile.behaviors.addFirstLastClasses = { | ||
5521 | _getVisibles: function( $els, create ) { | ||
5522 | var visibles; | ||
5523 | |||
5524 | if ( create ) { | ||
5525 | visibles = $els.not( ".ui-screen-hidden" ); | ||
5526 | } else { | ||
5527 | visibles = $els.filter( ":visible" ); | ||
5528 | if ( visibles.length === 0 ) { | ||
5529 | visibles = $els.not( ".ui-screen-hidden" ); | ||
5530 | } | ||
5531 | } | ||
5532 | |||
5533 | return visibles; | ||
5534 | }, | ||
5535 | |||
5536 | _addFirstLastClasses: function( $els, $visibles, create ) { | ||
5537 | $els.removeClass( "ui-first-child ui-last-child" ); | ||
5538 | $visibles.eq( 0 ).addClass( "ui-first-child" ).end().last().addClass( "ui-last-child" ); | ||
5539 | if ( !create ) { | ||
5540 | this.element.trigger( "updatelayout" ); | ||
5541 | } | ||
5542 | } | ||
5543 | }; | ||
5544 | |||
5545 | })( jQuery ); | ||
5546 | |||
5547 | (function( $, undefined ) { | ||
5548 | |||
5549 | // filter function removes whitespace between label and form element so we can use inline-block (nodeType 3 = text) | ||
5550 | $.fn.fieldcontain = function( options ) { | ||
5551 | return this | ||
5552 | .addClass( "ui-field-contain ui-body ui-br" ) | ||
5553 | .contents().filter( function() { | ||
5554 | return ( this.nodeType === 3 && !/\S/.test( this.nodeValue ) ); | ||
5555 | }).remove(); | ||
5556 | }; | ||
5557 | |||
5558 | //auto self-init widgets | ||
5559 | $( document ).bind( "pagecreate create", function( e ) { | ||
5560 | $( ":jqmData(role='fieldcontain')", e.target ).jqmEnhanceable().fieldcontain(); | ||
5561 | }); | ||
5562 | |||
5563 | })( jQuery ); | ||
5564 | |||
5565 | (function( $, undefined ) { | ||
5566 | |||
5567 | $.fn.grid = function( options ) { | ||
5568 | return this.each(function() { | ||
5569 | |||
5570 | var $this = $( this ), | ||
5571 | o = $.extend({ | ||
5572 | grid: null | ||
5573 | }, options ), | ||
5574 | $kids = $this.children(), | ||
5575 | gridCols = { solo:1, a:2, b:3, c:4, d:5 }, | ||
5576 | grid = o.grid, | ||
5577 | iterator; | ||
5578 | |||
5579 | if ( !grid ) { | ||
5580 | if ( $kids.length <= 5 ) { | ||
5581 | for ( var letter in gridCols ) { | ||
5582 | if ( gridCols[ letter ] === $kids.length ) { | ||
5583 | grid = letter; | ||
5584 | } | ||
5585 | } | ||
5586 | } else { | ||
5587 | grid = "a"; | ||
5588 | $this.addClass( "ui-grid-duo" ); | ||
5589 | } | ||
5590 | } | ||
5591 | iterator = gridCols[grid]; | ||
5592 | |||
5593 | $this.addClass( "ui-grid-" + grid ); | ||
5594 | |||
5595 | $kids.filter( ":nth-child(" + iterator + "n+1)" ).addClass( "ui-block-a" ); | ||
5596 | |||
5597 | if ( iterator > 1 ) { | ||
5598 | $kids.filter( ":nth-child(" + iterator + "n+2)" ).addClass( "ui-block-b" ); | ||
5599 | } | ||
5600 | if ( iterator > 2 ) { | ||
5601 | $kids.filter( ":nth-child(" + iterator + "n+3)" ).addClass( "ui-block-c" ); | ||
5602 | } | ||
5603 | if ( iterator > 3 ) { | ||
5604 | $kids.filter( ":nth-child(" + iterator + "n+4)" ).addClass( "ui-block-d" ); | ||
5605 | } | ||
5606 | if ( iterator > 4 ) { | ||
5607 | $kids.filter( ":nth-child(" + iterator + "n+5)" ).addClass( "ui-block-e" ); | ||
5608 | } | ||
5609 | }); | ||
5610 | }; | ||
5611 | })( jQuery ); | ||
5612 | |||
5613 | (function( $, undefined ) { | ||
5614 | |||
5615 | $( document ).bind( "pagecreate create", function( e ) { | ||
5616 | $( ":jqmData(role='nojs')", e.target ).addClass( "ui-nojs" ); | ||
5617 | |||
5618 | }); | ||
5619 | |||
5620 | })( jQuery ); | ||
5621 | |||
5622 | (function( $, undefined ) { | ||
5623 | |||
5624 | $.mobile.behaviors.formReset = { | ||
5625 | _handleFormReset: function() { | ||
5626 | this._on( this.element.closest( "form" ), { | ||
5627 | reset: function() { | ||
5628 | this._delay( "_reset" ); | ||
5629 | } | ||
5630 | }); | ||
5631 | } | ||
5632 | }; | ||
5633 | |||
5634 | })( jQuery ); | ||
5635 | |||
5636 | (function( $, undefined ) { | ||
5637 | |||
5638 | // This function calls getAttribute, which should be safe for data-* attributes | ||
5639 | var getAttrFixed = function( e, key ) { | ||
5640 | var value = e.getAttribute( key ); | ||
5641 | |||
5642 | return value === "true" ? true : | ||
5643 | value === "false" ? false : | ||
5644 | value === null ? undefined : value; | ||
5645 | }; | ||
5646 | |||
5647 | $.fn.buttonMarkup = function( options ) { | ||
5648 | var $workingSet = this, | ||
5649 | nsKey = "data-" + $.mobile.ns, | ||
5650 | key; | ||
5651 | |||
5652 | // Enforce options to be of type string | ||
5653 | options = ( options && ( $.type( options ) === "object" ) )? options : {}; | ||
5654 | for ( var i = 0; i < $workingSet.length; i++ ) { | ||
5655 | var el = $workingSet.eq( i ), | ||
5656 | e = el[ 0 ], | ||
5657 | o = $.extend( {}, $.fn.buttonMarkup.defaults, { | ||
5658 | icon: options.icon !== undefined ? options.icon : getAttrFixed( e, nsKey + "icon" ), | ||
5659 | iconpos: options.iconpos !== undefined ? options.iconpos : getAttrFixed( e, nsKey + "iconpos" ), | ||
5660 | theme: options.theme !== undefined ? options.theme : getAttrFixed( e, nsKey + "theme" ) || $.mobile.getInheritedTheme( el, "c" ), | ||
5661 | inline: options.inline !== undefined ? options.inline : getAttrFixed( e, nsKey + "inline" ), | ||
5662 | shadow: options.shadow !== undefined ? options.shadow : getAttrFixed( e, nsKey + "shadow" ), | ||
5663 | corners: options.corners !== undefined ? options.corners : getAttrFixed( e, nsKey + "corners" ), | ||
5664 | iconshadow: options.iconshadow !== undefined ? options.iconshadow : getAttrFixed( e, nsKey + "iconshadow" ), | ||
5665 | mini: options.mini !== undefined ? options.mini : getAttrFixed( e, nsKey + "mini" ) | ||
5666 | }, options ), | ||
5667 | |||
5668 | // Classes Defined | ||
5669 | innerClass = "ui-btn-inner", | ||
5670 | textClass = "ui-btn-text", | ||
5671 | buttonClass, iconClass, | ||
5672 | hover = false, | ||
5673 | state = "up", | ||
5674 | // Button inner markup | ||
5675 | buttonInner, | ||
5676 | buttonText, | ||
5677 | buttonIcon, | ||
5678 | buttonElements; | ||
5679 | |||
5680 | for ( key in o ) { | ||
5681 | e.setAttribute( nsKey + key, o[ key ] ); | ||
5682 | } | ||
5683 | |||
5684 | if ( getAttrFixed( e, nsKey + "rel" ) === "popup" && el.attr( "href" ) ) { | ||
5685 | e.setAttribute( "aria-haspopup", true ); | ||
5686 | e.setAttribute( "aria-owns", el.attr( "href" ) ); | ||
5687 | } | ||
5688 | |||
5689 | // Check if this element is already enhanced | ||
5690 | buttonElements = $.data( ( ( e.tagName === "INPUT" || e.tagName === "BUTTON" ) ? e.parentNode : e ), "buttonElements" ); | ||
5691 | |||
5692 | if ( buttonElements ) { | ||
5693 | e = buttonElements.outer; | ||
5694 | el = $( e ); | ||
5695 | buttonInner = buttonElements.inner; | ||
5696 | buttonText = buttonElements.text; | ||
5697 | // We will recreate this icon below | ||
5698 | $( buttonElements.icon ).remove(); | ||
5699 | buttonElements.icon = null; | ||
5700 | hover = buttonElements.hover; | ||
5701 | state = buttonElements.state; | ||
5702 | } | ||
5703 | else { | ||
5704 | buttonInner = document.createElement( o.wrapperEls ); | ||
5705 | buttonText = document.createElement( o.wrapperEls ); | ||
5706 | } | ||
5707 | buttonIcon = o.icon ? document.createElement( "span" ) : null; | ||
5708 | |||
5709 | if ( attachEvents && !buttonElements ) { | ||
5710 | attachEvents(); | ||
5711 | } | ||
5712 | |||
5713 | // if not, try to find closest theme container | ||
5714 | if ( !o.theme ) { | ||
5715 | o.theme = $.mobile.getInheritedTheme( el, "c" ); | ||
5716 | } | ||
5717 | |||
5718 | buttonClass = "ui-btn "; | ||
5719 | buttonClass += ( hover ? "ui-btn-hover-" + o.theme : "" ); | ||
5720 | buttonClass += ( state ? " ui-btn-" + state + "-" + o.theme : "" ); | ||
5721 | buttonClass += o.shadow ? " ui-shadow" : ""; | ||
5722 | buttonClass += o.corners ? " ui-btn-corner-all" : ""; | ||
5723 | |||
5724 | if ( o.mini !== undefined ) { | ||
5725 | // Used to control styling in headers/footers, where buttons default to `mini` style. | ||
5726 | buttonClass += o.mini === true ? " ui-mini" : " ui-fullsize"; | ||
5727 | } | ||
5728 | |||
5729 | if ( o.inline !== undefined ) { | ||
5730 | // Used to control styling in headers/footers, where buttons default to `inline` style. | ||
5731 | buttonClass += o.inline === true ? " ui-btn-inline" : " ui-btn-block"; | ||
5732 | } | ||
5733 | |||
5734 | if ( o.icon ) { | ||
5735 | o.icon = "ui-icon-" + o.icon; | ||
5736 | o.iconpos = o.iconpos || "left"; | ||
5737 | |||
5738 | iconClass = "ui-icon " + o.icon; | ||
5739 | |||
5740 | if ( o.iconshadow ) { | ||
5741 | iconClass += " ui-icon-shadow"; | ||
5742 | } | ||
5743 | } | ||
5744 | |||
5745 | if ( o.iconpos ) { | ||
5746 | buttonClass += " ui-btn-icon-" + o.iconpos; | ||
5747 | |||
5748 | if ( o.iconpos === "notext" && !el.attr( "title" ) ) { | ||
5749 | el.attr( "title", el.getEncodedText() ); | ||
5750 | } | ||
5751 | } | ||
5752 | |||
5753 | if ( o.iconpos && o.iconpos === "notext" && !el.attr( "title" ) ) { | ||
5754 | el.attr( "title", el.getEncodedText() ); | ||
5755 | } | ||
5756 | |||
5757 | if ( buttonElements ) { | ||
5758 | el.removeClass( buttonElements.bcls || "" ); | ||
5759 | } | ||
5760 | el.removeClass( "ui-link" ).addClass( buttonClass ); | ||
5761 | |||
5762 | buttonInner.className = innerClass; | ||
5763 | buttonText.className = textClass; | ||
5764 | if ( !buttonElements ) { | ||
5765 | buttonInner.appendChild( buttonText ); | ||
5766 | } | ||
5767 | if ( buttonIcon ) { | ||
5768 | buttonIcon.className = iconClass; | ||
5769 | if ( !( buttonElements && buttonElements.icon ) ) { | ||
5770 | buttonIcon.innerHTML = " "; | ||
5771 | buttonInner.appendChild( buttonIcon ); | ||
5772 | } | ||
5773 | } | ||
5774 | |||
5775 | while ( e.firstChild && !buttonElements ) { | ||
5776 | buttonText.appendChild( e.firstChild ); | ||
5777 | } | ||
5778 | |||
5779 | if ( !buttonElements ) { | ||
5780 | e.appendChild( buttonInner ); | ||
5781 | } | ||
5782 | |||
5783 | // Assign a structure containing the elements of this button to the elements of this button. This | ||
5784 | // will allow us to recognize this as an already-enhanced button in future calls to buttonMarkup(). | ||
5785 | buttonElements = { | ||
5786 | hover : hover, | ||
5787 | state : state, | ||
5788 | bcls : buttonClass, | ||
5789 | outer : e, | ||
5790 | inner : buttonInner, | ||
5791 | text : buttonText, | ||
5792 | icon : buttonIcon | ||
5793 | }; | ||
5794 | |||
5795 | $.data( e, 'buttonElements', buttonElements ); | ||
5796 | $.data( buttonInner, 'buttonElements', buttonElements ); | ||
5797 | $.data( buttonText, 'buttonElements', buttonElements ); | ||
5798 | if ( buttonIcon ) { | ||
5799 | $.data( buttonIcon, 'buttonElements', buttonElements ); | ||
5800 | } | ||
5801 | } | ||
5802 | |||
5803 | return this; | ||
5804 | }; | ||
5805 | |||
5806 | $.fn.buttonMarkup.defaults = { | ||
5807 | corners: true, | ||
5808 | shadow: true, | ||
5809 | iconshadow: true, | ||
5810 | wrapperEls: "span" | ||
5811 | }; | ||
5812 | |||
5813 | function closestEnabledButton( element ) { | ||
5814 | var cname; | ||
5815 | |||
5816 | while ( element ) { | ||
5817 | // Note that we check for typeof className below because the element we | ||
5818 | // handed could be in an SVG DOM where className on SVG elements is defined to | ||
5819 | // be of a different type (SVGAnimatedString). We only operate on HTML DOM | ||
5820 | // elements, so we look for plain "string". | ||
5821 | cname = ( typeof element.className === 'string' ) && ( element.className + ' ' ); | ||
5822 | if ( cname && cname.indexOf( "ui-btn " ) > -1 && cname.indexOf( "ui-disabled " ) < 0 ) { | ||
5823 | break; | ||
5824 | } | ||
5825 | |||
5826 | element = element.parentNode; | ||
5827 | } | ||
5828 | |||
5829 | return element; | ||
5830 | } | ||
5831 | |||
5832 | function updateButtonClass( $btn, classToRemove, classToAdd, hover, state ) { | ||
5833 | var buttonElements = $.data( $btn[ 0 ], "buttonElements" ); | ||
5834 | $btn.removeClass( classToRemove ).addClass( classToAdd ); | ||
5835 | if ( buttonElements ) { | ||
5836 | buttonElements.bcls = $( document.createElement( "div" ) ) | ||
5837 | .addClass( buttonElements.bcls + " " + classToAdd ) | ||
5838 | .removeClass( classToRemove ) | ||
5839 | .attr( "class" ); | ||
5840 | if ( hover !== undefined ) { | ||
5841 | buttonElements.hover = hover; | ||
5842 | } | ||
5843 | buttonElements.state = state; | ||
5844 | } | ||
5845 | } | ||
5846 | |||
5847 | var attachEvents = function() { | ||
5848 | var hoverDelay = $.mobile.buttonMarkup.hoverDelay, hov, foc; | ||
5849 | |||
5850 | $.mobile.document.bind( { | ||
5851 | "vmousedown vmousecancel vmouseup vmouseover vmouseout focus blur scrollstart": function( event ) { | ||
5852 | var theme, | ||
5853 | $btn = $( closestEnabledButton( event.target ) ), | ||
5854 | isTouchEvent = event.originalEvent && /^touch/.test( event.originalEvent.type ), | ||
5855 | evt = event.type; | ||
5856 | |||
5857 | if ( $btn.length ) { | ||
5858 | theme = $btn.attr( "data-" + $.mobile.ns + "theme" ); | ||
5859 | |||
5860 | if ( evt === "vmousedown" ) { | ||
5861 | if ( isTouchEvent ) { | ||
5862 | // Use a short delay to determine if the user is scrolling before highlighting | ||
5863 | hov = setTimeout( function() { | ||
5864 | updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-down-" + theme, undefined, "down" ); | ||
5865 | }, hoverDelay ); | ||
5866 | } else { | ||
5867 | updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-down-" + theme, undefined, "down" ); | ||
5868 | } | ||
5869 | } else if ( evt === "vmousecancel" || evt === "vmouseup" ) { | ||
5870 | updateButtonClass( $btn, "ui-btn-down-" + theme, "ui-btn-up-" + theme, undefined, "up" ); | ||
5871 | } else if ( evt === "vmouseover" || evt === "focus" ) { | ||
5872 | if ( isTouchEvent ) { | ||
5873 | // Use a short delay to determine if the user is scrolling before highlighting | ||
5874 | foc = setTimeout( function() { | ||
5875 | updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-hover-" + theme, true, "" ); | ||
5876 | }, hoverDelay ); | ||
5877 | } else { | ||
5878 | updateButtonClass( $btn, "ui-btn-up-" + theme, "ui-btn-hover-" + theme, true, "" ); | ||
5879 | } | ||
5880 | } else if ( evt === "vmouseout" || evt === "blur" || evt === "scrollstart" ) { | ||
5881 | updateButtonClass( $btn, "ui-btn-hover-" + theme + " ui-btn-down-" + theme, "ui-btn-up-" + theme, false, "up" ); | ||
5882 | if ( hov ) { | ||
5883 | clearTimeout( hov ); | ||
5884 | } | ||
5885 | if ( foc ) { | ||
5886 | clearTimeout( foc ); | ||
5887 | } | ||
5888 | } | ||
5889 | } | ||
5890 | }, | ||
5891 | "focusin focus": function( event ) { | ||
5892 | $( closestEnabledButton( event.target ) ).addClass( $.mobile.focusClass ); | ||
5893 | }, | ||
5894 | "focusout blur": function( event ) { | ||
5895 | $( closestEnabledButton( event.target ) ).removeClass( $.mobile.focusClass ); | ||
5896 | } | ||
5897 | }); | ||
5898 | |||
5899 | attachEvents = null; | ||
5900 | }; | ||
5901 | |||
5902 | //links in bars, or those with data-role become buttons | ||
5903 | //auto self-init widgets | ||
5904 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
5905 | |||
5906 | $( ":jqmData(role='button'), .ui-bar > a, .ui-header > a, .ui-footer > a, .ui-bar > :jqmData(role='controlgroup') > a", e.target ) | ||
5907 | .jqmEnhanceable() | ||
5908 | .not( "button, input, .ui-btn, :jqmData(role='none'), :jqmData(role='nojs')" ) | ||
5909 | .buttonMarkup(); | ||
5910 | }); | ||
5911 | |||
5912 | })( jQuery ); | ||
5913 | |||
5914 | |||
5915 | (function( $, undefined ) { | ||
5916 | |||
5917 | $.widget( "mobile.collapsible", $.mobile.widget, { | ||
5918 | options: { | ||
5919 | expandCueText: " click to expand contents", | ||
5920 | collapseCueText: " click to collapse contents", | ||
5921 | collapsed: true, | ||
5922 | heading: "h1,h2,h3,h4,h5,h6,legend", | ||
5923 | collapsedIcon: "plus", | ||
5924 | expandedIcon: "minus", | ||
5925 | iconpos: "left", | ||
5926 | theme: null, | ||
5927 | contentTheme: null, | ||
5928 | inset: true, | ||
5929 | corners: true, | ||
5930 | mini: false, | ||
5931 | initSelector: ":jqmData(role='collapsible')" | ||
5932 | }, | ||
5933 | _create: function() { | ||
5934 | |||
5935 | var $el = this.element, | ||
5936 | o = this.options, | ||
5937 | collapsible = $el.addClass( "ui-collapsible" ), | ||
5938 | collapsibleHeading = $el.children( o.heading ).first(), | ||
5939 | collapsibleContent = collapsible.wrapInner( "<div class='ui-collapsible-content'></div>" ).children( ".ui-collapsible-content" ), | ||
5940 | collapsibleSet = $el.closest( ":jqmData(role='collapsible-set')" ).addClass( "ui-collapsible-set" ), | ||
5941 | collapsibleClasses = ""; | ||
5942 | |||
5943 | // Replace collapsibleHeading if it's a legend | ||
5944 | if ( collapsibleHeading.is( "legend" ) ) { | ||
5945 | collapsibleHeading = $( "<div role='heading'>"+ collapsibleHeading.html() +"</div>" ).insertBefore( collapsibleHeading ); | ||
5946 | collapsibleHeading.next().remove(); | ||
5947 | } | ||
5948 | |||
5949 | // If we are in a collapsible set | ||
5950 | if ( collapsibleSet.length ) { | ||
5951 | // Inherit the theme from collapsible-set | ||
5952 | if ( !o.theme ) { | ||
5953 | o.theme = collapsibleSet.jqmData( "theme" ) || $.mobile.getInheritedTheme( collapsibleSet, "c" ); | ||
5954 | } | ||
5955 | // Inherit the content-theme from collapsible-set | ||
5956 | if ( !o.contentTheme ) { | ||
5957 | o.contentTheme = collapsibleSet.jqmData( "content-theme" ); | ||
5958 | } | ||
5959 | |||
5960 | // Get the preference for collapsed icon in the set, but override with data- attribute on the individual collapsible | ||
5961 | o.collapsedIcon = $el.jqmData( "collapsed-icon" ) || collapsibleSet.jqmData( "collapsed-icon" ) || o.collapsedIcon; | ||
5962 | |||
5963 | // Get the preference for expanded icon in the set, but override with data- attribute on the individual collapsible | ||
5964 | o.expandedIcon = $el.jqmData( "expanded-icon" ) || collapsibleSet.jqmData( "expanded-icon" ) || o.expandedIcon; | ||
5965 | |||
5966 | // Gets the preference icon position in the set, but override with data- attribute on the individual collapsible | ||
5967 | o.iconpos = $el.jqmData( "iconpos" ) || collapsibleSet.jqmData( "iconpos" ) || o.iconpos; | ||
5968 | |||
5969 | // Inherit the preference for inset from collapsible-set or set the default value to ensure equalty within a set | ||
5970 | if ( collapsibleSet.jqmData( "inset" ) !== undefined ) { | ||
5971 | o.inset = collapsibleSet.jqmData( "inset" ); | ||
5972 | } else { | ||
5973 | o.inset = true; | ||
5974 | } | ||
5975 | // Set corners for individual collapsibles to false when in a collapsible-set | ||
5976 | o.corners = false; | ||
5977 | // Gets the preference for mini in the set | ||
5978 | if ( !o.mini ) { | ||
5979 | o.mini = collapsibleSet.jqmData( "mini" ); | ||
5980 | } | ||
5981 | } else { | ||
5982 | // get inherited theme if not a set and no theme has been set | ||
5983 | if ( !o.theme ) { | ||
5984 | o.theme = $.mobile.getInheritedTheme( $el, "c" ); | ||
5985 | } | ||
5986 | } | ||
5987 | |||
5988 | if ( !!o.inset ) { | ||
5989 | collapsibleClasses += " ui-collapsible-inset"; | ||
5990 | if ( !!o.corners ) { | ||
5991 | collapsibleClasses += " ui-corner-all" ; | ||
5992 | } | ||
5993 | } | ||
5994 | if ( o.contentTheme ) { | ||
5995 | collapsibleClasses += " ui-collapsible-themed-content"; | ||
5996 | collapsibleContent.addClass( "ui-body-" + o.contentTheme ); | ||
5997 | } | ||
5998 | if ( collapsibleClasses !== "" ) { | ||
5999 | collapsible.addClass( collapsibleClasses ); | ||
6000 | } | ||
6001 | |||
6002 | collapsibleHeading | ||
6003 | //drop heading in before content | ||
6004 | .insertBefore( collapsibleContent ) | ||
6005 | //modify markup & attributes | ||
6006 | .addClass( "ui-collapsible-heading" ) | ||
6007 | .append( "<span class='ui-collapsible-heading-status'></span>" ) | ||
6008 | .wrapInner( "<a href='#' class='ui-collapsible-heading-toggle'></a>" ) | ||
6009 | .find( "a" ) | ||
6010 | .first() | ||
6011 | .buttonMarkup({ | ||
6012 | shadow: false, | ||
6013 | corners: false, | ||
6014 | iconpos: o.iconpos, | ||
6015 | icon: o.collapsedIcon, | ||
6016 | mini: o.mini, | ||
6017 | theme: o.theme | ||
6018 | }); | ||
6019 | |||
6020 | //events | ||
6021 | collapsible | ||
6022 | .bind( "expand collapse", function( event ) { | ||
6023 | if ( !event.isDefaultPrevented() ) { | ||
6024 | var $this = $( this ), | ||
6025 | isCollapse = ( event.type === "collapse" ); | ||
6026 | |||
6027 | event.preventDefault(); | ||
6028 | |||
6029 | collapsibleHeading | ||
6030 | .toggleClass( "ui-collapsible-heading-collapsed", isCollapse ) | ||
6031 | .find( ".ui-collapsible-heading-status" ) | ||
6032 | .text( isCollapse ? o.expandCueText : o.collapseCueText ) | ||
6033 | .end() | ||
6034 | .find( ".ui-icon" ) | ||
6035 | .toggleClass( "ui-icon-" + o.expandedIcon, !isCollapse ) | ||
6036 | // logic or cause same icon for expanded/collapsed state would remove the ui-icon-class | ||
6037 | .toggleClass( "ui-icon-" + o.collapsedIcon, ( isCollapse || o.expandedIcon === o.collapsedIcon ) ) | ||
6038 | .end() | ||
6039 | .find( "a" ).first().removeClass( $.mobile.activeBtnClass ); | ||
6040 | |||
6041 | $this.toggleClass( "ui-collapsible-collapsed", isCollapse ); | ||
6042 | collapsibleContent.toggleClass( "ui-collapsible-content-collapsed", isCollapse ).attr( "aria-hidden", isCollapse ); | ||
6043 | |||
6044 | collapsibleContent.trigger( "updatelayout" ); | ||
6045 | } | ||
6046 | }) | ||
6047 | .trigger( o.collapsed ? "collapse" : "expand" ); | ||
6048 | |||
6049 | collapsibleHeading | ||
6050 | .bind( "tap", function( event ) { | ||
6051 | collapsibleHeading.find( "a" ).first().addClass( $.mobile.activeBtnClass ); | ||
6052 | }) | ||
6053 | .bind( "click", function( event ) { | ||
6054 | |||
6055 | var type = collapsibleHeading.is( ".ui-collapsible-heading-collapsed" ) ? "expand" : "collapse"; | ||
6056 | |||
6057 | collapsible.trigger( type ); | ||
6058 | |||
6059 | event.preventDefault(); | ||
6060 | event.stopPropagation(); | ||
6061 | }); | ||
6062 | } | ||
6063 | }); | ||
6064 | |||
6065 | //auto self-init widgets | ||
6066 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6067 | $.mobile.collapsible.prototype.enhanceWithin( e.target ); | ||
6068 | }); | ||
6069 | |||
6070 | })( jQuery ); | ||
6071 | |||
6072 | (function( $, undefined ) { | ||
6073 | |||
6074 | $.widget( "mobile.collapsibleset", $.mobile.widget, { | ||
6075 | options: { | ||
6076 | initSelector: ":jqmData(role='collapsible-set')" | ||
6077 | }, | ||
6078 | _create: function() { | ||
6079 | var $el = this.element.addClass( "ui-collapsible-set" ), | ||
6080 | o = this.options; | ||
6081 | |||
6082 | // Inherit the theme from collapsible-set | ||
6083 | if ( !o.theme ) { | ||
6084 | o.theme = $.mobile.getInheritedTheme( $el, "c" ); | ||
6085 | } | ||
6086 | // Inherit the content-theme from collapsible-set | ||
6087 | if ( !o.contentTheme ) { | ||
6088 | o.contentTheme = $el.jqmData( "content-theme" ); | ||
6089 | } | ||
6090 | // Inherit the corner styling from collapsible-set | ||
6091 | if ( !o.corners ) { | ||
6092 | o.corners = $el.jqmData( "corners" ); | ||
6093 | } | ||
6094 | |||
6095 | if ( $el.jqmData( "inset" ) !== undefined ) { | ||
6096 | o.inset = $el.jqmData( "inset" ); | ||
6097 | } | ||
6098 | o.inset = o.inset !== undefined ? o.inset : true; | ||
6099 | o.corners = o.corners !== undefined ? o.corners : true; | ||
6100 | |||
6101 | if ( !!o.corners && !!o.inset ) { | ||
6102 | $el.addClass( "ui-corner-all" ); | ||
6103 | } | ||
6104 | |||
6105 | // Initialize the collapsible set if it's not already initialized | ||
6106 | if ( !$el.jqmData( "collapsiblebound" ) ) { | ||
6107 | $el | ||
6108 | .jqmData( "collapsiblebound", true ) | ||
6109 | .bind( "expand", function( event ) { | ||
6110 | var closestCollapsible = $( event.target ) | ||
6111 | .closest( ".ui-collapsible" ); | ||
6112 | if ( closestCollapsible.parent().is( ":jqmData(role='collapsible-set')" ) ) { | ||
6113 | closestCollapsible | ||
6114 | .siblings( ".ui-collapsible" ) | ||
6115 | .trigger( "collapse" ); | ||
6116 | } | ||
6117 | }); | ||
6118 | } | ||
6119 | }, | ||
6120 | |||
6121 | _init: function() { | ||
6122 | var $el = this.element, | ||
6123 | collapsiblesInSet = $el.children( ":jqmData(role='collapsible')" ), | ||
6124 | expanded = collapsiblesInSet.filter( ":jqmData(collapsed='false')" ); | ||
6125 | this._refresh( "true" ); | ||
6126 | |||
6127 | // Because the corners are handled by the collapsible itself and the default state is collapsed | ||
6128 | // That was causing https://github.com/jquery/jquery-mobile/issues/4116 | ||
6129 | expanded.trigger( "expand" ); | ||
6130 | }, | ||
6131 | |||
6132 | _refresh: function( create ) { | ||
6133 | var collapsiblesInSet = this.element.children( ":jqmData(role='collapsible')" ); | ||
6134 | |||
6135 | $.mobile.collapsible.prototype.enhance( collapsiblesInSet.not( ".ui-collapsible" ) ); | ||
6136 | |||
6137 | this._addFirstLastClasses( collapsiblesInSet, this._getVisibles( collapsiblesInSet, create ), create ); | ||
6138 | }, | ||
6139 | |||
6140 | refresh: function() { | ||
6141 | this._refresh( false ); | ||
6142 | } | ||
6143 | }); | ||
6144 | |||
6145 | $.widget( "mobile.collapsibleset", $.mobile.collapsibleset, $.mobile.behaviors.addFirstLastClasses ); | ||
6146 | |||
6147 | //auto self-init widgets | ||
6148 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6149 | $.mobile.collapsibleset.prototype.enhanceWithin( e.target ); | ||
6150 | }); | ||
6151 | |||
6152 | })( jQuery ); | ||
6153 | |||
6154 | (function( $, undefined ) { | ||
6155 | |||
6156 | $.widget( "mobile.navbar", $.mobile.widget, { | ||
6157 | options: { | ||
6158 | iconpos: "top", | ||
6159 | grid: null, | ||
6160 | initSelector: ":jqmData(role='navbar')" | ||
6161 | }, | ||
6162 | |||
6163 | _create: function() { | ||
6164 | |||
6165 | var $navbar = this.element, | ||
6166 | $navbtns = $navbar.find( "a" ), | ||
6167 | iconpos = $navbtns.filter( ":jqmData(icon)" ).length ? | ||
6168 | this.options.iconpos : undefined; | ||
6169 | |||
6170 | $navbar.addClass( "ui-navbar ui-mini" ) | ||
6171 | .attr( "role", "navigation" ) | ||
6172 | .find( "ul" ) | ||
6173 | .jqmEnhanceable() | ||
6174 | .grid({ grid: this.options.grid }); | ||
6175 | |||
6176 | $navbtns.buttonMarkup({ | ||
6177 | corners:false, | ||
6178 | shadow: false, | ||
6179 | inline: true, | ||
6180 | iconpos:iconpos | ||
6181 | }); | ||
6182 | |||
6183 | $navbar.delegate( "a", "vclick", function( event ) { | ||
6184 | if ( !$(event.target).hasClass( "ui-disabled" ) ) { | ||
6185 | $navbtns.removeClass( $.mobile.activeBtnClass ); | ||
6186 | $( this ).addClass( $.mobile.activeBtnClass ); | ||
6187 | // The code below is a workaround to fix #1181. We have to see why removeActiveLinkClass() doesn't take care of it. | ||
6188 | var activeNavbtn = $( this ); | ||
6189 | $( document ).one( "pagechange", function( event ) { | ||
6190 | activeNavbtn.removeClass( $.mobile.activeBtnClass ); | ||
6191 | }); | ||
6192 | } | ||
6193 | }); | ||
6194 | |||
6195 | // Buttons in the navbar with ui-state-persist class should regain their active state before page show | ||
6196 | $navbar.closest( ".ui-page" ).bind( "pagebeforeshow", function() { | ||
6197 | $navbtns.filter( ".ui-state-persist" ).addClass( $.mobile.activeBtnClass ); | ||
6198 | }); | ||
6199 | } | ||
6200 | }); | ||
6201 | |||
6202 | //auto self-init widgets | ||
6203 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6204 | $.mobile.navbar.prototype.enhanceWithin( e.target ); | ||
6205 | }); | ||
6206 | |||
6207 | })( jQuery ); | ||
6208 | |||
6209 | (function( $, undefined ) { | ||
6210 | |||
6211 | //Keeps track of the number of lists per page UID | ||
6212 | //This allows support for multiple nested list in the same page | ||
6213 | //https://github.com/jquery/jquery-mobile/issues/1617 | ||
6214 | var listCountPerPage = {}; | ||
6215 | |||
6216 | $.widget( "mobile.listview", $.mobile.widget, { | ||
6217 | |||
6218 | options: { | ||
6219 | theme: null, | ||
6220 | countTheme: "c", | ||
6221 | headerTheme: "b", | ||
6222 | dividerTheme: "b", | ||
6223 | icon: "arrow-r", | ||
6224 | splitIcon: "arrow-r", | ||
6225 | splitTheme: "b", | ||
6226 | corners: true, | ||
6227 | shadow: true, | ||
6228 | inset: false, | ||
6229 | initSelector: ":jqmData(role='listview')" | ||
6230 | }, | ||
6231 | |||
6232 | _create: function() { | ||
6233 | var t = this, | ||
6234 | listviewClasses = ""; | ||
6235 | |||
6236 | listviewClasses += t.options.inset ? " ui-listview-inset" : ""; | ||
6237 | |||
6238 | if ( !!t.options.inset ) { | ||
6239 | listviewClasses += t.options.corners ? " ui-corner-all" : ""; | ||
6240 | listviewClasses += t.options.shadow ? " ui-shadow" : ""; | ||
6241 | } | ||
6242 | |||
6243 | // create listview markup | ||
6244 | t.element.addClass(function( i, orig ) { | ||
6245 | return orig + " ui-listview" + listviewClasses; | ||
6246 | }); | ||
6247 | |||
6248 | t.refresh( true ); | ||
6249 | }, | ||
6250 | |||
6251 | // This is a generic utility method for finding the first | ||
6252 | // node with a given nodeName. It uses basic DOM traversal | ||
6253 | // to be fast and is meant to be a substitute for simple | ||
6254 | // $.fn.closest() and $.fn.children() calls on a single | ||
6255 | // element. Note that callers must pass both the lowerCase | ||
6256 | // and upperCase version of the nodeName they are looking for. | ||
6257 | // The main reason for this is that this function will be | ||
6258 | // called many times and we want to avoid having to lowercase | ||
6259 | // the nodeName from the element every time to ensure we have | ||
6260 | // a match. Note that this function lives here for now, but may | ||
6261 | // be moved into $.mobile if other components need a similar method. | ||
6262 | _findFirstElementByTagName: function( ele, nextProp, lcName, ucName ) { | ||
6263 | var dict = {}; | ||
6264 | dict[ lcName ] = dict[ ucName ] = true; | ||
6265 | while ( ele ) { | ||
6266 | if ( dict[ ele.nodeName ] ) { | ||
6267 | return ele; | ||
6268 | } | ||
6269 | ele = ele[ nextProp ]; | ||
6270 | } | ||
6271 | return null; | ||
6272 | }, | ||
6273 | _getChildrenByTagName: function( ele, lcName, ucName ) { | ||
6274 | var results = [], | ||
6275 | dict = {}; | ||
6276 | dict[ lcName ] = dict[ ucName ] = true; | ||
6277 | ele = ele.firstChild; | ||
6278 | while ( ele ) { | ||
6279 | if ( dict[ ele.nodeName ] ) { | ||
6280 | results.push( ele ); | ||
6281 | } | ||
6282 | ele = ele.nextSibling; | ||
6283 | } | ||
6284 | return $( results ); | ||
6285 | }, | ||
6286 | |||
6287 | _addThumbClasses: function( containers ) { | ||
6288 | var i, img, len = containers.length; | ||
6289 | for ( i = 0; i < len; i++ ) { | ||
6290 | img = $( this._findFirstElementByTagName( containers[ i ].firstChild, "nextSibling", "img", "IMG" ) ); | ||
6291 | if ( img.length ) { | ||
6292 | img.addClass( "ui-li-thumb" ); | ||
6293 | $( this._findFirstElementByTagName( img[ 0 ].parentNode, "parentNode", "li", "LI" ) ).addClass( img.is( ".ui-li-icon" ) ? "ui-li-has-icon" : "ui-li-has-thumb" ); | ||
6294 | } | ||
6295 | } | ||
6296 | }, | ||
6297 | |||
6298 | refresh: function( create ) { | ||
6299 | this.parentPage = this.element.closest( ".ui-page" ); | ||
6300 | this._createSubPages(); | ||
6301 | |||
6302 | var o = this.options, | ||
6303 | $list = this.element, | ||
6304 | self = this, | ||
6305 | dividertheme = $list.jqmData( "dividertheme" ) || o.dividerTheme, | ||
6306 | listsplittheme = $list.jqmData( "splittheme" ), | ||
6307 | listspliticon = $list.jqmData( "spliticon" ), | ||
6308 | listicon = $list.jqmData( "icon" ), | ||
6309 | li = this._getChildrenByTagName( $list[ 0 ], "li", "LI" ), | ||
6310 | ol = !!$.nodeName( $list[ 0 ], "ol" ), | ||
6311 | jsCount = !$.support.cssPseudoElement, | ||
6312 | start = $list.attr( "start" ), | ||
6313 | itemClassDict = {}, | ||
6314 | item, itemClass, itemTheme, | ||
6315 | a, last, splittheme, counter, startCount, newStartCount, countParent, icon, imgParents, img, linkIcon; | ||
6316 | |||
6317 | if ( ol && jsCount ) { | ||
6318 | $list.find( ".ui-li-dec" ).remove(); | ||
6319 | } | ||
6320 | |||
6321 | if ( ol ) { | ||
6322 | // Check if a start attribute has been set while taking a value of 0 into account | ||
6323 | if ( start || start === 0 ) { | ||
6324 | if ( !jsCount ) { | ||
6325 | startCount = parseInt( start , 10 ) - 1; | ||
6326 | $list.css( "counter-reset", "listnumbering " + startCount ); | ||
6327 | } else { | ||
6328 | counter = parseInt( start , 10 ); | ||
6329 | } | ||
6330 | } else if ( jsCount ) { | ||
6331 | counter = 1; | ||
6332 | } | ||
6333 | } | ||
6334 | |||
6335 | if ( !o.theme ) { | ||
6336 | o.theme = $.mobile.getInheritedTheme( this.element, "c" ); | ||
6337 | } | ||
6338 | |||
6339 | for ( var pos = 0, numli = li.length; pos < numli; pos++ ) { | ||
6340 | item = li.eq( pos ); | ||
6341 | itemClass = "ui-li"; | ||
6342 | |||
6343 | // If we're creating the element, we update it regardless | ||
6344 | if ( create || !item.hasClass( "ui-li" ) ) { | ||
6345 | itemTheme = item.jqmData( "theme" ) || o.theme; | ||
6346 | a = this._getChildrenByTagName( item[ 0 ], "a", "A" ); | ||
6347 | var isDivider = ( item.jqmData( "role" ) === "list-divider" ); | ||
6348 | |||
6349 | if ( a.length && !isDivider ) { | ||
6350 | icon = item.jqmData( "icon" ); | ||
6351 | |||
6352 | item.buttonMarkup({ | ||
6353 | wrapperEls: "div", | ||
6354 | shadow: false, | ||
6355 | corners: false, | ||
6356 | iconpos: "right", | ||
6357 | icon: a.length > 1 || icon === false ? false : icon || listicon || o.icon, | ||
6358 | theme: itemTheme | ||
6359 | }); | ||
6360 | |||
6361 | if ( ( icon !== false ) && ( a.length === 1 ) ) { | ||
6362 | item.addClass( "ui-li-has-arrow" ); | ||
6363 | } | ||
6364 | |||
6365 | a.first().removeClass( "ui-link" ).addClass( "ui-link-inherit" ); | ||
6366 | |||
6367 | if ( a.length > 1 ) { | ||
6368 | itemClass += " ui-li-has-alt"; | ||
6369 | |||
6370 | last = a.last(); | ||
6371 | splittheme = listsplittheme || last.jqmData( "theme" ) || o.splitTheme; | ||
6372 | linkIcon = last.jqmData( "icon" ); | ||
6373 | |||
6374 | last.appendTo( item ) | ||
6375 | .attr( "title", $.trim(last.getEncodedText()) ) | ||
6376 | .addClass( "ui-li-link-alt" ) | ||
6377 | .empty() | ||
6378 | .buttonMarkup({ | ||
6379 | shadow: false, | ||
6380 | corners: false, | ||
6381 | theme: itemTheme, | ||
6382 | icon: false, | ||
6383 | iconpos: "notext" | ||
6384 | }) | ||
6385 | .find( ".ui-btn-inner" ) | ||
6386 | .append( | ||
6387 | $( document.createElement( "span" ) ).buttonMarkup({ | ||
6388 | shadow: true, | ||
6389 | corners: true, | ||
6390 | theme: splittheme, | ||
6391 | iconpos: "notext", | ||
6392 | // link icon overrides list item icon overrides ul element overrides options | ||
6393 | icon: linkIcon || icon || listspliticon || o.splitIcon | ||
6394 | }) | ||
6395 | ); | ||
6396 | } | ||
6397 | } else if ( isDivider ) { | ||
6398 | |||
6399 | itemClass += " ui-li-divider ui-bar-" + ( item.jqmData( "theme" ) || dividertheme ); | ||
6400 | item.attr( "role", "heading" ); | ||
6401 | |||
6402 | if ( ol ) { | ||
6403 | //reset counter when a divider heading is encountered | ||
6404 | if ( start || start === 0 ) { | ||
6405 | if ( !jsCount ) { | ||
6406 | newStartCount = parseInt( start , 10 ) - 1; | ||
6407 | item.css( "counter-reset", "listnumbering " + newStartCount ); | ||
6408 | } else { | ||
6409 | counter = parseInt( start , 10 ); | ||
6410 | } | ||
6411 | } else if ( jsCount ) { | ||
6412 | counter = 1; | ||
6413 | } | ||
6414 | } | ||
6415 | |||
6416 | } else { | ||
6417 | itemClass += " ui-li-static ui-btn-up-" + itemTheme; | ||
6418 | } | ||
6419 | } | ||
6420 | |||
6421 | if ( ol && jsCount && itemClass.indexOf( "ui-li-divider" ) < 0 ) { | ||
6422 | countParent = itemClass.indexOf( "ui-li-static" ) > 0 ? item : item.find( ".ui-link-inherit" ); | ||
6423 | |||
6424 | countParent.addClass( "ui-li-jsnumbering" ) | ||
6425 | .prepend( "<span class='ui-li-dec'>" + ( counter++ ) + ". </span>" ); | ||
6426 | } | ||
6427 | |||
6428 | // Instead of setting item class directly on the list item and its | ||
6429 | // btn-inner at this point in time, push the item into a dictionary | ||
6430 | // that tells us what class to set on it so we can do this after this | ||
6431 | // processing loop is finished. | ||
6432 | |||
6433 | if ( !itemClassDict[ itemClass ] ) { | ||
6434 | itemClassDict[ itemClass ] = []; | ||
6435 | } | ||
6436 | |||
6437 | itemClassDict[ itemClass ].push( item[ 0 ] ); | ||
6438 | } | ||
6439 | |||
6440 | // Set the appropriate listview item classes on each list item | ||
6441 | // and their btn-inner elements. The main reason we didn't do this | ||
6442 | // in the for-loop above is because we can eliminate per-item function overhead | ||
6443 | // by calling addClass() and children() once or twice afterwards. This | ||
6444 | // can give us a significant boost on platforms like WP7.5. | ||
6445 | |||
6446 | for ( itemClass in itemClassDict ) { | ||
6447 | $( itemClassDict[ itemClass ] ).addClass( itemClass ).children( ".ui-btn-inner" ).addClass( itemClass ); | ||
6448 | } | ||
6449 | |||
6450 | $list.find( "h1, h2, h3, h4, h5, h6" ).addClass( "ui-li-heading" ) | ||
6451 | .end() | ||
6452 | |||
6453 | .find( "p, dl" ).addClass( "ui-li-desc" ) | ||
6454 | .end() | ||
6455 | |||
6456 | .find( ".ui-li-aside" ).each(function() { | ||
6457 | var $this = $( this ); | ||
6458 | $this.prependTo( $this.parent() ); //shift aside to front for css float | ||
6459 | }) | ||
6460 | .end() | ||
6461 | |||
6462 | .find( ".ui-li-count" ).each(function() { | ||
6463 | $( this ).closest( "li" ).addClass( "ui-li-has-count" ); | ||
6464 | }).addClass( "ui-btn-up-" + ( $list.jqmData( "counttheme" ) || this.options.countTheme) + " ui-btn-corner-all" ); | ||
6465 | |||
6466 | // The idea here is to look at the first image in the list item | ||
6467 | // itself, and any .ui-link-inherit element it may contain, so we | ||
6468 | // can place the appropriate classes on the image and list item. | ||
6469 | // Note that we used to use something like: | ||
6470 | // | ||
6471 | // li.find(">img:eq(0), .ui-link-inherit>img:eq(0)").each( ... ); | ||
6472 | // | ||
6473 | // But executing a find() like that on Windows Phone 7.5 took a | ||
6474 | // really long time. Walking things manually with the code below | ||
6475 | // allows the 400 listview item page to load in about 3 seconds as | ||
6476 | // opposed to 30 seconds. | ||
6477 | |||
6478 | this._addThumbClasses( li ); | ||
6479 | this._addThumbClasses( $list.find( ".ui-link-inherit" ) ); | ||
6480 | |||
6481 | this._addFirstLastClasses( li, this._getVisibles( li, create ), create ); | ||
6482 | // autodividers binds to this to redraw dividers after the listview refresh | ||
6483 | this._trigger( "afterrefresh" ); | ||
6484 | }, | ||
6485 | |||
6486 | //create a string for ID/subpage url creation | ||
6487 | _idStringEscape: function( str ) { | ||
6488 | return str.replace(/[^a-zA-Z0-9]/g, '-'); | ||
6489 | }, | ||
6490 | |||
6491 | _createSubPages: function() { | ||
6492 | var parentList = this.element, | ||
6493 | parentPage = parentList.closest( ".ui-page" ), | ||
6494 | parentUrl = parentPage.jqmData( "url" ), | ||
6495 | parentId = parentUrl || parentPage[ 0 ][ $.expando ], | ||
6496 | parentListId = parentList.attr( "id" ), | ||
6497 | o = this.options, | ||
6498 | dns = "data-" + $.mobile.ns, | ||
6499 | self = this, | ||
6500 | persistentFooterID = parentPage.find( ":jqmData(role='footer')" ).jqmData( "id" ), | ||
6501 | hasSubPages; | ||
6502 | |||
6503 | if ( typeof listCountPerPage[ parentId ] === "undefined" ) { | ||
6504 | listCountPerPage[ parentId ] = -1; | ||
6505 | } | ||
6506 | |||
6507 | parentListId = parentListId || ++listCountPerPage[ parentId ]; | ||
6508 | |||
6509 | $( parentList.find( "li>ul, li>ol" ).toArray().reverse() ).each(function( i ) { | ||
6510 | var self = this, | ||
6511 | list = $( this ), | ||
6512 | listId = list.attr( "id" ) || parentListId + "-" + i, | ||
6513 | parent = list.parent(), | ||
6514 | nodeElsFull = $( list.prevAll().toArray().reverse() ), | ||
6515 | nodeEls = nodeElsFull.length ? nodeElsFull : $( "<span>" + $.trim(parent.contents()[ 0 ].nodeValue) + "</span>" ), | ||
6516 | title = nodeEls.first().getEncodedText(),//url limits to first 30 chars of text | ||
6517 | id = ( parentUrl || "" ) + "&" + $.mobile.subPageUrlKey + "=" + listId, | ||
6518 | theme = list.jqmData( "theme" ) || o.theme, | ||
6519 | countTheme = list.jqmData( "counttheme" ) || parentList.jqmData( "counttheme" ) || o.countTheme, | ||
6520 | newPage, anchor; | ||
6521 | |||
6522 | //define hasSubPages for use in later removal | ||
6523 | hasSubPages = true; | ||
6524 | |||
6525 | newPage = list.detach() | ||
6526 | .wrap( "<div " + dns + "role='page' " + dns + "url='" + id + "' " + dns + "theme='" + theme + "' " + dns + "count-theme='" + countTheme + "'><div " + dns + "role='content'></div></div>" ) | ||
6527 | .parent() | ||
6528 | .before( "<div " + dns + "role='header' " + dns + "theme='" + o.headerTheme + "'><div class='ui-title'>" + title + "</div></div>" ) | ||
6529 | .after( persistentFooterID ? $( "<div " + dns + "role='footer' " + dns + "id='"+ persistentFooterID +"'>" ) : "" ) | ||
6530 | .parent() | ||
6531 | .appendTo( $.mobile.pageContainer ); | ||
6532 | |||
6533 | newPage.page(); | ||
6534 | |||
6535 | anchor = parent.find( 'a:first' ); | ||
6536 | |||
6537 | if ( !anchor.length ) { | ||
6538 | anchor = $( "<a/>" ).html( nodeEls || title ).prependTo( parent.empty() ); | ||
6539 | } | ||
6540 | |||
6541 | anchor.attr( "href", "#" + id ); | ||
6542 | |||
6543 | }).listview(); | ||
6544 | |||
6545 | // on pagehide, remove any nested pages along with the parent page, as long as they aren't active | ||
6546 | // and aren't embedded | ||
6547 | if ( hasSubPages && | ||
6548 | parentPage.is( ":jqmData(external-page='true')" ) && | ||
6549 | parentPage.data( "mobile-page" ).options.domCache === false ) { | ||
6550 | |||
6551 | var newRemove = function( e, ui ) { | ||
6552 | var nextPage = ui.nextPage, npURL, | ||
6553 | prEvent = new $.Event( "pageremove" ); | ||
6554 | |||
6555 | if ( ui.nextPage ) { | ||
6556 | npURL = nextPage.jqmData( "url" ); | ||
6557 | if ( npURL.indexOf( parentUrl + "&" + $.mobile.subPageUrlKey ) !== 0 ) { | ||
6558 | self.childPages().remove(); | ||
6559 | parentPage.trigger( prEvent ); | ||
6560 | if ( !prEvent.isDefaultPrevented() ) { | ||
6561 | parentPage.removeWithDependents(); | ||
6562 | } | ||
6563 | } | ||
6564 | } | ||
6565 | }; | ||
6566 | |||
6567 | // unbind the original page remove and replace with our specialized version | ||
6568 | parentPage | ||
6569 | .unbind( "pagehide.remove" ) | ||
6570 | .bind( "pagehide.remove", newRemove); | ||
6571 | } | ||
6572 | }, | ||
6573 | |||
6574 | // TODO sort out a better way to track sub pages of the listview this is brittle | ||
6575 | childPages: function() { | ||
6576 | var parentUrl = this.parentPage.jqmData( "url" ); | ||
6577 | |||
6578 | return $( ":jqmData(url^='"+ parentUrl + "&" + $.mobile.subPageUrlKey + "')" ); | ||
6579 | } | ||
6580 | }); | ||
6581 | |||
6582 | $.widget( "mobile.listview", $.mobile.listview, $.mobile.behaviors.addFirstLastClasses ); | ||
6583 | |||
6584 | //auto self-init widgets | ||
6585 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6586 | $.mobile.listview.prototype.enhanceWithin( e.target ); | ||
6587 | }); | ||
6588 | |||
6589 | })( jQuery ); | ||
6590 | |||
6591 | (function( $, undefined ) { | ||
6592 | |||
6593 | $.mobile.listview.prototype.options.autodividers = false; | ||
6594 | $.mobile.listview.prototype.options.autodividersSelector = function( elt ) { | ||
6595 | // look for the text in the given element | ||
6596 | var text = $.trim( elt.text() ) || null; | ||
6597 | |||
6598 | if ( !text ) { | ||
6599 | return null; | ||
6600 | } | ||
6601 | |||
6602 | // create the text for the divider (first uppercased letter) | ||
6603 | text = text.slice( 0, 1 ).toUpperCase(); | ||
6604 | |||
6605 | return text; | ||
6606 | }; | ||
6607 | |||
6608 | $.mobile.document.delegate( "ul,ol", "listviewcreate", function() { | ||
6609 | |||
6610 | var list = $( this ), | ||
6611 | listview = list.data( "mobile-listview" ); | ||
6612 | |||
6613 | if ( !listview || !listview.options.autodividers ) { | ||
6614 | return; | ||
6615 | } | ||
6616 | |||
6617 | var replaceDividers = function () { | ||
6618 | list.find( "li:jqmData(role='list-divider')" ).remove(); | ||
6619 | |||
6620 | var lis = list.find( 'li' ), | ||
6621 | lastDividerText = null, li, dividerText; | ||
6622 | |||
6623 | for ( var i = 0; i < lis.length ; i++ ) { | ||
6624 | li = lis[i]; | ||
6625 | dividerText = listview.options.autodividersSelector( $( li ) ); | ||
6626 | |||
6627 | if ( dividerText && lastDividerText !== dividerText ) { | ||
6628 | var divider = document.createElement( 'li' ); | ||
6629 | divider.appendChild( document.createTextNode( dividerText ) ); | ||
6630 | divider.setAttribute( 'data-' + $.mobile.ns + 'role', 'list-divider' ); | ||
6631 | li.parentNode.insertBefore( divider, li ); | ||
6632 | } | ||
6633 | |||
6634 | lastDividerText = dividerText; | ||
6635 | } | ||
6636 | }; | ||
6637 | |||
6638 | var afterListviewRefresh = function () { | ||
6639 | list.unbind( 'listviewafterrefresh', afterListviewRefresh ); | ||
6640 | replaceDividers(); | ||
6641 | listview.refresh(); | ||
6642 | list.bind( 'listviewafterrefresh', afterListviewRefresh ); | ||
6643 | }; | ||
6644 | |||
6645 | afterListviewRefresh(); | ||
6646 | }); | ||
6647 | |||
6648 | })( jQuery ); | ||
6649 | |||
6650 | /* | ||
6651 | * "checkboxradio" plugin | ||
6652 | */ | ||
6653 | |||
6654 | (function( $, undefined ) { | ||
6655 | |||
6656 | $.widget( "mobile.checkboxradio", $.mobile.widget, { | ||
6657 | options: { | ||
6658 | theme: null, | ||
6659 | mini: false, | ||
6660 | initSelector: "input[type='checkbox'],input[type='radio']" | ||
6661 | }, | ||
6662 | _create: function() { | ||
6663 | var self = this, | ||
6664 | input = this.element, | ||
6665 | o = this.options, | ||
6666 | inheritAttr = function( input, dataAttr ) { | ||
6667 | return input.jqmData( dataAttr ) || input.closest( "form, fieldset" ).jqmData( dataAttr ); | ||
6668 | }, | ||
6669 | // NOTE: Windows Phone could not find the label through a selector | ||
6670 | // filter works though. | ||
6671 | parentLabel = $( input ).closest( "label" ), | ||
6672 | label = parentLabel.length ? parentLabel : $( input ).closest( "form, fieldset, :jqmData(role='page'), :jqmData(role='dialog')" ).find( "label" ).filter( "[for='" + input[0].id + "']" ).first(), | ||
6673 | inputtype = input[0].type, | ||
6674 | mini = inheritAttr( input, "mini" ) || o.mini, | ||
6675 | checkedState = inputtype + "-on", | ||
6676 | uncheckedState = inputtype + "-off", | ||
6677 | iconpos = inheritAttr( input, "iconpos" ), | ||
6678 | checkedClass = "ui-" + checkedState, | ||
6679 | uncheckedClass = "ui-" + uncheckedState; | ||
6680 | |||
6681 | if ( inputtype !== "checkbox" && inputtype !== "radio" ) { | ||
6682 | return; | ||
6683 | } | ||
6684 | |||
6685 | // Expose for other methods | ||
6686 | $.extend( this, { | ||
6687 | label: label, | ||
6688 | inputtype: inputtype, | ||
6689 | checkedClass: checkedClass, | ||
6690 | uncheckedClass: uncheckedClass, | ||
6691 | checkedicon: checkedState, | ||
6692 | uncheckedicon: uncheckedState | ||
6693 | }); | ||
6694 | |||
6695 | // If there's no selected theme check the data attr | ||
6696 | if ( !o.theme ) { | ||
6697 | o.theme = $.mobile.getInheritedTheme( this.element, "c" ); | ||
6698 | } | ||
6699 | |||
6700 | label.buttonMarkup({ | ||
6701 | theme: o.theme, | ||
6702 | icon: uncheckedState, | ||
6703 | shadow: false, | ||
6704 | mini: mini, | ||
6705 | iconpos: iconpos | ||
6706 | }); | ||
6707 | |||
6708 | // Wrap the input + label in a div | ||
6709 | var wrapper = document.createElement('div'); | ||
6710 | wrapper.className = 'ui-' + inputtype; | ||
6711 | |||
6712 | input.add( label ).wrapAll( wrapper ); | ||
6713 | |||
6714 | label.bind({ | ||
6715 | vmouseover: function( event ) { | ||
6716 | if ( $( this ).parent().is( ".ui-disabled" ) ) { | ||
6717 | event.stopPropagation(); | ||
6718 | } | ||
6719 | }, | ||
6720 | |||
6721 | vclick: function( event ) { | ||
6722 | if ( input.is( ":disabled" ) ) { | ||
6723 | event.preventDefault(); | ||
6724 | return; | ||
6725 | } | ||
6726 | |||
6727 | self._cacheVals(); | ||
6728 | |||
6729 | input.prop( "checked", inputtype === "radio" && true || !input.prop( "checked" ) ); | ||
6730 | |||
6731 | // trigger click handler's bound directly to the input as a substitute for | ||
6732 | // how label clicks behave normally in the browsers | ||
6733 | // TODO: it would be nice to let the browser's handle the clicks and pass them | ||
6734 | // through to the associate input. we can swallow that click at the parent | ||
6735 | // wrapper element level | ||
6736 | input.triggerHandler( 'click' ); | ||
6737 | |||
6738 | // Input set for common radio buttons will contain all the radio | ||
6739 | // buttons, but will not for checkboxes. clearing the checked status | ||
6740 | // of other radios ensures the active button state is applied properly | ||
6741 | self._getInputSet().not( input ).prop( "checked", false ); | ||
6742 | |||
6743 | self._updateAll(); | ||
6744 | return false; | ||
6745 | } | ||
6746 | }); | ||
6747 | |||
6748 | input | ||
6749 | .bind({ | ||
6750 | vmousedown: function() { | ||
6751 | self._cacheVals(); | ||
6752 | }, | ||
6753 | |||
6754 | vclick: function() { | ||
6755 | var $this = $( this ); | ||
6756 | |||
6757 | // Adds checked attribute to checked input when keyboard is used | ||
6758 | if ( $this.is( ":checked" ) ) { | ||
6759 | |||
6760 | $this.prop( "checked", true); | ||
6761 | self._getInputSet().not( $this ).prop( "checked", false ); | ||
6762 | } else { | ||
6763 | |||
6764 | $this.prop( "checked", false ); | ||
6765 | } | ||
6766 | |||
6767 | self._updateAll(); | ||
6768 | }, | ||
6769 | |||
6770 | focus: function() { | ||
6771 | label.addClass( $.mobile.focusClass ); | ||
6772 | }, | ||
6773 | |||
6774 | blur: function() { | ||
6775 | label.removeClass( $.mobile.focusClass ); | ||
6776 | } | ||
6777 | }); | ||
6778 | |||
6779 | if ( this._handleFormReset ) { | ||
6780 | this._handleFormReset(); | ||
6781 | } | ||
6782 | this.refresh(); | ||
6783 | }, | ||
6784 | |||
6785 | _cacheVals: function() { | ||
6786 | this._getInputSet().each(function() { | ||
6787 | $( this ).jqmData( "cacheVal", this.checked ); | ||
6788 | }); | ||
6789 | }, | ||
6790 | |||
6791 | //returns either a set of radios with the same name attribute, or a single checkbox | ||
6792 | _getInputSet: function() { | ||
6793 | if ( this.inputtype === "checkbox" ) { | ||
6794 | return this.element; | ||
6795 | } | ||
6796 | |||
6797 | return this.element.closest( "form, :jqmData(role='page'), :jqmData(role='dialog')" ) | ||
6798 | .find( "input[name='" + this.element[0].name + "'][type='" + this.inputtype + "']" ); | ||
6799 | }, | ||
6800 | |||
6801 | _updateAll: function() { | ||
6802 | var self = this; | ||
6803 | |||
6804 | this._getInputSet().each(function() { | ||
6805 | var $this = $( this ); | ||
6806 | |||
6807 | if ( this.checked || self.inputtype === "checkbox" ) { | ||
6808 | $this.trigger( "change" ); | ||
6809 | } | ||
6810 | }) | ||
6811 | .checkboxradio( "refresh" ); | ||
6812 | }, | ||
6813 | |||
6814 | _reset: function() { | ||
6815 | this.refresh(); | ||
6816 | }, | ||
6817 | |||
6818 | refresh: function() { | ||
6819 | var input = this.element[ 0 ], | ||
6820 | active = " " + $.mobile.activeBtnClass, | ||
6821 | checkedClass = this.checkedClass + ( this.element.parents( ".ui-controlgroup-horizontal" ).length ? active : "" ), | ||
6822 | label = this.label; | ||
6823 | |||
6824 | if ( input.checked ) { | ||
6825 | label.removeClass( this.uncheckedClass + active ).addClass( checkedClass ).buttonMarkup( { icon: this.checkedicon } ); | ||
6826 | } else { | ||
6827 | label.removeClass( checkedClass ).addClass( this.uncheckedClass ).buttonMarkup( { icon: this.uncheckedicon } ); | ||
6828 | } | ||
6829 | |||
6830 | if ( input.disabled ) { | ||
6831 | this.disable(); | ||
6832 | } else { | ||
6833 | this.enable(); | ||
6834 | } | ||
6835 | }, | ||
6836 | |||
6837 | disable: function() { | ||
6838 | this.element.prop( "disabled", true ).parent().addClass( "ui-disabled" ); | ||
6839 | }, | ||
6840 | |||
6841 | enable: function() { | ||
6842 | this.element.prop( "disabled", false ).parent().removeClass( "ui-disabled" ); | ||
6843 | } | ||
6844 | }); | ||
6845 | |||
6846 | $.widget( "mobile.checkboxradio", $.mobile.checkboxradio, $.mobile.behaviors.formReset ); | ||
6847 | |||
6848 | //auto self-init widgets | ||
6849 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6850 | $.mobile.checkboxradio.prototype.enhanceWithin( e.target, true ); | ||
6851 | }); | ||
6852 | |||
6853 | })( jQuery ); | ||
6854 | |||
6855 | (function( $, undefined ) { | ||
6856 | |||
6857 | $.widget( "mobile.button", $.mobile.widget, { | ||
6858 | options: { | ||
6859 | theme: null, | ||
6860 | icon: null, | ||
6861 | iconpos: null, | ||
6862 | corners: true, | ||
6863 | shadow: true, | ||
6864 | iconshadow: true, | ||
6865 | inline: null, | ||
6866 | mini: null, | ||
6867 | initSelector: "button, [type='button'], [type='submit'], [type='reset']" | ||
6868 | }, | ||
6869 | _create: function() { | ||
6870 | var $el = this.element, | ||
6871 | $button, | ||
6872 | // create a copy of this.options we can pass to buttonMarkup | ||
6873 | o = ( function( tdo ) { | ||
6874 | var key, ret = {}; | ||
6875 | |||
6876 | for ( key in tdo ) { | ||
6877 | if ( tdo[ key ] !== null && key !== "initSelector" ) { | ||
6878 | ret[ key ] = tdo[ key ]; | ||
6879 | } | ||
6880 | } | ||
6881 | |||
6882 | return ret; | ||
6883 | } )( this.options ), | ||
6884 | classes = "", | ||
6885 | $buttonPlaceholder; | ||
6886 | |||
6887 | // if this is a link, check if it's been enhanced and, if not, use the right function | ||
6888 | if ( $el[ 0 ].tagName === "A" ) { | ||
6889 | if ( !$el.hasClass( "ui-btn" ) ) { | ||
6890 | $el.buttonMarkup(); | ||
6891 | } | ||
6892 | return; | ||
6893 | } | ||
6894 | |||
6895 | // get the inherited theme | ||
6896 | // TODO centralize for all widgets | ||
6897 | if ( !this.options.theme ) { | ||
6898 | this.options.theme = $.mobile.getInheritedTheme( this.element, "c" ); | ||
6899 | } | ||
6900 | |||
6901 | // TODO: Post 1.1--once we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577 | ||
6902 | /* if ( $el[0].className.length ) { | ||
6903 | classes = $el[0].className; | ||
6904 | } */ | ||
6905 | if ( !!~$el[0].className.indexOf( "ui-btn-left" ) ) { | ||
6906 | classes = "ui-btn-left"; | ||
6907 | } | ||
6908 | |||
6909 | if ( !!~$el[0].className.indexOf( "ui-btn-right" ) ) { | ||
6910 | classes = "ui-btn-right"; | ||
6911 | } | ||
6912 | |||
6913 | if ( $el.attr( "type" ) === "submit" || $el.attr( "type" ) === "reset" ) { | ||
6914 | classes ? classes += " ui-submit" : classes = "ui-submit"; | ||
6915 | } | ||
6916 | $( "label[for='" + $el.attr( "id" ) + "']" ).addClass( "ui-submit" ); | ||
6917 | |||
6918 | // Add ARIA role | ||
6919 | this.button = $( "<div></div>" ) | ||
6920 | [ $el.html() ? "html" : "text" ]( $el.html() || $el.val() ) | ||
6921 | .insertBefore( $el ) | ||
6922 | .buttonMarkup( o ) | ||
6923 | .addClass( classes ) | ||
6924 | .append( $el.addClass( "ui-btn-hidden" ) ); | ||
6925 | |||
6926 | $button = this.button; | ||
6927 | |||
6928 | $el.bind({ | ||
6929 | focus: function() { | ||
6930 | $button.addClass( $.mobile.focusClass ); | ||
6931 | }, | ||
6932 | |||
6933 | blur: function() { | ||
6934 | $button.removeClass( $.mobile.focusClass ); | ||
6935 | } | ||
6936 | }); | ||
6937 | |||
6938 | this.refresh(); | ||
6939 | }, | ||
6940 | |||
6941 | _setOption: function( key, value ) { | ||
6942 | var op = {}; | ||
6943 | |||
6944 | op[ key ] = value; | ||
6945 | if ( key !== "initSelector" ) { | ||
6946 | this.button.buttonMarkup( op ); | ||
6947 | // Record the option change in the options and in the DOM data-* attributes | ||
6948 | this.element.attr( "data-" + ( $.mobile.ns || "" ) + ( key.replace( /([A-Z])/, "-$1" ).toLowerCase() ), value ); | ||
6949 | } | ||
6950 | this._super( "_setOption", key, value ); | ||
6951 | }, | ||
6952 | |||
6953 | enable: function() { | ||
6954 | this.element.attr( "disabled", false ); | ||
6955 | this.button.removeClass( "ui-disabled" ).attr( "aria-disabled", false ); | ||
6956 | return this._setOption( "disabled", false ); | ||
6957 | }, | ||
6958 | |||
6959 | disable: function() { | ||
6960 | this.element.attr( "disabled", true ); | ||
6961 | this.button.addClass( "ui-disabled" ).attr( "aria-disabled", true ); | ||
6962 | return this._setOption( "disabled", true ); | ||
6963 | }, | ||
6964 | |||
6965 | refresh: function() { | ||
6966 | var $el = this.element; | ||
6967 | |||
6968 | if ( $el.prop("disabled") ) { | ||
6969 | this.disable(); | ||
6970 | } else { | ||
6971 | this.enable(); | ||
6972 | } | ||
6973 | |||
6974 | // Grab the button's text element from its implementation-independent data item | ||
6975 | $( this.button.data( 'buttonElements' ).text )[ $el.html() ? "html" : "text" ]( $el.html() || $el.val() ); | ||
6976 | } | ||
6977 | }); | ||
6978 | |||
6979 | //auto self-init widgets | ||
6980 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
6981 | $.mobile.button.prototype.enhanceWithin( e.target, true ); | ||
6982 | }); | ||
6983 | |||
6984 | })( jQuery ); | ||
6985 | |||
6986 | (function( $, undefined ) { | ||
6987 | |||
6988 | $.widget( "mobile.controlgroup", $.mobile.widget, { | ||
6989 | options: { | ||
6990 | shadow: false, | ||
6991 | corners: true, | ||
6992 | excludeInvisible: true, | ||
6993 | type: "vertical", | ||
6994 | mini: false, | ||
6995 | initSelector: ":jqmData(role='controlgroup')" | ||
6996 | }, | ||
6997 | |||
6998 | _create: function() { | ||
6999 | var $el = this.element, | ||
7000 | ui = { | ||
7001 | inner: $( "<div class='ui-controlgroup-controls'></div>" ), | ||
7002 | legend: $( "<div role='heading' class='ui-controlgroup-label'></div>" ) | ||
7003 | }, | ||
7004 | grouplegend = $el.children( "legend" ), | ||
7005 | self = this; | ||
7006 | |||
7007 | // Apply the proto | ||
7008 | $el.wrapInner( ui.inner ); | ||
7009 | if ( grouplegend.length ) { | ||
7010 | ui.legend.append( grouplegend ).insertBefore( $el.children( 0 ) ); | ||
7011 | } | ||
7012 | $el.addClass( "ui-corner-all ui-controlgroup" ); | ||
7013 | |||
7014 | $.extend( this, { | ||
7015 | _initialRefresh: true | ||
7016 | }); | ||
7017 | |||
7018 | $.each( this.options, function( key, value ) { | ||
7019 | // Cause initial options to be applied by their handler by temporarily setting the option to undefined | ||
7020 | // - the handler then sets it to the initial value | ||
7021 | self.options[ key ] = undefined; | ||
7022 | self._setOption( key, value, true ); | ||
7023 | }); | ||
7024 | }, | ||
7025 | |||
7026 | _init: function() { | ||
7027 | this.refresh(); | ||
7028 | }, | ||
7029 | |||
7030 | _setOption: function( key, value ) { | ||
7031 | var setter = "_set" + key.charAt( 0 ).toUpperCase() + key.slice( 1 ); | ||
7032 | |||
7033 | if ( this[ setter ] !== undefined ) { | ||
7034 | this[ setter ]( value ); | ||
7035 | } | ||
7036 | |||
7037 | this._super( key, value ); | ||
7038 | this.element.attr( "data-" + ( $.mobile.ns || "" ) + ( key.replace( /([A-Z])/, "-$1" ).toLowerCase() ), value ); | ||
7039 | }, | ||
7040 | |||
7041 | _setType: function( value ) { | ||
7042 | this.element | ||
7043 | .removeClass( "ui-controlgroup-horizontal ui-controlgroup-vertical" ) | ||
7044 | .addClass( "ui-controlgroup-" + value ); | ||
7045 | this.refresh(); | ||
7046 | }, | ||
7047 | |||
7048 | _setCorners: function( value ) { | ||
7049 | this.element.toggleClass( "ui-corner-all", value ); | ||
7050 | }, | ||
7051 | |||
7052 | _setShadow: function( value ) { | ||
7053 | this.element.toggleClass( "ui-shadow", value ); | ||
7054 | }, | ||
7055 | |||
7056 | _setMini: function( value ) { | ||
7057 | this.element.toggleClass( "ui-mini", value ); | ||
7058 | }, | ||
7059 | |||
7060 | container: function() { | ||
7061 | return this.element.children( ".ui-controlgroup-controls" ); | ||
7062 | }, | ||
7063 | |||
7064 | refresh: function() { | ||
7065 | var els = this.element.find( ".ui-btn" ).not( ".ui-slider-handle" ), | ||
7066 | create = this._initialRefresh; | ||
7067 | if ( $.mobile.checkboxradio ) { | ||
7068 | this.element.find( ":mobile-checkboxradio" ).checkboxradio( "refresh" ); | ||
7069 | } | ||
7070 | this._addFirstLastClasses( els, this.options.excludeInvisible ? this._getVisibles( els, create ) : els, create ); | ||
7071 | this._initialRefresh = false; | ||
7072 | } | ||
7073 | }); | ||
7074 | |||
7075 | $.widget( "mobile.controlgroup", $.mobile.controlgroup, $.mobile.behaviors.addFirstLastClasses ); | ||
7076 | |||
7077 | // TODO: Implement a mechanism to allow widgets to become enhanced in the | ||
7078 | // correct order when their correct enhancement depends on other widgets in | ||
7079 | // the page being correctly enhanced already. | ||
7080 | // | ||
7081 | // For now, we wait until dom-ready to attach the controlgroup's enhancement | ||
7082 | // hook, because by that time, all the other widgets' enhancement hooks should | ||
7083 | // already be in place, ensuring that all widgets that need to be grouped will | ||
7084 | // already have been enhanced by the time the controlgroup is created. | ||
7085 | $( function() { | ||
7086 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
7087 | $.mobile.controlgroup.prototype.enhanceWithin( e.target, true ); | ||
7088 | }); | ||
7089 | }); | ||
7090 | })(jQuery); | ||
7091 | |||
7092 | (function( $, undefined ) { | ||
7093 | |||
7094 | $( document ).bind( "pagecreate create", function( e ) { | ||
7095 | |||
7096 | //links within content areas, tests included with page | ||
7097 | $( e.target ) | ||
7098 | .find( "a" ) | ||
7099 | .jqmEnhanceable() | ||
7100 | .not( ".ui-btn, .ui-link-inherit, :jqmData(role='none'), :jqmData(role='nojs')" ) | ||
7101 | .addClass( "ui-link" ); | ||
7102 | |||
7103 | }); | ||
7104 | |||
7105 | })( jQuery ); | ||
7106 | |||
7107 | |||
7108 | (function( $, undefined ) { | ||
7109 | |||
7110 | function fitSegmentInsideSegment( winSize, segSize, offset, desired ) { | ||
7111 | var ret = desired; | ||
7112 | |||
7113 | if ( winSize < segSize ) { | ||
7114 | // Center segment if it's bigger than the window | ||
7115 | ret = offset + ( winSize - segSize ) / 2; | ||
7116 | } else { | ||
7117 | // Otherwise center it at the desired coordinate while keeping it completely inside the window | ||
7118 | ret = Math.min( Math.max( offset, desired - segSize / 2 ), offset + winSize - segSize ); | ||
7119 | } | ||
7120 | |||
7121 | return ret; | ||
7122 | } | ||
7123 | |||
7124 | function windowCoords() { | ||
7125 | var $win = $.mobile.window; | ||
7126 | |||
7127 | return { | ||
7128 | x: $win.scrollLeft(), | ||
7129 | y: $win.scrollTop(), | ||
7130 | cx: ( window.innerWidth || $win.width() ), | ||
7131 | cy: ( window.innerHeight || $win.height() ) | ||
7132 | }; | ||
7133 | } | ||
7134 | |||
7135 | $.widget( "mobile.popup", $.mobile.widget, { | ||
7136 | options: { | ||
7137 | theme: null, | ||
7138 | overlayTheme: null, | ||
7139 | shadow: true, | ||
7140 | corners: true, | ||
7141 | transition: "none", | ||
7142 | positionTo: "origin", | ||
7143 | tolerance: null, | ||
7144 | initSelector: ":jqmData(role='popup')", | ||
7145 | closeLinkSelector: "a:jqmData(rel='back')", | ||
7146 | closeLinkEvents: "click.popup", | ||
7147 | navigateEvents: "navigate.popup", | ||
7148 | closeEvents: "navigate.popup pagebeforechange.popup", | ||
7149 | dismissible: true, | ||
7150 | |||
7151 | // NOTE Windows Phone 7 has a scroll position caching issue that | ||
7152 | // requires us to disable popup history management by default | ||
7153 | // https://github.com/jquery/jquery-mobile/issues/4784 | ||
7154 | // | ||
7155 | // NOTE this option is modified in _create! | ||
7156 | history: !$.mobile.browser.oldIE | ||
7157 | }, | ||
7158 | |||
7159 | _eatEventAndClose: function( e ) { | ||
7160 | e.preventDefault(); | ||
7161 | e.stopImmediatePropagation(); | ||
7162 | if ( this.options.dismissible ) { | ||
7163 | this.close(); | ||
7164 | } | ||
7165 | return false; | ||
7166 | }, | ||
7167 | |||
7168 | // Make sure the screen size is increased beyond the page height if the popup's causes the document to increase in height | ||
7169 | _resizeScreen: function() { | ||
7170 | var popupHeight = this._ui.container.outerHeight( true ); | ||
7171 | |||
7172 | this._ui.screen.removeAttr( "style" ); | ||
7173 | if ( popupHeight > this._ui.screen.height() ) { | ||
7174 | this._ui.screen.height( popupHeight ); | ||
7175 | } | ||
7176 | }, | ||
7177 | |||
7178 | _handleWindowKeyUp: function( e ) { | ||
7179 | if ( this._isOpen && e.keyCode === $.mobile.keyCode.ESCAPE ) { | ||
7180 | return this._eatEventAndClose( e ); | ||
7181 | } | ||
7182 | }, | ||
7183 | |||
7184 | _expectResizeEvent: function() { | ||
7185 | var winCoords = windowCoords(); | ||
7186 | |||
7187 | if ( this._resizeData ) { | ||
7188 | if ( winCoords.x === this._resizeData.winCoords.x && | ||
7189 | winCoords.y === this._resizeData.winCoords.y && | ||
7190 | winCoords.cx === this._resizeData.winCoords.cx && | ||
7191 | winCoords.cy === this._resizeData.winCoords.cy ) { | ||
7192 | // timeout not refreshed | ||
7193 | return false; | ||
7194 | } else { | ||
7195 | // clear existing timeout - it will be refreshed below | ||
7196 | clearTimeout( this._resizeData.timeoutId ); | ||
7197 | } | ||
7198 | } | ||
7199 | |||
7200 | this._resizeData = { | ||
7201 | timeoutId: setTimeout( $.proxy( this, "_resizeTimeout" ), 200 ), | ||
7202 | winCoords: winCoords | ||
7203 | }; | ||
7204 | |||
7205 | return true; | ||
7206 | }, | ||
7207 | |||
7208 | _resizeTimeout: function() { | ||
7209 | if ( this._isOpen ) { | ||
7210 | if ( !this._expectResizeEvent() ) { | ||
7211 | if ( this._ui.container.hasClass( "ui-popup-hidden" ) ) { | ||
7212 | // effectively rapid-open the popup while leaving the screen intact | ||
7213 | this._ui.container.removeClass( "ui-popup-hidden" ); | ||
7214 | this.reposition( { positionTo: "window" } ); | ||
7215 | this._ignoreResizeEvents(); | ||
7216 | } | ||
7217 | |||
7218 | this._resizeScreen(); | ||
7219 | this._resizeData = null; | ||
7220 | this._orientationchangeInProgress = false; | ||
7221 | } | ||
7222 | } else { | ||
7223 | this._resizeData = null; | ||
7224 | this._orientationchangeInProgress = false; | ||
7225 | } | ||
7226 | }, | ||
7227 | |||
7228 | _ignoreResizeEvents: function() { | ||
7229 | var self = this; | ||
7230 | |||
7231 | if ( this._ignoreResizeTo ) { | ||
7232 | clearTimeout( this._ignoreResizeTo ); | ||
7233 | } | ||
7234 | this._ignoreResizeTo = setTimeout( function() { self._ignoreResizeTo = 0; }, 1000 ); | ||
7235 | }, | ||
7236 | |||
7237 | _handleWindowResize: function( e ) { | ||
7238 | if ( this._isOpen && this._ignoreResizeTo === 0 ) { | ||
7239 | if ( ( this._expectResizeEvent() || this._orientationchangeInProgress ) && | ||
7240 | !this._ui.container.hasClass( "ui-popup-hidden" ) ) { | ||
7241 | // effectively rapid-close the popup while leaving the screen intact | ||
7242 | this._ui.container | ||
7243 | .addClass( "ui-popup-hidden" ) | ||
7244 | .removeAttr( "style" ); | ||
7245 | } | ||
7246 | } | ||
7247 | }, | ||
7248 | |||
7249 | _handleWindowOrientationchange: function( e ) { | ||
7250 | if ( !this._orientationchangeInProgress && this._isOpen && this._ignoreResizeTo === 0 ) { | ||
7251 | this._expectResizeEvent(); | ||
7252 | this._orientationchangeInProgress = true; | ||
7253 | } | ||
7254 | }, | ||
7255 | |||
7256 | // When the popup is open, attempting to focus on an element that is not a | ||
7257 | // child of the popup will redirect focus to the popup | ||
7258 | _handleDocumentFocusIn: function( e ) { | ||
7259 | var tgt = e.target, $tgt, ui = this._ui; | ||
7260 | |||
7261 | if ( !this._isOpen ) { | ||
7262 | return; | ||
7263 | } | ||
7264 | |||
7265 | if ( tgt !== ui.container[ 0 ] ) { | ||
7266 | $tgt = $( e.target ); | ||
7267 | if ( 0 === $tgt.parents().filter( ui.container[ 0 ] ).length ) { | ||
7268 | $( document.activeElement ).one( "focus", function( e ) { | ||
7269 | $tgt.blur(); | ||
7270 | }); | ||
7271 | ui.focusElement.focus(); | ||
7272 | e.preventDefault(); | ||
7273 | e.stopImmediatePropagation(); | ||
7274 | return false; | ||
7275 | } else if ( ui.focusElement[ 0 ] === ui.container[ 0 ] ) { | ||
7276 | ui.focusElement = $tgt; | ||
7277 | } | ||
7278 | } else if ( ui.focusElement && ui.focusElement[ 0 ] !== ui.container[ 0 ] ) { | ||
7279 | ui.container.blur(); | ||
7280 | ui.focusElement.focus(); | ||
7281 | } | ||
7282 | |||
7283 | this._ignoreResizeEvents(); | ||
7284 | }, | ||
7285 | |||
7286 | _create: function() { | ||
7287 | var ui = { | ||
7288 | screen: $( "<div class='ui-screen-hidden ui-popup-screen'></div>" ), | ||
7289 | placeholder: $( "<div style='display: none;'><!-- placeholder --></div>" ), | ||
7290 | container: $( "<div class='ui-popup-container ui-popup-hidden'></div>" ) | ||
7291 | }, | ||
7292 | thisPage = this.element.closest( ".ui-page" ), | ||
7293 | myId = this.element.attr( "id" ), | ||
7294 | self = this; | ||
7295 | |||
7296 | // We need to adjust the history option to be false if there's no AJAX nav. | ||
7297 | // We can't do it in the option declarations because those are run before | ||
7298 | // it is determined whether there shall be AJAX nav. | ||
7299 | this.options.history = this.options.history && $.mobile.ajaxEnabled && $.mobile.hashListeningEnabled; | ||
7300 | |||
7301 | if ( thisPage.length === 0 ) { | ||
7302 | thisPage = $( "body" ); | ||
7303 | } | ||
7304 | |||
7305 | // define the container for navigation event bindings | ||
7306 | // TODO this would be nice at the the mobile widget level | ||
7307 | this.options.container = this.options.container || $.mobile.pageContainer; | ||
7308 | |||
7309 | // Apply the proto | ||
7310 | thisPage.append( ui.screen ); | ||
7311 | ui.container.insertAfter( ui.screen ); | ||
7312 | // Leave a placeholder where the element used to be | ||
7313 | ui.placeholder.insertAfter( this.element ); | ||
7314 | if ( myId ) { | ||
7315 | ui.screen.attr( "id", myId + "-screen" ); | ||
7316 | ui.container.attr( "id", myId + "-popup" ); | ||
7317 | ui.placeholder.html( "<!-- placeholder for " + myId + " -->" ); | ||
7318 | } | ||
7319 | ui.container.append( this.element ); | ||
7320 | ui.focusElement = ui.container; | ||
7321 | |||
7322 | // Add class to popup element | ||
7323 | this.element.addClass( "ui-popup" ); | ||
7324 | |||
7325 | // Define instance variables | ||
7326 | $.extend( this, { | ||
7327 | _scrollTop: 0, | ||
7328 | _page: thisPage, | ||
7329 | _ui: ui, | ||
7330 | _fallbackTransition: "", | ||
7331 | _currentTransition: false, | ||
7332 | _prereqs: null, | ||
7333 | _isOpen: false, | ||
7334 | _tolerance: null, | ||
7335 | _resizeData: null, | ||
7336 | _ignoreResizeTo: 0, | ||
7337 | _orientationchangeInProgress: false | ||
7338 | }); | ||
7339 | |||
7340 | $.each( this.options, function( key, value ) { | ||
7341 | // Cause initial options to be applied by their handler by temporarily setting the option to undefined | ||
7342 | // - the handler then sets it to the initial value | ||
7343 | self.options[ key ] = undefined; | ||
7344 | self._setOption( key, value, true ); | ||
7345 | }); | ||
7346 | |||
7347 | ui.screen.bind( "vclick", $.proxy( this, "_eatEventAndClose" ) ); | ||
7348 | |||
7349 | this._on( $.mobile.window, { | ||
7350 | orientationchange: $.proxy( this, "_handleWindowOrientationchange" ), | ||
7351 | resize: $.proxy( this, "_handleWindowResize" ), | ||
7352 | keyup: $.proxy( this, "_handleWindowKeyUp" ) | ||
7353 | }); | ||
7354 | this._on( $.mobile.document, { | ||
7355 | focusin: $.proxy( this, "_handleDocumentFocusIn" ) | ||
7356 | }); | ||
7357 | }, | ||
7358 | |||
7359 | _applyTheme: function( dst, theme, prefix ) { | ||
7360 | var classes = ( dst.attr( "class" ) || "").split( " " ), | ||
7361 | alreadyAdded = true, | ||
7362 | currentTheme = null, | ||
7363 | matches, | ||
7364 | themeStr = String( theme ); | ||
7365 | |||
7366 | while ( classes.length > 0 ) { | ||
7367 | currentTheme = classes.pop(); | ||
7368 | matches = ( new RegExp( "^ui-" + prefix + "-([a-z])$" ) ).exec( currentTheme ); | ||
7369 | if ( matches && matches.length > 1 ) { | ||
7370 | currentTheme = matches[ 1 ]; | ||
7371 | break; | ||
7372 | } else { | ||
7373 | currentTheme = null; | ||
7374 | } | ||
7375 | } | ||
7376 | |||
7377 | if ( theme !== currentTheme ) { | ||
7378 | dst.removeClass( "ui-" + prefix + "-" + currentTheme ); | ||
7379 | if ( ! ( theme === null || theme === "none" ) ) { | ||
7380 | dst.addClass( "ui-" + prefix + "-" + themeStr ); | ||
7381 | } | ||
7382 | } | ||
7383 | }, | ||
7384 | |||
7385 | _setTheme: function( value ) { | ||
7386 | this._applyTheme( this.element, value, "body" ); | ||
7387 | }, | ||
7388 | |||
7389 | _setOverlayTheme: function( value ) { | ||
7390 | this._applyTheme( this._ui.screen, value, "overlay" ); | ||
7391 | |||
7392 | if ( this._isOpen ) { | ||
7393 | this._ui.screen.addClass( "in" ); | ||
7394 | } | ||
7395 | }, | ||
7396 | |||
7397 | _setShadow: function( value ) { | ||
7398 | this.element.toggleClass( "ui-overlay-shadow", value ); | ||
7399 | }, | ||
7400 | |||
7401 | _setCorners: function( value ) { | ||
7402 | this.element.toggleClass( "ui-corner-all", value ); | ||
7403 | }, | ||
7404 | |||
7405 | _applyTransition: function( value ) { | ||
7406 | this._ui.container.removeClass( this._fallbackTransition ); | ||
7407 | if ( value && value !== "none" ) { | ||
7408 | this._fallbackTransition = $.mobile._maybeDegradeTransition( value ); | ||
7409 | if ( this._fallbackTransition === "none" ) { | ||
7410 | this._fallbackTransition = ""; | ||
7411 | } | ||
7412 | this._ui.container.addClass( this._fallbackTransition ); | ||
7413 | } | ||
7414 | }, | ||
7415 | |||
7416 | _setTransition: function( value ) { | ||
7417 | if ( !this._currentTransition ) { | ||
7418 | this._applyTransition( value ); | ||
7419 | } | ||
7420 | }, | ||
7421 | |||
7422 | _setTolerance: function( value ) { | ||
7423 | var tol = { t: 30, r: 15, b: 30, l: 15 }; | ||
7424 | |||
7425 | if ( value !== undefined ) { | ||
7426 | var ar = String( value ).split( "," ); | ||
7427 | |||
7428 | $.each( ar, function( idx, val ) { ar[ idx ] = parseInt( val, 10 ); } ); | ||
7429 | |||
7430 | switch( ar.length ) { | ||
7431 | // All values are to be the same | ||
7432 | case 1: | ||
7433 | if ( !isNaN( ar[ 0 ] ) ) { | ||
7434 | tol.t = tol.r = tol.b = tol.l = ar[ 0 ]; | ||
7435 | } | ||
7436 | break; | ||
7437 | |||
7438 | // The first value denotes top/bottom tolerance, and the second value denotes left/right tolerance | ||
7439 | case 2: | ||
7440 | if ( !isNaN( ar[ 0 ] ) ) { | ||
7441 | tol.t = tol.b = ar[ 0 ]; | ||
7442 | } | ||
7443 | if ( !isNaN( ar[ 1 ] ) ) { | ||
7444 | tol.l = tol.r = ar[ 1 ]; | ||
7445 | } | ||
7446 | break; | ||
7447 | |||
7448 | // The array contains values in the order top, right, bottom, left | ||
7449 | case 4: | ||
7450 | if ( !isNaN( ar[ 0 ] ) ) { | ||
7451 | tol.t = ar[ 0 ]; | ||
7452 | } | ||
7453 | if ( !isNaN( ar[ 1 ] ) ) { | ||
7454 | tol.r = ar[ 1 ]; | ||
7455 | } | ||
7456 | if ( !isNaN( ar[ 2 ] ) ) { | ||
7457 | tol.b = ar[ 2 ]; | ||
7458 | } | ||
7459 | if ( !isNaN( ar[ 3 ] ) ) { | ||
7460 | tol.l = ar[ 3 ]; | ||
7461 | } | ||
7462 | break; | ||
7463 | |||
7464 | default: | ||
7465 | break; | ||
7466 | } | ||
7467 | } | ||
7468 | |||
7469 | this._tolerance = tol; | ||
7470 | }, | ||
7471 | |||
7472 | _setOption: function( key, value ) { | ||
7473 | var exclusions, setter = "_set" + key.charAt( 0 ).toUpperCase() + key.slice( 1 ); | ||
7474 | |||
7475 | if ( this[ setter ] !== undefined ) { | ||
7476 | this[ setter ]( value ); | ||
7477 | } | ||
7478 | |||
7479 | // TODO REMOVE FOR 1.2.1 by moving them out to a default options object | ||
7480 | exclusions = [ | ||
7481 | "initSelector", | ||
7482 | "closeLinkSelector", | ||
7483 | "closeLinkEvents", | ||
7484 | "navigateEvents", | ||
7485 | "closeEvents", | ||
7486 | "history", | ||
7487 | "container" | ||
7488 | ]; | ||
7489 | |||
7490 | $.mobile.widget.prototype._setOption.apply( this, arguments ); | ||
7491 | if ( $.inArray( key, exclusions ) === -1 ) { | ||
7492 | // Record the option change in the options and in the DOM data-* attributes | ||
7493 | this.element.attr( "data-" + ( $.mobile.ns || "" ) + ( key.replace( /([A-Z])/, "-$1" ).toLowerCase() ), value ); | ||
7494 | } | ||
7495 | }, | ||
7496 | |||
7497 | // Try and center the overlay over the given coordinates | ||
7498 | _placementCoords: function( desired ) { | ||
7499 | // rectangle within which the popup must fit | ||
7500 | var | ||
7501 | winCoords = windowCoords(), | ||
7502 | rc = { | ||
7503 | x: this._tolerance.l, | ||
7504 | y: winCoords.y + this._tolerance.t, | ||
7505 | cx: winCoords.cx - this._tolerance.l - this._tolerance.r, | ||
7506 | cy: winCoords.cy - this._tolerance.t - this._tolerance.b | ||
7507 | }, | ||
7508 | menuSize, ret; | ||
7509 | |||
7510 | // Clamp the width of the menu before grabbing its size | ||
7511 | this._ui.container.css( "max-width", rc.cx ); | ||
7512 | menuSize = { | ||
7513 | cx: this._ui.container.outerWidth( true ), | ||
7514 | cy: this._ui.container.outerHeight( true ) | ||
7515 | }; | ||
7516 | |||
7517 | // Center the menu over the desired coordinates, while not going outside | ||
7518 | // the window tolerances. This will center wrt. the window if the popup is too large. | ||
7519 | ret = { | ||
7520 | x: fitSegmentInsideSegment( rc.cx, menuSize.cx, rc.x, desired.x ), | ||
7521 | y: fitSegmentInsideSegment( rc.cy, menuSize.cy, rc.y, desired.y ) | ||
7522 | }; | ||
7523 | |||
7524 | // Make sure the top of the menu is visible | ||
7525 | ret.y = Math.max( 0, ret.y ); | ||
7526 | |||
7527 | // If the height of the menu is smaller than the height of the document | ||
7528 | // align the bottom with the bottom of the document | ||
7529 | |||
7530 | // fix for $.mobile.document.height() bug in core 1.7.2. | ||
7531 | var docEl = document.documentElement, docBody = document.body, | ||
7532 | docHeight = Math.max( docEl.clientHeight, docBody.scrollHeight, docBody.offsetHeight, docEl.scrollHeight, docEl.offsetHeight ); | ||
7533 | |||
7534 | ret.y -= Math.min( ret.y, Math.max( 0, ret.y + menuSize.cy - docHeight ) ); | ||
7535 | |||
7536 | return { left: ret.x, top: ret.y }; | ||
7537 | }, | ||
7538 | |||
7539 | _createPrereqs: function( screenPrereq, containerPrereq, whenDone ) { | ||
7540 | var self = this, prereqs; | ||
7541 | |||
7542 | // It is important to maintain both the local variable prereqs and self._prereqs. The local variable remains in | ||
7543 | // the closure of the functions which call the callbacks passed in. The comparison between the local variable and | ||
7544 | // self._prereqs is necessary, because once a function has been passed to .animationComplete() it will be called | ||
7545 | // next time an animation completes, even if that's not the animation whose end the function was supposed to catch | ||
7546 | // (for example, if an abort happens during the opening animation, the .animationComplete handler is not called for | ||
7547 | // that animation anymore, but the handler remains attached, so it is called the next time the popup is opened | ||
7548 | // - making it stale. Comparing the local variable prereqs to the widget-level variable self._prereqs ensures that | ||
7549 | // callbacks triggered by a stale .animationComplete will be ignored. | ||
7550 | |||
7551 | prereqs = { | ||
7552 | screen: $.Deferred(), | ||
7553 | container: $.Deferred() | ||
7554 | }; | ||
7555 | |||
7556 | prereqs.screen.then( function() { | ||
7557 | if ( prereqs === self._prereqs ) { | ||
7558 | screenPrereq(); | ||
7559 | } | ||
7560 | }); | ||
7561 | |||
7562 | prereqs.container.then( function() { | ||
7563 | if ( prereqs === self._prereqs ) { | ||
7564 | containerPrereq(); | ||
7565 | } | ||
7566 | }); | ||
7567 | |||
7568 | $.when( prereqs.screen, prereqs.container ).done( function() { | ||
7569 | if ( prereqs === self._prereqs ) { | ||
7570 | self._prereqs = null; | ||
7571 | whenDone(); | ||
7572 | } | ||
7573 | }); | ||
7574 | |||
7575 | self._prereqs = prereqs; | ||
7576 | }, | ||
7577 | |||
7578 | _animate: function( args ) { | ||
7579 | // NOTE before removing the default animation of the screen | ||
7580 | // this had an animate callback that would resolve the deferred | ||
7581 | // now the deferred is resolved immediately | ||
7582 | // TODO remove the dependency on the screen deferred | ||
7583 | this._ui.screen | ||
7584 | .removeClass( args.classToRemove ) | ||
7585 | .addClass( args.screenClassToAdd ); | ||
7586 | |||
7587 | args.prereqs.screen.resolve(); | ||
7588 | |||
7589 | if ( args.transition && args.transition !== "none" ) { | ||
7590 | if ( args.applyTransition ) { | ||
7591 | this._applyTransition( args.transition ); | ||
7592 | } | ||
7593 | if ( this._fallbackTransition ) { | ||
7594 | this._ui.container | ||
7595 | .animationComplete( $.proxy( args.prereqs.container, "resolve" ) ) | ||
7596 | .addClass( args.containerClassToAdd ) | ||
7597 | .removeClass( args.classToRemove ); | ||
7598 | return; | ||
7599 | } | ||
7600 | } | ||
7601 | this._ui.container.removeClass( args.classToRemove ); | ||
7602 | args.prereqs.container.resolve(); | ||
7603 | }, | ||
7604 | |||
7605 | // The desired coordinates passed in will be returned untouched if no reference element can be identified via | ||
7606 | // desiredPosition.positionTo. Nevertheless, this function ensures that its return value always contains valid | ||
7607 | // x and y coordinates by specifying the center middle of the window if the coordinates are absent. | ||
7608 | // options: { x: coordinate, y: coordinate, positionTo: string: "origin", "window", or jQuery selector | ||
7609 | _desiredCoords: function( o ) { | ||
7610 | var dst = null, offset, winCoords = windowCoords(), x = o.x, y = o.y, pTo = o.positionTo; | ||
7611 | |||
7612 | // Establish which element will serve as the reference | ||
7613 | if ( pTo && pTo !== "origin" ) { | ||
7614 | if ( pTo === "window" ) { | ||
7615 | x = winCoords.cx / 2 + winCoords.x; | ||
7616 | y = winCoords.cy / 2 + winCoords.y; | ||
7617 | } else { | ||
7618 | try { | ||
7619 | dst = $( pTo ); | ||
7620 | } catch( e ) { | ||
7621 | dst = null; | ||
7622 | } | ||
7623 | if ( dst ) { | ||
7624 | dst.filter( ":visible" ); | ||
7625 | if ( dst.length === 0 ) { | ||
7626 | dst = null; | ||
7627 | } | ||
7628 | } | ||
7629 | } | ||
7630 | } | ||
7631 | |||
7632 | // If an element was found, center over it | ||
7633 | if ( dst ) { | ||
7634 | offset = dst.offset(); | ||
7635 | x = offset.left + dst.outerWidth() / 2; | ||
7636 | y = offset.top + dst.outerHeight() / 2; | ||
7637 | } | ||
7638 | |||
7639 | // Make sure x and y are valid numbers - center over the window | ||
7640 | if ( $.type( x ) !== "number" || isNaN( x ) ) { | ||
7641 | x = winCoords.cx / 2 + winCoords.x; | ||
7642 | } | ||
7643 | if ( $.type( y ) !== "number" || isNaN( y ) ) { | ||
7644 | y = winCoords.cy / 2 + winCoords.y; | ||
7645 | } | ||
7646 | |||
7647 | return { x: x, y: y }; | ||
7648 | }, | ||
7649 | |||
7650 | _reposition: function( o ) { | ||
7651 | // We only care about position-related parameters for repositioning | ||
7652 | o = { x: o.x, y: o.y, positionTo: o.positionTo }; | ||
7653 | this._trigger( "beforeposition", o ); | ||
7654 | this._ui.container.offset( this._placementCoords( this._desiredCoords( o ) ) ); | ||
7655 | }, | ||
7656 | |||
7657 | reposition: function( o ) { | ||
7658 | if ( this._isOpen ) { | ||
7659 | this._reposition( o ); | ||
7660 | } | ||
7661 | }, | ||
7662 | |||
7663 | _openPrereqsComplete: function() { | ||
7664 | this._ui.container.addClass( "ui-popup-active" ); | ||
7665 | this._isOpen = true; | ||
7666 | this._resizeScreen(); | ||
7667 | this._ui.container.attr( "tabindex", "0" ).focus(); | ||
7668 | this._ignoreResizeEvents(); | ||
7669 | this._trigger( "afteropen" ); | ||
7670 | }, | ||
7671 | |||
7672 | _open: function( options ) { | ||
7673 | var o = $.extend( {}, this.options, options ), | ||
7674 | // TODO move blacklist to private method | ||
7675 | androidBlacklist = ( function() { | ||
7676 | var w = window, | ||
7677 | ua = navigator.userAgent, | ||
7678 | // Rendering engine is Webkit, and capture major version | ||
7679 | wkmatch = ua.match( /AppleWebKit\/([0-9\.]+)/ ), | ||
7680 | wkversion = !!wkmatch && wkmatch[ 1 ], | ||
7681 | androidmatch = ua.match( /Android (\d+(?:\.\d+))/ ), | ||
7682 | andversion = !!androidmatch && androidmatch[ 1 ], | ||
7683 | chromematch = ua.indexOf( "Chrome" ) > -1; | ||
7684 | |||
7685 | // Platform is Android, WebKit version is greater than 534.13 ( Android 3.2.1 ) and not Chrome. | ||
7686 | if( androidmatch !== null && andversion === "4.0" && wkversion && wkversion > 534.13 && !chromematch ) { | ||
7687 | return true; | ||
7688 | } | ||
7689 | return false; | ||
7690 | }()); | ||
7691 | |||
7692 | // Count down to triggering "popupafteropen" - we have two prerequisites: | ||
7693 | // 1. The popup window animation completes (container()) | ||
7694 | // 2. The screen opacity animation completes (screen()) | ||
7695 | this._createPrereqs( | ||
7696 | $.noop, | ||
7697 | $.noop, | ||
7698 | $.proxy( this, "_openPrereqsComplete" ) ); | ||
7699 | |||
7700 | this._currentTransition = o.transition; | ||
7701 | this._applyTransition( o.transition ); | ||
7702 | |||
7703 | if ( !this.options.theme ) { | ||
7704 | this._setTheme( this._page.jqmData( "theme" ) || $.mobile.getInheritedTheme( this._page, "c" ) ); | ||
7705 | } | ||
7706 | |||
7707 | this._ui.screen.removeClass( "ui-screen-hidden" ); | ||
7708 | this._ui.container.removeClass( "ui-popup-hidden" ); | ||
7709 | |||
7710 | // Give applications a chance to modify the contents of the container before it appears | ||
7711 | this._reposition( o ); | ||
7712 | |||
7713 | if ( this.options.overlayTheme && androidBlacklist ) { | ||
7714 | /* TODO: | ||
7715 | The native browser on Android 4.0.X ("Ice Cream Sandwich") suffers from an issue where the popup overlay appears to be z-indexed | ||
7716 | above the popup itself when certain other styles exist on the same page -- namely, any element set to `position: fixed` and certain | ||
7717 | types of input. These issues are reminiscent of previously uncovered bugs in older versions of Android's native browser: | ||
7718 | https://github.com/scottjehl/Device-Bugs/issues/3 | ||
7719 | |||
7720 | This fix closes the following bugs ( I use "closes" with reluctance, and stress that this issue should be revisited as soon as possible ): | ||
7721 | |||
7722 | https://github.com/jquery/jquery-mobile/issues/4816 | ||
7723 | https://github.com/jquery/jquery-mobile/issues/4844 | ||
7724 | https://github.com/jquery/jquery-mobile/issues/4874 | ||
7725 | */ | ||
7726 | |||
7727 | // TODO sort out why this._page isn't working | ||
7728 | this.element.closest( ".ui-page" ).addClass( "ui-popup-open" ); | ||
7729 | } | ||
7730 | this._animate({ | ||
7731 | additionalCondition: true, | ||
7732 | transition: o.transition, | ||
7733 | classToRemove: "", | ||
7734 | screenClassToAdd: "in", | ||
7735 | containerClassToAdd: "in", | ||
7736 | applyTransition: false, | ||
7737 | prereqs: this._prereqs | ||
7738 | }); | ||
7739 | }, | ||
7740 | |||
7741 | _closePrereqScreen: function() { | ||
7742 | this._ui.screen | ||
7743 | .removeClass( "out" ) | ||
7744 | .addClass( "ui-screen-hidden" ); | ||
7745 | }, | ||
7746 | |||
7747 | _closePrereqContainer: function() { | ||
7748 | this._ui.container | ||
7749 | .removeClass( "reverse out" ) | ||
7750 | .addClass( "ui-popup-hidden" ) | ||
7751 | .removeAttr( "style" ); | ||
7752 | }, | ||
7753 | |||
7754 | _closePrereqsDone: function() { | ||
7755 | var opts = this.options; | ||
7756 | |||
7757 | this._ui.container.removeAttr( "tabindex" ); | ||
7758 | |||
7759 | // remove the global mutex for popups | ||
7760 | $.mobile.popup.active = undefined; | ||
7761 | |||
7762 | // alert users that the popup is closed | ||
7763 | this._trigger( "afterclose" ); | ||
7764 | }, | ||
7765 | |||
7766 | _close: function( immediate ) { | ||
7767 | this._ui.container.removeClass( "ui-popup-active" ); | ||
7768 | this._page.removeClass( "ui-popup-open" ); | ||
7769 | |||
7770 | this._isOpen = false; | ||
7771 | |||
7772 | // Count down to triggering "popupafterclose" - we have two prerequisites: | ||
7773 | // 1. The popup window reverse animation completes (container()) | ||
7774 | // 2. The screen opacity animation completes (screen()) | ||
7775 | this._createPrereqs( | ||
7776 | $.proxy( this, "_closePrereqScreen" ), | ||
7777 | $.proxy( this, "_closePrereqContainer" ), | ||
7778 | $.proxy( this, "_closePrereqsDone" ) ); | ||
7779 | |||
7780 | this._animate( { | ||
7781 | additionalCondition: this._ui.screen.hasClass( "in" ), | ||
7782 | transition: ( immediate ? "none" : ( this._currentTransition ) ), | ||
7783 | classToRemove: "in", | ||
7784 | screenClassToAdd: "out", | ||
7785 | containerClassToAdd: "reverse out", | ||
7786 | applyTransition: true, | ||
7787 | prereqs: this._prereqs | ||
7788 | }); | ||
7789 | }, | ||
7790 | |||
7791 | _unenhance: function() { | ||
7792 | // Put the element back to where the placeholder was and remove the "ui-popup" class | ||
7793 | this._setTheme( "none" ); | ||
7794 | this.element | ||
7795 | // Cannot directly insertAfter() - we need to detach() first, because | ||
7796 | // insertAfter() will do nothing if the payload div was not attached | ||
7797 | // to the DOM at the time the widget was created, and so the payload | ||
7798 | // will remain inside the container even after we call insertAfter(). | ||
7799 | // If that happens and we remove the container a few lines below, we | ||
7800 | // will cause an infinite recursion - #5244 | ||
7801 | .detach() | ||
7802 | .insertAfter( this._ui.placeholder ) | ||
7803 | .removeClass( "ui-popup ui-overlay-shadow ui-corner-all" ); | ||
7804 | this._ui.screen.remove(); | ||
7805 | this._ui.container.remove(); | ||
7806 | this._ui.placeholder.remove(); | ||
7807 | }, | ||
7808 | |||
7809 | _destroy: function() { | ||
7810 | if ( $.mobile.popup.active === this ) { | ||
7811 | this.element.one( "popupafterclose", $.proxy( this, "_unenhance" ) ); | ||
7812 | this.close(); | ||
7813 | } else { | ||
7814 | this._unenhance(); | ||
7815 | } | ||
7816 | }, | ||
7817 | |||
7818 | _closePopup: function( e, data ) { | ||
7819 | var parsedDst, toUrl, o = this.options, immediate = false; | ||
7820 | |||
7821 | // restore location on screen | ||
7822 | window.scrollTo( 0, this._scrollTop ); | ||
7823 | |||
7824 | if ( e && e.type === "pagebeforechange" && data ) { | ||
7825 | // Determine whether we need to rapid-close the popup, or whether we can | ||
7826 | // take the time to run the closing transition | ||
7827 | if ( typeof data.toPage === "string" ) { | ||
7828 | parsedDst = data.toPage; | ||
7829 | } else { | ||
7830 | parsedDst = data.toPage.jqmData( "url" ); | ||
7831 | } | ||
7832 | parsedDst = $.mobile.path.parseUrl( parsedDst ); | ||
7833 | toUrl = parsedDst.pathname + parsedDst.search + parsedDst.hash; | ||
7834 | |||
7835 | if ( this._myUrl !== $.mobile.path.makeUrlAbsolute( toUrl ) ) { | ||
7836 | // Going to a different page - close immediately | ||
7837 | immediate = true; | ||
7838 | } else { | ||
7839 | e.preventDefault(); | ||
7840 | } | ||
7841 | } | ||
7842 | |||
7843 | // remove nav bindings | ||
7844 | o.container.unbind( o.closeEvents ); | ||
7845 | // unbind click handlers added when history is disabled | ||
7846 | this.element.undelegate( o.closeLinkSelector, o.closeLinkEvents ); | ||
7847 | |||
7848 | this._close( immediate ); | ||
7849 | }, | ||
7850 | |||
7851 | // any navigation event after a popup is opened should close the popup | ||
7852 | // NOTE the pagebeforechange is bound to catch navigation events that don't | ||
7853 | // alter the url (eg, dialogs from popups) | ||
7854 | _bindContainerClose: function() { | ||
7855 | this.options.container | ||
7856 | .one( this.options.closeEvents, $.proxy( this, "_closePopup" ) ); | ||
7857 | }, | ||
7858 | |||
7859 | // TODO no clear deliniation of what should be here and | ||
7860 | // what should be in _open. Seems to be "visual" vs "history" for now | ||
7861 | open: function( options ) { | ||
7862 | var self = this, opts = this.options, url, hashkey, activePage, currentIsDialog, hasHash, urlHistory; | ||
7863 | |||
7864 | // make sure open is idempotent | ||
7865 | if( $.mobile.popup.active ) { | ||
7866 | return; | ||
7867 | } | ||
7868 | |||
7869 | // set the global popup mutex | ||
7870 | $.mobile.popup.active = this; | ||
7871 | this._scrollTop = $.mobile.window.scrollTop(); | ||
7872 | |||
7873 | // if history alteration is disabled close on navigate events | ||
7874 | // and leave the url as is | ||
7875 | if( !( opts.history ) ) { | ||
7876 | self._open( options ); | ||
7877 | self._bindContainerClose(); | ||
7878 | |||
7879 | // When histoy is disabled we have to grab the data-rel | ||
7880 | // back link clicks so we can close the popup instead of | ||
7881 | // relying on history to do it for us | ||
7882 | self.element | ||
7883 | .delegate( opts.closeLinkSelector, opts.closeLinkEvents, function( e ) { | ||
7884 | self.close(); | ||
7885 | e.preventDefault(); | ||
7886 | }); | ||
7887 | |||
7888 | return; | ||
7889 | } | ||
7890 | |||
7891 | // cache some values for min/readability | ||
7892 | urlHistory = $.mobile.urlHistory; | ||
7893 | hashkey = $.mobile.dialogHashKey; | ||
7894 | activePage = $.mobile.activePage; | ||
7895 | currentIsDialog = activePage.is( ".ui-dialog" ); | ||
7896 | this._myUrl = url = urlHistory.getActive().url; | ||
7897 | hasHash = ( url.indexOf( hashkey ) > -1 ) && !currentIsDialog && ( urlHistory.activeIndex > 0 ); | ||
7898 | |||
7899 | if ( hasHash ) { | ||
7900 | self._open( options ); | ||
7901 | self._bindContainerClose(); | ||
7902 | return; | ||
7903 | } | ||
7904 | |||
7905 | // if the current url has no dialog hash key proceed as normal | ||
7906 | // otherwise, if the page is a dialog simply tack on the hash key | ||
7907 | if ( url.indexOf( hashkey ) === -1 && !currentIsDialog ){ | ||
7908 | url = url + (url.indexOf( "#" ) > -1 ? hashkey : "#" + hashkey); | ||
7909 | } else { | ||
7910 | url = $.mobile.path.parseLocation().hash + hashkey; | ||
7911 | } | ||
7912 | |||
7913 | // Tack on an extra hashkey if this is the first page and we've just reconstructed the initial hash | ||
7914 | if ( urlHistory.activeIndex === 0 && url === urlHistory.initialDst ) { | ||
7915 | url += hashkey; | ||
7916 | } | ||
7917 | |||
7918 | // swallow the the initial navigation event, and bind for the next | ||
7919 | $(window).one( "beforenavigate", function( e ) { | ||
7920 | e.preventDefault(); | ||
7921 | self._open( options ); | ||
7922 | self._bindContainerClose(); | ||
7923 | }); | ||
7924 | |||
7925 | this.urlAltered = true; | ||
7926 | $.mobile.navigate( url, {role: "dialog"} ); | ||
7927 | }, | ||
7928 | |||
7929 | close: function() { | ||
7930 | // make sure close is idempotent | ||
7931 | if( $.mobile.popup.active !== this ) { | ||
7932 | return; | ||
7933 | } | ||
7934 | |||
7935 | this._scrollTop = $.mobile.window.scrollTop(); | ||
7936 | |||
7937 | if( this.options.history && this.urlAltered ) { | ||
7938 | $.mobile.back(); | ||
7939 | this.urlAltered = false; | ||
7940 | } else { | ||
7941 | // simulate the nav bindings having fired | ||
7942 | this._closePopup(); | ||
7943 | } | ||
7944 | } | ||
7945 | }); | ||
7946 | |||
7947 | |||
7948 | // TODO this can be moved inside the widget | ||
7949 | $.mobile.popup.handleLink = function( $link ) { | ||
7950 | var closestPage = $link.closest( ":jqmData(role='page')" ), | ||
7951 | scope = ( ( closestPage.length === 0 ) ? $( "body" ) : closestPage ), | ||
7952 | // NOTE make sure to get only the hash, ie7 (wp7) return the absolute href | ||
7953 | // in this case ruining the element selection | ||
7954 | popup = $( $.mobile.path.parseUrl($link.attr( "href" )).hash, scope[0] ), | ||
7955 | offset; | ||
7956 | |||
7957 | if ( popup.data( "mobile-popup" ) ) { | ||
7958 | offset = $link.offset(); | ||
7959 | popup.popup( "open", { | ||
7960 | x: offset.left + $link.outerWidth() / 2, | ||
7961 | y: offset.top + $link.outerHeight() / 2, | ||
7962 | transition: $link.jqmData( "transition" ), | ||
7963 | positionTo: $link.jqmData( "position-to" ) | ||
7964 | }); | ||
7965 | } | ||
7966 | |||
7967 | //remove after delay | ||
7968 | setTimeout( function() { | ||
7969 | // Check if we are in a listview | ||
7970 | var $parent = $link.parent().parent(); | ||
7971 | if ($parent.hasClass("ui-li")) { | ||
7972 | $link = $parent.parent(); | ||
7973 | } | ||
7974 | $link.removeClass( $.mobile.activeBtnClass ); | ||
7975 | }, 300 ); | ||
7976 | }; | ||
7977 | |||
7978 | // TODO move inside _create | ||
7979 | $.mobile.document.bind( "pagebeforechange", function( e, data ) { | ||
7980 | if ( data.options.role === "popup" ) { | ||
7981 | $.mobile.popup.handleLink( data.options.link ); | ||
7982 | e.preventDefault(); | ||
7983 | } | ||
7984 | }); | ||
7985 | |||
7986 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
7987 | $.mobile.popup.prototype.enhanceWithin( e.target, true ); | ||
7988 | }); | ||
7989 | |||
7990 | })( jQuery ); | ||
7991 | |||
7992 | (function( $, undefined ) { | ||
7993 | |||
7994 | $.widget( "mobile.panel", $.mobile.widget, { | ||
7995 | options: { | ||
7996 | classes: { | ||
7997 | panel: "ui-panel", | ||
7998 | panelOpen: "ui-panel-open", | ||
7999 | panelClosed: "ui-panel-closed", | ||
8000 | panelFixed: "ui-panel-fixed", | ||
8001 | panelInner: "ui-panel-inner", | ||
8002 | modal: "ui-panel-dismiss", | ||
8003 | modalOpen: "ui-panel-dismiss-open", | ||
8004 | pagePanel: "ui-page-panel", | ||
8005 | pagePanelOpen: "ui-page-panel-open", | ||
8006 | contentWrap: "ui-panel-content-wrap", | ||
8007 | contentWrapOpen: "ui-panel-content-wrap-open", | ||
8008 | contentWrapClosed: "ui-panel-content-wrap-closed", | ||
8009 | contentFixedToolbar: "ui-panel-content-fixed-toolbar", | ||
8010 | contentFixedToolbarOpen: "ui-panel-content-fixed-toolbar-open", | ||
8011 | contentFixedToolbarClosed: "ui-panel-content-fixed-toolbar-closed", | ||
8012 | animate: "ui-panel-animate" | ||
8013 | }, | ||
8014 | animate: true, | ||
8015 | theme: "c", | ||
8016 | position: "left", | ||
8017 | dismissible: true, | ||
8018 | display: "reveal", //accepts reveal, push, overlay | ||
8019 | initSelector: ":jqmData(role='panel')", | ||
8020 | swipeClose: true, | ||
8021 | positionFixed: false | ||
8022 | }, | ||
8023 | |||
8024 | _panelID: null, | ||
8025 | _closeLink: null, | ||
8026 | _page: null, | ||
8027 | _modal: null, | ||
8028 | _pannelInner: null, | ||
8029 | _wrapper: null, | ||
8030 | _fixedToolbar: null, | ||
8031 | |||
8032 | _create: function() { | ||
8033 | var self = this, | ||
8034 | $el = self.element, | ||
8035 | page = $el.closest( ":jqmData(role='page')" ), | ||
8036 | _getPageTheme = function() { | ||
8037 | var $theme = $.data( page[0], "mobilePage" ).options.theme, | ||
8038 | $pageThemeClass = "ui-body-" + $theme; | ||
8039 | return $pageThemeClass; | ||
8040 | }, | ||
8041 | _getPanelInner = function() { | ||
8042 | var $pannelInner = $el.find( "." + self.options.classes.panelInner ); | ||
8043 | if ( $pannelInner.length === 0 ) { | ||
8044 | $pannelInner = $el.children().wrapAll( '<div class="' + self.options.classes.panelInner + '" />' ).parent(); | ||
8045 | } | ||
8046 | return $pannelInner; | ||
8047 | }, | ||
8048 | _getWrapper = function() { | ||
8049 | var $wrapper = page.find( "." + self.options.classes.contentWrap ); | ||
8050 | if ( $wrapper.length === 0 ) { | ||
8051 | $wrapper = page.children( ".ui-header:not(:jqmData(position='fixed')), .ui-content:not(:jqmData(role='popup')), .ui-footer:not(:jqmData(position='fixed'))" ).wrapAll( '<div class="' + self.options.classes.contentWrap + ' ' + _getPageTheme() + '" />' ).parent(); | ||
8052 | if ( $.support.cssTransform3d && !!self.options.animate ) { | ||
8053 | $wrapper.addClass( self.options.classes.animate ); | ||
8054 | } | ||
8055 | } | ||
8056 | return $wrapper; | ||
8057 | }, | ||
8058 | _getFixedToolbar = function() { | ||
8059 | var $fixedToolbar = page.find( "." + self.options.classes.contentFixedToolbar ); | ||
8060 | if ( $fixedToolbar.length === 0 ) { | ||
8061 | $fixedToolbar = page.find( ".ui-header:jqmData(position='fixed'), .ui-footer:jqmData(position='fixed')" ).addClass( self.options.classes.contentFixedToolbar ); | ||
8062 | if ( $.support.cssTransform3d && !!self.options.animate ) { | ||
8063 | $fixedToolbar.addClass( self.options.classes.animate ); | ||
8064 | } | ||
8065 | } | ||
8066 | return $fixedToolbar; | ||
8067 | }; | ||
8068 | |||
8069 | // expose some private props to other methods | ||
8070 | $.extend( this, { | ||
8071 | _panelID: $el.attr( "id" ), | ||
8072 | _closeLink: $el.find( ":jqmData(rel='close')" ), | ||
8073 | _page: $el.closest( ":jqmData(role='page')" ), | ||
8074 | _pageTheme: _getPageTheme(), | ||
8075 | _pannelInner: _getPanelInner(), | ||
8076 | _wrapper: _getWrapper(), | ||
8077 | _fixedToolbar: _getFixedToolbar() | ||
8078 | }); | ||
8079 | |||
8080 | self._addPanelClasses(); | ||
8081 | self._wrapper.addClass( this.options.classes.contentWrapClosed ); | ||
8082 | self._fixedToolbar.addClass( this.options.classes.contentFixedToolbarClosed ); | ||
8083 | // add class to page so we can set "overflow-x: hidden;" for it to fix Android zoom issue | ||
8084 | self._page.addClass( self.options.classes.pagePanel ); | ||
8085 | |||
8086 | // if animating, add the class to do so | ||
8087 | if ( $.support.cssTransform3d && !!self.options.animate ) { | ||
8088 | this.element.addClass( self.options.classes.animate ); | ||
8089 | } | ||
8090 | |||
8091 | self._bindUpdateLayout(); | ||
8092 | self._bindCloseEvents(); | ||
8093 | self._bindLinkListeners(); | ||
8094 | self._bindPageEvents(); | ||
8095 | |||
8096 | if ( !!self.options.dismissible ) { | ||
8097 | self._createModal(); | ||
8098 | } | ||
8099 | |||
8100 | self._bindSwipeEvents(); | ||
8101 | }, | ||
8102 | |||
8103 | _createModal: function( options ) { | ||
8104 | var self = this; | ||
8105 | |||
8106 | self._modal = $( "<div class='" + self.options.classes.modal + "' data-panelid='" + self._panelID + "'></div>" ) | ||
8107 | .on( "mousedown", function() { | ||
8108 | self.close(); | ||
8109 | }) | ||
8110 | .appendTo( this._page ); | ||
8111 | }, | ||
8112 | |||
8113 | _getPosDisplayClasses: function( prefix ) { | ||
8114 | return prefix + "-position-" + this.options.position + " " + prefix + "-display-" + this.options.display; | ||
8115 | }, | ||
8116 | |||
8117 | _getPanelClasses: function() { | ||
8118 | var panelClasses = this.options.classes.panel + | ||
8119 | " " + this._getPosDisplayClasses( this.options.classes.panel ) + | ||
8120 | " " + this.options.classes.panelClosed; | ||
8121 | |||
8122 | if ( this.options.theme ) { | ||
8123 | panelClasses += " ui-body-" + this.options.theme; | ||
8124 | } | ||
8125 | if ( !!this.options.positionFixed ) { | ||
8126 | panelClasses += " " + this.options.classes.panelFixed; | ||
8127 | } | ||
8128 | return panelClasses; | ||
8129 | }, | ||
8130 | |||
8131 | _addPanelClasses: function() { | ||
8132 | this.element.addClass( this._getPanelClasses() ); | ||
8133 | }, | ||
8134 | |||
8135 | _bindCloseEvents: function() { | ||
8136 | var self = this; | ||
8137 | |||
8138 | self._closeLink.on( "click.panel" , function( e ) { | ||
8139 | e.preventDefault(); | ||
8140 | self.close(); | ||
8141 | return false; | ||
8142 | }); | ||
8143 | self.element.on( "click.panel" , "a:jqmData(ajax='false')", function( e ) { | ||
8144 | self.close(); | ||
8145 | }); | ||
8146 | }, | ||
8147 | |||
8148 | _positionPanel: function() { | ||
8149 | var self = this, | ||
8150 | pannelInnerHeight = self._pannelInner.outerHeight(), | ||
8151 | expand = pannelInnerHeight > $.mobile.getScreenHeight(); | ||
8152 | |||
8153 | if ( expand || !self.options.positionFixed ) { | ||
8154 | if ( expand ) { | ||
8155 | self._unfixPanel(); | ||
8156 | $.mobile.resetActivePageHeight( pannelInnerHeight ); | ||
8157 | } | ||
8158 | self._scrollIntoView( pannelInnerHeight ); | ||
8159 | } else { | ||
8160 | self._fixPanel(); | ||
8161 | } | ||
8162 | }, | ||
8163 | |||
8164 | _scrollIntoView: function( pannelInnerHeight ) { | ||
8165 | if ( pannelInnerHeight < $( window ).scrollTop() ) { | ||
8166 | window.scrollTo( 0, 0 ); | ||
8167 | } | ||
8168 | }, | ||
8169 | |||
8170 | _bindFixListener: function() { | ||
8171 | this._on( $( window ), { "throttledresize": "_positionPanel" }); | ||
8172 | }, | ||
8173 | |||
8174 | _unbindFixListener: function() { | ||
8175 | this._off( $( window ), "throttledresize" ); | ||
8176 | }, | ||
8177 | |||
8178 | _unfixPanel: function() { | ||
8179 | if ( !!this.options.positionFixed && $.support.fixedPosition ) { | ||
8180 | this.element.removeClass( this.options.classes.panelFixed ); | ||
8181 | } | ||
8182 | }, | ||
8183 | |||
8184 | _fixPanel: function() { | ||
8185 | if ( !!this.options.positionFixed && $.support.fixedPosition ) { | ||
8186 | this.element.addClass( this.options.classes.panelFixed ); | ||
8187 | } | ||
8188 | }, | ||
8189 | |||
8190 | _bindUpdateLayout: function() { | ||
8191 | var self = this; | ||
8192 | |||
8193 | self.element.on( "updatelayout", function( e ) { | ||
8194 | if ( self._open ) { | ||
8195 | self._positionPanel(); | ||
8196 | } | ||
8197 | }); | ||
8198 | }, | ||
8199 | |||
8200 | _bindLinkListeners: function() { | ||
8201 | var self = this; | ||
8202 | |||
8203 | self._page.on( "click.panel" , "a", function( e ) { | ||
8204 | if ( this.href.split( "#" )[ 1 ] === self._panelID && self._panelID !== undefined ) { | ||
8205 | e.preventDefault(); | ||
8206 | var $link = $( this ); | ||
8207 | if ( $link.is( ":jqmData(role='button')" ) ) { | ||
8208 | $link.addClass( $.mobile.activeBtnClass ); | ||
8209 | self.element.one( "panelopen panelclose", function() { | ||
8210 | $link.removeClass( $.mobile.activeBtnClass ); | ||
8211 | }); | ||
8212 | } | ||
8213 | self.toggle(); | ||
8214 | return false; | ||
8215 | } | ||
8216 | }); | ||
8217 | }, | ||
8218 | |||
8219 | _bindSwipeEvents: function() { | ||
8220 | var self = this, | ||
8221 | area = self._modal ? self.element.add( self._modal ) : self.element; | ||
8222 | |||
8223 | // on swipe, close the panel | ||
8224 | if( !!self.options.swipeClose ) { | ||
8225 | if ( self.options.position === "left" ) { | ||
8226 | area.on( "swipeleft.panel", function( e ) { | ||
8227 | self.close(); | ||
8228 | }); | ||
8229 | } else { | ||
8230 | area.on( "swiperight.panel", function( e ) { | ||
8231 | self.close(); | ||
8232 | }); | ||
8233 | } | ||
8234 | } | ||
8235 | }, | ||
8236 | |||
8237 | _bindPageEvents: function() { | ||
8238 | var self = this; | ||
8239 | |||
8240 | self._page | ||
8241 | // Close the panel if another panel on the page opens | ||
8242 | .on( "panelbeforeopen", function( e ) { | ||
8243 | if ( self._open && e.target !== self.element[ 0 ] ) { | ||
8244 | self.close(); | ||
8245 | } | ||
8246 | }) | ||
8247 | // clean up open panels after page hide | ||
8248 | .on( "pagehide", function( e ) { | ||
8249 | if ( self._open ) { | ||
8250 | self.close( true ); | ||
8251 | } | ||
8252 | }) | ||
8253 | // on escape, close? might need to have a target check too... | ||
8254 | .on( "keyup.panel", function( e ) { | ||
8255 | if ( e.keyCode === 27 && self._open ) { | ||
8256 | self.close(); | ||
8257 | } | ||
8258 | }); | ||
8259 | }, | ||
8260 | |||
8261 | // state storage of open or closed | ||
8262 | _open: false, | ||
8263 | |||
8264 | _contentWrapOpenClasses: null, | ||
8265 | _fixedToolbarOpenClasses: null, | ||
8266 | _modalOpenClasses: null, | ||
8267 | |||
8268 | open: function( immediate ) { | ||
8269 | if ( !this._open ) { | ||
8270 | var self = this, | ||
8271 | o = self.options, | ||
8272 | _openPanel = function() { | ||
8273 | self._page.off( "panelclose" ); | ||
8274 | self._page.jqmData( "panel", "open" ); | ||
8275 | |||
8276 | if ( !immediate && $.support.cssTransform3d && !!o.animate ) { | ||
8277 | self.element.add( self._wrapper ).on( self._transitionEndEvents, complete ); | ||
8278 | } else { | ||
8279 | setTimeout( complete, 0 ); | ||
8280 | } | ||
8281 | |||
8282 | if ( self.options.theme && self.options.display !== "overlay" ) { | ||
8283 | self._page | ||
8284 | .removeClass( self._pageTheme ) | ||
8285 | .addClass( "ui-body-" + self.options.theme ); | ||
8286 | } | ||
8287 | |||
8288 | self.element.removeClass( o.classes.panelClosed ).addClass( o.classes.panelOpen ); | ||
8289 | |||
8290 | self._contentWrapOpenClasses = self._getPosDisplayClasses( o.classes.contentWrap ); | ||
8291 | self._wrapper | ||
8292 | .removeClass( o.classes.contentWrapClosed ) | ||
8293 | .addClass( self._contentWrapOpenClasses + " " + o.classes.contentWrapOpen ); | ||
8294 | |||
8295 | self._fixedToolbarOpenClasses = self._getPosDisplayClasses( o.classes.contentFixedToolbar ); | ||
8296 | self._fixedToolbar | ||
8297 | .removeClass( o.classes.contentFixedToolbarClosed ) | ||
8298 | .addClass( self._fixedToolbarOpenClasses + " " + o.classes.contentFixedToolbarOpen ); | ||
8299 | |||
8300 | self._modalOpenClasses = self._getPosDisplayClasses( o.classes.modal ) + " " + o.classes.modalOpen; | ||
8301 | if ( self._modal ) { | ||
8302 | self._modal.addClass( self._modalOpenClasses ); | ||
8303 | } | ||
8304 | }, | ||
8305 | complete = function() { | ||
8306 | self.element.add( self._wrapper ).off( self._transitionEndEvents, complete ); | ||
8307 | |||
8308 | self._page.addClass( o.classes.pagePanelOpen ); | ||
8309 | |||
8310 | self._positionPanel(); | ||
8311 | self._bindFixListener(); | ||
8312 | |||
8313 | self._trigger( "open" ); | ||
8314 | }; | ||
8315 | |||
8316 | if ( this.element.closest( ".ui-page-active" ).length < 0 ) { | ||
8317 | immediate = true; | ||
8318 | } | ||
8319 | |||
8320 | self._trigger( "beforeopen" ); | ||
8321 | |||
8322 | if ( self._page.jqmData('panel') === "open" ) { | ||
8323 | self._page.on( "panelclose", function() { | ||
8324 | _openPanel(); | ||
8325 | }); | ||
8326 | } else { | ||
8327 | _openPanel(); | ||
8328 | } | ||
8329 | |||
8330 | self._open = true; | ||
8331 | } | ||
8332 | }, | ||
8333 | |||
8334 | close: function( immediate ) { | ||
8335 | if ( this._open ) { | ||
8336 | var o = this.options, | ||
8337 | self = this, | ||
8338 | _closePanel = function() { | ||
8339 | if ( !immediate && $.support.cssTransform3d && !!o.animate ) { | ||
8340 | self.element.add( self._wrapper ).on( self._transitionEndEvents, complete ); | ||
8341 | } else { | ||
8342 | setTimeout( complete, 0 ); | ||
8343 | } | ||
8344 | |||
8345 | self._page.removeClass( o.classes.pagePanelOpen ); | ||
8346 | self.element.removeClass( o.classes.panelOpen ); | ||
8347 | self._wrapper.removeClass( o.classes.contentWrapOpen ); | ||
8348 | self._fixedToolbar.removeClass( o.classes.contentFixedToolbarOpen ); | ||
8349 | |||
8350 | if ( self._modal ) { | ||
8351 | self._modal.removeClass( self._modalOpenClasses ); | ||
8352 | } | ||
8353 | }, | ||
8354 | complete = function() { | ||
8355 | if ( self.options.theme && self.options.display !== "overlay" ) { | ||
8356 | self._page.removeClass( "ui-body-" + self.options.theme ).addClass( self._pageTheme ); | ||
8357 | } | ||
8358 | self.element.add( self._wrapper ).off( self._transitionEndEvents, complete ); | ||
8359 | self.element.addClass( o.classes.panelClosed ); | ||
8360 | |||
8361 | self._wrapper | ||
8362 | .removeClass( self._contentWrapOpenClasses ) | ||
8363 | .addClass( o.classes.contentWrapClosed ); | ||
8364 | |||
8365 | self._fixedToolbar | ||
8366 | .removeClass( self._fixedToolbarOpenClasses ) | ||
8367 | .addClass( o.classes.contentFixedToolbarClosed ); | ||
8368 | |||
8369 | self._fixPanel(); | ||
8370 | self._unbindFixListener(); | ||
8371 | $.mobile.resetActivePageHeight(); | ||
8372 | |||
8373 | self._page.jqmRemoveData( "panel" ); | ||
8374 | self._trigger( "close" ); | ||
8375 | }; | ||
8376 | |||
8377 | if ( this.element.closest( ".ui-page-active" ).length < 0 ) { | ||
8378 | immediate = true; | ||
8379 | } | ||
8380 | self._trigger( "beforeclose" ); | ||
8381 | |||
8382 | _closePanel(); | ||
8383 | |||
8384 | self._open = false; | ||
8385 | } | ||
8386 | }, | ||
8387 | |||
8388 | toggle: function( options ) { | ||
8389 | this[ this._open ? "close" : "open" ](); | ||
8390 | }, | ||
8391 | |||
8392 | _transitionEndEvents: "webkitTransitionEnd oTransitionEnd otransitionend transitionend msTransitionEnd", | ||
8393 | |||
8394 | _destroy: function() { | ||
8395 | var classes = this.options.classes, | ||
8396 | theme = this.options.theme, | ||
8397 | hasOtherSiblingPanels = this.element.siblings( "." + classes.panel ).length; | ||
8398 | |||
8399 | // create | ||
8400 | if ( !hasOtherSiblingPanels ) { | ||
8401 | this._wrapper.children().unwrap(); | ||
8402 | this._page.find( "a" ).unbind( "panelopen panelclose" ); | ||
8403 | this._page.removeClass( classes.pagePanel ); | ||
8404 | if ( this._open ) { | ||
8405 | this._page.jqmRemoveData( "panel" ); | ||
8406 | this._page.removeClass( classes.pagePanelOpen ); | ||
8407 | if ( theme ) { | ||
8408 | this._page.removeClass( "ui-body-" + theme ).addClass( this._pageTheme ); | ||
8409 | } | ||
8410 | $.mobile.resetActivePageHeight(); | ||
8411 | } | ||
8412 | } else if ( this._open ) { | ||
8413 | this._wrapper.removeClass( classes.contentWrapOpen ); | ||
8414 | this._fixedToolbar.removeClass( classes.contentFixedToolbarOpen ); | ||
8415 | this._page.jqmRemoveData( "panel" ); | ||
8416 | this._page.removeClass( classes.pagePanelOpen ); | ||
8417 | if ( theme ) { | ||
8418 | this._page.removeClass( "ui-body-" + theme ).addClass( this._pageTheme ); | ||
8419 | } | ||
8420 | } | ||
8421 | |||
8422 | this._pannelInner.children().unwrap(); | ||
8423 | |||
8424 | this.element.removeClass( [ this._getPanelClasses(), classes.panelAnimate ].join( " " ) ) | ||
8425 | .off( "swipeleft.panel swiperight.panel" ) | ||
8426 | .off( "panelbeforeopen" ) | ||
8427 | .off( "panelhide" ) | ||
8428 | .off( "keyup.panel" ) | ||
8429 | .off( "updatelayout" ); | ||
8430 | |||
8431 | this._closeLink.off( "click.panel" ); | ||
8432 | |||
8433 | if ( this._modal ) { | ||
8434 | this._modal.remove(); | ||
8435 | } | ||
8436 | |||
8437 | // open and close | ||
8438 | this.element.off( this._transitionEndEvents ) | ||
8439 | .removeClass( [ classes.panelUnfixed, classes.panelClosed, classes.panelOpen ].join( " " ) ); | ||
8440 | } | ||
8441 | }); | ||
8442 | |||
8443 | //auto self-init widgets | ||
8444 | $( document ).bind( "pagecreate create", function( e ) { | ||
8445 | $.mobile.panel.prototype.enhanceWithin( e.target ); | ||
8446 | }); | ||
8447 | |||
8448 | })( jQuery ); | ||
8449 | |||
8450 | (function( $, undefined ) { | ||
8451 | |||
8452 | $.widget( "mobile.table", $.mobile.widget, { | ||
8453 | |||
8454 | options: { | ||
8455 | classes: { | ||
8456 | table: "ui-table" | ||
8457 | }, | ||
8458 | initSelector: ":jqmData(role='table')" | ||
8459 | }, | ||
8460 | |||
8461 | _create: function() { | ||
8462 | |||
8463 | var self = this, | ||
8464 | trs = this.element.find( "thead tr" ); | ||
8465 | |||
8466 | this.element.addClass( this.options.classes.table ); | ||
8467 | |||
8468 | // Expose headers and allHeaders properties on the widget | ||
8469 | // headers references the THs within the first TR in the table | ||
8470 | self.headers = this.element.find( "tr:eq(0)" ).children(); | ||
8471 | |||
8472 | // allHeaders references headers, plus all THs in the thead, which may include several rows, or not | ||
8473 | self.allHeaders = self.headers.add( trs.children() ); | ||
8474 | |||
8475 | trs.each(function(){ | ||
8476 | |||
8477 | var coltally = 0; | ||
8478 | |||
8479 | $( this ).children().each(function( i ){ | ||
8480 | |||
8481 | var span = parseInt( $( this ).attr( "colspan" ), 10 ), | ||
8482 | sel = ":nth-child(" + ( coltally + 1 ) + ")"; | ||
8483 | |||
8484 | $( this ) | ||
8485 | .jqmData( "colstart", coltally + 1 ); | ||
8486 | |||
8487 | if( span ){ | ||
8488 | for( var j = 0; j < span - 1; j++ ){ | ||
8489 | coltally++; | ||
8490 | sel += ", :nth-child(" + ( coltally + 1 ) + ")"; | ||
8491 | } | ||
8492 | } | ||
8493 | |||
8494 | // Store "cells" data on header as a reference to all cells in the same column as this TH | ||
8495 | $( this ) | ||
8496 | .jqmData( "cells", self.element.find( "tr" ).not( trs.eq(0) ).not( this ).children( sel ) ); | ||
8497 | |||
8498 | coltally++; | ||
8499 | |||
8500 | }); | ||
8501 | |||
8502 | }); | ||
8503 | |||
8504 | } | ||
8505 | |||
8506 | }); | ||
8507 | |||
8508 | //auto self-init widgets | ||
8509 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
8510 | $.mobile.table.prototype.enhanceWithin( e.target ); | ||
8511 | }); | ||
8512 | |||
8513 | })( jQuery ); | ||
8514 | |||
8515 | |||
8516 | (function( $, undefined ) { | ||
8517 | |||
8518 | $.mobile.table.prototype.options.mode = "columntoggle"; | ||
8519 | |||
8520 | $.mobile.table.prototype.options.columnBtnTheme = null; | ||
8521 | |||
8522 | $.mobile.table.prototype.options.columnPopupTheme = null; | ||
8523 | |||
8524 | $.mobile.table.prototype.options.columnBtnText = "Columns..."; | ||
8525 | |||
8526 | $.mobile.table.prototype.options.classes = $.extend( | ||
8527 | $.mobile.table.prototype.options.classes, | ||
8528 | { | ||
8529 | popup: "ui-table-columntoggle-popup", | ||
8530 | columnBtn: "ui-table-columntoggle-btn", | ||
8531 | priorityPrefix: "ui-table-priority-", | ||
8532 | columnToggleTable: "ui-table-columntoggle" | ||
8533 | } | ||
8534 | ); | ||
8535 | |||
8536 | $.mobile.document.delegate( ":jqmData(role='table')", "tablecreate", function() { | ||
8537 | |||
8538 | var $table = $( this ), | ||
8539 | self = $table.data( "mobile-table" ), | ||
8540 | o = self.options, | ||
8541 | ns = $.mobile.ns; | ||
8542 | |||
8543 | if( o.mode !== "columntoggle" ){ | ||
8544 | return; | ||
8545 | } | ||
8546 | |||
8547 | self.element.addClass( o.classes.columnToggleTable ); | ||
8548 | |||
8549 | var id = ( $table.attr( "id" ) || o.classes.popup ) + "-popup", //TODO BETTER FALLBACK ID HERE | ||
8550 | $menuButton = $( "<a href='#" + id + "' class='" + o.classes.columnBtn + "' data-" + ns + "rel='popup' data-" + ns + "mini='true'>" + o.columnBtnText + "</a>" ), | ||
8551 | $popup = $( "<div data-" + ns + "role='popup' data-" + ns + "role='fieldcontain' class='" + o.classes.popup + "' id='" + id + "'></div>"), | ||
8552 | $menu = $("<fieldset data-" + ns + "role='controlgroup'></fieldset>"); | ||
8553 | |||
8554 | // create the hide/show toggles | ||
8555 | self.headers.not( "td" ).each(function(){ | ||
8556 | |||
8557 | var priority = $( this ).jqmData( "priority" ), | ||
8558 | $cells = $( this ).add( $( this ).jqmData( "cells" ) ); | ||
8559 | |||
8560 | if( priority ){ | ||
8561 | |||
8562 | $cells.addClass( o.classes.priorityPrefix + priority ); | ||
8563 | |||
8564 | $("<label><input type='checkbox' checked />" + $( this ).text() + "</label>" ) | ||
8565 | .appendTo( $menu ) | ||
8566 | .children( 0 ) | ||
8567 | .jqmData( "cells", $cells ) | ||
8568 | .checkboxradio({ | ||
8569 | theme: o.columnPopupTheme | ||
8570 | }); | ||
8571 | } | ||
8572 | }); | ||
8573 | $menu.appendTo( $popup ); | ||
8574 | |||
8575 | // bind change event listeners to inputs - TODO: move to a private method? | ||
8576 | $menu.on( "change", "input", function( e ){ | ||
8577 | if( this.checked ){ | ||
8578 | $( this ).jqmData( "cells" ).removeClass( "ui-table-cell-hidden" ).addClass( "ui-table-cell-visible" ); | ||
8579 | } | ||
8580 | else { | ||
8581 | $( this ).jqmData( "cells" ).removeClass( "ui-table-cell-visible" ).addClass( "ui-table-cell-hidden" ); | ||
8582 | } | ||
8583 | }); | ||
8584 | |||
8585 | $menuButton | ||
8586 | .insertBefore( $table ) | ||
8587 | .buttonMarkup({ | ||
8588 | theme: o.columnBtnTheme | ||
8589 | }); | ||
8590 | |||
8591 | $popup | ||
8592 | .insertBefore( $table ) | ||
8593 | .popup(); | ||
8594 | |||
8595 | // refresh method | ||
8596 | self.refresh = function(){ | ||
8597 | $menu.find( "input" ).each( function(){ | ||
8598 | this.checked = $( this ).jqmData( "cells" ).eq(0).css( "display" ) === "table-cell"; | ||
8599 | $( this ).checkboxradio( "refresh" ); | ||
8600 | }); | ||
8601 | }; | ||
8602 | |||
8603 | $.mobile.window.on( "throttledresize", self.refresh ); | ||
8604 | |||
8605 | self.refresh(); | ||
8606 | |||
8607 | }); | ||
8608 | |||
8609 | })( jQuery ); | ||
8610 | |||
8611 | (function( $, undefined ) { | ||
8612 | |||
8613 | $.mobile.table.prototype.options.mode = "reflow"; | ||
8614 | |||
8615 | $.mobile.table.prototype.options.classes = $.extend( | ||
8616 | $.mobile.table.prototype.options.classes, | ||
8617 | { | ||
8618 | reflowTable: "ui-table-reflow", | ||
8619 | cellLabels: "ui-table-cell-label" | ||
8620 | } | ||
8621 | ); | ||
8622 | |||
8623 | $.mobile.document.delegate( ":jqmData(role='table')", "tablecreate", function() { | ||
8624 | |||
8625 | var $table = $( this ), | ||
8626 | self = $table.data( "mobile-table" ), | ||
8627 | o = self.options; | ||
8628 | |||
8629 | // If it's not reflow mode, return here. | ||
8630 | if( o.mode !== "reflow" ){ | ||
8631 | return; | ||
8632 | } | ||
8633 | |||
8634 | self.element.addClass( o.classes.reflowTable ); | ||
8635 | |||
8636 | // get headers in reverse order so that top-level headers are appended last | ||
8637 | var reverseHeaders = $( self.allHeaders.get().reverse() ); | ||
8638 | |||
8639 | // create the hide/show toggles | ||
8640 | reverseHeaders.each(function(i){ | ||
8641 | var $cells = $( this ).jqmData( "cells" ), | ||
8642 | colstart = $( this ).jqmData( "colstart" ), | ||
8643 | hierarchyClass = $cells.not( this ).filter( "thead th" ).length && " ui-table-cell-label-top", | ||
8644 | text = $(this).text(); | ||
8645 | |||
8646 | if( text !== "" ){ | ||
8647 | |||
8648 | if( hierarchyClass ){ | ||
8649 | var iteration = parseInt( $( this ).attr( "colspan" ), 10 ), | ||
8650 | filter = ""; | ||
8651 | |||
8652 | if( iteration ){ | ||
8653 | filter = "td:nth-child("+ iteration +"n + " + ( colstart ) +")"; | ||
8654 | } | ||
8655 | $cells.filter( filter ).prepend( "<b class='" + o.classes.cellLabels + hierarchyClass + "'>" + text + "</b>" ); | ||
8656 | } | ||
8657 | else { | ||
8658 | $cells.prepend( "<b class='" + o.classes.cellLabels + "'>" + text + "</b>" ); | ||
8659 | } | ||
8660 | |||
8661 | } | ||
8662 | }); | ||
8663 | |||
8664 | }); | ||
8665 | |||
8666 | })( jQuery ); | ||
8667 | |||
8668 | (function( $ ) { | ||
8669 | varmeta = $( "meta[name=viewport]" ), | ||
8670 | initialContent = meta.attr( "content" ), | ||
8671 | disabledZoom = initialContent + ",maximum-scale=1, user-scalable=no", | ||
8672 | enabledZoom = initialContent + ",maximum-scale=10, user-scalable=yes", | ||
8673 | disabledInitially = /(user-scalable[\s]*=[\s]*no)|(maximum-scale[\s]*=[\s]*1)[$,\s]/.test( initialContent ); | ||
8674 | |||
8675 | $.mobile.zoom = $.extend( {}, { | ||
8676 | enabled: !disabledInitially, | ||
8677 | locked: false, | ||
8678 | disable: function( lock ) { | ||
8679 | if ( !disabledInitially && !$.mobile.zoom.locked ) { | ||
8680 | meta.attr( "content", disabledZoom ); | ||
8681 | $.mobile.zoom.enabled = false; | ||
8682 | $.mobile.zoom.locked = lock || false; | ||
8683 | } | ||
8684 | }, | ||
8685 | enable: function( unlock ) { | ||
8686 | if ( !disabledInitially && ( !$.mobile.zoom.locked || unlock === true ) ) { | ||
8687 | meta.attr( "content", enabledZoom ); | ||
8688 | $.mobile.zoom.enabled = true; | ||
8689 | $.mobile.zoom.locked = false; | ||
8690 | } | ||
8691 | }, | ||
8692 | restore: function() { | ||
8693 | if ( !disabledInitially ) { | ||
8694 | meta.attr( "content", initialContent ); | ||
8695 | $.mobile.zoom.enabled = true; | ||
8696 | } | ||
8697 | } | ||
8698 | }); | ||
8699 | |||
8700 | }( jQuery )); | ||
8701 | |||
8702 | (function( $, undefined ) { | ||
8703 | |||
8704 | $.widget( "mobile.textinput", $.mobile.widget, { | ||
8705 | options: { | ||
8706 | theme: null, | ||
8707 | mini: false, | ||
8708 | // This option defaults to true on iOS devices. | ||
8709 | preventFocusZoom: /iPhone|iPad|iPod/.test( navigator.platform ) && navigator.userAgent.indexOf( "AppleWebKit" ) > -1, | ||
8710 | initSelector: "input[type='text'], input[type='search'], :jqmData(type='search'), input[type='number'], :jqmData(type='number'), input[type='password'], input[type='email'], input[type='url'], input[type='tel'], textarea, input[type='time'], input[type='date'], input[type='month'], input[type='week'], input[type='datetime'], input[type='datetime-local'], input[type='color'], input:not([type]), input[type='file']", | ||
8711 | clearBtn: false, | ||
8712 | clearSearchButtonText: null, //deprecating for 1.3... | ||
8713 | clearBtnText: "clear text", | ||
8714 | disabled: false | ||
8715 | }, | ||
8716 | |||
8717 | _create: function() { | ||
8718 | |||
8719 | var self = this, | ||
8720 | input = this.element, | ||
8721 | o = this.options, | ||
8722 | theme = o.theme || $.mobile.getInheritedTheme( this.element, "c" ), | ||
8723 | themeclass = " ui-body-" + theme, | ||
8724 | miniclass = o.mini ? " ui-mini" : "", | ||
8725 | isSearch = input.is( "[type='search'], :jqmData(type='search')" ), | ||
8726 | focusedEl, | ||
8727 | clearbtn, | ||
8728 | clearBtnText = o.clearSearchButtonText || o.clearBtnText, | ||
8729 | clearBtnBlacklist = input.is( "textarea, :jqmData(type='range')" ), | ||
8730 | inputNeedsClearBtn = !!o.clearBtn && !clearBtnBlacklist, | ||
8731 | inputNeedsWrap = input.is( "input" ) && !input.is( ":jqmData(type='range')" ); | ||
8732 | |||
8733 | function toggleClear() { | ||
8734 | setTimeout( function() { | ||
8735 | clearbtn.toggleClass( "ui-input-clear-hidden", !input.val() ); | ||
8736 | }, 0 ); | ||
8737 | } | ||
8738 | |||
8739 | $( "label[for='" + input.attr( "id" ) + "']" ).addClass( "ui-input-text" ); | ||
8740 | |||
8741 | focusedEl = input.addClass( "ui-input-text ui-body-"+ theme ); | ||
8742 | |||
8743 | // XXX: Temporary workaround for issue 785 (Apple bug 8910589). | ||
8744 | // Turn off autocorrect and autocomplete on non-iOS 5 devices | ||
8745 | // since the popup they use can't be dismissed by the user. Note | ||
8746 | // that we test for the presence of the feature by looking for | ||
8747 | // the autocorrect property on the input element. We currently | ||
8748 | // have no test for iOS 5 or newer so we're temporarily using | ||
8749 | // the touchOverflow support flag for jQM 1.0. Yes, I feel dirty. - jblas | ||
8750 | if ( typeof input[0].autocorrect !== "undefined" && !$.support.touchOverflow ) { | ||
8751 | // Set the attribute instead of the property just in case there | ||
8752 | // is code that attempts to make modifications via HTML. | ||
8753 | input[0].setAttribute( "autocorrect", "off" ); | ||
8754 | input[0].setAttribute( "autocomplete", "off" ); | ||
8755 | } | ||
8756 | |||
8757 | //"search" and "text" input widgets | ||
8758 | if ( isSearch ) { | ||
8759 | focusedEl = input.wrap( "<div class='ui-input-search ui-shadow-inset ui-btn-corner-all ui-btn-shadow ui-icon-searchfield" + themeclass + miniclass + "'></div>" ).parent(); | ||
8760 | } else if ( inputNeedsWrap ) { | ||
8761 | focusedEl = input.wrap( "<div class='ui-input-text ui-shadow-inset ui-corner-all ui-btn-shadow" + themeclass + miniclass + "'></div>" ).parent(); | ||
8762 | } | ||
8763 | |||
8764 | if( inputNeedsClearBtn || isSearch ) { | ||
8765 | clearbtn = $( "<a href='#' class='ui-input-clear' title='" + clearBtnText + "'>" + clearBtnText + "</a>" ) | ||
8766 | .bind( "click", function( event ) { | ||
8767 | input | ||
8768 | .val( "" ) | ||
8769 | .focus() | ||
8770 | .trigger( "change" ); | ||
8771 | clearbtn.addClass( "ui-input-clear-hidden" ); | ||
8772 | event.preventDefault(); | ||
8773 | }) | ||
8774 | .appendTo( focusedEl ) | ||
8775 | .buttonMarkup({ | ||
8776 | icon: "delete", | ||
8777 | iconpos: "notext", | ||
8778 | corners: true, | ||
8779 | shadow: true, | ||
8780 | mini: o.mini | ||
8781 | }); | ||
8782 | |||
8783 | if ( !isSearch ) { | ||
8784 | focusedEl.addClass( "ui-input-has-clear" ); | ||
8785 | } | ||
8786 | |||
8787 | toggleClear(); | ||
8788 | |||
8789 | input.bind( "paste cut keyup input focus change blur", toggleClear ); | ||
8790 | } | ||
8791 | else if ( !inputNeedsWrap && !isSearch ) { | ||
8792 | input.addClass( "ui-corner-all ui-shadow-inset" + themeclass + miniclass ); | ||
8793 | } | ||
8794 | |||
8795 | input.focus(function() { | ||
8796 | // In many situations, iOS will zoom into the input upon tap, this prevents that from happening | ||
8797 | if ( o.preventFocusZoom ) { | ||
8798 | $.mobile.zoom.disable( true ); | ||
8799 | } | ||
8800 | focusedEl.addClass( $.mobile.focusClass ); | ||
8801 | }) | ||
8802 | .blur(function() { | ||
8803 | focusedEl.removeClass( $.mobile.focusClass ); | ||
8804 | if ( o.preventFocusZoom ) { | ||
8805 | $.mobile.zoom.enable( true ); | ||
8806 | } | ||
8807 | }) | ||
8808 | |||
8809 | // Autogrow | ||
8810 | if ( input.is( "textarea" ) ) { | ||
8811 | var extraLineHeight = 15, | ||
8812 | keyupTimeoutBuffer = 100, | ||
8813 | keyupTimeout; | ||
8814 | |||
8815 | this._keyup = function() { | ||
8816 | var scrollHeight = input[ 0 ].scrollHeight, | ||
8817 | clientHeight = input[ 0 ].clientHeight; | ||
8818 | |||
8819 | if ( clientHeight < scrollHeight ) { | ||
8820 | input.height( scrollHeight + extraLineHeight ); | ||
8821 | } | ||
8822 | }; | ||
8823 | |||
8824 | input.on( "keyup change input paste", function() { | ||
8825 | clearTimeout( keyupTimeout ); | ||
8826 | keyupTimeout = setTimeout( self._keyup, keyupTimeoutBuffer ); | ||
8827 | }); | ||
8828 | |||
8829 | // binding to pagechange here ensures that for pages loaded via | ||
8830 | // ajax the height is recalculated without user input | ||
8831 | this._on( $.mobile.document, { "pagechange": "_keyup" }); | ||
8832 | |||
8833 | // Issue 509: the browser is not providing scrollHeight properly until the styles load | ||
8834 | if ( $.trim( input.val() ) ) { | ||
8835 | // bind to the window load to make sure the height is calculated based on BOTH | ||
8836 | // the DOM and CSS | ||
8837 | this._on( $.mobile.window, {"load": "_keyup"}); | ||
8838 | } | ||
8839 | } | ||
8840 | if ( input.attr( "disabled" ) ) { | ||
8841 | this.disable(); | ||
8842 | } | ||
8843 | }, | ||
8844 | |||
8845 | disable: function() { | ||
8846 | var $el, | ||
8847 | isSearch = this.element.is( "[type='search'], :jqmData(type='search')" ), | ||
8848 | inputNeedsWrap = this.element.is( "input" ) && !this.element.is( ":jqmData(type='range')" ), | ||
8849 | parentNeedsDisabled = this.element.attr( "disabled", true )&& ( inputNeedsWrap || isSearch ); | ||
8850 | |||
8851 | if ( parentNeedsDisabled ) { | ||
8852 | $el = this.element.parent(); | ||
8853 | } else { | ||
8854 | $el = this.element; | ||
8855 | } | ||
8856 | $el.addClass( "ui-disabled" ); | ||
8857 | return this._setOption( "disabled", true ); | ||
8858 | }, | ||
8859 | |||
8860 | enable: function() { | ||
8861 | var $el, | ||
8862 | isSearch = this.element.is( "[type='search'], :jqmData(type='search')" ), | ||
8863 | inputNeedsWrap = this.element.is( "input" ) && !this.element.is( ":jqmData(type='range')" ), | ||
8864 | parentNeedsEnabled = this.element.attr( "disabled", false )&& ( inputNeedsWrap || isSearch ); | ||
8865 | |||
8866 | if ( parentNeedsEnabled ) { | ||
8867 | $el = this.element.parent(); | ||
8868 | } else { | ||
8869 | $el = this.element; | ||
8870 | } | ||
8871 | $el.removeClass( "ui-disabled" ); | ||
8872 | return this._setOption( "disabled", false ); | ||
8873 | } | ||
8874 | }); | ||
8875 | |||
8876 | //auto self-init widgets | ||
8877 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
8878 | $.mobile.textinput.prototype.enhanceWithin( e.target, true ); | ||
8879 | }); | ||
8880 | |||
8881 | })( jQuery ); | ||
8882 | |||
8883 | (function( $, undefined ) { | ||
8884 | |||
8885 | $.mobile.listview.prototype.options.filter = false; | ||
8886 | $.mobile.listview.prototype.options.filterPlaceholder = "Filter items..."; | ||
8887 | $.mobile.listview.prototype.options.filterTheme = "c"; | ||
8888 | $.mobile.listview.prototype.options.filterReveal = false; | ||
8889 | // TODO rename callback/deprecate and default to the item itself as the first argument | ||
8890 | var defaultFilterCallback = function( text, searchValue, item ) { | ||
8891 | return text.toString().toLowerCase().indexOf( searchValue ) === -1; | ||
8892 | }; | ||
8893 | |||
8894 | $.mobile.listview.prototype.options.filterCallback = defaultFilterCallback; | ||
8895 | |||
8896 | $.mobile.document.delegate( "ul, ol", "listviewcreate", function() { | ||
8897 | |||
8898 | var list = $( this ), | ||
8899 | listview = list.data( "mobile-listview" ); | ||
8900 | |||
8901 | if ( !listview.options.filter ) { | ||
8902 | return; | ||
8903 | } | ||
8904 | |||
8905 | if ( listview.options.filterReveal ) { | ||
8906 | list.children().addClass( "ui-screen-hidden" ); | ||
8907 | } | ||
8908 | |||
8909 | var wrapper = $( "<form>", { | ||
8910 | "class": "ui-listview-filter ui-bar-" + listview.options.filterTheme, | ||
8911 | "role": "search" | ||
8912 | }).submit( function( e ) { | ||
8913 | e.preventDefault(); | ||
8914 | search.blur(); | ||
8915 | }), | ||
8916 | onKeyUp = function( e ) { | ||
8917 | var $this = $( this ), | ||
8918 | val = this.value.toLowerCase(), | ||
8919 | listItems = null, | ||
8920 | li = list.children(), | ||
8921 | lastval = $this.jqmData( "lastval" ) + "", | ||
8922 | childItems = false, | ||
8923 | itemtext = "", | ||
8924 | item, | ||
8925 | // Check if a custom filter callback applies | ||
8926 | isCustomFilterCallback = listview.options.filterCallback !== defaultFilterCallback; | ||
8927 | |||
8928 | if ( lastval && lastval === val ) { | ||
8929 | // Execute the handler only once per value change | ||
8930 | return; | ||
8931 | } | ||
8932 | |||
8933 | listview._trigger( "beforefilter", "beforefilter", { input: this } ); | ||
8934 | |||
8935 | // Change val as lastval for next execution | ||
8936 | $this.jqmData( "lastval" , val ); | ||
8937 | if ( isCustomFilterCallback || val.length < lastval.length || val.indexOf( lastval ) !== 0 ) { | ||
8938 | |||
8939 | // Custom filter callback applies or removed chars or pasted something totally different, check all items | ||
8940 | listItems = list.children(); | ||
8941 | } else { | ||
8942 | |||
8943 | // Only chars added, not removed, only use visible subset | ||
8944 | listItems = list.children( ":not(.ui-screen-hidden)" ); | ||
8945 | |||
8946 | if ( !listItems.length && listview.options.filterReveal ) { | ||
8947 | listItems = list.children( ".ui-screen-hidden" ); | ||
8948 | } | ||
8949 | } | ||
8950 | |||
8951 | if ( val ) { | ||
8952 | |||
8953 | // This handles hiding regular rows without the text we search for | ||
8954 | // and any list dividers without regular rows shown under it | ||
8955 | |||
8956 | for ( var i = listItems.length - 1; i >= 0; i-- ) { | ||
8957 | item = $( listItems[ i ] ); | ||
8958 | itemtext = item.jqmData( "filtertext" ) || item.text(); | ||
8959 | |||
8960 | if ( item.is( "li:jqmData(role=list-divider)" ) ) { | ||
8961 | |||
8962 | item.toggleClass( "ui-filter-hidequeue" , !childItems ); | ||
8963 | |||
8964 | // New bucket! | ||
8965 | childItems = false; | ||
8966 | |||
8967 | } else if ( listview.options.filterCallback( itemtext, val, item ) ) { | ||
8968 | |||
8969 | //mark to be hidden | ||
8970 | item.toggleClass( "ui-filter-hidequeue" , true ); | ||
8971 | } else { | ||
8972 | |||
8973 | // There's a shown item in the bucket | ||
8974 | childItems = true; | ||
8975 | } | ||
8976 | } | ||
8977 | |||
8978 | // Show items, not marked to be hidden | ||
8979 | listItems | ||
8980 | .filter( ":not(.ui-filter-hidequeue)" ) | ||
8981 | .toggleClass( "ui-screen-hidden", false ); | ||
8982 | |||
8983 | // Hide items, marked to be hidden | ||
8984 | listItems | ||
8985 | .filter( ".ui-filter-hidequeue" ) | ||
8986 | .toggleClass( "ui-screen-hidden", true ) | ||
8987 | .toggleClass( "ui-filter-hidequeue", false ); | ||
8988 | |||
8989 | } else { | ||
8990 | |||
8991 | //filtervalue is empty => show all | ||
8992 | listItems.toggleClass( "ui-screen-hidden", !!listview.options.filterReveal ); | ||
8993 | } | ||
8994 | listview._addFirstLastClasses( li, listview._getVisibles( li, false ), false ); | ||
8995 | }, | ||
8996 | search = $( "<input>", { | ||
8997 | placeholder: listview.options.filterPlaceholder | ||
8998 | }) | ||
8999 | .attr( "data-" + $.mobile.ns + "type", "search" ) | ||
9000 | .jqmData( "lastval", "" ) | ||
9001 | .bind( "keyup change input", onKeyUp ) | ||
9002 | .appendTo( wrapper ) | ||
9003 | .textinput(); | ||
9004 | |||
9005 | if ( listview.options.inset ) { | ||
9006 | wrapper.addClass( "ui-listview-filter-inset" ); | ||
9007 | } | ||
9008 | |||
9009 | wrapper.bind( "submit", function() { | ||
9010 | return false; | ||
9011 | }) | ||
9012 | .insertBefore( list ); | ||
9013 | }); | ||
9014 | |||
9015 | })( jQuery ); | ||
9016 | |||
9017 | (function( $, undefined ) { | ||
9018 | |||
9019 | $.widget( "mobile.slider", $.mobile.widget, { | ||
9020 | widgetEventPrefix: "slide", | ||
9021 | |||
9022 | options: { | ||
9023 | theme: null, | ||
9024 | trackTheme: null, | ||
9025 | disabled: false, | ||
9026 | initSelector: "input[type='range'], :jqmData(type='range'), :jqmData(role='slider')", | ||
9027 | mini: false, | ||
9028 | highlight: false | ||
9029 | }, | ||
9030 | |||
9031 | _create: function() { | ||
9032 | |||
9033 | // TODO: Each of these should have comments explain what they're for | ||
9034 | var self = this, | ||
9035 | control = this.element, | ||
9036 | parentTheme = $.mobile.getInheritedTheme( control, "c" ), | ||
9037 | theme = this.options.theme || parentTheme, | ||
9038 | trackTheme = this.options.trackTheme || parentTheme, | ||
9039 | cType = control[ 0 ].nodeName.toLowerCase(), | ||
9040 | isSelect = this.isToggleSwitch = cType === "select", | ||
9041 | isRangeslider = control.parent().is( ":jqmData(role='rangeslider')" ), | ||
9042 | selectClass = ( this.isToggleSwitch ) ? "ui-slider-switch" : "", | ||
9043 | controlID = control.attr( "id" ), | ||
9044 | $label = $( "[for='" + controlID + "']" ), | ||
9045 | labelID = $label.attr( "id" ) || controlID + "-label", | ||
9046 | label = $label.attr( "id", labelID ), | ||
9047 | min = !this.isToggleSwitch ? parseFloat( control.attr( "min" ) ) : 0, | ||
9048 | max = !this.isToggleSwitch ? parseFloat( control.attr( "max" ) ) : control.find( "option" ).length-1, | ||
9049 | step = window.parseFloat( control.attr( "step" ) || 1 ), | ||
9050 | miniClass = ( this.options.mini || control.jqmData( "mini" ) ) ? " ui-mini" : "", | ||
9051 | domHandle = document.createElement( "a" ), | ||
9052 | handle = $( domHandle ), | ||
9053 | domSlider = document.createElement( "div" ), | ||
9054 | slider = $( domSlider ), | ||
9055 | valuebg = this.options.highlight && !this.isToggleSwitch ? (function() { | ||
9056 | var bg = document.createElement( "div" ); | ||
9057 | bg.className = "ui-slider-bg " + $.mobile.activeBtnClass + " ui-btn-corner-all"; | ||
9058 | return $( bg ).prependTo( slider ); | ||
9059 | })() : false, | ||
9060 | options; | ||
9061 | |||
9062 | domHandle.setAttribute( "href", "#" ); | ||
9063 | domSlider.setAttribute( "role", "application" ); | ||
9064 | domSlider.className = [this.isToggleSwitch ? "ui-slider " : "ui-slider-track ",selectClass," ui-btn-down-",trackTheme," ui-btn-corner-all", miniClass].join( "" ); | ||
9065 | domHandle.className = "ui-slider-handle"; | ||
9066 | domSlider.appendChild( domHandle ); | ||
9067 | |||
9068 | handle.buttonMarkup({ corners: true, theme: theme, shadow: true }) | ||
9069 | .attr({ | ||
9070 | "role": "slider", | ||
9071 | "aria-valuemin": min, | ||
9072 | "aria-valuemax": max, | ||
9073 | "aria-valuenow": this._value(), | ||
9074 | "aria-valuetext": this._value(), | ||
9075 | "title": this._value(), | ||
9076 | "aria-labelledby": labelID | ||
9077 | }); | ||
9078 | |||
9079 | $.extend( this, { | ||
9080 | slider: slider, | ||
9081 | handle: handle, | ||
9082 | type: cType, | ||
9083 | step: step, | ||
9084 | max: max, | ||
9085 | min: min, | ||
9086 | valuebg: valuebg, | ||
9087 | isRangeslider: isRangeslider, | ||
9088 | dragging: false, | ||
9089 | beforeStart: null, | ||
9090 | userModified: false, | ||
9091 | mouseMoved: false | ||
9092 | }); | ||
9093 | |||
9094 | if ( this.isToggleSwitch ) { | ||
9095 | var wrapper = document.createElement( "div" ); | ||
9096 | wrapper.className = "ui-slider-inneroffset"; | ||
9097 | |||
9098 | for ( var j = 0, length = domSlider.childNodes.length; j < length; j++ ) { | ||
9099 | wrapper.appendChild( domSlider.childNodes[j] ); | ||
9100 | } | ||
9101 | |||
9102 | domSlider.appendChild( wrapper ); | ||
9103 | |||
9104 | // slider.wrapInner( "<div class='ui-slider-inneroffset'></div>" ); | ||
9105 | |||
9106 | // make the handle move with a smooth transition | ||
9107 | handle.addClass( "ui-slider-handle-snapping" ); | ||
9108 | |||
9109 | options = control.find( "option" ); | ||
9110 | |||
9111 | for ( var i = 0, optionsCount = options.length; i < optionsCount; i++ ) { | ||
9112 | var side = !i ? "b" : "a", | ||
9113 | sliderTheme = !i ? " ui-btn-down-" + trackTheme : ( " " + $.mobile.activeBtnClass ), | ||
9114 | sliderLabel = document.createElement( "div" ), | ||
9115 | sliderImg = document.createElement( "span" ); | ||
9116 | |||
9117 | sliderImg.className = ["ui-slider-label ui-slider-label-", side, sliderTheme, " ui-btn-corner-all"].join( "" ); | ||
9118 | sliderImg.setAttribute( "role", "img" ); | ||
9119 | sliderImg.appendChild( document.createTextNode( options[i].innerHTML ) ); | ||
9120 | $( sliderImg ).prependTo( slider ); | ||
9121 | } | ||
9122 | |||
9123 | self._labels = $( ".ui-slider-label", slider ); | ||
9124 | |||
9125 | } | ||
9126 | |||
9127 | label.addClass( "ui-slider" ); | ||
9128 | |||
9129 | // monitor the input for updated values | ||
9130 | control.addClass( this.isToggleSwitch ? "ui-slider-switch" : "ui-slider-input" ); | ||
9131 | |||
9132 | this._on( control, { | ||
9133 | "change": "_controlChange", | ||
9134 | "keyup": "_controlKeyup", | ||
9135 | "blur": "_controlBlur", | ||
9136 | "vmouseup": "_controlVMouseUp" | ||
9137 | }); | ||
9138 | |||
9139 | slider.bind( "vmousedown", $.proxy( this._sliderVMouseDown, this ) ) | ||
9140 | .bind( "vclick", false ); | ||
9141 | |||
9142 | // We have to instantiate a new function object for the unbind to work properly | ||
9143 | // since the method itself is defined in the prototype (causing it to unbind everything) | ||
9144 | this._on( document, { "vmousemove": "_preventDocumentDrag" }); | ||
9145 | this._on( slider.add( document ), { "vmouseup": "_sliderVMouseUp" }); | ||
9146 | |||
9147 | slider.insertAfter( control ); | ||
9148 | |||
9149 | // wrap in a div for styling purposes | ||
9150 | if ( !this.isToggleSwitch && !isRangeslider ) { | ||
9151 | var wrapper = this.options.mini ? "<div class='ui-slider ui-mini'>" : "<div class='ui-slider'>"; | ||
9152 | |||
9153 | control.add( slider ).wrapAll( wrapper ); | ||
9154 | } | ||
9155 | |||
9156 | // Only add focus class to toggle switch, sliders get it automatically from ui-btn | ||
9157 | if ( this.isToggleSwitch ) { | ||
9158 | this.handle.bind({ | ||
9159 | focus: function() { | ||
9160 | slider.addClass( $.mobile.focusClass ); | ||
9161 | }, | ||
9162 | |||
9163 | blur: function() { | ||
9164 | slider.removeClass( $.mobile.focusClass ); | ||
9165 | } | ||
9166 | }); | ||
9167 | } | ||
9168 | |||
9169 | // bind the handle event callbacks and set the context to the widget instance | ||
9170 | this._on( this.handle, { | ||
9171 | "vmousedown": "_handleVMouseDown", | ||
9172 | "keydown": "_handleKeydown", | ||
9173 | "keyup": "_handleKeyup" | ||
9174 | }); | ||
9175 | |||
9176 | this.handle.bind( "vclick", false ); | ||
9177 | |||
9178 | if ( this._handleFormReset ) { | ||
9179 | this._handleFormReset(); | ||
9180 | } | ||
9181 | |||
9182 | this.refresh( undefined, undefined, true ); | ||
9183 | }, | ||
9184 | |||
9185 | _controlChange: function( event ) { | ||
9186 | // if the user dragged the handle, the "change" event was triggered from inside refresh(); don't call refresh() again | ||
9187 | if ( this._trigger( "controlchange", event ) === false ) { | ||
9188 | return false; | ||
9189 | } | ||
9190 | if ( !this.mouseMoved ) { | ||
9191 | this.refresh( this._value(), true ); | ||
9192 | } | ||
9193 | }, | ||
9194 | |||
9195 | _controlKeyup: function( event ) { // necessary? | ||
9196 | this.refresh( this._value(), true, true ); | ||
9197 | }, | ||
9198 | |||
9199 | _controlBlur: function( event ) { | ||
9200 | this.refresh( this._value(), true ); | ||
9201 | }, | ||
9202 | |||
9203 | // it appears the clicking the up and down buttons in chrome on | ||
9204 | // range/number inputs doesn't trigger a change until the field is | ||
9205 | // blurred. Here we check thif the value has changed and refresh | ||
9206 | _controlVMouseUp: function( event ) { | ||
9207 | this._checkedRefresh(); | ||
9208 | }, | ||
9209 | |||
9210 | // NOTE force focus on handle | ||
9211 | _handleVMouseDown: function( event ) { | ||
9212 | this.handle.focus(); | ||
9213 | }, | ||
9214 | |||
9215 | _handleKeydown: function( event ) { | ||
9216 | var index = this._value(); | ||
9217 | if ( this.options.disabled ) { | ||
9218 | return; | ||
9219 | } | ||
9220 | |||
9221 | // In all cases prevent the default and mark the handle as active | ||
9222 | switch ( event.keyCode ) { | ||
9223 | case $.mobile.keyCode.HOME: | ||
9224 | case $.mobile.keyCode.END: | ||
9225 | case $.mobile.keyCode.PAGE_UP: | ||
9226 | case $.mobile.keyCode.PAGE_DOWN: | ||
9227 | case $.mobile.keyCode.UP: | ||
9228 | case $.mobile.keyCode.RIGHT: | ||
9229 | case $.mobile.keyCode.DOWN: | ||
9230 | case $.mobile.keyCode.LEFT: | ||
9231 | event.preventDefault(); | ||
9232 | |||
9233 | if ( !this._keySliding ) { | ||
9234 | this._keySliding = true; | ||
9235 | this.handle.addClass( "ui-state-active" ); | ||
9236 | } | ||
9237 | |||
9238 | break; | ||
9239 | } | ||
9240 | |||
9241 | // move the slider according to the keypress | ||
9242 | switch ( event.keyCode ) { | ||
9243 | case $.mobile.keyCode.HOME: | ||
9244 | this.refresh( this.min ); | ||
9245 | break; | ||
9246 | case $.mobile.keyCode.END: | ||
9247 | this.refresh( this.max ); | ||
9248 | break; | ||
9249 | case $.mobile.keyCode.PAGE_UP: | ||
9250 | case $.mobile.keyCode.UP: | ||
9251 | case $.mobile.keyCode.RIGHT: | ||
9252 | this.refresh( index + this.step ); | ||
9253 | break; | ||
9254 | case $.mobile.keyCode.PAGE_DOWN: | ||
9255 | case $.mobile.keyCode.DOWN: | ||
9256 | case $.mobile.keyCode.LEFT: | ||
9257 | this.refresh( index - this.step ); | ||
9258 | break; | ||
9259 | } | ||
9260 | }, // remove active mark | ||
9261 | |||
9262 | _handleKeyup: function( event ) { | ||
9263 | if ( this._keySliding ) { | ||
9264 | this._keySliding = false; | ||
9265 | this.handle.removeClass( "ui-state-active" ); | ||
9266 | } | ||
9267 | }, | ||
9268 | |||
9269 | _sliderVMouseDown: function( event ) { | ||
9270 | // NOTE: we don't do this in refresh because we still want to | ||
9271 | // support programmatic alteration of disabled inputs | ||
9272 | if ( this.options.disabled ) { | ||
9273 | return false; | ||
9274 | } | ||
9275 | if ( this._trigger( "beforestart", event ) === false ) { | ||
9276 | return false; | ||
9277 | } | ||
9278 | this.dragging = true; | ||
9279 | this.userModified = false; | ||
9280 | this.mouseMoved = false; | ||
9281 | |||
9282 | if ( this.isToggleSwitch ) { | ||
9283 | this.beforeStart = this.element[0].selectedIndex; | ||
9284 | } | ||
9285 | |||
9286 | |||
9287 | this.refresh( event ); | ||
9288 | this._trigger( "start" ); | ||
9289 | return false; | ||
9290 | }, | ||
9291 | |||
9292 | _sliderVMouseUp: function() { | ||
9293 | if ( this.dragging ) { | ||
9294 | this.dragging = false; | ||
9295 | |||
9296 | if ( this.isToggleSwitch ) { | ||
9297 | // make the handle move with a smooth transition | ||
9298 | this.handle.addClass( "ui-slider-handle-snapping" ); | ||
9299 | |||
9300 | if ( this.mouseMoved ) { | ||
9301 | // this is a drag, change the value only if user dragged enough | ||
9302 | if ( this.userModified ) { | ||
9303 | this.refresh( this.beforeStart === 0 ? 1 : 0 ); | ||
9304 | } else { | ||
9305 | this.refresh( this.beforeStart ); | ||
9306 | } | ||
9307 | } else { | ||
9308 | // this is just a click, change the value | ||
9309 | this.refresh( this.beforeStart === 0 ? 1 : 0 ); | ||
9310 | } | ||
9311 | } | ||
9312 | |||
9313 | this.mouseMoved = false; | ||
9314 | this._trigger( "stop" ); | ||
9315 | return false; | ||
9316 | } | ||
9317 | }, | ||
9318 | |||
9319 | _preventDocumentDrag: function( event ) { | ||
9320 | // NOTE: we don't do this in refresh because we still want to | ||
9321 | // support programmatic alteration of disabled inputs | ||
9322 | if ( this._trigger( "drag", event ) === false) { | ||
9323 | return false; | ||
9324 | } | ||
9325 | if ( this.dragging && !this.options.disabled ) { | ||
9326 | |||
9327 | // this.mouseMoved must be updated before refresh() because it will be used in the control "change" event | ||
9328 | this.mouseMoved = true; | ||
9329 | |||
9330 | if ( this.isToggleSwitch ) { | ||
9331 | // make the handle move in sync with the mouse | ||
9332 | this.handle.removeClass( "ui-slider-handle-snapping" ); | ||
9333 | } | ||
9334 | |||
9335 | this.refresh( event ); | ||
9336 | |||
9337 | // only after refresh() you can calculate this.userModified | ||
9338 | this.userModified = this.beforeStart !== this.element[0].selectedIndex; | ||
9339 | return false; | ||
9340 | } | ||
9341 | }, | ||
9342 | |||
9343 | _checkedRefresh: function() { | ||
9344 | if ( this.value != this._value() ) { | ||
9345 | this.refresh( this._value() ); | ||
9346 | } | ||
9347 | }, | ||
9348 | |||
9349 | _value: function() { | ||
9350 | return this.isToggleSwitch ? this.element[0].selectedIndex : parseFloat( this.element.val() ) ; | ||
9351 | }, | ||
9352 | |||
9353 | |||
9354 | _reset: function() { | ||
9355 | this.refresh( undefined, false, true ); | ||
9356 | }, | ||
9357 | |||
9358 | refresh: function( val, isfromControl, preventInputUpdate ) { | ||
9359 | // NOTE: we don't return here because we want to support programmatic | ||
9360 | // alteration of the input value, which should still update the slider | ||
9361 | |||
9362 | var self = this, | ||
9363 | parentTheme = $.mobile.getInheritedTheme( this.element, "c" ), | ||
9364 | theme = this.options.theme || parentTheme, | ||
9365 | trackTheme = this.options.trackTheme || parentTheme; | ||
9366 | |||
9367 | self.slider[0].className = [ this.isToggleSwitch ? "ui-slider ui-slider-switch" : "ui-slider-track"," ui-btn-down-" + trackTheme,' ui-btn-corner-all', ( this.options.mini ) ? " ui-mini":""].join( "" ); | ||
9368 | if ( this.options.disabled || this.element.attr( "disabled" ) ) { | ||
9369 | this.disable(); | ||
9370 | } | ||
9371 | |||
9372 | // set the stored value for comparison later | ||
9373 | this.value = this._value(); | ||
9374 | if ( this.options.highlight && !this.isToggleSwitch && this.slider.find( ".ui-slider-bg" ).length === 0 ) { | ||
9375 | this.valuebg = (function() { | ||
9376 | var bg = document.createElement( "div" ); | ||
9377 | bg.className = "ui-slider-bg " + $.mobile.activeBtnClass + " ui-btn-corner-all"; | ||
9378 | return $( bg ).prependTo( self.slider ); | ||
9379 | })(); | ||
9380 | } | ||
9381 | this.handle.buttonMarkup({ corners: true, theme: theme, shadow: true }); | ||
9382 | |||
9383 | var pxStep, percent, | ||
9384 | control = this.element, | ||
9385 | isInput = !this.isToggleSwitch, | ||
9386 | optionElements = isInput ? [] : control.find( "option" ), | ||
9387 | min = isInput ? parseFloat( control.attr( "min" ) ) : 0, | ||
9388 | max = isInput ? parseFloat( control.attr( "max" ) ) : optionElements.length - 1, | ||
9389 | step = ( isInput && parseFloat( control.attr( "step" ) ) > 0 ) ? parseFloat( control.attr( "step" ) ) : 1; | ||
9390 | |||
9391 | if ( typeof val === "object" ) { | ||
9392 | var left, width, data = val, | ||
9393 | // a slight tolerance helped get to the ends of the slider | ||
9394 | tol = 8; | ||
9395 | |||
9396 | left = this.slider.offset().left; | ||
9397 | width = this.slider.width(); | ||
9398 | pxStep = width/((max-min)/step); | ||
9399 | if ( !this.dragging || | ||
9400 | data.pageX < left - tol || | ||
9401 | data.pageX > left + width + tol ) { | ||
9402 | return; | ||
9403 | } | ||
9404 | if ( pxStep > 1 ) { | ||
9405 | percent = ( ( data.pageX - left ) / width ) * 100; | ||
9406 | } else { | ||
9407 | percent = Math.round( ( ( data.pageX - left ) / width ) * 100 ); | ||
9408 | } | ||
9409 | } else { | ||
9410 | if ( val == null ) { | ||
9411 | val = isInput ? parseFloat( control.val() || 0 ) : control[0].selectedIndex; | ||
9412 | } | ||
9413 | percent = ( parseFloat( val ) - min ) / ( max - min ) * 100; | ||
9414 | } | ||
9415 | |||
9416 | if ( isNaN( percent ) ) { | ||
9417 | return; | ||
9418 | } | ||
9419 | |||
9420 | var newval = ( percent / 100 ) * ( max - min ) + min; | ||
9421 | |||
9422 | //from jQuery UI slider, the following source will round to the nearest step | ||
9423 | var valModStep = ( newval - min ) % step; | ||
9424 | var alignValue = newval - valModStep; | ||
9425 | |||
9426 | if ( Math.abs( valModStep ) * 2 >= step ) { | ||
9427 | alignValue += ( valModStep > 0 ) ? step : ( -step ); | ||
9428 | } | ||
9429 | |||
9430 | var percentPerStep = 100/((max-min)/step); | ||
9431 | // Since JavaScript has problems with large floats, round | ||
9432 | // the final value to 5 digits after the decimal point (see jQueryUI: #4124) | ||
9433 | newval = parseFloat( alignValue.toFixed(5) ); | ||
9434 | |||
9435 | if ( typeof pxStep === "undefined" ) { | ||
9436 | pxStep = width / ( (max-min) / step ); | ||
9437 | } | ||
9438 | if ( pxStep > 1 && isInput ) { | ||
9439 | percent = ( newval - min ) * percentPerStep * ( 1 / step ); | ||
9440 | } | ||
9441 | if ( percent < 0 ) { | ||
9442 | percent = 0; | ||
9443 | } | ||
9444 | |||
9445 | if ( percent > 100 ) { | ||
9446 | percent = 100; | ||
9447 | } | ||
9448 | |||
9449 | if ( newval < min ) { | ||
9450 | newval = min; | ||
9451 | } | ||
9452 | |||
9453 | if ( newval > max ) { | ||
9454 | newval = max; | ||
9455 | } | ||
9456 | |||
9457 | this.handle.css( "left", percent + "%" ); | ||
9458 | |||
9459 | this.handle[0].setAttribute( "aria-valuenow", isInput ? newval : optionElements.eq( newval ).attr( "value" ) ); | ||
9460 | |||
9461 | this.handle[0].setAttribute( "aria-valuetext", isInput ? newval : optionElements.eq( newval ).getEncodedText() ); | ||
9462 | |||
9463 | this.handle[0].setAttribute( "title", isInput ? newval : optionElements.eq( newval ).getEncodedText() ); | ||
9464 | |||
9465 | if ( this.valuebg ) { | ||
9466 | this.valuebg.css( "width", percent + "%" ); | ||
9467 | } | ||
9468 | |||
9469 | // drag the label widths | ||
9470 | if ( this._labels ) { | ||
9471 | var handlePercent = this.handle.width() / this.slider.width() * 100, | ||
9472 | aPercent = percent && handlePercent + ( 100 - handlePercent ) * percent / 100, | ||
9473 | bPercent = percent === 100 ? 0 : Math.min( handlePercent + 100 - aPercent, 100 ); | ||
9474 | |||
9475 | this._labels.each(function() { | ||
9476 | var ab = $( this ).is( ".ui-slider-label-a" ); | ||
9477 | $( this ).width( ( ab ? aPercent : bPercent ) + "%" ); | ||
9478 | }); | ||
9479 | } | ||
9480 | |||
9481 | if ( !preventInputUpdate ) { | ||
9482 | var valueChanged = false; | ||
9483 | |||
9484 | // update control"s value | ||
9485 | if ( isInput ) { | ||
9486 | valueChanged = control.val() !== newval; | ||
9487 | control.val( newval ); | ||
9488 | } else { | ||
9489 | valueChanged = control[ 0 ].selectedIndex !== newval; | ||
9490 | control[ 0 ].selectedIndex = newval; | ||
9491 | } | ||
9492 | if ( this._trigger( "beforechange", val ) === false) { | ||
9493 | return false; | ||
9494 | } | ||
9495 | if ( !isfromControl && valueChanged ) { | ||
9496 | control.trigger( "change" ); | ||
9497 | } | ||
9498 | } | ||
9499 | }, | ||
9500 | |||
9501 | enable: function() { | ||
9502 | this.element.attr( "disabled", false ); | ||
9503 | this.slider.removeClass( "ui-disabled" ).attr( "aria-disabled", false ); | ||
9504 | return this._setOption( "disabled", false ); | ||
9505 | }, | ||
9506 | |||
9507 | disable: function() { | ||
9508 | this.element.attr( "disabled", true ); | ||
9509 | this.slider.addClass( "ui-disabled" ).attr( "aria-disabled", true ); | ||
9510 | return this._setOption( "disabled", true ); | ||
9511 | } | ||
9512 | |||
9513 | }); | ||
9514 | |||
9515 | $.widget( "mobile.slider", $.mobile.slider, $.mobile.behaviors.formReset ); | ||
9516 | |||
9517 | //auto self-init widgets | ||
9518 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
9519 | $.mobile.slider.prototype.enhanceWithin( e.target, true ); | ||
9520 | }); | ||
9521 | |||
9522 | })( jQuery ); | ||
9523 | |||
9524 | (function( $, undefined ) { | ||
9525 | $.widget( "mobile.rangeslider", $.mobile.widget, { | ||
9526 | |||
9527 | options: { | ||
9528 | theme: null, | ||
9529 | trackTheme: null, | ||
9530 | disabled: false, | ||
9531 | initSelector: ":jqmData(role='rangeslider')", | ||
9532 | mini: false, | ||
9533 | highlight: true | ||
9534 | }, | ||
9535 | |||
9536 | _create: function() { | ||
9537 | var secondLabel, | ||
9538 | $el = this.element, | ||
9539 | elClass = this.options.mini ? "ui-rangeslider ui-mini" : "ui-rangeslider", | ||
9540 | _inputFirst = $el.find( "input" ).first(), | ||
9541 | _inputLast = $el.find( "input" ).last(), | ||
9542 | label = $el.find( "label" ).first(), | ||
9543 | _sliderFirst = $.data( _inputFirst.get(0), "mobileSlider" ).slider, | ||
9544 | _sliderLast = $.data( _inputLast.get(0), "mobileSlider" ).slider, | ||
9545 | firstHandle = $.data( _inputFirst.get(0), "mobileSlider" ).handle, | ||
9546 | _sliders = $( "<div class=\"ui-rangeslider-sliders\" />" ).appendTo( $el ); | ||
9547 | |||
9548 | if ( $el.find( "label" ).length > 1 ) { | ||
9549 | secondLabel = $el.find( "label" ).last().hide(); | ||
9550 | } | ||
9551 | |||
9552 | _inputFirst.addClass( "ui-rangeslider-first" ); | ||
9553 | _inputLast.addClass( "ui-rangeslider-last" ); | ||
9554 | $el.addClass( elClass ); | ||
9555 | |||
9556 | _sliderFirst.appendTo( _sliders ); | ||
9557 | _sliderLast.appendTo( _sliders ); | ||
9558 | label.prependTo( $el ); | ||
9559 | firstHandle.prependTo( _sliderLast ); | ||
9560 | |||
9561 | $.extend( this, { | ||
9562 | _inputFirst: _inputFirst, | ||
9563 | _inputLast: _inputLast, | ||
9564 | _sliderFirst: _sliderFirst, | ||
9565 | _sliderLast: _sliderLast, | ||
9566 | _targetVal: null, | ||
9567 | _sliderTarget: false, | ||
9568 | _sliders: _sliders, | ||
9569 | _proxy: false | ||
9570 | }); | ||
9571 | |||
9572 | this.refresh(); | ||
9573 | this._on( this.element.find( "input.ui-slider-input" ), { | ||
9574 | "slidebeforestart": "_slidebeforestart", | ||
9575 | "slidestop": "_slidestop", | ||
9576 | "slidedrag": "_slidedrag", | ||
9577 | "slidebeforechange": "_change", | ||
9578 | "blur": "_change", | ||
9579 | "keyup": "_change" | ||
9580 | }); | ||
9581 | this._on( firstHandle, { | ||
9582 | "vmousedown": "_dragFirstHandle" | ||
9583 | }); | ||
9584 | }, | ||
9585 | |||
9586 | _dragFirstHandle: function( event ) { | ||
9587 | //if the first handle is dragged send the event to the first slider | ||
9588 | $.data( this._inputFirst.get(0), "mobileSlider" ).dragging = true; | ||
9589 | $.data( this._inputFirst.get(0), "mobileSlider" ).refresh( event ); | ||
9590 | return false; | ||
9591 | }, | ||
9592 | |||
9593 | _slidedrag: function( event ) { | ||
9594 | var first = $( event.target ).is( this._inputFirst ), | ||
9595 | otherSlider = ( first ) ? this._inputLast : this._inputFirst; | ||
9596 | |||
9597 | this._sliderTarget = false; | ||
9598 | //if the drag was initaed on an extream and the other handle is focused send the events to | ||
9599 | //the closest handle | ||
9600 | if ( ( this._proxy === "first" && first ) || ( this._proxy === "last" && !first ) ) { | ||
9601 | $.data( otherSlider.get(0), "mobileSlider" ).dragging = true; | ||
9602 | $.data( otherSlider.get(0), "mobileSlider" ).refresh( event ); | ||
9603 | return false; | ||
9604 | } | ||
9605 | }, | ||
9606 | |||
9607 | _slidestop: function( event ) { | ||
9608 | var first = $( event.target ).is( this._inputFirst ); | ||
9609 | |||
9610 | this._proxy = false; | ||
9611 | //this stops dragging of the handle and brings the active track to the front | ||
9612 | //this makes clicks on the track go the the last handle used | ||
9613 | this.element.find( "input" ).trigger( "vmouseup" ); | ||
9614 | this._sliderFirst.css( "z-index", first ? 1 : "" ); | ||
9615 | }, | ||
9616 | |||
9617 | _slidebeforestart: function( event ) { | ||
9618 | this._sliderTarget = false; | ||
9619 | //if the track is the target remember this and the original value | ||
9620 | if ( $( event.originalEvent.target ).hasClass( "ui-slider-track" ) ) { | ||
9621 | this._sliderTarget = true; | ||
9622 | this._targetVal = $( event.target ).val(); | ||
9623 | } | ||
9624 | }, | ||
9625 | |||
9626 | _setOption: function( options ) { | ||
9627 | this._superApply( options ); | ||
9628 | this.refresh(); | ||
9629 | }, | ||
9630 | |||
9631 | refresh: function() { | ||
9632 | var $el = this.element, | ||
9633 | o = this.options; | ||
9634 | |||
9635 | $el.find( "input" ).slider({ | ||
9636 | theme: o.theme, | ||
9637 | trackTheme: o.trackTheme, | ||
9638 | disabled: o.disabled, | ||
9639 | mini: o.mini, | ||
9640 | highlight: o.highlight | ||
9641 | }).slider( "refresh" ); | ||
9642 | this._updateHighlight(); | ||
9643 | }, | ||
9644 | |||
9645 | _change: function( event ) { | ||
9646 | if ( event.type == "keyup" ) { | ||
9647 | this._updateHighlight(); | ||
9648 | return false; | ||
9649 | } | ||
9650 | |||
9651 | var min = parseFloat( this._inputFirst.val(), 10 ), | ||
9652 | max = parseFloat( this._inputLast.val(), 10 ), | ||
9653 | first = $( event.target ).hasClass( "ui-rangeslider-first" ), | ||
9654 | thisSlider = first ? this._inputFirst : this._inputLast, | ||
9655 | otherSlider = first ? this._inputLast : this._inputFirst; | ||
9656 | |||
9657 | if ( min > max && !this._sliderTarget ) { | ||
9658 | //this prevents min from being greater then max | ||
9659 | thisSlider.val( first ? max: min ).slider( "refresh" ); | ||
9660 | this._trigger( "normalize" ); | ||
9661 | } else if ( min > max ) { | ||
9662 | //this makes it so clicks on the target on either extream go to the closest handle | ||
9663 | thisSlider.val( this._targetVal ).slider( "refresh" ); | ||
9664 | |||
9665 | var self = this; | ||
9666 | //You must wait for the stack to unwind so first slider is updated before updating second | ||
9667 | setTimeout( function() { | ||
9668 | otherSlider.val( first ? min: max ).slider( "refresh" ); | ||
9669 | $.data( otherSlider.get(0), "mobileSlider" ).handle.focus(); | ||
9670 | self._sliderFirst.css( "z-index", first ? "" : 1 ); | ||
9671 | self._trigger( "normalize" ); | ||
9672 | }, 0 ); | ||
9673 | this._proxy = ( first ) ? "first" : "last"; | ||
9674 | } | ||
9675 | //fixes issue where when both _sliders are at min they cannot be adjusted | ||
9676 | if ( min === max ) { | ||
9677 | $.data( thisSlider.get(0), "mobileSlider" ).handle.css( "z-index", 1 ); | ||
9678 | $.data( otherSlider.get(0), "mobileSlider" ).handle.css( "z-index", 0 ); | ||
9679 | } else { | ||
9680 | $.data( otherSlider.get(0), "mobileSlider" ).handle.css( "z-index", "" ); | ||
9681 | $.data( thisSlider.get(0), "mobileSlider" ).handle.css( "z-index", "" ); | ||
9682 | } | ||
9683 | |||
9684 | this._updateHighlight(); | ||
9685 | |||
9686 | if ( min >= max ) { | ||
9687 | return false; | ||
9688 | } | ||
9689 | }, | ||
9690 | |||
9691 | _updateHighlight: function() { | ||
9692 | var min = parseInt( $.data( this._inputFirst.get(0), "mobileSlider" ).handle.get(0).style.left, 10 ), | ||
9693 | max = parseInt( $.data( this._inputLast.get(0), "mobileSlider" ).handle.get(0).style.left, 10 ), | ||
9694 | width = (max - min); | ||
9695 | |||
9696 | this.element.find( ".ui-slider-bg" ).css({ | ||
9697 | "margin-left": min + "%", | ||
9698 | "width": width + "%" | ||
9699 | }); | ||
9700 | }, | ||
9701 | |||
9702 | _destroy: function() { | ||
9703 | this.element.removeClass( "ui-rangeslider ui-mini" ).find( "label" ).show(); | ||
9704 | this._inputFirst.after( this._sliderFirst ); | ||
9705 | this._inputLast.after( this._sliderLast ); | ||
9706 | this._sliders.remove(); | ||
9707 | this.element.find( "input" ).removeClass( "ui-rangeslider-first ui-rangeslider-last" ).slider( "destroy" ); | ||
9708 | } | ||
9709 | |||
9710 | }); | ||
9711 | |||
9712 | $.widget( "mobile.rangeslider", $.mobile.rangeslider, $.mobile.behaviors.formReset ); | ||
9713 | |||
9714 | //auto self-init widgets | ||
9715 | $( document ).bind( "pagecreate create", function( e ) { | ||
9716 | $.mobile.rangeslider.prototype.enhanceWithin( e.target, true ); | ||
9717 | }); | ||
9718 | |||
9719 | })( jQuery ); | ||
9720 | (function( $, undefined ) { | ||
9721 | |||
9722 | $.widget( "mobile.selectmenu", $.mobile.widget, { | ||
9723 | options: { | ||
9724 | theme: null, | ||
9725 | disabled: false, | ||
9726 | icon: "arrow-d", | ||
9727 | iconpos: "right", | ||
9728 | inline: false, | ||
9729 | corners: true, | ||
9730 | shadow: true, | ||
9731 | iconshadow: true, | ||
9732 | overlayTheme: "a", | ||
9733 | dividerTheme: "b", | ||
9734 | hidePlaceholderMenuItems: true, | ||
9735 | closeText: "Close", | ||
9736 | nativeMenu: true, | ||
9737 | // This option defaults to true on iOS devices. | ||
9738 | preventFocusZoom: /iPhone|iPad|iPod/.test( navigator.platform ) && navigator.userAgent.indexOf( "AppleWebKit" ) > -1, | ||
9739 | initSelector: "select:not( :jqmData(role='slider') )", | ||
9740 | mini: false | ||
9741 | }, | ||
9742 | |||
9743 | _button: function() { | ||
9744 | return $( "<div/>" ); | ||
9745 | }, | ||
9746 | |||
9747 | _setDisabled: function( value ) { | ||
9748 | this.element.attr( "disabled", value ); | ||
9749 | this.button.attr( "aria-disabled", value ); | ||
9750 | return this._setOption( "disabled", value ); | ||
9751 | }, | ||
9752 | |||
9753 | _focusButton : function() { | ||
9754 | var self = this; | ||
9755 | |||
9756 | setTimeout( function() { | ||
9757 | self.button.focus(); | ||
9758 | }, 40); | ||
9759 | }, | ||
9760 | |||
9761 | _selectOptions: function() { | ||
9762 | return this.select.find( "option" ); | ||
9763 | }, | ||
9764 | |||
9765 | // setup items that are generally necessary for select menu extension | ||
9766 | _preExtension: function() { | ||
9767 | var classes = ""; | ||
9768 | // TODO: Post 1.1--once we have time to test thoroughly--any classes manually applied to the original element should be carried over to the enhanced element, with an `-enhanced` suffix. See https://github.com/jquery/jquery-mobile/issues/3577 | ||
9769 | /* if ( $el[0].className.length ) { | ||
9770 | classes = $el[0].className; | ||
9771 | } */ | ||
9772 | if ( !!~this.element[0].className.indexOf( "ui-btn-left" ) ) { | ||
9773 | classes = " ui-btn-left"; | ||
9774 | } | ||
9775 | |||
9776 | if ( !!~this.element[0].className.indexOf( "ui-btn-right" ) ) { | ||
9777 | classes = " ui-btn-right"; | ||
9778 | } | ||
9779 | |||
9780 | this.select = this.element.removeClass( "ui-btn-left ui-btn-right" ).wrap( "<div class='ui-select" + classes + "'>" ); | ||
9781 | this.selectID = this.select.attr( "id" ); | ||
9782 | this.label = $( "label[for='"+ this.selectID +"']" ).addClass( "ui-select" ); | ||
9783 | this.isMultiple = this.select[ 0 ].multiple; | ||
9784 | if ( !this.options.theme ) { | ||
9785 | this.options.theme = $.mobile.getInheritedTheme( this.select, "c" ); | ||
9786 | } | ||
9787 | }, | ||
9788 | |||
9789 | _destroy: function() { | ||
9790 | var wrapper = this.element.parents( ".ui-select" ); | ||
9791 | if ( wrapper.length > 0 ) { | ||
9792 | if ( wrapper.is( ".ui-btn-left, .ui-btn-right" ) ) { | ||
9793 | this.element.addClass( wrapper.is( ".ui-btn-left" ) ? "ui-btn-left" : "ui-btn-right" ); | ||
9794 | } | ||
9795 | this.element.insertAfter( wrapper ); | ||
9796 | wrapper.remove(); | ||
9797 | } | ||
9798 | }, | ||
9799 | |||
9800 | _create: function() { | ||
9801 | this._preExtension(); | ||
9802 | |||
9803 | // Allows for extension of the native select for custom selects and other plugins | ||
9804 | // see select.custom for example extension | ||
9805 | // TODO explore plugin registration | ||
9806 | this._trigger( "beforeCreate" ); | ||
9807 | |||
9808 | this.button = this._button(); | ||
9809 | |||
9810 | var self = this, | ||
9811 | |||
9812 | options = this.options, | ||
9813 | |||
9814 | inline = options.inline || this.select.jqmData( "inline" ), | ||
9815 | mini = options.mini || this.select.jqmData( "mini" ), | ||
9816 | iconpos = options.icon ? ( options.iconpos || this.select.jqmData( "iconpos" ) ) : false, | ||
9817 | |||
9818 | // IE throws an exception at options.item() function when | ||
9819 | // there is no selected item | ||
9820 | // select first in this case | ||
9821 | selectedIndex = this.select[ 0 ].selectedIndex === -1 ? 0 : this.select[ 0 ].selectedIndex, | ||
9822 | |||
9823 | // TODO values buttonId and menuId are undefined here | ||
9824 | button = this.button | ||
9825 | .insertBefore( this.select ) | ||
9826 | .buttonMarkup( { | ||
9827 | theme: options.theme, | ||
9828 | icon: options.icon, | ||
9829 | iconpos: iconpos, | ||
9830 | inline: inline, | ||
9831 | corners: options.corners, | ||
9832 | shadow: options.shadow, | ||
9833 | iconshadow: options.iconshadow, | ||
9834 | mini: mini | ||
9835 | }); | ||
9836 | |||
9837 | this.setButtonText(); | ||
9838 | |||
9839 | // Opera does not properly support opacity on select elements | ||
9840 | // In Mini, it hides the element, but not its text | ||
9841 | // On the desktop,it seems to do the opposite | ||
9842 | // for these reasons, using the nativeMenu option results in a full native select in Opera | ||
9843 | if ( options.nativeMenu && window.opera && window.opera.version ) { | ||
9844 | button.addClass( "ui-select-nativeonly" ); | ||
9845 | } | ||
9846 | |||
9847 | // Add counter for multi selects | ||
9848 | if ( this.isMultiple ) { | ||
9849 | this.buttonCount = $( "<span>" ) | ||
9850 | .addClass( "ui-li-count ui-btn-up-c ui-btn-corner-all" ) | ||
9851 | .hide() | ||
9852 | .appendTo( button.addClass('ui-li-has-count') ); | ||
9853 | } | ||
9854 | |||
9855 | // Disable if specified | ||
9856 | if ( options.disabled || this.element.attr('disabled')) { | ||
9857 | this.disable(); | ||
9858 | } | ||
9859 | |||
9860 | // Events on native select | ||
9861 | this.select.change(function() { | ||
9862 | self.refresh(); | ||
9863 | }); | ||
9864 | |||
9865 | if ( this._handleFormReset ) { | ||
9866 | this._handleFormReset(); | ||
9867 | } | ||
9868 | this.build(); | ||
9869 | }, | ||
9870 | |||
9871 | build: function() { | ||
9872 | var self = this; | ||
9873 | |||
9874 | this.select | ||
9875 | .appendTo( self.button ) | ||
9876 | .bind( "vmousedown", function() { | ||
9877 | // Add active class to button | ||
9878 | self.button.addClass( $.mobile.activeBtnClass ); | ||
9879 | }) | ||
9880 | .bind( "focus", function() { | ||
9881 | self.button.addClass( $.mobile.focusClass ); | ||
9882 | }) | ||
9883 | .bind( "blur", function() { | ||
9884 | self.button.removeClass( $.mobile.focusClass ); | ||
9885 | }) | ||
9886 | .bind( "focus vmouseover", function() { | ||
9887 | self.button.trigger( "vmouseover" ); | ||
9888 | }) | ||
9889 | .bind( "vmousemove", function() { | ||
9890 | // Remove active class on scroll/touchmove | ||
9891 | self.button.removeClass( $.mobile.activeBtnClass ); | ||
9892 | }) | ||
9893 | .bind( "change blur vmouseout", function() { | ||
9894 | self.button.trigger( "vmouseout" ) | ||
9895 | .removeClass( $.mobile.activeBtnClass ); | ||
9896 | }) | ||
9897 | .bind( "change blur", function() { | ||
9898 | self.button.removeClass( "ui-btn-down-" + self.options.theme ); | ||
9899 | }); | ||
9900 | |||
9901 | // In many situations, iOS will zoom into the select upon tap, this prevents that from happening | ||
9902 | self.button.bind( "vmousedown", function() { | ||
9903 | if ( self.options.preventFocusZoom ) { | ||
9904 | $.mobile.zoom.disable( true ); | ||
9905 | } | ||
9906 | }); | ||
9907 | self.label.bind( "click focus", function() { | ||
9908 | if ( self.options.preventFocusZoom ) { | ||
9909 | $.mobile.zoom.disable( true ); | ||
9910 | } | ||
9911 | }); | ||
9912 | self.select.bind( "focus", function() { | ||
9913 | if ( self.options.preventFocusZoom ) { | ||
9914 | $.mobile.zoom.disable( true ); | ||
9915 | } | ||
9916 | }); | ||
9917 | self.button.bind( "mouseup", function() { | ||
9918 | if ( self.options.preventFocusZoom ) { | ||
9919 | setTimeout(function() { | ||
9920 | $.mobile.zoom.enable( true ); | ||
9921 | }, 0 ); | ||
9922 | } | ||
9923 | }); | ||
9924 | self.select.bind( "blur", function() { | ||
9925 | if ( self.options.preventFocusZoom ) { | ||
9926 | $.mobile.zoom.enable( true ); | ||
9927 | } | ||
9928 | }); | ||
9929 | |||
9930 | }, | ||
9931 | |||
9932 | selected: function() { | ||
9933 | return this._selectOptions().filter( ":selected" ); | ||
9934 | }, | ||
9935 | |||
9936 | selectedIndices: function() { | ||
9937 | var self = this; | ||
9938 | |||
9939 | return this.selected().map(function() { | ||
9940 | return self._selectOptions().index( this ); | ||
9941 | }).get(); | ||
9942 | }, | ||
9943 | |||
9944 | setButtonText: function() { | ||
9945 | var self = this, | ||
9946 | selected = this.selected(), | ||
9947 | text = this.placeholder, | ||
9948 | span = $( document.createElement( "span" ) ); | ||
9949 | |||
9950 | this.button.find( ".ui-btn-text" ).html(function() { | ||
9951 | if ( selected.length ) { | ||
9952 | text = selected.map(function() { | ||
9953 | return $( this ).text(); | ||
9954 | }).get().join( ", " ); | ||
9955 | } else { | ||
9956 | text = self.placeholder; | ||
9957 | } | ||
9958 | |||
9959 | // TODO possibly aggregate multiple select option classes | ||
9960 | return span.text( text ) | ||
9961 | .addClass( self.select.attr( "class" ) ) | ||
9962 | .addClass( selected.attr( "class" ) ); | ||
9963 | }); | ||
9964 | }, | ||
9965 | |||
9966 | setButtonCount: function() { | ||
9967 | var selected = this.selected(); | ||
9968 | |||
9969 | // multiple count inside button | ||
9970 | if ( this.isMultiple ) { | ||
9971 | this.buttonCount[ selected.length > 1 ? "show" : "hide" ]().text( selected.length ); | ||
9972 | } | ||
9973 | }, | ||
9974 | |||
9975 | _reset: function() { | ||
9976 | this.refresh(); | ||
9977 | }, | ||
9978 | |||
9979 | refresh: function() { | ||
9980 | this.setButtonText(); | ||
9981 | this.setButtonCount(); | ||
9982 | }, | ||
9983 | |||
9984 | // open and close preserved in native selects | ||
9985 | // to simplify users code when looping over selects | ||
9986 | open: $.noop, | ||
9987 | close: $.noop, | ||
9988 | |||
9989 | disable: function() { | ||
9990 | this._setDisabled( true ); | ||
9991 | this.button.addClass( "ui-disabled" ); | ||
9992 | }, | ||
9993 | |||
9994 | enable: function() { | ||
9995 | this._setDisabled( false ); | ||
9996 | this.button.removeClass( "ui-disabled" ); | ||
9997 | } | ||
9998 | }); | ||
9999 | |||
10000 | $.widget( "mobile.selectmenu", $.mobile.selectmenu, $.mobile.behaviors.formReset ); | ||
10001 | |||
10002 | //auto self-init widgets | ||
10003 | $.mobile.document.bind( "pagecreate create", function( e ) { | ||
10004 | $.mobile.selectmenu.prototype.enhanceWithin( e.target, true ); | ||
10005 | }); | ||
10006 | })( jQuery ); | ||
10007 | |||
10008 | /* | ||
10009 | * custom "selectmenu" plugin | ||
10010 | */ | ||
10011 | |||
10012 | (function( $, undefined ) { | ||
10013 | var extendSelect = function( widget ) { | ||
10014 | |||
10015 | var select = widget.select, | ||
10016 | origDestroy = widget._destroy, | ||
10017 | selectID = widget.selectID, | ||
10018 | prefix = ( selectID ? selectID : ( ( $.mobile.ns || "" ) + "uuid-" + widget.uuid ) ), | ||
10019 | popupID = prefix + "-listbox", | ||
10020 | dialogID = prefix + "-dialog", | ||
10021 | label = widget.label, | ||
10022 | thisPage = widget.select.closest( ".ui-page" ), | ||
10023 | selectOptions = widget._selectOptions(), | ||
10024 | isMultiple = widget.isMultiple = widget.select[ 0 ].multiple, | ||
10025 | buttonId = selectID + "-button", | ||
10026 | menuId = selectID + "-menu", | ||
10027 | menuPage = $( "<div data-" + $.mobile.ns + "role='dialog' id='" + dialogID + "' data-" +$.mobile.ns + "theme='"+ widget.options.theme +"' data-" +$.mobile.ns + "overlay-theme='"+ widget.options.overlayTheme +"'>" + | ||
10028 | "<div data-" + $.mobile.ns + "role='header'>" + | ||
10029 | "<div class='ui-title'>" + label.getEncodedText() + "</div>"+ | ||
10030 | "</div>"+ | ||
10031 | "<div data-" + $.mobile.ns + "role='content'></div>"+ | ||
10032 | "</div>" ), | ||
10033 | |||
10034 | listbox = $( "<div id='" + popupID + "' class='ui-selectmenu'>" ).insertAfter( widget.select ).popup( { theme: widget.options.overlayTheme } ), | ||
10035 | |||
10036 | list = $( "<ul>", { | ||
10037 | "class": "ui-selectmenu-list", | ||
10038 | "id": menuId, | ||
10039 | "role": "listbox", | ||
10040 | "aria-labelledby": buttonId | ||
10041 | }).attr( "data-" + $.mobile.ns + "theme", widget.options.theme ) | ||
10042 | .attr( "data-" + $.mobile.ns + "divider-theme", widget.options.dividerTheme ) | ||
10043 | .appendTo( listbox ), | ||
10044 | |||
10045 | |||
10046 | header = $( "<div>", { | ||
10047 | "class": "ui-header ui-bar-" + widget.options.theme | ||
10048 | }).prependTo( listbox ), | ||
10049 | |||
10050 | headerTitle = $( "<h1>", { | ||
10051 | "class": "ui-title" | ||
10052 | }).appendTo( header ), | ||
10053 | |||
10054 | menuPageContent, | ||
10055 | menuPageClose, | ||
10056 | headerClose; | ||
10057 | |||
10058 | if ( widget.isMultiple ) { | ||
10059 | headerClose = $( "<a>", { | ||
10060 | "text": widget.options.closeText, | ||
10061 | "href": "#", | ||
10062 | "class": "ui-btn-left" | ||
10063 | }).attr( "data-" + $.mobile.ns + "iconpos", "notext" ).attr( "data-" + $.mobile.ns + "icon", "delete" ).appendTo( header ).buttonMarkup(); | ||
10064 | } | ||
10065 | |||
10066 | $.extend( widget, { | ||
10067 | select: widget.select, | ||
10068 | selectID: selectID, | ||
10069 | buttonId: buttonId, | ||
10070 | menuId: menuId, | ||
10071 | popupID: popupID, | ||
10072 | dialogID: dialogID, | ||
10073 | thisPage: thisPage, | ||
10074 | menuPage: menuPage, | ||
10075 | label: label, | ||
10076 | selectOptions: selectOptions, | ||
10077 | isMultiple: isMultiple, | ||
10078 | theme: widget.options.theme, | ||
10079 | listbox: listbox, | ||
10080 | list: list, | ||
10081 | header: header, | ||
10082 | headerTitle: headerTitle, | ||
10083 | headerClose: headerClose, | ||
10084 | menuPageContent: menuPageContent, | ||
10085 | menuPageClose: menuPageClose, | ||
10086 | placeholder: "", | ||
10087 | |||
10088 | build: function() { | ||
10089 | var self = this; | ||
10090 | |||
10091 | // Create list from select, update state | ||
10092 | self.refresh(); | ||
10093 | |||
10094 | if ( self._origTabIndex === undefined ) { | ||
10095 | // Map undefined to false, because self._origTabIndex === undefined | ||
10096 | // indicates that we have not yet checked whether the select has | ||
10097 | // originally had a tabindex attribute, whereas false indicates that | ||
10098 | // we have checked the select for such an attribute, and have found | ||
10099 | // none present. | ||
10100 | self._origTabIndex = ( self.select[ 0 ].getAttribute( "tabindex" ) === null ) ? false : self.select.attr( "tabindex" ); | ||
10101 | } | ||
10102 | self.select.attr( "tabindex", "-1" ).focus(function() { | ||
10103 | $( this ).blur(); | ||
10104 | self.button.focus(); | ||
10105 | }); | ||
10106 | |||
10107 | // Button events | ||
10108 | self.button.bind( "vclick keydown" , function( event ) { | ||
10109 | if ( self.options.disabled || self.isOpen ) { | ||
10110 | return; | ||
10111 | } | ||
10112 | |||
10113 | if (event.type === "vclick" || | ||
10114 | event.keyCode && (event.keyCode === $.mobile.keyCode.ENTER || | ||
10115 | event.keyCode === $.mobile.keyCode.SPACE)) { | ||
10116 | |||
10117 | self._decideFormat(); | ||
10118 | if ( self.menuType === "overlay" ) { | ||
10119 | self.button.attr( "href", "#" + self.popupID ).attr( "data-" + ( $.mobile.ns || "" ) + "rel", "popup" ); | ||
10120 | } else { | ||
10121 | self.button.attr( "href", "#" + self.dialogID ).attr( "data-" + ( $.mobile.ns || "" ) + "rel", "dialog" ); | ||
10122 | } | ||
10123 | self.isOpen = true; | ||
10124 | // Do not prevent default, so the navigation may have a chance to actually open the chosen format | ||
10125 | } | ||
10126 | }); | ||
10127 | |||
10128 | // Events for list items | ||
10129 | self.list.attr( "role", "listbox" ) | ||
10130 | .bind( "focusin", function( e ) { | ||
10131 | $( e.target ) | ||
10132 | .attr( "tabindex", "0" ) | ||
10133 | .trigger( "vmouseover" ); | ||
10134 | |||
10135 | }) | ||
10136 | .bind( "focusout", function( e ) { | ||
10137 | $( e.target ) | ||
10138 | .attr( "tabindex", "-1" ) | ||
10139 | .trigger( "vmouseout" ); | ||
10140 | }) | ||
10141 | .delegate( "li:not(.ui-disabled, .ui-li-divider)", "click", function( event ) { | ||
10142 | |||
10143 | // index of option tag to be selected | ||
10144 | var oldIndex = self.select[ 0 ].selectedIndex, | ||
10145 | newIndex = self.list.find( "li:not(.ui-li-divider)" ).index( this ), | ||
10146 | option = self._selectOptions().eq( newIndex )[ 0 ]; | ||
10147 | |||
10148 | // toggle selected status on the tag for multi selects | ||
10149 | option.selected = self.isMultiple ? !option.selected : true; | ||
10150 | |||
10151 | // toggle checkbox class for multiple selects | ||
10152 | if ( self.isMultiple ) { | ||
10153 | $( this ).find( ".ui-icon" ) | ||
10154 | .toggleClass( "ui-icon-checkbox-on", option.selected ) | ||
10155 | .toggleClass( "ui-icon-checkbox-off", !option.selected ); | ||
10156 | } | ||
10157 | |||
10158 | // trigger change if value changed | ||
10159 | if ( self.isMultiple || oldIndex !== newIndex ) { | ||
10160 | self.select.trigger( "change" ); | ||
10161 | } | ||
10162 | |||
10163 | // hide custom select for single selects only - otherwise focus clicked item | ||
10164 | // We need to grab the clicked item the hard way, because the list may have been rebuilt | ||
10165 | if ( self.isMultiple ) { | ||
10166 | self.list.find( "li:not(.ui-li-divider)" ).eq( newIndex ) | ||
10167 | .addClass( "ui-btn-down-" + widget.options.theme ).find( "a" ).first().focus(); | ||
10168 | } | ||
10169 | else { | ||
10170 | self.close(); | ||
10171 | } | ||
10172 | |||
10173 | event.preventDefault(); | ||
10174 | }) | ||
10175 | .keydown(function( event ) { //keyboard events for menu items | ||
10176 | var target = $( event.target ), | ||
10177 | li = target.closest( "li" ), | ||
10178 | prev, next; | ||
10179 | |||
10180 | // switch logic based on which key was pressed | ||
10181 | switch ( event.keyCode ) { | ||
10182 | // up or left arrow keys | ||
10183 | case 38: | ||
10184 | prev = li.prev().not( ".ui-selectmenu-placeholder" ); | ||
10185 | |||
10186 | if ( prev.is( ".ui-li-divider" ) ) { | ||
10187 | prev = prev.prev(); | ||
10188 | } | ||
10189 | |||
10190 | // if there's a previous option, focus it | ||
10191 | if ( prev.length ) { | ||
10192 | target | ||
10193 | .blur() | ||
10194 | .attr( "tabindex", "-1" ); | ||
10195 | |||
10196 | prev.addClass( "ui-btn-down-" + widget.options.theme ).find( "a" ).first().focus(); | ||
10197 | } | ||
10198 | |||
10199 | return false; | ||
10200 | // down or right arrow keys | ||
10201 | case 40: | ||
10202 | next = li.next(); | ||
10203 | |||
10204 | if ( next.is( ".ui-li-divider" ) ) { | ||
10205 | next = next.next(); | ||
10206 | } | ||
10207 | |||
10208 | // if there's a next option, focus it | ||
10209 | if ( next.length ) { | ||
10210 | target | ||
10211 | .blur() | ||
10212 | .attr( "tabindex", "-1" ); | ||
10213 | |||
10214 | next.addClass( "ui-btn-down-" + widget.options.theme ).find( "a" ).first().focus(); | ||
10215 | } | ||
10216 | |||
10217 | return false; | ||
10218 | // If enter or space is pressed, trigger click | ||
10219 | case 13: | ||
10220 | case 32: | ||
10221 | target.trigger( "click" ); | ||
10222 | |||
10223 | return false; | ||
10224 | } | ||
10225 | }); | ||
10226 | |||
10227 | // button refocus ensures proper height calculation | ||
10228 | // by removing the inline style and ensuring page inclusion | ||
10229 | self.menuPage.bind( "pagehide", function() { | ||
10230 | // TODO centralize page removal binding / handling in the page plugin. | ||
10231 | // Suggestion from @jblas to do refcounting | ||
10232 | // | ||
10233 | // TODO extremely confusing dependency on the open method where the pagehide.remove | ||
10234 | // bindings are stripped to prevent the parent page from disappearing. The way | ||
10235 | // we're keeping pages in the DOM right now sucks | ||
10236 | // | ||
10237 | // rebind the page remove that was unbound in the open function | ||
10238 | // to allow for the parent page removal from actions other than the use | ||
10239 | // of a dialog sized custom select | ||
10240 | // | ||
10241 | // doing this here provides for the back button on the custom select dialog | ||
10242 | $.mobile._bindPageRemove.call( self.thisPage ); | ||
10243 | }); | ||
10244 | |||
10245 | // Events on the popup | ||
10246 | self.listbox.bind( "popupafterclose", function( event ) { | ||
10247 | self.close(); | ||
10248 | }); | ||
10249 | |||
10250 | // Close button on small overlays | ||
10251 | if ( self.isMultiple ) { | ||
10252 | self.headerClose.click(function() { | ||
10253 | if ( self.menuType === "overlay" ) { | ||
10254 | self.close(); | ||
10255 | return false; | ||
10256 | } | ||
10257 | }); | ||
10258 | } | ||
10259 | |||
10260 | // track this dependency so that when the parent page | ||
10261 | // is removed on pagehide it will also remove the menupage | ||
10262 | self.thisPage.addDependents( this.menuPage ); | ||
10263 | }, | ||
10264 | |||
10265 | _isRebuildRequired: function() { | ||
10266 | var list = this.list.find( "li" ), | ||
10267 | options = this._selectOptions(); | ||
10268 | |||
10269 | // TODO exceedingly naive method to determine difference | ||
10270 | // ignores value changes etc in favor of a forcedRebuild | ||
10271 | // from the user in the refresh method | ||
10272 | return options.text() !== list.text(); | ||
10273 | }, | ||
10274 | |||
10275 | selected: function() { | ||
10276 | return this._selectOptions().filter( ":selected:not( :jqmData(placeholder='true') )" ); | ||
10277 | }, | ||
10278 | |||
10279 | refresh: function( forceRebuild , foo ) { | ||
10280 | var self = this, | ||
10281 | select = this.element, | ||
10282 | isMultiple = this.isMultiple, | ||
10283 | indicies; | ||
10284 | |||
10285 | if ( forceRebuild || this._isRebuildRequired() ) { | ||
10286 | self._buildList(); | ||
10287 | } | ||
10288 | |||
10289 | indicies = this.selectedIndices(); | ||
10290 | |||
10291 | self.setButtonText(); | ||
10292 | self.setButtonCount(); | ||
10293 | |||
10294 | self.list.find( "li:not(.ui-li-divider)" ) | ||
10295 | .removeClass( $.mobile.activeBtnClass ) | ||
10296 | .attr( "aria-selected", false ) | ||
10297 | .each(function( i ) { | ||
10298 | |||
10299 | if ( $.inArray( i, indicies ) > -1 ) { | ||
10300 | var item = $( this ); | ||
10301 | |||
10302 | // Aria selected attr | ||
10303 | item.attr( "aria-selected", true ); | ||
10304 | |||
10305 | // Multiple selects: add the "on" checkbox state to the icon | ||
10306 | if ( self.isMultiple ) { | ||
10307 | item.find( ".ui-icon" ).removeClass( "ui-icon-checkbox-off" ).addClass( "ui-icon-checkbox-on" ); | ||
10308 | } else { | ||
10309 | if ( item.is( ".ui-selectmenu-placeholder" ) ) { | ||
10310 | item.next().addClass( $.mobile.activeBtnClass ); | ||
10311 | } else { | ||
10312 | item.addClass( $.mobile.activeBtnClass ); | ||
10313 | } | ||
10314 | } | ||
10315 | } | ||
10316 | }); | ||
10317 | }, | ||
10318 | |||
10319 | close: function() { | ||
10320 | if ( this.options.disabled || !this.isOpen ) { | ||
10321 | return; | ||
10322 | } | ||
10323 | |||
10324 | var self = this; | ||
10325 | |||
10326 | if ( self.menuType === "page" ) { | ||
10327 | self.menuPage.dialog( "close" ); | ||
10328 | self.list.appendTo( self.listbox ); | ||
10329 | } else { | ||
10330 | self.listbox.popup( "close" ); | ||
10331 | } | ||
10332 | |||
10333 | self._focusButton(); | ||
10334 | // allow the dialog to be closed again | ||
10335 | self.isOpen = false; | ||
10336 | }, | ||
10337 | |||
10338 | open: function() { | ||
10339 | this.button.click(); | ||
10340 | }, | ||
10341 | |||
10342 | _decideFormat: function() { | ||
10343 | var self = this, | ||
10344 | $window = $.mobile.window, | ||
10345 | selfListParent = self.list.parent(), | ||
10346 | menuHeight = selfListParent.outerHeight(), | ||
10347 | menuWidth = selfListParent.outerWidth(), | ||
10348 | activePage = $( "." + $.mobile.activePageClass ), | ||
10349 | scrollTop = $window.scrollTop(), | ||
10350 | btnOffset = self.button.offset().top, | ||
10351 | screenHeight = $window.height(), | ||
10352 | screenWidth = $window.width(); | ||
10353 | |||
10354 | function focusMenuItem() { | ||
10355 | var selector = self.list.find( "." + $.mobile.activeBtnClass + " a" ); | ||
10356 | if ( selector.length === 0 ) { | ||
10357 | selector = self.list.find( "li.ui-btn:not( :jqmData(placeholder='true') ) a" ); | ||
10358 | } | ||
10359 | selector.first().focus().closest( "li" ).addClass( "ui-btn-down-" + widget.options.theme ); | ||
10360 | } | ||
10361 | |||
10362 | if ( menuHeight > screenHeight - 80 || !$.support.scrollTop ) { | ||
10363 | |||
10364 | self.menuPage.appendTo( $.mobile.pageContainer ).page(); | ||
10365 | self.menuPageContent = menuPage.find( ".ui-content" ); | ||
10366 | self.menuPageClose = menuPage.find( ".ui-header a" ); | ||
10367 | |||
10368 | // prevent the parent page from being removed from the DOM, | ||
10369 | // otherwise the results of selecting a list item in the dialog | ||
10370 | // fall into a black hole | ||
10371 | self.thisPage.unbind( "pagehide.remove" ); | ||
10372 | |||
10373 | //for WebOS/Opera Mini (set lastscroll using button offset) | ||
10374 | if ( scrollTop === 0 && btnOffset > screenHeight ) { | ||
10375 | self.thisPage.one( "pagehide", function() { | ||
10376 | $( this ).jqmData( "lastScroll", btnOffset ); | ||
10377 | }); | ||
10378 | } | ||
10379 | |||
10380 | self.menuPage | ||
10381 | .one( "pageshow", function() { | ||
10382 | focusMenuItem(); | ||
10383 | }) | ||
10384 | .one( "pagehide", function() { | ||
10385 | self.close(); | ||
10386 | }); | ||
10387 | |||
10388 | self.menuType = "page"; | ||
10389 | self.menuPageContent.append( self.list ); | ||
10390 | self.menuPage.find("div .ui-title").text(self.label.text()); | ||
10391 | } else { | ||
10392 | self.menuType = "overlay"; | ||
10393 | |||
10394 | self.listbox.one( "popupafteropen", focusMenuItem ); | ||
10395 | } | ||
10396 | }, | ||
10397 | |||
10398 | _buildList: function() { | ||
10399 | var self = this, | ||
10400 | o = this.options, | ||
10401 | placeholder = this.placeholder, | ||
10402 | needPlaceholder = true, | ||
10403 | optgroups = [], | ||
10404 | lis = [], | ||
10405 | dataIcon = self.isMultiple ? "checkbox-off" : "false"; | ||
10406 | |||
10407 | self.list.empty().filter( ".ui-listview" ).listview( "destroy" ); | ||
10408 | |||
10409 | var $options = self.select.find( "option" ), | ||
10410 | numOptions = $options.length, | ||
10411 | select = this.select[ 0 ], | ||
10412 | dataPrefix = 'data-' + $.mobile.ns, | ||
10413 | dataIndexAttr = dataPrefix + 'option-index', | ||
10414 | dataIconAttr = dataPrefix + 'icon', | ||
10415 | dataRoleAttr = dataPrefix + 'role', | ||
10416 | dataPlaceholderAttr = dataPrefix + 'placeholder', | ||
10417 | fragment = document.createDocumentFragment(), | ||
10418 | isPlaceholderItem = false, | ||
10419 | optGroup; | ||
10420 | |||
10421 | for (var i = 0; i < numOptions;i++, isPlaceholderItem = false) { | ||
10422 | var option = $options[i], | ||
10423 | $option = $( option ), | ||
10424 | parent = option.parentNode, | ||
10425 | text = $option.text(), | ||
10426 | anchor = document.createElement( 'a' ), | ||
10427 | classes = []; | ||
10428 | |||
10429 | anchor.setAttribute( 'href', '#' ); | ||
10430 | anchor.appendChild( document.createTextNode( text ) ); | ||
10431 | |||
10432 | // Are we inside an optgroup? | ||
10433 | if ( parent !== select && parent.nodeName.toLowerCase() === "optgroup" ) { | ||
10434 | var optLabel = parent.getAttribute( 'label' ); | ||
10435 | if ( optLabel !== optGroup ) { | ||
10436 | var divider = document.createElement( 'li' ); | ||
10437 | divider.setAttribute( dataRoleAttr, 'list-divider' ); | ||
10438 | divider.setAttribute( 'role', 'option' ); | ||
10439 | divider.setAttribute( 'tabindex', '-1' ); | ||
10440 | divider.appendChild( document.createTextNode( optLabel ) ); | ||
10441 | fragment.appendChild( divider ); | ||
10442 | optGroup = optLabel; | ||
10443 | } | ||
10444 | } | ||
10445 | |||
10446 | if ( needPlaceholder && ( !option.getAttribute( "value" ) || text.length === 0 || $option.jqmData( "placeholder" ) ) ) { | ||
10447 | needPlaceholder = false; | ||
10448 | isPlaceholderItem = true; | ||
10449 | |||
10450 | // If we have identified a placeholder, record the fact that it was | ||
10451 | // us who have added the placeholder to the option and mark it | ||
10452 | // retroactively in the select as well | ||
10453 | if ( null === option.getAttribute( dataPlaceholderAttr ) ) { | ||
10454 | this._removePlaceholderAttr = true; | ||
10455 | } | ||
10456 | option.setAttribute( dataPlaceholderAttr, true ); | ||
10457 | if ( o.hidePlaceholderMenuItems ) { | ||
10458 | classes.push( "ui-selectmenu-placeholder" ); | ||
10459 | } | ||
10460 | if ( placeholder !== text ) { | ||
10461 | placeholder = self.placeholder = text; | ||
10462 | } | ||
10463 | } | ||
10464 | |||
10465 | var item = document.createElement('li'); | ||
10466 | if ( option.disabled ) { | ||
10467 | classes.push( "ui-disabled" ); | ||
10468 | item.setAttribute('aria-disabled',true); | ||
10469 | } | ||
10470 | item.setAttribute( dataIndexAttr,i ); | ||
10471 | item.setAttribute( dataIconAttr, dataIcon ); | ||
10472 | if ( isPlaceholderItem ) { | ||
10473 | item.setAttribute( dataPlaceholderAttr, true ); | ||
10474 | } | ||
10475 | item.className = classes.join( " " ); | ||
10476 | item.setAttribute( 'role', 'option' ); | ||
10477 | anchor.setAttribute( 'tabindex', '-1' ); | ||
10478 | item.appendChild( anchor ); | ||
10479 | fragment.appendChild( item ); | ||
10480 | } | ||
10481 | |||
10482 | self.list[0].appendChild( fragment ); | ||
10483 | |||
10484 | // Hide header if it's not a multiselect and there's no placeholder | ||
10485 | if ( !this.isMultiple && !placeholder.length ) { | ||
10486 | this.header.hide(); | ||
10487 | } else { | ||
10488 | this.headerTitle.text( this.placeholder ); | ||
10489 | } | ||
10490 | |||
10491 | // Now populated, create listview | ||
10492 | self.list.listview(); | ||
10493 | }, | ||
10494 | |||
10495 | _button: function() { | ||
10496 | return $( "<a>", { | ||
10497 | "href": "#", | ||
10498 | "role": "button", | ||
10499 | // TODO value is undefined at creation | ||
10500 | "id": this.buttonId, | ||
10501 | "aria-haspopup": "true", | ||
10502 | |||
10503 | // TODO value is undefined at creation | ||
10504 | "aria-owns": this.menuId | ||
10505 | }); | ||
10506 | }, | ||
10507 | |||
10508 | _destroy: function() { | ||
10509 | this.close(); | ||
10510 | |||
10511 | // Restore the tabindex attribute to its original value | ||
10512 | if ( this._origTabIndex !== undefined ) { | ||
10513 | if ( this._origTabIndex !== false ) { | ||
10514 | this.select.attr( "tabindex", this._origTabIndex ); | ||
10515 | } else { | ||
10516 | this.select.removeAttr( "tabindex" ); | ||
10517 | } | ||
10518 | } | ||
10519 | |||
10520 | // Remove the placeholder attribute if we were the ones to add it | ||
10521 | if ( this._removePlaceholderAttr ) { | ||
10522 | this._selectOptions().removeAttr( "data-" + $.mobile.ns + "placeholder" ); | ||
10523 | } | ||
10524 | |||
10525 | // Remove the popup | ||
10526 | this.listbox.remove(); | ||
10527 | |||
10528 | // Chain up | ||
10529 | origDestroy.apply( this, arguments ); | ||
10530 | } | ||
10531 | }); | ||
10532 | }; | ||
10533 | |||
10534 | // issue #3894 - core doesn't trigger events on disabled delegates | ||
10535 | $.mobile.document.bind( "selectmenubeforecreate", function( event ) { | ||
10536 | var selectmenuWidget = $( event.target ).data( "mobile-selectmenu" ); | ||
10537 | |||
10538 | if ( !selectmenuWidget.options.nativeMenu && | ||
10539 | selectmenuWidget.element.parents( ":jqmData(role='popup')" ).length === 0 ) { | ||
10540 | extendSelect( selectmenuWidget ); | ||
10541 | } | ||
10542 | }); | ||
10543 | })( jQuery ); | ||
10544 | |||
10545 | (function( $, undefined ) { | ||
10546 | |||
10547 | |||
10548 | $.widget( "mobile.fixedtoolbar", $.mobile.widget, { | ||
10549 | options: { | ||
10550 | visibleOnPageShow: true, | ||
10551 | disablePageZoom: true, | ||
10552 | transition: "slide", //can be none, fade, slide (slide maps to slideup or slidedown) | ||
10553 | fullscreen: false, | ||
10554 | tapToggle: true, | ||
10555 | tapToggleBlacklist: "a, button, input, select, textarea, .ui-header-fixed, .ui-footer-fixed, .ui-popup, .ui-panel, .ui-panel-dismiss-open", | ||
10556 | hideDuringFocus: "input, textarea, select", | ||
10557 | updatePagePadding: true, | ||
10558 | trackPersistentToolbars: true, | ||
10559 | |||
10560 | // Browser detection! Weeee, here we go... | ||
10561 | // Unfortunately, position:fixed is costly, not to mention probably impossible, to feature-detect accurately. | ||
10562 | // Some tests exist, but they currently return false results in critical devices and browsers, which could lead to a broken experience. | ||
10563 | // Testing fixed positioning is also pretty obtrusive to page load, requiring injected elements and scrolling the window | ||
10564 | // The following function serves to rule out some popular browsers with known fixed-positioning issues | ||
10565 | // This is a plugin option like any other, so feel free to improve or overwrite it | ||
10566 | supportBlacklist: function() { | ||
10567 | return !$.support.fixedPosition; | ||
10568 | }, | ||
10569 | initSelector: ":jqmData(position='fixed')" | ||
10570 | }, | ||
10571 | |||
10572 | _create: function() { | ||
10573 | |||
10574 | var self = this, | ||
10575 | o = self.options, | ||
10576 | $el = self.element, | ||
10577 | tbtype = $el.is( ":jqmData(role='header')" ) ? "header" : "footer", | ||
10578 | $page = $el.closest( ".ui-page" ); | ||
10579 | |||
10580 | // Feature detecting support for | ||
10581 | if ( o.supportBlacklist() ) { | ||
10582 | self.destroy(); | ||
10583 | return; | ||
10584 | } | ||
10585 | |||
10586 | $el.addClass( "ui-"+ tbtype +"-fixed" ); | ||
10587 | |||
10588 | // "fullscreen" overlay positioning | ||
10589 | if ( o.fullscreen ) { | ||
10590 | $el.addClass( "ui-"+ tbtype +"-fullscreen" ); | ||
10591 | $page.addClass( "ui-page-" + tbtype + "-fullscreen" ); | ||
10592 | } | ||
10593 | // If not fullscreen, add class to page to set top or bottom padding | ||
10594 | else{ | ||
10595 | $page.addClass( "ui-page-" + tbtype + "-fixed" ); | ||
10596 | } | ||
10597 | |||
10598 | $.extend( this, { | ||
10599 | _thisPage: null | ||
10600 | }); | ||
10601 | |||
10602 | self._addTransitionClass(); | ||
10603 | self._bindPageEvents(); | ||
10604 | self._bindToggleHandlers(); | ||
10605 | }, | ||
10606 | |||
10607 | _addTransitionClass: function() { | ||
10608 | var tclass = this.options.transition; | ||
10609 | |||
10610 | if ( tclass && tclass !== "none" ) { | ||
10611 | // use appropriate slide for header or footer | ||
10612 | if ( tclass === "slide" ) { | ||
10613 | tclass = this.element.is( ".ui-header" ) ? "slidedown" : "slideup"; | ||
10614 | } | ||
10615 | |||
10616 | this.element.addClass( tclass ); | ||
10617 | } | ||
10618 | }, | ||
10619 | |||
10620 | _bindPageEvents: function() { | ||
10621 | this._thisPage = this.element.closest( ".ui-page" ); | ||
10622 | //page event bindings | ||
10623 | // Fixed toolbars require page zoom to be disabled, otherwise usability issues crop up | ||
10624 | // This method is meant to disable zoom while a fixed-positioned toolbar page is visible | ||
10625 | this._on( this._thisPage, { | ||
10626 | "pagebeforeshow": "_handlePageBeforeShow", | ||
10627 | "webkitAnimationStart":"_handleAnimationStart", | ||
10628 | "animationstart":"_handleAnimationStart", | ||
10629 | "updatelayout": "_handleAnimationStart", | ||
10630 | "pageshow": "_handlePageShow", | ||
10631 | "pagebeforehide": "_handlePageBeforeHide" | ||
10632 | }); | ||
10633 | }, | ||
10634 | |||
10635 | _handlePageBeforeShow: function() { | ||
10636 | var o = this.options; | ||
10637 | if ( o.disablePageZoom ) { | ||
10638 | $.mobile.zoom.disable( true ); | ||
10639 | } | ||
10640 | if ( !o.visibleOnPageShow ) { | ||
10641 | this.hide( true ); | ||
10642 | } | ||
10643 | }, | ||
10644 | |||
10645 | _handleAnimationStart: function() { | ||
10646 | if ( this.options.updatePagePadding ) { | ||
10647 | this.updatePagePadding( this._thisPage ); | ||
10648 | } | ||
10649 | }, | ||
10650 | |||
10651 | _handlePageShow: function() { | ||
10652 | this.updatePagePadding( this._thisPage ); | ||
10653 | if ( this.options.updatePagePadding ) { | ||
10654 | this._on( $.mobile.window, { "throttledresize": "updatePagePadding" } ); | ||
10655 | } | ||
10656 | }, | ||
10657 | |||
10658 | _handlePageBeforeHide: function( e, ui ) { | ||
10659 | var o = this.options; | ||
10660 | |||
10661 | if ( o.disablePageZoom ) { | ||
10662 | $.mobile.zoom.enable( true ); | ||
10663 | } | ||
10664 | if ( o.updatePagePadding ) { | ||
10665 | this._off( $.mobile.window, "throttledresize" ); | ||
10666 | } | ||
10667 | |||
10668 | if ( o.trackPersistentToolbars ) { | ||
10669 | var thisFooter = $( ".ui-footer-fixed:jqmData(id)", this._thisPage ), | ||
10670 | thisHeader = $( ".ui-header-fixed:jqmData(id)", this._thisPage ), | ||
10671 | nextFooter = thisFooter.length && ui.nextPage && $( ".ui-footer-fixed:jqmData(id='" + thisFooter.jqmData( "id" ) + "')", ui.nextPage ) || $(), | ||
10672 | nextHeader = thisHeader.length && ui.nextPage && $( ".ui-header-fixed:jqmData(id='" + thisHeader.jqmData( "id" ) + "')", ui.nextPage ) || $(); | ||
10673 | |||
10674 | if ( nextFooter.length || nextHeader.length ) { | ||
10675 | |||
10676 | nextFooter.add( nextHeader ).appendTo( $.mobile.pageContainer ); | ||
10677 | |||
10678 | ui.nextPage.one( "pageshow", function() { | ||
10679 | nextHeader.prependTo( this ); | ||
10680 | nextFooter.appendTo( this ); | ||
10681 | }); | ||
10682 | } | ||
10683 | } | ||
10684 | }, | ||
10685 | |||
10686 | _visible: true, | ||
10687 | |||
10688 | // This will set the content element's top or bottom padding equal to the toolbar's height | ||
10689 | updatePagePadding: function( tbPage ) { | ||
10690 | var $el = this.element, | ||
10691 | header = $el.is( ".ui-header" ), | ||
10692 | pos = parseFloat( $el.css( header ? "top" : "bottom" ) ); | ||
10693 | |||
10694 | // This behavior only applies to "fixed", not "fullscreen" | ||
10695 | if ( this.options.fullscreen ) { return; } | ||
10696 | |||
10697 | tbPage = tbPage || this._thisPage || $el.closest( ".ui-page" ); | ||
10698 | $( tbPage ).css( "padding-" + ( header ? "top" : "bottom" ), $el.outerHeight() + pos ); | ||
10699 | }, | ||
10700 | |||
10701 | _useTransition: function( notransition ) { | ||
10702 | var $win = $.mobile.window, | ||
10703 | $el = this.element, | ||
10704 | scroll = $win.scrollTop(), | ||
10705 | elHeight = $el.height(), | ||
10706 | pHeight = $el.closest( ".ui-page" ).height(), | ||
10707 | viewportHeight = $.mobile.getScreenHeight(), | ||
10708 | tbtype = $el.is( ":jqmData(role='header')" ) ? "header" : "footer"; | ||
10709 | |||
10710 | return !notransition && | ||
10711 | ( this.options.transition && this.options.transition !== "none" && | ||
10712 | ( | ||
10713 | ( tbtype === "header" && !this.options.fullscreen && scroll > elHeight ) || | ||
10714 | ( tbtype === "footer" && !this.options.fullscreen && scroll + viewportHeight < pHeight - elHeight ) | ||
10715 | ) || this.options.fullscreen | ||
10716 | ); | ||
10717 | }, | ||
10718 | |||
10719 | show: function( notransition ) { | ||
10720 | var hideClass = "ui-fixed-hidden", | ||
10721 | $el = this.element; | ||
10722 | |||
10723 | if ( this._useTransition( notransition ) ) { | ||
10724 | $el | ||
10725 | .removeClass( "out " + hideClass ) | ||
10726 | .addClass( "in" ) | ||
10727 | .animationComplete(function () { | ||
10728 | $el.removeClass('in'); | ||
10729 | }); | ||
10730 | } | ||
10731 | else { | ||
10732 | $el.removeClass( hideClass ); | ||
10733 | } | ||
10734 | this._visible = true; | ||
10735 | }, | ||
10736 | |||
10737 | hide: function( notransition ) { | ||
10738 | var hideClass = "ui-fixed-hidden", | ||
10739 | $el = this.element, | ||
10740 | // if it's a slide transition, our new transitions need the reverse class as well to slide outward | ||
10741 | outclass = "out" + ( this.options.transition === "slide" ? " reverse" : "" ); | ||
10742 | |||
10743 | if( this._useTransition( notransition ) ) { | ||
10744 | $el | ||
10745 | .addClass( outclass ) | ||
10746 | .removeClass( "in" ) | ||
10747 | .animationComplete(function() { | ||
10748 | $el.addClass( hideClass ).removeClass( outclass ); | ||
10749 | }); | ||
10750 | } | ||
10751 | else { | ||
10752 | $el.addClass( hideClass ).removeClass( outclass ); | ||
10753 | } | ||
10754 | this._visible = false; | ||
10755 | }, | ||
10756 | |||
10757 | toggle: function() { | ||
10758 | this[ this._visible ? "hide" : "show" ](); | ||
10759 | }, | ||
10760 | |||
10761 | _bindToggleHandlers: function() { | ||
10762 | var self = this, delay, | ||
10763 | o = self.options, | ||
10764 | $el = self.element; | ||
10765 | |||
10766 | // tap toggle | ||
10767 | $el.closest( ".ui-page" ) | ||
10768 | .bind( "vclick", function( e ) { | ||
10769 | if ( o.tapToggle && !$( e.target ).closest( o.tapToggleBlacklist ).length ) { | ||
10770 | self.toggle(); | ||
10771 | } | ||
10772 | }) | ||
10773 | .bind( "focusin focusout", function( e ) { | ||
10774 | //this hides the toolbars on a keyboard pop to give more screen room and prevent ios bug which | ||
10775 | //positions fixed toolbars in the middle of the screen on pop if the input is near the top or | ||
10776 | //bottom of the screen addresses issues #4410 Footer navbar moves up when clicking on a textbox in an Android environment | ||
10777 | //and issue #4113 Header and footer change their position after keyboard popup - iOS | ||
10778 | //and issue #4410 Footer navbar moves up when clicking on a textbox in an Android environment | ||
10779 | if ( screen.width < 1025 && $( e.target ).is( o.hideDuringFocus ) && !$( e.target ).closest( ".ui-header-fixed, .ui-footer-fixed" ).length ) { | ||
10780 | //Fix for issue #4724 Moving through form in Mobile Safari with "Next" and "Previous" system | ||
10781 | //controls causes fixed position, tap-toggle false Header to reveal itself | ||
10782 | if ( e.type === "focusout" && !self._visible ) { | ||
10783 | //wait for the stack to unwind and see if we have jumped to another input | ||
10784 | delay = setTimeout( function() { | ||
10785 | self.show(); | ||
10786 | }, 0 ); | ||
10787 | } else if ( e.type === "focusin" && self._visible ) { | ||
10788 | //if we have jumped to another input clear the time out to cancel the show. | ||
10789 | clearTimeout( delay ); | ||
10790 | self.hide(); | ||
10791 | } | ||
10792 | } | ||
10793 | }); | ||
10794 | }, | ||
10795 | |||
10796 | _destroy: function() { | ||
10797 | var $el = this.element, | ||
10798 | header = $el.is( ".ui-header" ); | ||
10799 | |||
10800 | $el.closest( ".ui-page" ).css( "padding-" + ( header ? "top" : "bottom" ), "" ); | ||
10801 | $el.removeClass( "ui-header-fixed ui-footer-fixed ui-header-fullscreen ui-footer-fullscreen in out fade slidedown slideup ui-fixed-hidden" ); | ||
10802 | $el.closest( ".ui-page" ).removeClass( "ui-page-header-fixed ui-page-footer-fixed ui-page-header-fullscreen ui-page-footer-fullscreen" ); | ||
10803 | } | ||
10804 | |||
10805 | }); | ||
10806 | |||
10807 | //auto self-init widgets | ||
10808 | $.mobile.document | ||
10809 | .bind( "pagecreate create", function( e ) { | ||
10810 | |||
10811 | // DEPRECATED in 1.1: support for data-fullscreen=true|false on the page element. | ||
10812 | // This line ensures it still works, but we recommend moving the attribute to the toolbars themselves. | ||
10813 | if ( $( e.target ).jqmData( "fullscreen" ) ) { | ||
10814 | $( $.mobile.fixedtoolbar.prototype.options.initSelector, e.target ).not( ":jqmData(fullscreen)" ).jqmData( "fullscreen", true ); | ||
10815 | } | ||
10816 | |||
10817 | $.mobile.fixedtoolbar.prototype.enhanceWithin( e.target ); | ||
10818 | }); | ||
10819 | |||
10820 | })( jQuery ); | ||
10821 | |||
10822 | (function( $, undefined ) { | ||
10823 | $.widget( "mobile.fixedtoolbar", $.mobile.fixedtoolbar, { | ||
10824 | |||
10825 | _create: function() { | ||
10826 | this._super(); | ||
10827 | this._workarounds(); | ||
10828 | }, | ||
10829 | |||
10830 | //check the browser and version and run needed workarounds | ||
10831 | _workarounds: function() { | ||
10832 | var ua = navigator.userAgent, | ||
10833 | platform = navigator.platform, | ||
10834 | // Rendering engine is Webkit, and capture major version | ||
10835 | wkmatch = ua.match( /AppleWebKit\/([0-9]+)/ ), | ||
10836 | wkversion = !!wkmatch && wkmatch[ 1 ], | ||
10837 | os = null, | ||
10838 | self = this; | ||
10839 | //set the os we are working in if it dosent match one with workarounds return | ||
10840 | if( platform.indexOf( "iPhone" ) > -1 || platform.indexOf( "iPad" ) > -1 || platform.indexOf( "iPod" ) > -1 ){ | ||
10841 | os = "ios"; | ||
10842 | } else if( ua.indexOf( "Android" ) > -1 ){ | ||
10843 | os = "android"; | ||
10844 | } else { | ||
10845 | return; | ||
10846 | } | ||
10847 | //check os version if it dosent match one with workarounds return | ||
10848 | if( os === "ios" ) { | ||
10849 | //iOS workarounds | ||
10850 | self._bindScrollWorkaround(); | ||
10851 | } else if( os === "android" && wkversion && wkversion < 534 ) { | ||
10852 | //Android 2.3 run all Android 2.3 workaround | ||
10853 | self._bindScrollWorkaround(); | ||
10854 | self._bindListThumbWorkaround(); | ||
10855 | } else { | ||
10856 | return; | ||
10857 | } | ||
10858 | }, | ||
10859 | |||
10860 | //Utility class for checking header and footer positions relative to viewport | ||
10861 | _viewportOffset: function() { | ||
10862 | var $el = this.element, | ||
10863 | header = $el.is( ".ui-header" ), | ||
10864 | offset = Math.abs($el.offset().top - $.mobile.window.scrollTop()); | ||
10865 | if( !header ) { | ||
10866 | offset = Math.round(offset - $.mobile.window.height() + $el.outerHeight())-60; | ||
10867 | } | ||
10868 | return offset; | ||
10869 | }, | ||
10870 | |||
10871 | //bind events for _triggerRedraw() function | ||
10872 | _bindScrollWorkaround: function() { | ||
10873 | var self = this; | ||
10874 | //bind to scrollstop and check if the toolbars are correctly positioned | ||
10875 | this._on( $.mobile.window, { scrollstop: function() { | ||
10876 | var viewportOffset = self._viewportOffset(); | ||
10877 | //check if the header is visible and if its in the right place | ||
10878 | if( viewportOffset > 2 && self._visible) { | ||
10879 | self._triggerRedraw(); | ||
10880 | } | ||
10881 | }}); | ||
10882 | }, | ||
10883 | |||
10884 | //this addresses issue #4250 Persistent footer instability in v1.1 with long select lists in Android 2.3.3 | ||
10885 | //and issue #3748 Android 2.x: Page transitions broken when fixed toolbars used | ||
10886 | //the absolutely positioned thumbnail in a list view causes problems with fixed position buttons above in a nav bar | ||
10887 | //setting the li's to -webkit-transform:translate3d(0,0,0); solves this problem to avoide potential issues in other | ||
10888 | //platforms we scope this with the class ui-android-2x-fix | ||
10889 | _bindListThumbWorkaround: function() { | ||
10890 | this.element.closest(".ui-page").addClass( "ui-android-2x-fixed" ); | ||
10891 | }, | ||
10892 | //this addresses issues #4337 Fixed header problem after scrolling content on iOS and Android | ||
10893 | //and device bugs project issue #1 Form elements can lose click hit area in position: fixed containers. | ||
10894 | //this also addresses not on fixed toolbars page in docs | ||
10895 | //adding 1px of padding to the bottom then removing it causes a "redraw" | ||
10896 | //which positions the toolbars correctly (they will always be visually correct) | ||
10897 | _triggerRedraw: function() { | ||
10898 | var paddingBottom = parseFloat( $( ".ui-page-active" ).css( "padding-bottom" ) ); | ||
10899 | //trigger page redraw to fix incorrectly positioned fixed elements | ||
10900 | $( ".ui-page-active" ).css( "padding-bottom", ( paddingBottom + 1 ) +"px" ); | ||
10901 | //if the padding is reset with out a timeout the reposition will not occure. | ||
10902 | //this is independant of JQM the browser seems to need the time to react. | ||
10903 | setTimeout( function() { | ||
10904 | $( ".ui-page-active" ).css( "padding-bottom", paddingBottom + "px" ); | ||
10905 | }, 0 ); | ||
10906 | }, | ||
10907 | |||
10908 | destroy: function() { | ||
10909 | this._super(); | ||
10910 | //Remove the class we added to the page previously in android 2.x | ||
10911 | this.element.closest(".ui-page-active").removeClass( "ui-android-2x-fix" ); | ||
10912 | } | ||
10913 | }); | ||
10914 | |||
10915 | })( jQuery ); | ||
10916 | |||
10917 | (function( $, window ) { | ||
10918 | |||
10919 | $.mobile.iosorientationfixEnabled = true; | ||
10920 | |||
10921 | // This fix addresses an iOS bug, so return early if the UA claims it's something else. | ||
10922 | var ua = navigator.userAgent; | ||
10923 | if( !( /iPhone|iPad|iPod/.test( navigator.platform ) && /OS [1-5]_[0-9_]* like Mac OS X/i.test( ua ) && ua.indexOf( "AppleWebKit" ) > -1 ) ){ | ||
10924 | $.mobile.iosorientationfixEnabled = false; | ||
10925 | return; | ||
10926 | } | ||
10927 | |||
10928 | var zoom = $.mobile.zoom, | ||
10929 | evt, x, y, z, aig; | ||
10930 | |||
10931 | function checkTilt( e ) { | ||
10932 | evt = e.originalEvent; | ||
10933 | aig = evt.accelerationIncludingGravity; | ||
10934 | |||
10935 | x = Math.abs( aig.x ); | ||
10936 | y = Math.abs( aig.y ); | ||
10937 | z = Math.abs( aig.z ); | ||
10938 | |||
10939 | // If portrait orientation and in one of the danger zones | ||
10940 | if ( !window.orientation && ( x > 7 || ( ( z > 6 && y < 8 || z < 8 && y > 6 ) && x > 5 ) ) ) { | ||
10941 | if ( zoom.enabled ) { | ||
10942 | zoom.disable(); | ||
10943 | } | ||
10944 | }else if ( !zoom.enabled ) { | ||
10945 | zoom.enable(); | ||
10946 | } | ||
10947 | } | ||
10948 | |||
10949 | $.mobile.document.on( "mobileinit", function(){ | ||
10950 | if( $.mobile.iosorientationfixEnabled ){ | ||
10951 | $.mobile.window | ||
10952 | .bind( "orientationchange.iosorientationfix", zoom.enable ) | ||
10953 | .bind( "devicemotion.iosorientationfix", checkTilt ); | ||
10954 | } | ||
10955 | }); | ||
10956 | |||
10957 | }( jQuery, this )); | ||
10958 | |||
10959 | (function( $, window, undefined ) { | ||
10960 | var$html = $( "html" ), | ||
10961 | $head = $( "head" ), | ||
10962 | $window = $.mobile.window; | ||
10963 | |||
10964 | //remove initial build class (only present on first pageshow) | ||
10965 | function hideRenderingClass() { | ||
10966 | $html.removeClass( "ui-mobile-rendering" ); | ||
10967 | } | ||
10968 | |||
10969 | // trigger mobileinit event - useful hook for configuring $.mobile settings before they're used | ||
10970 | $( window.document ).trigger( "mobileinit" ); | ||
10971 | |||
10972 | // support conditions | ||
10973 | // if device support condition(s) aren't met, leave things as they are -> a basic, usable experience, | ||
10974 | // otherwise, proceed with the enhancements | ||
10975 | if ( !$.mobile.gradeA() ) { | ||
10976 | return; | ||
10977 | } | ||
10978 | |||
10979 | // override ajaxEnabled on platforms that have known conflicts with hash history updates | ||
10980 | // or generally work better browsing in regular http for full page refreshes (BB5, Opera Mini) | ||
10981 | if ( $.mobile.ajaxBlacklist ) { | ||
10982 | $.mobile.ajaxEnabled = false; | ||
10983 | } | ||
10984 | |||
10985 | // Add mobile, initial load "rendering" classes to docEl | ||
10986 | $html.addClass( "ui-mobile ui-mobile-rendering" ); | ||
10987 | |||
10988 | // This is a fallback. If anything goes wrong (JS errors, etc), or events don't fire, | ||
10989 | // this ensures the rendering class is removed after 5 seconds, so content is visible and accessible | ||
10990 | setTimeout( hideRenderingClass, 5000 ); | ||
10991 | |||
10992 | $.extend( $.mobile, { | ||
10993 | // find and enhance the pages in the dom and transition to the first page. | ||
10994 | initializePage: function() { | ||
10995 | // find present pages | ||
10996 | var path = $.mobile.path, | ||
10997 | $pages = $( ":jqmData(role='page'), :jqmData(role='dialog')" ), | ||
10998 | hash = path.stripHash( path.stripQueryParams(path.parseLocation().hash) ), | ||
10999 | hashPage = document.getElementById( hash ); | ||
11000 | |||
11001 | // if no pages are found, create one with body's inner html | ||
11002 | if ( !$pages.length ) { | ||
11003 | $pages = $( "body" ).wrapInner( "<div data-" + $.mobile.ns + "role='page'></div>" ).children( 0 ); | ||
11004 | } | ||
11005 | |||
11006 | // add dialogs, set data-url attrs | ||
11007 | $pages.each(function() { | ||
11008 | var $this = $( this ); | ||
11009 | |||
11010 | // unless the data url is already set set it to the pathname | ||
11011 | if ( !$this.jqmData( "url" ) ) { | ||
11012 | $this.attr( "data-" + $.mobile.ns + "url", $this.attr( "id" ) || location.pathname + location.search ); | ||
11013 | } | ||
11014 | }); | ||
11015 | |||
11016 | // define first page in dom case one backs out to the directory root (not always the first page visited, but defined as fallback) | ||
11017 | $.mobile.firstPage = $pages.first(); | ||
11018 | |||
11019 | // define page container | ||
11020 | $.mobile.pageContainer = $.mobile.firstPage.parent().addClass( "ui-mobile-viewport" ); | ||
11021 | |||
11022 | // alert listeners that the pagecontainer has been determined for binding | ||
11023 | // to events triggered on it | ||
11024 | $window.trigger( "pagecontainercreate" ); | ||
11025 | |||
11026 | // cue page loading message | ||
11027 | $.mobile.showPageLoadingMsg(); | ||
11028 | |||
11029 | //remove initial build class (only present on first pageshow) | ||
11030 | hideRenderingClass(); | ||
11031 | |||
11032 | // if hashchange listening is disabled, there's no hash deeplink, | ||
11033 | // the hash is not valid (contains more than one # or does not start with #) | ||
11034 | // or there is no page with that hash, change to the first page in the DOM | ||
11035 | // Remember, however, that the hash can also be a path! | ||
11036 | if ( ! ( $.mobile.hashListeningEnabled && | ||
11037 | $.mobile.path.isHashValid( location.hash ) && | ||
11038 | ( $( hashPage ).is( ':jqmData(role="page")' ) || | ||
11039 | $.mobile.path.isPath( hash ) || | ||
11040 | hash === $.mobile.dialogHashKey ) ) ) { | ||
11041 | |||
11042 | // Store the initial destination | ||
11043 | if ( $.mobile.path.isHashValid( location.hash ) ) { | ||
11044 | $.mobile.urlHistory.initialDst = hash.replace( "#", "" ); | ||
11045 | } | ||
11046 | |||
11047 | // make sure to set initial popstate state if it exists | ||
11048 | // so that navigation back to the initial page works properly | ||
11049 | if( $.event.special.navigate.isPushStateEnabled() ) { | ||
11050 | $.mobile.navigate.navigator.squash( path.parseLocation().href ); | ||
11051 | } | ||
11052 | |||
11053 | $.mobile.changePage( $.mobile.firstPage, { | ||
11054 | transition: "none", | ||
11055 | reverse: true, | ||
11056 | changeHash: false, | ||
11057 | fromHashChange: true | ||
11058 | }); | ||
11059 | } else { | ||
11060 | // trigger hashchange or navigate to squash and record the correct | ||
11061 | // history entry for an initial hash path | ||
11062 | if( !$.event.special.navigate.isPushStateEnabled() ) { | ||
11063 | $window.trigger( "hashchange", [true] ); | ||
11064 | } else { | ||
11065 | // TODO figure out how to simplify this interaction with the initial history entry | ||
11066 | // at the bottom js/navigate/navigate.js | ||
11067 | $.mobile.navigate.history.stack = []; | ||
11068 | $.mobile.navigate( $.mobile.path.isPath( location.hash ) ? location.hash : location.href ); | ||
11069 | } | ||
11070 | } | ||
11071 | } | ||
11072 | }); | ||
11073 | |||
11074 | // initialize events now, after mobileinit has occurred | ||
11075 | $.mobile.navreadyDeferred.resolve(); | ||
11076 | |||
11077 | // check which scrollTop value should be used by scrolling to 1 immediately at domready | ||
11078 | // then check what the scroll top is. Android will report 0... others 1 | ||
11079 | // note that this initial scroll won't hide the address bar. It's just for the check. | ||
11080 | $(function() { | ||
11081 | window.scrollTo( 0, 1 ); | ||
11082 | |||
11083 | // if defaultHomeScroll hasn't been set yet, see if scrollTop is 1 | ||
11084 | // it should be 1 in most browsers, but android treats 1 as 0 (for hiding addr bar) | ||
11085 | // so if it's 1, use 0 from now on | ||
11086 | $.mobile.defaultHomeScroll = ( !$.support.scrollTop || $.mobile.window.scrollTop() === 1 ) ? 0 : 1; | ||
11087 | |||
11088 | //dom-ready inits | ||
11089 | if ( $.mobile.autoInitializePage ) { | ||
11090 | $.mobile.initializePage(); | ||
11091 | } | ||
11092 | |||
11093 | // window load event | ||
11094 | // hide iOS browser chrome on load | ||
11095 | $window.load( $.mobile.silentScroll ); | ||
11096 | |||
11097 | if ( !$.support.cssPointerEvents ) { | ||
11098 | // IE and Opera don't support CSS pointer-events: none that we use to disable link-based buttons | ||
11099 | // by adding the 'ui-disabled' class to them. Using a JavaScript workaround for those browser. | ||
11100 | // https://github.com/jquery/jquery-mobile/issues/3558 | ||
11101 | |||
11102 | $.mobile.document.delegate( ".ui-disabled", "vclick", | ||
11103 | function( e ) { | ||
11104 | e.preventDefault(); | ||
11105 | e.stopImmediatePropagation(); | ||
11106 | } | ||
11107 | ); | ||
11108 | } | ||
11109 | }); | ||
11110 | }( jQuery, this )); | ||
11111 | |||
11112 | |||
11113 | })); | ||