/* Set default page positon
* 1. add title style to header
* 2. Set default header/footer position */
- setHeaderFooter: function ( event ) {
- var $elPage = $( event.target ),
+ setHeaderFooter: function ( thisPage ) {
+ var $elPage = $( thisPage ),
$elHeader = $elPage.find( ":jqmData(role='header')" ).length ? $elPage.find( ":jqmData(role='header')") : $elPage.siblings( ":jqmData(role='header')"),
- $elFieldcontain = $elHeader.find( ":jqmData(role='fieldcontain')" ),
- $elControlgroup = $elHeader.find( ":jqmData(role='controlgroup')" ),
$elContent = $elPage.find( ".ui-content" ),
- next_id,
- $elFooter,
- $elFooterGroup,
- gLength,
- footerButton,
- tStyle = "normal",
- headerBtnNum;
-
- if ( $elFieldcontain.length != 0 || $elControlgroup.length != 0 ) {
- tStyle = "extended";
- }
-
- if ( $elHeader.jqmData("position") == "fixed" || $.tizen.frameworkData.theme.match(/tizen/) || $elHeader.css("position") == "fixed" ) {
- $elHeader
- .css( "position", "fixed" )
- .css( "top", "0px" );
-
- if ( $elHeader.children().is(".ui-navbar") ) {
- $elHeader.addClass( "ui-title-controlbar-height" );
- $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-controlbar-height" );
- } else {
- if ( $elHeader.length ) {
- $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-" + tStyle + "-height" );
- } else {
- $( event.target ).find( ".ui-content" ).addClass( "ui-title-content-no-height" );
- }
- }
- }
-
- if ( $elHeader.children().is(".ui-option-header") ) {
- $elContent.removeClass( "ui-title-content-" + tStyle + "-height" );
- if ( $.tizen.optionheader.prototype.options.collapseOnInit == true ) {
- $elContent.addClass( "ui-title-content-option-header-collapsed-1line-height" );
- } else {
- $elContent.addClass( "ui-title-content-option-header-expanded-1line-height" );
- }
- } 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" ) {
- $elContent.removeClass( "ui-title-content-" + tStyle + "-height" ).addClass( "ui-title-content-search" );
- }
-
- headerBtnNum = $elHeader.children("a").length;
- if ( headerBtnNum > 0 || $elHeader.children().find(".ui-radio").length != 0 ) {
- if ( tStyle != "normal" ) {
- gLength = $elFieldcontain.length ? $elFieldcontain.find( ".ui-radio" ).length : $elControlgroup.find( "a" ).length;
-
- $elHeader.addClass( "ui-title-extended-height" );
-
- $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" );
-
- $elFieldcontain.length ? $elFieldcontain.addClass( "ui-title-extended-segment-style" ) : $elControlgroup.addClass( "ui-title-extended-segment-style" );
-
- if ( gLength == 2 || gLength == 3 || gLength == 4 ) {
- $elFieldcontain.length ? $elFieldcontain.addClass( "ui-title-extended-controlgroup-" + gLength + "btn" ) : $elControlgroup.addClass( "ui-title-extended-controlgroup-" + gLength + "btn" );
- }
- }
- $elContent.addClass( "ui-title-content-" + tStyle + "-height" );
- }
+ $elFooter = $elPage.find( ":jqmData(role='footer')" ),
+ $elFooterGroup = $elFooter.find( ":jqmData(role='fieldcontain')" );
// divide content mode scrollview and non-scrollview
- // recalculate content area when resize callback occur
- if ( $.support.scrollview ) {
- if ( $elHeader.css( "position" ) != "fixed" ) {
- $elHeader.css( "position", "fixed" );
- }
-
- } else {
- if ( $elHeader.css("position") != "fixed" ) {
+ if ( !$elPage.is( ".ui-dialog" ) ) {
+ if ( $elHeader.jqmData("position") == "fixed" || ( $.support.scrollview && $.tizen.frameworkData.theme.match(/tizen/) ) ) {
+ $elHeader
+ .css( "position", "fixed" )
+ .css( "top", "0px" );
+ } else if ( !$.support.scrollview && $elHeader.jqmData("position") != "fixed" ) {
$elHeader.css( "position", "relative" );
}
}
- $elFooter = $( document ).find( ":jqmData(role='footer')" );
-
- if ( $elFooter.find(".ui-navbar").is(".ui-controlbar-s") ) {
- $elFooter
- .css( "bottom", 0 )
- .show();
- }
-
- if ( $elFooter.children().find(".ui-radio").length != 0 ) {
- $elFooterGroup = $elFooter.find( ":jqmData(role='fieldcontain')" );
- gLength = $elFooterGroup.find( ".ui-radio" ).length;
-
- $elFooterGroup.find( ".ui-controlgroup" )
- .addClass( "ui-extended-controlgroup" )
- .addClass( "ui-footer-extended-controlgroup" )
- .css( "display", "inline" );
-
- /* Groupcontrol cannot initialize inline property at first page */
- $elFooterGroup.addClass( "ui-footer-extended-controlgroup-" + gLength + "btn" );
- }
-
- footerButton = $elFooter.children( "a" );
- footerButton.each( function ( i ) {
- if ( footerButton.eq( i ).is(".ui-btn") && !footerButton.eq( i ).is(".ui-btn-back") ) {
- footerButton.eq( i )
- .removeClass( "ui-btn-left" )
- .addClass( "ui-btn-footer-right" );
- }
- });
-
- if ( $elFooter.is(".ui-footer-fixed") ) {
- $elFooter.css( "bottom", 0 );
+ /* set Title style */
+ if ( $elHeader.find("span.ui-title-text-sub").length ) {
+ $elHeader.addClass( "ui-title-multiline");
}
- /* Increase Content size with dummy <div> because of footer height */
- if ( $elFooter.length != 0 && $( event.target ).find( ".dummy-div" ).length == 0 ) {
- $( event.target ).find( ":jqmData(role='content')" ).append( '<div class="dummy-div"></div>' );
- $( ".dummy-div" )
- .css( "width", $elFooter.width() )
- .css( "height", $elFooter.height() );
+ if ( $elFooterGroup.find( "div" ).is( ".ui-controlgroup-label" ) ) {
+ $elFooterGroup.find( "div.ui-controlgroup-label" ).remove();
}
-
- $elFooter.show();
-
- /* Header position fix(remove transition) */
- next_id = $( event.target ).attr( "id" );
-
- $( "#" + next_id ).find( ":jqmData(role='header')" )
- .removeClass( "fade in out" )
- .appendTo( $.mobile.pageContainer );
},
_bindPageEvents: function () {
var self = this,
o = self.options,
- $el = self.element;
+ $el = self.element,
+ $elCurrentFooter;
//page event bindings
// Fixed toolbars require page zoom to be disabled, otherwise usability issues crop up
// This method is meant to disable zoom while a fixed-positioned toolbar page is visible
$el.closest( ".ui-page" )
.bind( "pagebeforeshow", function ( event ) {
+ var thisPage = this;
if ( o.disablePageZoom ) {
$.mobile.zoom.disable( true );
}
if ( !o.visibleOnPageShow ) {
self.hide( true );
}
-/* IME concenpt change after alpha2.0 */
-/* self._IMEShown = false;*/
- self.setHeaderFooter( event );
+ self.setHeaderFooter( thisPage );
+ self._setContentMinHeight( thisPage );
} )
.bind( "webkitAnimationStart animationstart updatelayout", function ( e, data ) {
+ var thisPage = this;
if ( o.updatePagePadding ) {
- self.updatePagePadding(data); // FIXME: unused function.
- self.updatePageLayout(data);
+ self.updatePagePadding(thisPage);
+ self.updatePageLayout( false, thisPage);
}
})
.bind( "pageshow", function ( event ) {
- self.updatePagePadding(); // FIXME: unused function.
- self._updateHeaderArea();
+ var thisPage = this;
+ self._setContentMinHeight( thisPage );
+ self.updatePagePadding( thisPage );
+ self._updateHeaderArea( thisPage );
if ( o.updatePagePadding ) {
$( window ).bind( "throttledresize." + self.widgetName, function () {
- self.updatePagePadding(); // FIXME: unused function.
-/* IME concenpt change after alpha2.0 */
-/* self.layoutPageIME();*/
- self.updatePageLayout();
- self._updateHeaderArea();
+ self.updatePagePadding(thisPage);
+
+ self.updatePageLayout( false, thisPage);
+ self._updateHeaderArea( thisPage );
+ self._setContentMinHeight( thisPage );
});
}
-
- /* Header position fix(remove transition) */
- $( "body" ).children( ":jqmData(role='header')" )
- .insertBefore( $(event.target).find(":jqmData(role='content')").eq( 0 ) );
-/* new_header */
})
.bind( "pagebeforehide", function ( e, ui ) {
}
}
});
+
+ window.addEventListener( "softkeyboardchange", function( e ) {
+ var thisPage = this;
+
+ if ( e.state == "on" ) {
+ $elCurrentFooter = $( ".ui-page-active .ui-footer" );
+ $elCurrentFooter.hide();
+ } else if (e.state == "off") {
+ $elCurrentFooter.show();
+ }
+ self.updatePagePadding( thisPage );
+ self.updatePageLayout( true, thisPage );
+ });
},
_bindContentControlEvents: function () {
});
},
- _updateHeaderArea : function() {
- var $elPage = $( ".ui-page-active" ),
+ _setContentMinHeight : function ( thisPage ) {
+ var $elPage = $( thisPage ),
+ $elHeader = $elPage.find( ":jqmData(role='header')" ),
+ $elFooter = $elPage.find( ":jqmData(role='footer')" ),
+ $elContent = $elPage.find( ":jqmData(role='content')" ),
+ resultMinHeight;
+
+ resultMinHeight = window.innerHeight - $elHeader.height() - $elFooter.height();
+
+ $elContent.css( "min-height", resultMinHeight - parseFloat( $elContent.css("padding-top") ) - parseFloat( $elContent.css("padding-bottom") ) + "px" );
+ },
+
+ _updateHeaderArea : function ( thisPage ) {
+ var $elPage = $( thisPage ),
$elHeader = $elPage.find( ":jqmData(role='header')" ).length ? $elPage.find( ":jqmData(role='header')") : $elPage.siblings( ":jqmData(role='header')"),
headerBtnNum = $elHeader.children("a").length,
headerSrcNum = $elHeader.children("img").length;
- $elHeader.find( "h1" ).css( "width", window.innerWidth - $elHeader.children( "a" ).width() * headerBtnNum - $elHeader.children( "a" ).width() / 4 - $elHeader.children( "img" ).width() * headerSrcNum * 3 );
+ if ( !$elPage.is( ".ui-dialog" ) ) {
+ $elHeader.find( "h1" ).css( "width", window.innerWidth - $elHeader.children( "a" ).width() * headerBtnNum - $elHeader.children( "a" ).width() / 4 - $elHeader.children( "img" ).width() * headerSrcNum * 4 );
+ }
/* add half width for default space between text and button, and img tag area is too narrow, so multiply three for img width*/
},
_visible: true,
-/* IME concenpt change after alpha2.0 */
-/* _IMEShown : false,
- _IMEindicatorHeight : window.outerHeight - window.innerHeight,
-
- layoutPageIME: function () {
- if ( $( document.activeElement ).is( "input" ) || $( document.activeElement ).is( "textarea" )
- || $(".ui-page-active .ui-header .input-search-bar").length
- || $(".ui-page-active .ui-content").find("input").length
- || $(".ui-page-active .ui-content").find("textarea").length) {
-
- if ( ( window.innerHeight + this._IMEindicatorHeight ) < window.outerHeight && window.innerWidth == window.outerWidth ) {
- if ( this._IMEShown === false ) {
- $( ".ui-page-active .ui-footer" ).hide();
- this._IMEShown = true;
- }
- } else if ( ( window.innerHeight + this._IMEindicatorHeight ) >= window.outerHeight ) {
- if ( this._IMEShown === true ) {
- $( ".ui-page-active .ui-footer" ).show();
- this._IMEShown = false;
- }
- }
- } else {
- if ( ( window.innerHeight + this._IMEindicatorHeight ) >= window.outerHeight ) {
- if ( this._IMEShown === true ) {
- $( ".ui-page-active .ui-footer" ).show();
- this._IMEShown = false;
- }
- }
- }
- },
-*/
+
// This will set the content element's top or bottom padding equal to the toolbar's height
- updatePagePadding: function (data) {
+ updatePagePadding: function ( tbPage ) {
var $el = this.element,
- header = $el.is( ".ui-header" );
+ header = $el.siblings( ".ui-header" ).length,
+ footer = $el.siblings( ".ui-footer" ).length;
// This behavior only applies to "fixed", not "fullscreen"
- if ( this.options.fullscreen ) { return; }
+ if ( this.options.fullscreen && imestatus ) { return; }
-// $el.closest( ".ui-page" ).css( "padding-" + ( header ? "top" : "bottom" ), $el.outerHeight() );
- },
+ tbPage = tbPage || $el.closest( ".ui-page" );
+ if ( $el.siblings( ".ui-header" ).jqmData("position") == "fixed" || $.support.scrollview ) {
+ $( tbPage ).css( "padding-top", ( header ? $el.siblings( ".ui-header" ).outerHeight() : 0 ) );
+ }
+ $( tbPage ).css( "padding-bottom", ( footer ? $el.siblings( ".ui-footer" ).outerHeight() : 0 ) );
+ },
- /* 1. Calculate toolbar width(only controlbar)
- * 2. Calculate and update content height */
- updatePageLayout: function ( receiveType ) {
+ /* 1. Calculate and update content height */
+ updatePageLayout: function ( receiveType, thisPage ) {
var $elFooter,
- $elFooterControlbar,
- $elPage = $( document ).find( ".ui-page-active" ),
+ $elPage = $( thisPage ),
$elHeader = $elPage.find( ":jqmData(role='header')" ),
$elContent = $elPage.find( ":jqmData(role='content')" ),
resultContentHeight = 0,
resultHeaderHeight = 0;
if ( $elPage.length ) {
- $elFooter = $( document ).find( ".ui-page-active" ).find( ":jqmData(role='footer')" );
+ $elFooter = $elPage.find( ":jqmData(role='footer')" );
} else {
$elFooter = $( document ).find( ":jqmData(role='footer')" ).eq( 0 );
}
- $elFooterControlbar = $elFooter.find( ".ui-navbar" );
// calculate footer height
resultFooterHeight = ( $elFooter.css( "display" ) == "none" ) ? 0 : $elFooter.height();
if (resultFooterHeight != 0 ) {
$elFooter.css( "bottom", 0 );
}
- if ( $elFooterControlbar.jqmData("style") == "toolbar" ) {
- $elFooterControlbar.css( "width", window.innerWidth - $elFooterControlbar.siblings( ".ui-btn" ).width() - parseInt($elFooterControlbar.siblings(".ui-btn").css("right"), 10 ) * 2 );
- }
resultContentHeight = window.innerHeight - resultFooterHeight - resultHeaderHeight;
if ( $.support.scrollview ) {
- if ( $elHeader.css("position") != "fixed" ) {
- $elHeader.css( "position", "fixed" );
- }
-
$elContent.height( resultContentHeight -
parseFloat( $elContent.css("padding-top") ) -
parseFloat( $elContent.css("padding-bottom") ) );
- } else {
- if ( $elHeader.css("position") != "fixed" ) {
- $elHeader.css( "position", "relative" );
- } else {
- $elContent.height( resultContentHeight );
- }
}
- // check this line need
- // because another style title will be not supported to updatePageLayout
-
- // in case title changed
+ // External call page( "refresh") - in case title changed
if ( receiveType ) {
- $elContent.css( "top", resultHeaderHeight + "px" );
+ $elPage
+ .css( "min-height", resultContentHeight )
+ .css( "padding-top", resultHeaderHeight )
+ .css( "padding-bottom", resultFooterHeight );
}
},
this[ this._visible ? "hide" : "show" ]();
},
- /* support external api for adding backbutton via javascript */
-/* backButton: function ( target, status ){
- this._addBackbutton( target, "external" );
- },
-*/
destroy: function () {
this.element.removeClass( "ui-header-fixed ui-footer-fixed ui-header-fullscreen ui-footer-fullscreen in out fade slidedown slideup ui-fixed-hidden" );
this.element.closest( ".ui-page" ).removeClass( "ui-page-header-fixed ui-page-footer-fixed ui-page-header-fullscreen ui-page-footer-fullscreen" );
}
-
});
//auto self-init widgets