Permalink
Browse files

Popup: Implement classes option

Fixes gh-7686
  • Loading branch information...
gabrielschulhof committed Mar 1, 2015
1 parent b5d6ec3 commit 87763c8e8facad480d471b07870c263ee8bba2c6
View
@@ -93,7 +93,9 @@
'widgets/fixedToolbar.workarounds.js',
'widgets/panel.js',
'widgets/popup.js',
'widgets/popup.backcompat.js',
'widgets/popup.arrow.js',
'widgets/popup.arrow.backcompat.js',
'widgets/table.js',
'widgets/table.columntoggle.js',
'widgets/table.reflow.js',
View
@@ -58,7 +58,9 @@
"./widgets/fixedToolbar.backcompat",
"./widgets/fixedToolbar.workarounds",
"./widgets/popup",
"./widgets/popup.backcompat",
"./widgets/popup.arrow",
"./widgets/popup.arrow.backcompat",
"./widgets/panel",
"./widgets/table",
"./widgets/table.columntoggle",
@@ -0,0 +1,80 @@
/*!
* jQuery Mobile Popup Backcompat @VERSION
* http://jquerymobile.com
*
* Copyright jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*/
//>>label: Popups
//>>group: Widgets
//>>description: Deprecated popup arrow features
( function( factory ) {
if ( typeof define === "function" && define.amd ) {
// AMD. Register as an anonymous module.
define( [
"jquery",
"./popup.backcompat",
"./popup.arrow" ], factory );
} else {
// Browser globals
factory( jQuery );
}
} )( function( $ ) {
if ( $.mobileBackcompat !== false ) {
var classSplitterRegex = /\S+/g,
toggleClass = function( classValue, oneClass, add ) {
var index;
classValue = classValue.match( classSplitterRegex ) || [];
index = $.inArray( oneClass, classValue );
if ( add && index === -1 ) {
classValue.push( oneClass );
} else if ( !add && index >= 0 ) {
classValue.splice( index, 1 );
}
return classValue.join( " " );
};
$.widget( "mobile.popup", $.mobile.popup, {
_setInitialOptions: function() {
var classes = this.options.classes;
this._super();
// If the value for the ui-popup-arrow class key has not changed we assume we're
// dealing with legacy code, so we make sure the presence of the ui-overlay-shadow
// class in the ui-popup-arrow key reflects the value of the "shadow" option.
if ( classes[ "ui-popup-arrow" ] ===
$[ this.namespace ][ this.widgetName ].prototype.options
.classes[ "ui-popup-arrow" ] ) {
classes[ "ui-popup-arrow" ] = toggleClass( classes[ "ui-popup-arrow" ],
"ui-overlay-shadow", this.options.shadow );
}
},
_optionsToClasses: function( option, value ) {
this._super( option, value );
if ( option === "shadow" ) {
this.option( "classes.ui-popup-arrow",
toggleClass( this.options.classes[ "ui-popup-arrow" ], "ui-overlay-shadow",
value ) );
}
}
} );
}
return $.mobile.popup;
} );
View
@@ -31,9 +31,15 @@
var ieHack = ( $.mobile.browser.oldIE && $.mobile.browser.oldIE <= 8 ),
uiTemplate = $(
"<div class='ui-popup-arrow-guide'></div>" +
"<div class='ui-popup-arrow-container" + ( ieHack ? " ie" : "" ) + "'>" +
"<div class='ui-popup-arrow'></div>" +
// guide
"<div></div>" +
// container
"<div>" +
// arrow
"<div></div>" +
"</div>"
);
@@ -48,7 +54,9 @@ function getArrow() {
return $.widget( "mobile.popup", $.mobile.popup, {
options: {
classes: {
"ui-popup-arrow": "ui-overlay-shadow"
},
arrow: ""
},
@@ -64,12 +72,13 @@ return $.widget( "mobile.popup", $.mobile.popup, {
},
_addArrow: function() {
var theme,
opts = this.options,
ar = getArrow();
var ar = getArrow();
this._addClass( ar.gd, "ui-popup-arrow-guide" );
this._addClass( ar.ct, "ui-popup-arrow-container", ieHack ? "ie" : "" );
this._addClass( ar.ar, "ui-popup-arrow",
this._themeClassFromOption( "ui-body-", this.options.theme ) );
theme = this._themeClassFromOption( "ui-body-", opts.theme );
ar.ar.addClass( theme + ( opts.shadow ? " ui-overlay-shadow" : "" ) );
ar.arEls.hide().appendTo( this.element );
return ar;
@@ -188,9 +197,10 @@ return $.widget( "mobile.popup", $.mobile.popup, {
}
// Move the arrow into place
this._removeClass( ar.ct,
"ui-popup-arrow-l ui-popup-arrow-t ui-popup-arrow-r ui-popup-arrow-b" )
._addClass( ar.ct, "ui-popup-arrow-" + best.dir );
ar.ct
.removeClass( "ui-popup-arrow-l ui-popup-arrow-t ui-popup-arrow-r ui-popup-arrow-b" )
.addClass( "ui-popup-arrow-" + best.dir )
.removeAttr( "style" ).css( best.posProp, best.posVal )
.show();
@@ -222,7 +232,7 @@ return $.widget( "mobile.popup", $.mobile.popup, {
return;
} else if ( ar && !opts.arrow ) {
ar.arEls.remove();
this._ui.arrow = null;
delete this._ui.arrow;
}
}
@@ -233,11 +243,8 @@ return $.widget( "mobile.popup", $.mobile.popup, {
if ( opts.theme !== undefined ) {
oldTheme = this._themeClassFromOption( "ui-body-", oldTheme );
newTheme = this._themeClassFromOption( "ui-body-", opts.theme );
ar.ar.removeClass( oldTheme ).addClass( newTheme );
}
if ( opts.shadow !== undefined ) {
ar.ar.toggleClass( "ui-overlay-shadow", opts.shadow );
this._removeClass( ar.ar, null, oldTheme )
._addClass( ar.ar, null, newTheme );
}
}
@@ -0,0 +1,48 @@
/*!
* jQuery Mobile Popup Backcompat @VERSION
* http://jquerymobile.com
*
* Copyright jQuery Foundation and other contributors
* Released under the MIT license.
* http://jquery.org/license
*/
//>>label: Popups
//>>group: Widgets
//>>description: Deprecated popup features
( function( factory ) {
if ( typeof define === "function" && define.amd ) {
// AMD. Register as an anonymous module.
define( [
"jquery",
"./widget.backcompat",
"./popup" ], factory );
} else {
// Browser globals
factory( jQuery );
}
} )( function( $ ) {
if ( $.mobileBackcompat !== false ) {
$.widget( "mobile.popup", $.mobile.popup, {
options: {
wrapperClass: null,
shadow: true,
corners: true
},
classProp: "ui-popup"
} );
$.widget( "mobile.popup", $.mobile.popup, $.mobile.widget.backcompat );
$.mobile.popup.prototype._boolOptions.shadow = "ui-overlay-shadow";
}
return $.mobile.popup;
} );
Oops, something went wrong.

0 comments on commit 87763c8

Please sign in to comment.