src/widgets/pagelayout/js/jquery.mobile.tizen.pagelayout.js

   1 /* ***************************************************************************
   2  * Copyright (c) 2000 - 2011 Samsung Electronics Co., Ltd.
   3  *
   4  * Permission is hereby granted, free of charge, to any person obtaining a
   5  * copy of this software and associated documentation files (the "Software"),
   6  * to deal in the Software without restriction, including without limitation
   7  * the rights to use, copy, modify, merge, publish, distribute, sublicense,
   8  * and/or sell copies of the Software, and to permit persons to whom the
   9  * Software is furnished to do so, subject to the following conditions:
  10  *
  11  * The above copyright notice and this permission notice shall be included in
  12  * all copies or substantial portions of the Software.
  13  *
  14  * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
  15  * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
  16  * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
  17  * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
  18  * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
  19  * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER
  20  * DEALINGS IN THE SOFTWARE.
  21  * ***************************************************************************
  22  *
  23  *      Author: Jinhyuk Jun <jinhyuk.jun@samsung.com>
  24  */
  25
  26 (function ( $, undefined ) {
  27
  28         $.widget( "mobile.pagelayout", $.mobile.widget, {
  29                 options: {
  30                         visibleOnPageShow: true,
  31                         disablePageZoom: true,
  32                         transition: "slide", //can be none, fade, slide (slide maps to slideup or slidedown)
  33                         fullscreen: false,
  34                         tapToggle: true,
  35                         tapToggleBlacklist: "a, input, select, textarea, .ui-header-fixed, .ui-footer-fixed",
  36                         hideDuringFocus: "input, textarea, select",
  37                         updatePagePadding: true,
  38                         trackPersistentToolbars: true,
  39                         // Browser detection! Weeee, here we go...
  40                         // Unfortunately, position:fixed is costly, not to mention probably impossible, to feature-detect accurately.
  41                         // Some tests exist, but they currently return false results in critical devices and browsers, which could lead to a broken experience.
  42                         // Testing fixed positioning is also pretty obtrusive to page load, requiring injected elements and scrolling the window
  43                         // The following function serves to rule out some popular browsers with known fixed-positioning issues
  44                         // This is a plugin option like any other, so feel free to improve or overwrite it
  45                         supportBlacklist: function () {
  46                                 var w = window,
  47                                         ua = navigator.userAgent,
  48                                         platform = navigator.platform,
  49                                         // Rendering engine is Webkit, and capture major version
  50                                         wkmatch = ua.match( /AppleWebKit\/([0-9]+)/ ),
  51                                         wkversion = !!wkmatch && wkmatch[ 1 ],
  52                                         ffmatch = ua.match( /Fennec\/([0-9]+)/ ),
  53                                         ffversion = !!ffmatch && ffmatch[ 1 ],
  54                                         operammobilematch = ua.match( /Opera Mobi\/([0-9]+)/ ),
  55                                         omversion = !!operammobilematch && operammobilematch[ 1 ];
  56
  57                                 if (
  58                                                 // iOS 4.3 and older : Platform is iPhone/Pad/Touch and Webkit version is less than 534 (ios5)
  59                                                 ( ( platform.indexOf( "iPhone" ) > -1 || platform.indexOf( "iPad" ) > -1  || platform.indexOf( "iPod" ) > -1 ) && wkversion && wkversion < 534 )
  60                                                 ||
  61                                                 // Opera Mini
  62                                                 ( w.operamini && ({}).toString.call( w.operamini ) === "[object OperaMini]" )
  63                                                 ||
  64                                                 ( operammobilematch && omversion < 7458 )
  65                                                 ||
  66                                                 //Android lte 2.1: Platform is Android and Webkit version is less than 533 (Android 2.2)
  67                                                 ( ua.indexOf( "Android" ) > -1 && wkversion && wkversion < 533 )
  68                                                 ||
  69                                                 // Firefox Mobile before 6.0 -
  70                                                 ( ffversion && ffversion < 6 )
  71                                                 ||
  72                                                 // WebOS less than 3
  73                                                 ( "palmGetResource" in window && wkversion && wkversion < 534 )
  74                                                 ||
  75                                                 // MeeGo
  76                                                 ( ua.indexOf( "MeeGo" ) > -1 && ua.indexOf( "NokiaBrowser/8.5.0" ) > -1 )
  77                                 ) {
  78                                         return true;
  79                                 }
  80
  81                                 return false;
  82                         },
  83                         initSelector: ":jqmData(role='content')"
  84                 },
  85
  86                 _create: function () {
  87
  88                         var self = this,
  89                                 o = self.options,
  90                                 $el = self.element;
  91
  92                         // Feature detecting support for
  93                         if ( o.supportBlacklist() ) {
  94                                 self.destroy();
  95                                 return;
  96                         }
  97
  98                         self._addFixedClass();
  99                         self._addTransitionClass();
 100                         self._bindPageEvents();
 101
 102                         // only content
 103                         self._bindContentControlEvents();
 104                 },
 105
 106                 /* add minimum fixed css style to bar(header/footer) and content
 107                 *  it need to update when core source modified(jquery.mobile.page.section.js)
 108                 *  modified from core source cuz initSelector different */
 109                 _addFixedClass: function () {
 110                         var self = this,
 111                                 o = self.options,
 112                                 $el = self.element,
 113                                 $elHeader = $el.siblings( ":jqmData(role='header')" ),
 114                                 $elFooter = $el.siblings( ":jqmData(role='footer')" ),
 115                                 $elPage = $el.closest(".ui-page");
 116
 117                         $elHeader.addClass( "ui-header-fixed" );
 118                         $elFooter.addClass( "ui-footer-fixed" );
 119
 120                         // "fullscreen" overlay positioning
 121                         if ( o.fullscreen ) {
 122                                 $elHeader.addClass( "ui-header-fullscreen" );
 123                                 $elFooter.addClass( "ui-footer-fullscreen" );
 124                                 $elPage
 125                                         .addClass( "ui-page-header-fullscreen" )
 126                                         .addClass( "ui-page-footer-fullscreen" );
 127                         } else {
 128                         // If not fullscreen, add class to page to set top or bottom padding
 129                                 $elPage.addClass( "ui-page-header-fixed" )
 130                                         .addClass( "ui-page-footer-fixed" );
 131                         }
 132                 },
 133
 134                 /* original core source(jquery.mobile.fixedToolbar.js)
 135                 * never changed */
 136                 _addTransitionClass: function () {
 137                         var tclass = this.options.transition;
 138
 139                         if ( tclass && tclass !== "none" ) {
 140                                 // use appropriate slide for header or footer
 141                                 if ( tclass === "slide" ) {
 142                                         tclass = this.element.is( ".ui-header" ) ? "slidedown" : "slideup";
 143                                 }
 144
 145                                 this.element.addClass( tclass );
 146                         }
 147                 },
 148
 149
 150                 /* Set default page positon
 151                 * 1. add title style to header
 152                 * 2. Set default header/footer position */
 153                 setHeaderFooter: function ( event ) {
 154                         var $elPage = $( event.target ),
 155                                 $elHeader = $elPage.find( ":jqmData(role='header')" ).length ? $elPage.find( ":jqmData(role='header')") : $elPage.siblings( ":jqmData(role='header')"),
 156                                 $elFieldcontain = $elHeader.find( ":jqmData(role='fieldcontain')" ),
 157                                 $elControlgroup = $elHeader.find( ":jqmData(role='controlgroup')" ),
 158                                 $elContent = $elPage.find( ".ui-content" ),
 159                                 next_id,
 160                                 $elFooter,
 161                                 $elFooterGroup,
 162                                 gLength,
 163                                 footerButton,
 164                                 tStyle = "normal",
 165                                 headerBtnNum;
 166
 167                         if ( $elFieldcontain.length != 0 || $elControlgroup.length != 0 ) {
 168                                 tStyle = "extended";
 169                         }
 170
 171                         if ( $elHeader.jqmData("position") == "fixed" || $.tizen.frameworkData.theme.match(/tizen/) || $elHeader.css("position") == "fixed" ) {
 172                                 $elHeader
 173                                         .css( "position", "fixed" )
 174                                         .css( "top", "0px" );
 175
 176                                 if ( $elHeader.children().is(".ui-navbar") ) {
 177                                         $elHeader.addClass( "ui-title-controlbar-height" );
 178                                         $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-controlbar-height" );
 179                                 } else {
 180                                         if ( $elHeader.length ) {
 181                                                 $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-" + tStyle + "-height" );
 182                                         } else {
 183                                                 $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-no-height" );
 184                                         }
 185                                 }
 186                         }
 187
 188                         if ( $elHeader.children().is(".ui-option-header") ) {
 189                                 $elContent.removeClass( "ui-title-content-" + tStyle + "-height" );
 190                                 if ( $.tizen.optionheader.prototype.options.collapseOnInit == true ) {
 191                                         $elContent.addClass( "ui-title-content-option-header-collapsed-1line-height" );
 192                                 } else {
 193                                         $elContent.addClass( "ui-title-content-option-header-expanded-1line-height" );
 194                                 }
 195                         } else if ( $elHeader.find("input").attr("type") === "search" || $elHeader.find("input").attr("type") === "tizen-search" || $elHeader.find("input").jqmData("type") == "search" || $elHeader.find("input").jqmData("type") == "tizen-search" ) {
 196                                 $elContent.removeClass( "ui-title-content-" + tStyle + "-height" ).addClass( "ui-title-content-search" );
 197                         }
 198
 199                         headerBtnNum = $elHeader.children("a").length;
 200                         if ( headerBtnNum > 0  || $elHeader.children().find(".ui-radio").length != 0 ) {
 201                                 if ( tStyle != "normal" ) {
 202                                         gLength = $elFieldcontain.length ? $elFieldcontain.find( ".ui-radio" ).length : $elControlgroup.find( "a" ).length;
 203
 204                                         $elHeader.addClass( "ui-title-extended-height" );
 205
 206                                         $elFieldcontain.length ? $elFieldcontain.find( ".ui-controlgroup" ).addClass( "ui-title-extended-controlgroup" ).addClass( "ui-extended-controlgroup" ) : $elControlgroup.addClass( "ui-title-extended-button-controlgroup" ).addClass( "ui-extended-controlgroup" );
 207
 208                                         $elFieldcontain.length ? $elFieldcontain.addClass( "ui-title-extended-segment-style" ) : $elControlgroup.addClass( "ui-title-extended-segment-style" );
 209
 210                                         if ( gLength == 2 || gLength == 3 || gLength == 4 ) {
 211                                                 $elFieldcontain.length ? $elFieldcontain.addClass( "ui-title-extended-controlgroup-" + gLength + "btn" ) : $elControlgroup.addClass( "ui-title-extended-controlgroup-" + gLength + "btn" );
 212                                         }
 213                                 }
 214                                 $elContent.addClass( "ui-title-content-" + tStyle + "-height" );
 215                         }
 216
 217                         // divide content mode scrollview and non-scrollview
 218                         // recalculate content area when resize callback occur
 219                         if ( $.support.scrollview ) {
 220                                 if ( $elHeader.css( "position" ) != "fixed" ) {
 221                                         $elHeader.css( "position", "fixed" );
 222                                 }
 223
 224                         } else {
 225                                 if ( $elHeader.css("position") != "fixed" ) {
 226                                         $elHeader.css( "position", "relative" );
 227                                 }
 228                         }
 229
 230                         $elFooter = $( document ).find( ":jqmData(role='footer')" );
 231
 232                         if ( $elFooter.find(".ui-navbar").is(".ui-controlbar-s") ) {
 233                                 $elFooter
 234                                         .css( "bottom", 0 )
 235                                         .show();
 236                         }
 237
 238                         if ( $elFooter.children().find(".ui-radio").length != 0 ) {
 239                                 $elFooterGroup = $elFooter.find( ":jqmData(role='fieldcontain')" );
 240                                 gLength = $elFooterGroup.find( ".ui-radio" ).length;
 241
 242                                 $elFooterGroup.find( ".ui-controlgroup" )
 243                                         .addClass( "ui-extended-controlgroup" )
 244                                         .addClass( "ui-footer-extended-controlgroup" )
 245                                         .css( "display", "inline" );
 246
 247                                         /* Groupcontrol cannot initialize inline property at first page */
 248                                 $elFooterGroup.addClass( "ui-footer-extended-controlgroup-" + gLength + "btn" );
 249                         }
 250
 251                         footerButton = $elFooter.children( "a" );
 252                         footerButton.each( function ( i ) {
 253                                 if ( footerButton.eq( i ).is(".ui-btn") && !footerButton.eq( i ).is(".ui-btn-back") ) {
 254                                         footerButton.eq( i )
 255                                                 .removeClass( "ui-btn-left" )
 256                                                 .addClass( "ui-btn-footer-right" );
 257                                 }
 258                         });
 259
 260                         if ( $elFooter.is(".ui-footer-fixed") ) {
 261                                 $elFooter.css( "bottom", 0 );
 262                         }
 263
 264                         /* Increase Content size with dummy <div> because of footer height */
 265                         if ( $elFooter.length != 0 && $( event.target ).find( ".dummy-div" ).length == 0 ) {
 266                                 $( event.target ).find( ":jqmData(role='content')" ).append( '<div class="dummy-div"></div>' );
 267                                 $( ".dummy-div" )
 268                                         .css( "width", $elFooter.width() )
 269                                         .css( "height", $elFooter.height() );
 270                         }
 271
 272                         /* Header position fix(remove transition) */
 273                         next_id = $( event.target ).attr( "id" );
 274
 275                         $( "#" + next_id ).find( ":jqmData(role='header')" )
 276                                 .removeClass( "fade in out" )
 277                                 .appendTo( $.mobile.pageContainer );
 278                 },
 279
 280                 _bindPageEvents: function () {
 281                         var self = this,
 282                                 o = self.options,
 283                                 $el = self.element;
 284
 285                         //page event bindings
 286                         // Fixed toolbars require page zoom to be disabled, otherwise usability issues crop up
 287                         // This method is meant to disable zoom while a fixed-positioned toolbar page is visible
 288                         $el.closest( ".ui-page" )
 289                                 .bind( "pagebeforeshow", function ( event ) {
 290                                         if ( o.disablePageZoom ) {
 291                                                 $.mobile.zoom.disable( true );
 292                                         }
 293                                         if ( !o.visibleOnPageShow ) {
 294                                                 self.hide( true );
 295                                         }
 296                                         self.setHeaderFooter( event );
 297                                 } )
 298                                 .bind( "webkitAnimationStart animationstart updatelayout", function ( e, data ) {
 299                                         if ( o.updatePagePadding ) {
 300                                                 self.updatePagePadding(data);   // FIXME: unused function.
 301                                                 self.updatePageLayout(data);
 302                                         }
 303                                 })
 304
 305                                 .bind( "pageshow", function ( event ) {
 306                                         self.updatePagePadding();                       // FIXME: unused function.
 307                                         self._updateHeaderArea();
 308                                         if ( o.updatePagePadding ) {
 309                                                 $( window ).bind( "throttledresize." + self.widgetName, function () {
 310                                                         self.updatePagePadding();       // FIXME: unused function.
 311                                                         self.layoutPageIME();   // IME/resize reposition
 312                                                         self.updatePageLayout();
 313                                                         self._updateHeaderArea();
 314                                                 });
 315                                         }
 316
 317                                         /* Header position fix(remove transition) */
 318                                         $( "body" ).children( ":jqmData(role='header')" )
 319                                                 .insertBefore( $(event.target).find(":jqmData(role='content')").eq( 0 ) );
 320 /* new_header */
 321                                 })
 322
 323                                 .bind( "pagebeforehide", function ( e, ui ) {
 324                                         if ( o.disablePageZoom ) {
 325                                                 $.mobile.zoom.enable( true );
 326                                         }
 327                                         if ( o.updatePagePadding ) {
 328                                                 $( window ).unbind( "throttledresize." + self.widgetName );
 329                                         }
 330
 331                                         if ( o.trackPersistentToolbars ) {
 332                                                 var thisFooter = $( ".ui-footer-fixed:jqmData(id)", this ),
 333                                                         thisHeader = $( ".ui-header-fixed:jqmData(id)", this ),
 334                                                         nextFooter = thisFooter.length && ui.nextPage && $( ".ui-footer-fixed:jqmData(id='" + thisFooter.jqmData( "id" ) + "')", ui.nextPage ),
 335                                                         nextHeader = thisHeader.length && ui.nextPage && $( ".ui-header-fixed:jqmData(id='" + thisHeader.jqmData( "id" ) + "')", ui.nextPage );
 336
 337                                                 nextFooter = nextFooter || $();
 338
 339                                                 if ( nextFooter.length || nextHeader.length ) {
 340
 341                                                         nextFooter.add( nextHeader ).appendTo( $.mobile.pageContainer );
 342
 343                                                         ui.nextPage.one( "pageshow", function () {
 344                                                                 nextFooter.add( nextHeader ).appendTo( this );
 345                                                         });
 346                                                 }
 347                                         }
 348                                 });
 349                 },
 350
 351                 _bindContentControlEvents: function () {
 352                         var self = this,
 353                                 o = self.options,
 354                                 $el = self.element;
 355
 356                         $el.closest( ".ui-page" )
 357                                 .bind( "pagebeforeshow", function ( event ) {
 358
 359                                 });
 360                 },
 361
 362                 _updateHeaderArea : function() {
 363                         var $elPage = $( ".ui-page-active" ),
 364                                 $elHeader = $elPage.find( ":jqmData(role='header')" ).length ? $elPage.find( ":jqmData(role='header')") : $elPage.siblings( ":jqmData(role='header')"),
 365                                 headerBtnNum = $elHeader.children("a").length,
 366                                 headerSrcNum = $elHeader.children("img").length;
 367
 368                         $elHeader.find( "h1" ).css( "width", window.innerWidth - $elHeader.children( "a" ).width() * headerBtnNum - $elHeader.children( "a" ).width() / 4 - $elHeader.children( "img" ).width() * headerSrcNum * 3 );
 369                         /* add half width for default space between text and button, and img tag area is too narrow, so multiply three for img width*/
 370                 },
 371
 372                 _visible: true,
 373                 _IMEShown : false,
 374                 _IMEindicatorHeight : window.outerHeight - window.innerHeight,
 375
 376                 layoutPageIME: function () {
 377                         if ( $( document.activeElement ).is( "input" ) || $( document.activeElement ).is( "textarea" )
 378                                         || $(".ui-page-active .ui-header .input-search-bar").length
 379                                         || $(".ui-page-active .ui-content").find("input").length
 380                                         || $(".ui-page-active .ui-content").find("textarea").length) {
 381                                         /* Check vertical and horizontal ratio.
 382                                          * If focus on input and two values are different, IME is drawed. */
 383
 384                                 if ( ( window.innerHeight + this._IMEindicatorHeight ) < window.outerHeight && window.innerWidth == window.outerWidth ) {
 385                                         if ( this._IMEShown === false ) {
 386                                                 $( ".ui-page-active .ui-footer" ).hide();
 387                                                 this._IMEShown = true;
 388                                         }
 389                                 } else if ( ( window.innerHeight + this._IMEindicatorHeight ) >= window.outerHeight ) {
 390                                         if ( this._IMEShown === true ) {
 391                                                 $( ".ui-page-active .ui-footer" ).show();
 392                                                 this._IMEShown = false;
 393                                         }
 394                                 }
 395                         } else {
 396                                 if ( ( window.innerHeight + this._IMEindicatorHeight ) >= window.outerHeight ) {
 397                                         if ( this._IMEShown === true ) {
 398                                                 $( ".ui-page-active .ui-footer" ).show();
 399                                                 this._IMEShown = false;
 400                                         }
 401                                 }
 402                         }
 403                 },
 404
 405                 // This will set the content element's top or bottom padding equal to the toolbar's height
 406                 updatePagePadding: function (data) {
 407                         var $el = this.element,
 408                                 header = $el.is( ".ui-header" );
 409
 410                         // This behavior only applies to "fixed", not "fullscreen"
 411                         if ( this.options.fullscreen ) { return; }
 412
 413 //                      $el.closest( ".ui-page" ).css( "padding-" + ( header ? "top" : "bottom" ), $el.outerHeight() );
 414                 },
 415
 416
 417                 /* 1. Calculate toolbar width(only controlbar)
 418                 *  2. Calculate and update content height   */
 419                 updatePageLayout: function ( receiveType ) {
 420                         var $elFooter,
 421                                 $elFooterControlbar,
 422                                 $elPage = $( document ).find( ".ui-page-active" ),
 423                                 $elHeader = $elPage.find( ":jqmData(role='header')" ),
 424                                 $elContent = $elPage.find( ":jqmData(role='content')" ),
 425                                 resultContentHeight = 0,
 426                                 resultFooterHeight = 0,
 427                                 resultHeaderHeight = 0;
 428
 429                         if ( $elPage.length ) {
 430                                 $elFooter = $( document ).find( ".ui-page-active" ).find( ":jqmData(role='footer')" );
 431                         } else {
 432                                 $elFooter = $( document ).find( ":jqmData(role='footer')" ).eq( 0 );
 433                         }
 434                         $elFooterControlbar = $elFooter.find( ".ui-navbar" );
 435
 436                         // calculate footer height
 437                         resultFooterHeight = ( $elFooter.css( "display" ) == "none" ) ? 0 : $elFooter.height();
 438                         resultHeaderHeight = ( $elHeader.css( "display" ) == "none" ) ? 0 : $elHeader.height();
 439
 440                         if (resultFooterHeight != 0 ) {
 441                                 $elFooter.css( "bottom", 0 );
 442                         }
 443                         if ( $elFooterControlbar.jqmData("style") == "toolbar" ) {
 444                                 $elFooterControlbar.css( "width", window.innerWidth - $elFooterControlbar.siblings( ".ui-btn" ).width() - parseInt($elFooterControlbar.siblings(".ui-btn").css("right"), 10 ) * 2  );
 445                         }
 446
 447                         resultContentHeight = window.innerHeight - resultFooterHeight - resultHeaderHeight;
 448
 449                         if ( $.support.scrollview ) {
 450                                 if ( $elHeader.css("position") != "fixed" ) {
 451                                         $elHeader.css( "position", "fixed" );
 452                                 }
 453
 454                                 $elContent.height( resultContentHeight -
 455                                                 parseFloat( $elContent.css("padding-top") ) -
 456                                                 parseFloat( $elContent.css("padding-bottom") ) );
 457                         } else {
 458                                 if ( $elHeader.css("position") != "fixed" ) {
 459                                         $elHeader.css( "position", "relative" );
 460                                 } else {
 461                                         $elContent.height( resultContentHeight );
 462                                 }
 463                         }
 464
 465                         // check this line need
 466                         // because another style title will be not supported to updatePageLayout
 467
 468                         // in case title changed
 469                         if ( receiveType ) {
 470                                 $elContent.css( "top", resultHeaderHeight + "px" );
 471                         }
 472                 },
 473
 474                 _useTransition: function ( notransition ) {
 475                         var $win = $( window ),
 476                                 $el = this.element,
 477                                 scroll = $win.scrollTop(),
 478                                 elHeight = $el.height(),
 479                                 pHeight = $el.closest( ".ui-page" ).height(),
 480                                 viewportHeight = $.mobile.getScreenHeight(),
 481                                 tbtype = $el.is( ":jqmData(role='header')" ) ? "header" : "footer";
 482
 483                         return !notransition &&
 484                                 ( this.options.transition && this.options.transition !== "none" &&
 485                                 (
 486                                                 ( tbtype === "header" && !this.options.fullscreen && scroll > elHeight ) ||
 487                                                 ( tbtype === "footer" && !this.options.fullscreen && scroll + viewportHeight < pHeight - elHeight )
 488                                         ) || this.options.fullscreen
 489                                 );
 490                 },
 491
 492                 show: function ( notransition ) {
 493 /*                      var hideClass = "ui-fixed-hidden",
 494                                 $el = this.element;
 495
 496                         if ( this._useTransition( notransition ) ){
 497                                 $el
 498                                         .removeClass( "out " + hideClass )
 499                                         .addClass( "in" );
 500                         }
 501                         else {
 502                                 $el.removeClass( hideClass );
 503                         }
 504                         this._visible = true;*/
 505                 },
 506
 507                 hide: function ( notransition ) {
 508 /*                      var hideClass = "ui-fixed-hidden",
 509                                 $el = this.element,
 510                                 // if it's a slide transition, our new transitions need the reverse class as well to slide outward
 511                                 outclass = "out" + ( this.options.transition === "slide" ? " reverse" : "" );
 512
 513                         if ( this._useTransition( notransition ) ){
 514                                 $el
 515                                         .addClass( outclass )
 516                                         .removeClass( "in" )
 517                                         .animationComplete( function () {
 518                                                 $el.addClass( hideClass ).removeClass( outclass );
 519                                         });
 520                         }
 521                         else {
 522                                 $el.addClass( hideClass ).removeClass( outclass );
 523                         }
 524                         this._visible = false;*/
 525                 },
 526
 527                 toggle: function () {
 528                         this[ this._visible ? "hide" : "show" ]();
 529                 },
 530
 531                 /* support external api for adding backbutton via javascript */
 532 /*              backButton: function ( target, status ){
 533                         this._addBackbutton( target, "external" );
 534                 },
 535 */
 536                 destroy: function () {
 537                         this.element.removeClass( "ui-header-fixed ui-footer-fixed ui-header-fullscreen ui-footer-fullscreen in out fade slidedown slideup ui-fixed-hidden" );
 538                         this.element.closest( ".ui-page" ).removeClass( "ui-page-header-fixed ui-page-footer-fixed ui-page-header-fullscreen ui-page-footer-fullscreen" );
 539                 }
 540
 541         });
 542
 543         //auto self-init widgets
 544         $( document )
 545                 .bind( "pagecreate create", function ( e ) {
 546                         // DEPRECATED in 1.1: support for data-fullscreen=true|false on the page element.
 547                         // This line ensures it still works, but we recommend moving the attribute to the toolbars themselves.
 548                         if ( $( e.target ).jqmData( "fullscreen" ) ) {
 549                                 $( $.mobile.pagelayout.prototype.options.initSelector, e.target ).not( ":jqmData(fullscreen)" ).jqmData( "fullscreen", true );
 550                         }
 551                         $.mobile.pagelayout.prototype.enhanceWithin( e.target );
 552                 });
 553
 554 })( jQuery );