mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
trim jquery mobile
This commit is contained in:
Luke Pulverenti
parent
d8a7a9ff37
commit
d50e6c28f2
5 changed files with 146 additions and 1508 deletions
|
|
@ -4903,112 +4903,6 @@ $.fn.grid = function( options ) {
|
|||
$.mobile.pageContainer.toggleClass( "ui-mobile-viewport-transitioning viewport-" + this.name );
|
||||
},
|
||||
|
||||
slide: function (Velocity) {
|
||||
|
||||
var trans = this;
|
||||
|
||||
if (trans.reverse) {
|
||||
|
||||
$(trans.$from).show().css('left', '0').css('right', '0');
|
||||
|
||||
Velocity.animate($(trans.$from)[0], { "left": "100%", "right": "-100%" },
|
||||
{
|
||||
easing: "ease-in-out",
|
||||
duration: 800,
|
||||
|
||||
begin: function (elements, complete, remaining, start, tweenValue) {
|
||||
|
||||
$(trans.$to).show().css('left', '-100%').css('right', '100%');
|
||||
|
||||
Velocity.animate($(trans.$to)[0], { "left": "0", "right": "0" },
|
||||
{
|
||||
complete: function () {
|
||||
$(trans.$from).hide();
|
||||
trans.toggleViewportClass();
|
||||
trans.deferred.resolve(trans.name, trans.reverse, trans.$to, trans.$from, true);
|
||||
},
|
||||
|
||||
easing: "ease-in-out",
|
||||
duration: 800
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
Velocity.animate($(trans.$from)[0], {
|
||||
"left": "-100%",
|
||||
"right": "100%"
|
||||
},
|
||||
{
|
||||
easing: "ease-in-out",
|
||||
duration: 800,
|
||||
|
||||
begin: function (elements, complete, remaining, start, tweenValue) {
|
||||
|
||||
$(trans.$to).show().css('left', '100%');
|
||||
|
||||
Velocity.animate($(trans.$to)[0], { "left": "0px" },
|
||||
{
|
||||
complete: function () {
|
||||
$(trans.$from).hide();
|
||||
trans.toggleViewportClass();
|
||||
trans.deferred.resolve(trans.name, trans.reverse, trans.$to, trans.$from, true);
|
||||
},
|
||||
|
||||
easing: "ease-in-out",
|
||||
duration: 800
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
slideUp: function (Velocity) {
|
||||
|
||||
var trans = this;
|
||||
|
||||
if (trans.reverse) {
|
||||
|
||||
$(trans.$to).show();
|
||||
|
||||
Velocity.animate($(trans.$from)[0], { "top": "100%", bottom: '-100%' },
|
||||
{
|
||||
complete: function () {
|
||||
$(trans.$from).hide();
|
||||
trans.toggleViewportClass();
|
||||
trans.deferred.resolve(trans.name, trans.reverse, trans.$to, trans.$from, true);
|
||||
},
|
||||
|
||||
easing: "ease-in-out",
|
||||
duration: 800
|
||||
|
||||
});
|
||||
|
||||
} else {
|
||||
|
||||
$(trans.$to).show().css('top', '100%').css('bottom', '-100%');
|
||||
|
||||
Velocity.animate($(trans.$to)[0], { "top": "0px", bottom: 0 },
|
||||
{
|
||||
complete: function () {
|
||||
$(trans.$from).hide();
|
||||
trans.toggleViewportClass();
|
||||
trans.deferred.resolve(trans.name, trans.reverse, trans.$to, trans.$from, true);
|
||||
},
|
||||
|
||||
easing: "ease-in-out",
|
||||
duration: 800
|
||||
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
transition: function() {
|
||||
// NOTE many of these could be calculated/recorded in the constructor, it's my
|
||||
// opinion that binding them as late as possible has value with regards to
|
||||
|
|
@ -5030,25 +4924,11 @@ $.fn.grid = function( options ) {
|
|||
|
||||
this.toggleViewportClass();
|
||||
|
||||
if (none) {
|
||||
if (this.$from && !none) {
|
||||
this.startOut(screenHeight, reverseClass, none);
|
||||
} else {
|
||||
this.doneOut(screenHeight, reverseClass, none, true);
|
||||
}
|
||||
} else {
|
||||
|
||||
var trans = this;
|
||||
|
||||
require(["jquery", "velocity"], function (d, Velocity) {
|
||||
|
||||
if (trans.name == 'slideup') {
|
||||
trans.slideUp(Velocity);
|
||||
} else {
|
||||
trans.slide(Velocity);
|
||||
}
|
||||
});
|
||||
}
|
||||
if ( this.$from && !none ) {
|
||||
this.startOut( screenHeight, reverseClass, none );
|
||||
} else {
|
||||
this.doneOut( screenHeight, reverseClass, none, true );
|
||||
}
|
||||
|
||||
return this.deferred.promise();
|
||||
}
|
||||
|
|
@ -7088,14 +6968,6 @@ $.mobile.links = function( target ) {
|
|||
})( jQuery );
|
||||
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.mobile.nojs = function( target ) {
|
||||
$( ":jqmData(role='nojs')", target ).addClass( "ui-nojs" );
|
||||
};
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $ ) {
|
||||
var meta = $( "meta[name=viewport]" ),
|
||||
initialContent = meta.attr( "content" ),
|
||||
|
|
@ -7130,50 +7002,6 @@ $.mobile.nojs = function( target ) {
|
|||
|
||||
}( jQuery ));
|
||||
|
||||
/*
|
||||
* fallback transition for pop in non-3D supporting browsers (which tend to handle complex transitions poorly in general
|
||||
*/
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
$.mobile.transitionFallbacks.pop = "fade";
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
/*
|
||||
* fallback transition for slide in non-3D supporting browsers (which tend to handle complex transitions poorly in general
|
||||
*/
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
// Use the simultaneous transitions handler for slide transitions
|
||||
$.mobile.transitionHandlers.slide = $.mobile.transitionHandlers.simultaneous;
|
||||
|
||||
// Set the slide transitions's fallback to "fade"
|
||||
$.mobile.transitionFallbacks.slide = "fade";
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
/*
|
||||
* fallback transition for slidedown in non-3D supporting browsers (which tend to handle complex transitions poorly in general
|
||||
*/
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
$.mobile.transitionFallbacks.slidedown = "fade";
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
/*
|
||||
* fallback transition for slideup in non-3D supporting browsers (which tend to handle complex transitions poorly in general
|
||||
*/
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
$.mobile.transitionFallbacks.slideup = "fade";
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
var uiScreenHiddenRegex = /\bui-screen-hidden\b/;
|
||||
|
|
@ -7745,164 +7573,6 @@ $.widget( "mobile.controlgroup", $.extend( {
|
|||
|
||||
})(jQuery);
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
$.widget( "mobile.dialog", {
|
||||
options: {
|
||||
|
||||
// Accepts left, right and none
|
||||
closeBtn: "left",
|
||||
closeBtnText: "Close",
|
||||
overlayTheme: "a",
|
||||
corners: true
|
||||
},
|
||||
|
||||
// Override the theme set by the page plugin on pageshow
|
||||
_handlePageBeforeShow: function() {
|
||||
this._isCloseable = true;
|
||||
if ( this.options.overlayTheme ) {
|
||||
this.element
|
||||
.page( "removeContainerBackground" )
|
||||
.page( "setContainerBackground", this.options.overlayTheme );
|
||||
}
|
||||
},
|
||||
|
||||
_handlePageBeforeHide: function() {
|
||||
this._isCloseable = false;
|
||||
},
|
||||
|
||||
// click and submit events:
|
||||
// - clicks and submits should use the closing transition that the dialog
|
||||
// opened with unless a data-transition is specified on the link/form
|
||||
// - if the click was on the close button, or the link has a data-rel="back"
|
||||
// it'll go back in history naturally
|
||||
_handleVClickSubmit: function( event ) {
|
||||
var attrs,
|
||||
$target = $( event.target ).closest( event.type === "vclick" ? "a" : "form" );
|
||||
|
||||
if ( $target.length && !$target.jqmData( "transition" ) ) {
|
||||
attrs = {};
|
||||
attrs[ "data-" + $.mobile.ns + "transition" ] =
|
||||
( $.mobile.navigate.history.getActive() || {} )[ "transition" ] ||
|
||||
$.mobile.defaultDialogTransition;
|
||||
attrs[ "data-" + $.mobile.ns + "direction" ] = "reverse";
|
||||
$target.attr( attrs );
|
||||
}
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
var elem = this.element,
|
||||
opts = this.options;
|
||||
|
||||
// Class the markup for dialog styling and wrap interior
|
||||
elem.addClass( "ui-dialog" )
|
||||
.wrapInner( $( "<div/>", {
|
||||
|
||||
// ARIA role
|
||||
"role" : "dialog",
|
||||
"class" : "ui-dialog-contain ui-overlay-shadow" +
|
||||
( !!opts.corners ? " ui-corner-all" : "" )
|
||||
}));
|
||||
|
||||
$.extend( this, {
|
||||
_isCloseable: false,
|
||||
_inner: elem.children(),
|
||||
_headerCloseButton: null
|
||||
});
|
||||
|
||||
this._on( elem, {
|
||||
vclick: "_handleVClickSubmit",
|
||||
submit: "_handleVClickSubmit",
|
||||
pagebeforeshow: "_handlePageBeforeShow",
|
||||
pagebeforehide: "_handlePageBeforeHide"
|
||||
});
|
||||
|
||||
this._setCloseBtn( opts.closeBtn );
|
||||
},
|
||||
|
||||
_setOptions: function( options ) {
|
||||
var closeButtonLocation, closeButtonText,
|
||||
currentOpts = this.options;
|
||||
|
||||
if ( options.corners !== undefined ) {
|
||||
this._inner.toggleClass( "ui-corner-all", !!options.corners );
|
||||
}
|
||||
|
||||
if ( options.overlayTheme !== undefined ) {
|
||||
if ( $.mobile.activePage[ 0 ] === this.element[ 0 ] ) {
|
||||
currentOpts.overlayTheme = options.overlayTheme;
|
||||
this._handlePageBeforeShow();
|
||||
}
|
||||
}
|
||||
|
||||
if ( options.closeBtnText !== undefined ) {
|
||||
closeButtonLocation = currentOpts.closeBtn;
|
||||
closeButtonText = options.closeBtnText;
|
||||
}
|
||||
|
||||
if ( options.closeBtn !== undefined ) {
|
||||
closeButtonLocation = options.closeBtn;
|
||||
}
|
||||
|
||||
if ( closeButtonLocation ) {
|
||||
this._setCloseBtn( closeButtonLocation, closeButtonText );
|
||||
}
|
||||
|
||||
this._super( options );
|
||||
},
|
||||
|
||||
_setCloseBtn: function( location, text ) {
|
||||
var dst,
|
||||
btn = this._headerCloseButton;
|
||||
|
||||
// Sanitize value
|
||||
location = "left" === location ? "left" : "right" === location ? "right" : "none";
|
||||
|
||||
if ( "none" === location ) {
|
||||
if ( btn ) {
|
||||
btn.remove();
|
||||
btn = null;
|
||||
}
|
||||
} else if ( btn ) {
|
||||
btn.removeClass( "ui-btn-left ui-btn-right" ).addClass( "ui-btn-" + location );
|
||||
if ( text ) {
|
||||
btn.text( text );
|
||||
}
|
||||
} else {
|
||||
dst = this._inner.find( ":jqmData(role='header')" ).first();
|
||||
btn = $( "<a></a>", {
|
||||
"role": "button",
|
||||
"href": "#",
|
||||
"class": "ui-btn ui-corner-all ui-icon-delete ui-btn-icon-notext ui-btn-" + location
|
||||
})
|
||||
.text( text || this.options.closeBtnText || "" )
|
||||
.prependTo( dst );
|
||||
this._on( btn, { click: "close" } );
|
||||
}
|
||||
|
||||
this._headerCloseButton = btn;
|
||||
},
|
||||
|
||||
// Close method goes back in history
|
||||
close: function() {
|
||||
var hist = $.mobile.navigate.history;
|
||||
|
||||
if ( this._isCloseable ) {
|
||||
this._isCloseable = false;
|
||||
// If the hash listening is enabled and there is at least one preceding history
|
||||
// entry it's ok to go back. Initial pages with the dialog hash state are an example
|
||||
// where the stack check is necessary
|
||||
if ( $.mobile.hashListeningEnabled && hist.activeIndex > 0 ) {
|
||||
$.mobile.back();
|
||||
} else {
|
||||
$.mobile.pageContainer.pagecontainer( "back" );
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.textinput", {
|
||||
|
|
@ -8756,133 +8426,6 @@ $.widget( "mobile.checkboxradio", $.extend( {
|
|||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.textinput", $.mobile.textinput, {
|
||||
options: {
|
||||
clearBtn: false,
|
||||
clearBtnText: "Clear text"
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
this._super();
|
||||
|
||||
if ( this.isSearch ) {
|
||||
this.options.clearBtn = true;
|
||||
}
|
||||
|
||||
if ( !!this.options.clearBtn && this.inputNeedsWrap ) {
|
||||
this._addClearBtn();
|
||||
}
|
||||
},
|
||||
|
||||
clearButton: function() {
|
||||
return $( "<a href='#' tabindex='-1' aria-hidden='true' " +
|
||||
"class='ui-input-clear ui-btn ui-icon-delete ui-btn-icon-notext ui-corner-all'>" +
|
||||
"</a>" )
|
||||
.attr( "title", this.options.clearBtnText )
|
||||
.text( this.options.clearBtnText );
|
||||
},
|
||||
|
||||
_clearBtnClick: function( event ) {
|
||||
this.element.val( "" )
|
||||
.focus()
|
||||
.trigger( "change" );
|
||||
|
||||
this._clearBtn.addClass( "ui-input-clear-hidden" );
|
||||
event.preventDefault();
|
||||
},
|
||||
|
||||
_addClearBtn: function() {
|
||||
|
||||
if ( !this.options.enhanced ) {
|
||||
this._enhanceClear();
|
||||
}
|
||||
|
||||
$.extend( this, {
|
||||
_clearBtn: this.widget().find("a.ui-input-clear")
|
||||
});
|
||||
|
||||
this._bindClearEvents();
|
||||
|
||||
this._toggleClear();
|
||||
|
||||
},
|
||||
|
||||
_enhanceClear: function() {
|
||||
|
||||
this.clearButton().appendTo( this.widget() );
|
||||
this.widget().addClass( "ui-input-has-clear" );
|
||||
|
||||
},
|
||||
|
||||
_bindClearEvents: function() {
|
||||
|
||||
this._on( this._clearBtn, {
|
||||
"click": "_clearBtnClick"
|
||||
});
|
||||
|
||||
this._on({
|
||||
"keyup": "_toggleClear",
|
||||
"change": "_toggleClear",
|
||||
"input": "_toggleClear",
|
||||
"focus": "_toggleClear",
|
||||
"blur": "_toggleClear",
|
||||
"cut": "_toggleClear",
|
||||
"paste": "_toggleClear"
|
||||
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
_unbindClear: function() {
|
||||
this._off( this._clearBtn, "click");
|
||||
this._off( this.element, "keyup change input focus blur cut paste" );
|
||||
},
|
||||
|
||||
_setOptions: function( options ) {
|
||||
this._super( options );
|
||||
|
||||
if ( options.clearBtn !== undefined &&
|
||||
!this.element.is( "textarea, :jqmData(type='range')" ) ) {
|
||||
if ( options.clearBtn ) {
|
||||
this._addClearBtn();
|
||||
} else {
|
||||
this._destroyClear();
|
||||
}
|
||||
}
|
||||
|
||||
if ( options.clearBtnText !== undefined && this._clearBtn !== undefined ) {
|
||||
this._clearBtn.text( options.clearBtnText )
|
||||
.attr("title", options.clearBtnText);
|
||||
}
|
||||
},
|
||||
|
||||
_toggleClear: function() {
|
||||
this._delay( "_toggleClearClass", 0 );
|
||||
},
|
||||
|
||||
_toggleClearClass: function() {
|
||||
this._clearBtn.toggleClass( "ui-input-clear-hidden", !this.element.val() );
|
||||
},
|
||||
|
||||
_destroyClear: function() {
|
||||
this.widget().removeClass( "ui-input-has-clear" );
|
||||
this._unbindClear();
|
||||
this._clearBtn.remove();
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
this._super();
|
||||
if ( this.options.clearBtn ) {
|
||||
this._destroyClear();
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.flipswitch", $.extend({
|
||||
|
|
@ -10565,99 +10108,6 @@ $.widget( "mobile.listview", $.extend( {
|
|||
|
||||
(function( $, undefined ) {
|
||||
|
||||
function defaultAutodividersSelector( elt ) {
|
||||
// look for the text in the given element
|
||||
var text = $.trim( elt.text() ) || null;
|
||||
|
||||
if ( !text ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
// create the text for the divider (first uppercased letter)
|
||||
text = text.slice( 0, 1 ).toUpperCase();
|
||||
|
||||
return text;
|
||||
}
|
||||
|
||||
$.widget( "mobile.listview", $.mobile.listview, {
|
||||
options: {
|
||||
autodividers: false,
|
||||
autodividersSelector: defaultAutodividersSelector
|
||||
},
|
||||
|
||||
_beforeListviewRefresh: function() {
|
||||
if ( this.options.autodividers ) {
|
||||
this._replaceDividers();
|
||||
this._superApply( arguments );
|
||||
}
|
||||
},
|
||||
|
||||
_replaceDividers: function() {
|
||||
var i, lis, li, dividerText,
|
||||
lastDividerText = null,
|
||||
list = this.element,
|
||||
divider;
|
||||
|
||||
list.children( "li:jqmData(role='list-divider')" ).remove();
|
||||
|
||||
lis = list.children( "li" );
|
||||
|
||||
for ( i = 0; i < lis.length ; i++ ) {
|
||||
li = lis[ i ];
|
||||
dividerText = this.options.autodividersSelector( $( li ) );
|
||||
|
||||
if ( dividerText && lastDividerText !== dividerText ) {
|
||||
divider = document.createElement( "li" );
|
||||
divider.appendChild( document.createTextNode( dividerText ) );
|
||||
divider.setAttribute( "data-" + $.mobile.ns + "role", "list-divider" );
|
||||
li.parentNode.insertBefore( divider, li );
|
||||
}
|
||||
|
||||
lastDividerText = dividerText;
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
var rdivider = /(^|\s)ui-li-divider($|\s)/,
|
||||
rhidden = /(^|\s)ui-screen-hidden($|\s)/;
|
||||
|
||||
$.widget( "mobile.listview", $.mobile.listview, {
|
||||
options: {
|
||||
hideDividers: false
|
||||
},
|
||||
|
||||
_afterListviewRefresh: function() {
|
||||
var items, idx, item, hideDivider = true;
|
||||
|
||||
this._superApply( arguments );
|
||||
|
||||
if ( this.options.hideDividers ) {
|
||||
items = this._getChildrenByTagName( this.element[ 0 ], "li", "LI" );
|
||||
for ( idx = items.length - 1 ; idx > -1 ; idx-- ) {
|
||||
item = items[ idx ];
|
||||
if ( item.className.match( rdivider ) ) {
|
||||
if ( hideDivider ) {
|
||||
item.className = item.className + " ui-screen-hidden";
|
||||
}
|
||||
hideDivider = true;
|
||||
} else {
|
||||
if ( !item.className.match( rhidden ) ) {
|
||||
hideDivider = false;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.navbar", {
|
||||
options: {
|
||||
iconpos: "top",
|
||||
|
|
@ -10720,124 +10170,6 @@ $.widget( "mobile.navbar", {
|
|||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, window, undefined ) {
|
||||
|
||||
$.widget( "mobile.page", $.mobile.page, {
|
||||
options: {
|
||||
|
||||
// Accepts left, right and none
|
||||
closeBtn: "left",
|
||||
closeBtnText: "Close",
|
||||
overlayTheme: "a",
|
||||
corners: true,
|
||||
dialog: false
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
this._super();
|
||||
if ( this.options.dialog ) {
|
||||
|
||||
$.extend( this, {
|
||||
_inner: this.element.children(),
|
||||
_headerCloseButton: null
|
||||
});
|
||||
|
||||
if ( !this.options.enhanced ) {
|
||||
this._setCloseBtn( this.options.closeBtn );
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
_enhance: function() {
|
||||
this._super();
|
||||
|
||||
// Class the markup for dialog styling and wrap interior
|
||||
if ( this.options.dialog ) {
|
||||
this.element.addClass( "ui-dialog" )
|
||||
.wrapInner( $( "<div/>", {
|
||||
|
||||
// ARIA role
|
||||
"role" : "dialog",
|
||||
"class" : "ui-dialog-contain ui-overlay-shadow" +
|
||||
( this.options.corners ? " ui-corner-all" : "" )
|
||||
}));
|
||||
}
|
||||
},
|
||||
|
||||
_setOptions: function( options ) {
|
||||
var closeButtonLocation, closeButtonText,
|
||||
currentOpts = this.options;
|
||||
|
||||
if ( options.corners !== undefined ) {
|
||||
this._inner.toggleClass( "ui-corner-all", !!options.corners );
|
||||
}
|
||||
|
||||
if ( options.overlayTheme !== undefined ) {
|
||||
if ( $.mobile.activePage[ 0 ] === this.element[ 0 ] ) {
|
||||
currentOpts.overlayTheme = options.overlayTheme;
|
||||
this._handlePageBeforeShow();
|
||||
}
|
||||
}
|
||||
|
||||
if ( options.closeBtnText !== undefined ) {
|
||||
closeButtonLocation = currentOpts.closeBtn;
|
||||
closeButtonText = options.closeBtnText;
|
||||
}
|
||||
|
||||
if ( options.closeBtn !== undefined ) {
|
||||
closeButtonLocation = options.closeBtn;
|
||||
}
|
||||
|
||||
if ( closeButtonLocation ) {
|
||||
this._setCloseBtn( closeButtonLocation, closeButtonText );
|
||||
}
|
||||
|
||||
this._super( options );
|
||||
},
|
||||
|
||||
_handlePageBeforeShow: function () {
|
||||
if ( this.options.overlayTheme && this.options.dialog ) {
|
||||
this.removeContainerBackground();
|
||||
this.setContainerBackground( this.options.overlayTheme );
|
||||
} else {
|
||||
this._super();
|
||||
}
|
||||
},
|
||||
|
||||
_setCloseBtn: function( location, text ) {
|
||||
var dst,
|
||||
btn = this._headerCloseButton;
|
||||
|
||||
// Sanitize value
|
||||
location = "left" === location ? "left" : "right" === location ? "right" : "none";
|
||||
|
||||
if ( "none" === location ) {
|
||||
if ( btn ) {
|
||||
btn.remove();
|
||||
btn = null;
|
||||
}
|
||||
} else if ( btn ) {
|
||||
btn.removeClass( "ui-btn-left ui-btn-right" ).addClass( "ui-btn-" + location );
|
||||
if ( text ) {
|
||||
btn.text( text );
|
||||
}
|
||||
} else {
|
||||
dst = this._inner.find( ":jqmData(role='header')" ).first();
|
||||
btn = $( "<a></a>", {
|
||||
"href": "#",
|
||||
"class": "ui-btn ui-corner-all ui-icon-delete ui-btn-icon-notext ui-btn-" + location
|
||||
})
|
||||
.attr( "data-" + $.mobile.ns + "rel", "back" )
|
||||
.text( text || this.options.closeBtnText || "" )
|
||||
.prependTo( dst );
|
||||
}
|
||||
|
||||
this._headerCloseButton = btn;
|
||||
}
|
||||
});
|
||||
|
||||
})( jQuery, this );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.panel", {
|
||||
|
|
@ -12604,231 +11936,6 @@ $.widget( "mobile.table", {
|
|||
})( jQuery );
|
||||
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.table", $.mobile.table, {
|
||||
options: {
|
||||
mode: "columntoggle",
|
||||
columnBtnTheme: null,
|
||||
columnPopupTheme: null,
|
||||
columnBtnText: "Columns...",
|
||||
classes: $.extend( $.mobile.table.prototype.options.classes, {
|
||||
popup: "ui-table-columntoggle-popup",
|
||||
columnBtn: "ui-table-columntoggle-btn",
|
||||
priorityPrefix: "ui-table-priority-",
|
||||
columnToggleTable: "ui-table-columntoggle"
|
||||
})
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
this._super();
|
||||
|
||||
if ( this.options.mode !== "columntoggle" ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$.extend( this, {
|
||||
_menu: null
|
||||
});
|
||||
|
||||
if ( this.options.enhanced ) {
|
||||
this._menu = $( this.document[ 0 ].getElementById( this._id() + "-popup" ) ).children().first();
|
||||
this._addToggles( this._menu, true );
|
||||
} else {
|
||||
this._menu = this._enhanceColToggle();
|
||||
this.element.addClass( this.options.classes.columnToggleTable );
|
||||
}
|
||||
|
||||
this._setupEvents();
|
||||
|
||||
this._setToggleState();
|
||||
},
|
||||
|
||||
_id: function() {
|
||||
return ( this.element.attr( "id" ) || ( this.widgetName + this.uuid ) );
|
||||
},
|
||||
|
||||
_setupEvents: function() {
|
||||
//NOTE: inputs are bound in bindToggles,
|
||||
// so it can be called on refresh, too
|
||||
|
||||
// update column toggles on resize
|
||||
this._on( this.window, {
|
||||
throttledresize: "_setToggleState"
|
||||
});
|
||||
this._on( this._menu, {
|
||||
"change input": "_menuInputChange"
|
||||
});
|
||||
},
|
||||
|
||||
_addToggles: function( menu, keep ) {
|
||||
var inputs,
|
||||
checkboxIndex = 0,
|
||||
opts = this.options,
|
||||
container = menu.controlgroup( "container" );
|
||||
|
||||
// allow update of menu on refresh (fixes #5880)
|
||||
if ( keep ) {
|
||||
inputs = menu.find( "input" );
|
||||
} else {
|
||||
container.empty();
|
||||
}
|
||||
|
||||
// create the hide/show toggles
|
||||
this.headers.not( "td" ).each( function() {
|
||||
var input, cells,
|
||||
header = $( this ),
|
||||
priority = $.mobile.getAttribute( this, "priority" );
|
||||
|
||||
if ( priority ) {
|
||||
cells = header.add( header.jqmData( "cells" ) );
|
||||
cells.addClass( opts.classes.priorityPrefix + priority );
|
||||
|
||||
// Make sure the (new?) checkbox is associated with its header via .jqmData() and
|
||||
// that, vice versa, the header is also associated with the checkbox
|
||||
input = ( keep ? inputs.eq( checkboxIndex++ ) :
|
||||
$("<label><input type='checkbox' checked />" +
|
||||
( header.children( "abbr" ).first().attr( "title" ) ||
|
||||
header.text() ) +
|
||||
"</label>" )
|
||||
.appendTo( container )
|
||||
.children( 0 )
|
||||
.checkboxradio( {
|
||||
theme: opts.columnPopupTheme
|
||||
}) )
|
||||
|
||||
// Associate the header with the checkbox
|
||||
.jqmData( "header", header )
|
||||
.jqmData( "cells", cells );
|
||||
|
||||
// Associate the checkbox with the header
|
||||
header.jqmData( "input", input );
|
||||
}
|
||||
});
|
||||
|
||||
// set bindings here
|
||||
if ( !keep ) {
|
||||
menu.controlgroup( "refresh" );
|
||||
}
|
||||
},
|
||||
|
||||
_menuInputChange: function( evt ) {
|
||||
var input = $( evt.target ),
|
||||
checked = input[ 0 ].checked;
|
||||
|
||||
input.jqmData( "cells" )
|
||||
.toggleClass( "ui-table-cell-hidden", !checked )
|
||||
.toggleClass( "ui-table-cell-visible", checked );
|
||||
},
|
||||
|
||||
_unlockCells: function( cells ) {
|
||||
// allow hide/show via CSS only = remove all toggle-locks
|
||||
cells.removeClass( "ui-table-cell-hidden ui-table-cell-visible");
|
||||
},
|
||||
|
||||
_enhanceColToggle: function() {
|
||||
var id , menuButton, popup, menu,
|
||||
table = this.element,
|
||||
opts = this.options,
|
||||
ns = $.mobile.ns,
|
||||
fragment = this.document[ 0 ].createDocumentFragment();
|
||||
|
||||
id = this._id() + "-popup";
|
||||
menuButton = $( "<a href='#" + id + "' " +
|
||||
"class='" + opts.classes.columnBtn + " ui-btn " +
|
||||
"ui-btn-" + ( opts.columnBtnTheme || "a" ) +
|
||||
" ui-corner-all ui-shadow ui-mini' " +
|
||||
"data-" + ns + "rel='popup'>" + opts.columnBtnText + "</a>" );
|
||||
popup = $( "<div class='" + opts.classes.popup + "' id='" + id + "'></div>" );
|
||||
menu = $( "<fieldset></fieldset>" ).controlgroup();
|
||||
|
||||
// set extension here, send "false" to trigger build/rebuild
|
||||
this._addToggles( menu, false );
|
||||
|
||||
menu.appendTo( popup );
|
||||
|
||||
fragment.appendChild( popup[ 0 ] );
|
||||
fragment.appendChild( menuButton[ 0 ] );
|
||||
table.before( fragment );
|
||||
|
||||
popup.popup();
|
||||
|
||||
return menu;
|
||||
},
|
||||
|
||||
rebuild: function() {
|
||||
this._super();
|
||||
|
||||
if ( this.options.mode === "columntoggle" ) {
|
||||
// NOTE: rebuild passes "false", while refresh passes "undefined"
|
||||
// both refresh the table, but inside addToggles, !false will be true,
|
||||
// so a rebuild call can be indentified
|
||||
this._refresh( false );
|
||||
}
|
||||
},
|
||||
|
||||
_refresh: function( create ) {
|
||||
var headers, hiddenColumns, index;
|
||||
|
||||
// Calling _super() here updates this.headers
|
||||
this._super( create );
|
||||
|
||||
if ( !create && this.options.mode === "columntoggle" ) {
|
||||
headers = this.headers;
|
||||
hiddenColumns = [];
|
||||
|
||||
// Find the index of the column header associated with each old checkbox among the
|
||||
// post-refresh headers and, if the header is still there, make sure the corresponding
|
||||
// column will be hidden if the pre-refresh checkbox indicates that the column is
|
||||
// hidden by recording its index in the array of hidden columns.
|
||||
this._menu.find( "input" ).each( function() {
|
||||
var input = $( this ),
|
||||
header = input.jqmData( "header" ),
|
||||
index = headers.index( header[ 0 ] );
|
||||
|
||||
if ( index > -1 && !input.prop( "checked" ) ) {
|
||||
|
||||
// The column header associated with /this/ checkbox is still present in the
|
||||
// post-refresh table and the checkbox is not checked, so the column associated
|
||||
// with this column header is currently hidden. Let's record that.
|
||||
hiddenColumns.push( index );
|
||||
}
|
||||
});
|
||||
|
||||
// columns not being replaced must be cleared from input toggle-locks
|
||||
this._unlockCells( this.element.find( ".ui-table-cell-hidden, " +
|
||||
".ui-table-cell-visible" ) );
|
||||
|
||||
// update columntoggles and cells
|
||||
this._addToggles( this._menu, create );
|
||||
|
||||
// At this point all columns are visible, so uncheck the checkboxes that correspond to
|
||||
// those columns we've found to be hidden
|
||||
for ( index = hiddenColumns.length - 1 ; index > -1 ; index-- ) {
|
||||
headers.eq( hiddenColumns[ index ] ).jqmData( "input" )
|
||||
.prop( "checked", false )
|
||||
.checkboxradio( "refresh" )
|
||||
.trigger( "change" );
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
_setToggleState: function() {
|
||||
this._menu.find( "input" ).each( function() {
|
||||
var checkbox = $( this );
|
||||
|
||||
this.checked = checkbox.jqmData( "cells" ).eq( 0 ).css( "display" ) === "table-cell";
|
||||
checkbox.checkboxradio( "refresh" );
|
||||
});
|
||||
},
|
||||
|
||||
_destroy: function() {
|
||||
this._super();
|
||||
}
|
||||
});
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.widget( "mobile.table", $.mobile.table, {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue