mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
isolate jqm checkbox
This commit is contained in:
Luke Pulverenti
parent
429f27755b
commit
8199fe27ff
18 changed files with 423 additions and 419 deletions
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="channelItemsPage" data-role="page" class="page libraryPage channelsPage noSecondaryNavPage" data-contextname="${HeaderChannels}" data-require="jqmcontrolgroup,jqmpanel,scripts/channelitems" data-backbutton="true" data-menubutton="false">
|
||||
<div id="channelItemsPage" data-role="page" class="page libraryPage channelsPage noSecondaryNavPage" data-contextname="${HeaderChannels}" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/channelitems" data-backbutton="true" data-menubutton="false">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="viewSettings">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="editItemMetadataPage" data-role="page" class="page libraryPage metadataEditorPage noSecondaryNavPage" data-contextname="${HeaderMetadataManager}" data-require="jqmcollapsible,jqmlistview,jqmpopup,scripts/editorsidebar,scripts/edititemmetadata,scripts/edititemsubtitles,scripts/editcollectionitems,scripts/edititemimages">
|
||||
<div id="editItemMetadataPage" data-role="page" class="page libraryPage metadataEditorPage noSecondaryNavPage" data-contextname="${HeaderMetadataManager}" data-require="jqmcheckbox,jqmcollapsible,jqmlistview,jqmpopup,scripts/editorsidebar,scripts/edititemmetadata,scripts/edititemsubtitles,scripts/editcollectionitems,scripts/edititemimages">
|
||||
<div>
|
||||
<div class="editPageSidebar" style="overflow:auto;">
|
||||
<div class="libraryTree">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="episodesPage" data-role="page" class="page libraryPage" data-require="jqmcontrolgroup,jqmpanel,scripts/episodes,jqmicons">
|
||||
<div id="episodesPage" data-role="page" class="page libraryPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/episodes,jqmicons">
|
||||
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="tvrecommended.html"><iron-icon icon="info"></iron-icon>${TabSuggestions}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-require="jqmcontrolgroup,jqmpanel,scripts/gamegenrepage">
|
||||
<div id="gameGenresPage" data-role="page" class="page libraryPage listPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/gamegenrepage">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="gamesrecommended.html">${TabSuggestions}</a>
|
||||
<a href="games.html">${TabGames}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="gamesPage" data-role="page" class="page libraryPage listPage" data-require="jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/gamespage,scripts/queryfilters">
|
||||
<div id="gamesPage" data-role="page" class="page libraryPage listPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/gamespage,scripts/queryfilters">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="gamesrecommended.html">${TabSuggestions}</a>
|
||||
<a href="#" class="ui-btn-active">${TabGames}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="jqmcontrolgroup,jqmpanel,scripts/gamestudiospage">
|
||||
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/gamestudiospage">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="gamesrecommended.html">${TabSuggestions}</a>
|
||||
<a href="games.html">${TabGames}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title></title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="itemListPage" data-role="page" class="page libraryPage folderListPage noSecondaryNavPage" data-require="jqmcontrolgroup,jqmpanel,scripts/itemlistpage">
|
||||
<div id="itemListPage" data-role="page" class="page libraryPage folderListPage noSecondaryNavPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/itemlistpage">
|
||||
<div class="alphabetPicker">
|
||||
</div>
|
||||
<div data-role="content" class="itemListContent">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-contextname="${HeaderLiveTv}" data-backdroptype="series,movie" data-require="jqmcontrolgroup,jqmpanel,scripts/livetvsuggested,livetvcss,scripts/livetvcomponents">
|
||||
<div id="liveTvSuggestedPage" data-dom-cache="true" data-role="page" class="page libraryPage liveTvPage pageWithAbsoluteTabs" data-contextname="${HeaderLiveTv}" data-backdroptype="series,movie" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/livetvsuggested,livetvcss,scripts/livetvcomponents">
|
||||
|
||||
<div class="libraryViewNav libraryViewNavWithMinHeight">
|
||||
<paper-tabs hidescrollbuttons>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage pageWithAbsoluteTabs collectionEditorPage" data-backdroptype="movie" data-require="jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/moviesrecommended">
|
||||
<div id="moviesPage" data-role="page" data-dom-cache="true" class="page libraryPage backdropPage pageWithAbsoluteTabs collectionEditorPage" data-backdroptype="movie" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/moviesrecommended">
|
||||
|
||||
<div class="libraryViewNav libraryViewNavWithMinHeight">
|
||||
<paper-tabs hidescrollbuttons noink>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/musicrecommended">
|
||||
<div id="musicRecommendedPage" data-dom-cache="true" data-role="page" class="page libraryPage backdropPage pageWithAbsoluteTabs" data-backdroptype="musicartist" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/musicrecommended">
|
||||
<div class="libraryViewNav libraryViewNavWithMinHeight">
|
||||
<paper-tabs hidescrollbuttons noink>
|
||||
<paper-tab><iron-icon icon="info"></iron-icon>${TabSuggestions}</paper-tab>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="libraryReportManagerPage" data-role="page" class="page libraryPage noSecondaryNavPage reportsPage" data-contextname="${HeaderReports}" data-require="jqmcontrolgroup,jqmpanel,jqmcollapsible,jqmtable,scripts/reports,detailtablecss,jqmicons">
|
||||
<div id="libraryReportManagerPage" data-role="page" class="page libraryPage noSecondaryNavPage reportsPage" data-contextname="${HeaderReports}" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,jqmcollapsible,jqmtable,scripts/reports,detailtablecss,jqmicons">
|
||||
<div data-role="content">
|
||||
<div style="text-align: center;">
|
||||
<div class="viewControls">
|
||||
|
|
|
|||
|
|
@ -2121,6 +2121,11 @@ var AppInfo = {};
|
|||
return {};
|
||||
});
|
||||
|
||||
define("jqmcheckbox", ["jqmicons", "thirdparty/jquerymobile-1.4.5/jqm.checkbox"], function () {
|
||||
Dashboard.importCss('thirdparty/jquerymobile-1.4.5/jqm.checkbox.css');
|
||||
return {};
|
||||
});
|
||||
|
||||
define("jqmpanel", ["thirdparty/jquerymobile-1.4.5/jqm.panel"], function () {
|
||||
$.mobile.panel.prototype.options.classes.modalOpen = "largePanelModalOpen ui-panel-dismiss-open";
|
||||
$.mobile.panel.prototype.options.classes.panel = "largePanel ui-panel";
|
||||
|
|
@ -2212,6 +2217,7 @@ var AppInfo = {};
|
|||
depends.push('jqmlistview');
|
||||
depends.push('jqmcollapsible');
|
||||
depends.push('jqmcontrolgroup');
|
||||
depends.push('jqmcheckbox');
|
||||
}
|
||||
|
||||
require(depends, function () {
|
||||
|
|
|
|||
52
dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.checkbox.css
vendored
Normal file
52
dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.checkbox.css
vendored
Normal file
|
|
@ -0,0 +1,52 @@
|
|||
.ui-checkbox,
|
||||
.ui-radio {
|
||||
margin: .5em 0;
|
||||
position: relative;
|
||||
}
|
||||
.ui-checkbox .ui-btn,
|
||||
.ui-radio .ui-btn {
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
white-space: normal; /* Nowrap + ellipsis doesn't work on label. Issue #1419. */
|
||||
z-index: 2;
|
||||
}
|
||||
.ui-controlgroup .ui-checkbox .ui-btn.ui-focus,
|
||||
.ui-controlgroup .ui-radio .ui-btn.ui-focus {
|
||||
z-index: 3;
|
||||
}
|
||||
.ui-checkbox .ui-btn-icon-top,
|
||||
.ui-radio .ui-btn-icon-top,
|
||||
.ui-checkbox .ui-btn-icon-bottom,
|
||||
.ui-radio .ui-btn-icon-bottom {
|
||||
text-align: center;
|
||||
}
|
||||
.ui-controlgroup-horizontal .ui-checkbox .ui-btn:after,
|
||||
.ui-controlgroup-horizontal .ui-radio .ui-btn:after {
|
||||
content: none;
|
||||
display: none;
|
||||
}
|
||||
/* Native input positioning */
|
||||
.ui-checkbox input,
|
||||
.ui-radio input {
|
||||
position: absolute;
|
||||
left: .466em;
|
||||
top: 50%;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin: -11px 0 0 0;
|
||||
outline: 0 !important;
|
||||
z-index: 1;
|
||||
}
|
||||
.ui-controlgroup-horizontal .ui-checkbox input,
|
||||
.ui-controlgroup-horizontal .ui-radio input {
|
||||
left: 50%;
|
||||
margin-left: -9px;
|
||||
}
|
||||
.ui-checkbox input:disabled,
|
||||
.ui-radio input:disabled {
|
||||
position: absolute !important;
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
clip: rect(1px,1px,1px,1px);
|
||||
}
|
||||
351
dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.checkbox.js
vendored
Normal file
351
dashboard-ui/thirdparty/jquerymobile-1.4.5/jqm.checkbox.js
vendored
Normal file
|
|
@ -0,0 +1,351 @@
|
|||
/*
|
||||
* "checkboxradio" plugin
|
||||
*/
|
||||
|
||||
(function ($, undefined) {
|
||||
|
||||
var escapeId = $.mobile.path.hashToSelector;
|
||||
|
||||
$.widget("mobile.checkboxradio", $.extend({
|
||||
|
||||
initSelector: "input[type='checkbox'],input[type='radio']",
|
||||
|
||||
options: {
|
||||
theme: "inherit",
|
||||
mini: false,
|
||||
wrapperClass: null,
|
||||
enhanced: false,
|
||||
iconpos: "left"
|
||||
|
||||
},
|
||||
_create: function () {
|
||||
var input = this.element,
|
||||
o = this.options,
|
||||
inheritAttr = function (input, dataAttr) {
|
||||
return input.jqmData(dataAttr) ||
|
||||
input.closest("form, fieldset").jqmData(dataAttr);
|
||||
},
|
||||
label = this.options.enhanced ?
|
||||
{
|
||||
element: this.element.siblings("label"),
|
||||
isParent: false
|
||||
} :
|
||||
this._findLabel(),
|
||||
inputtype = input[0].type,
|
||||
checkedClass = "ui-" + inputtype + "-on",
|
||||
uncheckedClass = "ui-" + inputtype + "-off";
|
||||
|
||||
if (inputtype !== "checkbox" && inputtype !== "radio") {
|
||||
return;
|
||||
}
|
||||
|
||||
if (this.element[0].disabled) {
|
||||
this.options.disabled = true;
|
||||
}
|
||||
|
||||
o.iconpos = inheritAttr(input, "iconpos") ||
|
||||
label.element.attr("data-" + $.mobile.ns + "iconpos") || o.iconpos,
|
||||
|
||||
// Establish options
|
||||
o.mini = inheritAttr(input, "mini") || o.mini;
|
||||
|
||||
// Expose for other methods
|
||||
$.extend(this, {
|
||||
input: input,
|
||||
label: label.element,
|
||||
labelIsParent: label.isParent,
|
||||
inputtype: inputtype,
|
||||
checkedClass: checkedClass,
|
||||
uncheckedClass: uncheckedClass
|
||||
});
|
||||
|
||||
if (!this.options.enhanced) {
|
||||
this._enhance();
|
||||
}
|
||||
|
||||
this._on(label.element, {
|
||||
mouseover: "_handleLabelVMouseOver",
|
||||
click: "_handleLabelVClick"
|
||||
});
|
||||
|
||||
this._on(input, {
|
||||
mousedown: "_cacheVals",
|
||||
click: "_handleInputVClick",
|
||||
focus: "_handleInputFocus",
|
||||
blur: "_handleInputBlur"
|
||||
});
|
||||
|
||||
this._handleFormReset();
|
||||
this.refresh();
|
||||
},
|
||||
|
||||
_findLabel: function () {
|
||||
var parentLabel, label, isParent,
|
||||
input = this.element,
|
||||
labelsList = input[0].labels;
|
||||
|
||||
if (labelsList && labelsList.length > 0) {
|
||||
label = $(labelsList[0]);
|
||||
isParent = $.contains(label[0], input[0]);
|
||||
} else {
|
||||
parentLabel = input.closest("label");
|
||||
isParent = (parentLabel.length > 0);
|
||||
|
||||
// NOTE: Windows Phone could not find the label through a selector
|
||||
// filter works though.
|
||||
label = isParent ? parentLabel :
|
||||
$(this.document[0].getElementsByTagName("label"))
|
||||
.filter("[for='" + escapeId(input[0].id) + "']")
|
||||
.first();
|
||||
}
|
||||
|
||||
return {
|
||||
element: label,
|
||||
isParent: isParent
|
||||
};
|
||||
},
|
||||
|
||||
_enhance: function () {
|
||||
this.label.addClass("ui-btn ui-corner-all");
|
||||
|
||||
if (this.labelIsParent) {
|
||||
this.input.add(this.label).wrapAll(this._wrapper());
|
||||
} else {
|
||||
//this.element.replaceWith( this.input.add( this.label ).wrapAll( this._wrapper() ) );
|
||||
this.element.wrap(this._wrapper());
|
||||
this.element.parent().prepend(this.label);
|
||||
}
|
||||
|
||||
// Wrap the input + label in a div
|
||||
|
||||
this._setOptions({
|
||||
"theme": this.options.theme,
|
||||
"iconpos": this.options.iconpos,
|
||||
"mini": this.options.mini
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
_wrapper: function () {
|
||||
return $("<div class='" +
|
||||
(this.options.wrapperClass ? this.options.wrapperClass : "") +
|
||||
" ui-" + this.inputtype +
|
||||
(this.options.disabled ? " ui-state-disabled" : "") + "' ></div>");
|
||||
},
|
||||
|
||||
_handleInputFocus: function () {
|
||||
this.label.addClass($.mobile.focusClass);
|
||||
},
|
||||
|
||||
_handleInputBlur: function () {
|
||||
this.label.removeClass($.mobile.focusClass);
|
||||
},
|
||||
|
||||
_handleInputVClick: function () {
|
||||
// Adds checked attribute to checked input when keyboard is used
|
||||
this.element.prop("checked", this.element.is(":checked"));
|
||||
this._getInputSet().not(this.element).prop("checked", false);
|
||||
this._updateAll(true);
|
||||
},
|
||||
|
||||
_handleLabelVMouseOver: function (event) {
|
||||
if (this.label.parent().hasClass("ui-state-disabled")) {
|
||||
event.stopPropagation();
|
||||
}
|
||||
},
|
||||
|
||||
_handleLabelVClick: function (event) {
|
||||
var input = this.element;
|
||||
|
||||
if (input.is(":disabled")) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
this._cacheVals();
|
||||
|
||||
input.prop("checked", this.inputtype === "radio" && true || !input.prop("checked"));
|
||||
|
||||
// trigger click handler's bound directly to the input as a substitute for
|
||||
// how label clicks behave normally in the browsers
|
||||
// TODO: it would be nice to let the browser's handle the clicks and pass them
|
||||
// through to the associate input. we can swallow that click at the parent
|
||||
// wrapper element level
|
||||
input.triggerHandler("click");
|
||||
|
||||
// Input set for common radio buttons will contain all the radio
|
||||
// buttons, but will not for checkboxes. clearing the checked status
|
||||
// of other radios ensures the active button state is applied properly
|
||||
this._getInputSet().not(input).prop("checked", false);
|
||||
|
||||
this._updateAll();
|
||||
return false;
|
||||
},
|
||||
|
||||
_cacheVals: function () {
|
||||
this._getInputSet().each(function () {
|
||||
$(this).attr("data-" + $.mobile.ns + "cacheVal", this.checked);
|
||||
});
|
||||
},
|
||||
|
||||
// Returns those radio buttons that are supposed to be in the same group as
|
||||
// this radio button. In the case of a checkbox or a radio lacking a name
|
||||
// attribute, it returns this.element.
|
||||
_getInputSet: function () {
|
||||
var selector, formId,
|
||||
radio = this.element[0],
|
||||
name = radio.name,
|
||||
form = radio.form,
|
||||
doc = this.element.parents().last().get(0),
|
||||
|
||||
// A radio is always a member of its own group
|
||||
radios = this.element;
|
||||
|
||||
// Only start running selectors if this is an attached radio button with a name
|
||||
if (name && this.inputtype === "radio" && doc) {
|
||||
selector = "input[type='radio'][name='" + escapeId(name) + "']";
|
||||
|
||||
// If we're inside a form
|
||||
if (form) {
|
||||
formId = form.getAttribute("id");
|
||||
|
||||
// If the form has an ID, collect radios scattered throught the document which
|
||||
// nevertheless are part of the form by way of the value of their form attribute
|
||||
if (formId) {
|
||||
radios = $(selector + "[form='" + escapeId(formId) + "']", doc);
|
||||
}
|
||||
|
||||
// Also add to those the radios in the form itself
|
||||
radios = $(form).find(selector).filter(function () {
|
||||
|
||||
// Some radios inside the form may belong to some other form by virtue of
|
||||
// having a form attribute defined on them, so we must filter them out here
|
||||
return (this.form === form);
|
||||
}).add(radios);
|
||||
|
||||
// If we're outside a form
|
||||
} else {
|
||||
|
||||
// Collect all those radios which are also outside of a form and match our name
|
||||
radios = $(selector, doc).filter(function () {
|
||||
return !this.form;
|
||||
});
|
||||
}
|
||||
}
|
||||
return radios;
|
||||
},
|
||||
|
||||
_updateAll: function (changeTriggered) {
|
||||
var self = this;
|
||||
|
||||
this._getInputSet().each(function () {
|
||||
var $this = $(this);
|
||||
|
||||
if ((this.checked || self.inputtype === "checkbox") && !changeTriggered) {
|
||||
$this.trigger("change");
|
||||
}
|
||||
})
|
||||
.checkboxradio("refresh");
|
||||
},
|
||||
|
||||
_reset: function () {
|
||||
this.refresh();
|
||||
},
|
||||
|
||||
// Is the widget supposed to display an icon?
|
||||
_hasIcon: function () {
|
||||
var controlgroup, controlgroupWidget,
|
||||
controlgroupConstructor = $.mobile.controlgroup;
|
||||
|
||||
// If the controlgroup widget is defined ...
|
||||
if (controlgroupConstructor) {
|
||||
controlgroup = this.element.closest(
|
||||
":mobile-controlgroup," +
|
||||
controlgroupConstructor.prototype.initSelector);
|
||||
|
||||
// ... and the checkbox is in a controlgroup ...
|
||||
if (controlgroup.length > 0) {
|
||||
|
||||
// ... look for a controlgroup widget instance, and ...
|
||||
controlgroupWidget = $.data(controlgroup[0], "mobile-controlgroup");
|
||||
|
||||
// ... if found, decide based on the option value, ...
|
||||
return ((controlgroupWidget ? controlgroupWidget.options.type :
|
||||
|
||||
// ... otherwise decide based on the "type" data attribute.
|
||||
controlgroup.attr("data-" + $.mobile.ns + "type")) !== "horizontal");
|
||||
}
|
||||
}
|
||||
|
||||
// Normally, the widget displays an icon.
|
||||
return true;
|
||||
},
|
||||
|
||||
refresh: function () {
|
||||
var isChecked = this.element[0].checked,
|
||||
active = $.mobile.activeBtnClass,
|
||||
iconposClass = "ui-btn-icon-" + this.options.iconpos,
|
||||
addClasses = [],
|
||||
removeClasses = [];
|
||||
|
||||
if (this._hasIcon()) {
|
||||
removeClasses.push(active);
|
||||
addClasses.push(iconposClass);
|
||||
} else {
|
||||
removeClasses.push(iconposClass);
|
||||
(isChecked ? addClasses : removeClasses).push(active);
|
||||
}
|
||||
|
||||
if (isChecked) {
|
||||
addClasses.push(this.checkedClass);
|
||||
removeClasses.push(this.uncheckedClass);
|
||||
} else {
|
||||
addClasses.push(this.uncheckedClass);
|
||||
removeClasses.push(this.checkedClass);
|
||||
}
|
||||
|
||||
this.widget().toggleClass("ui-state-disabled", this.element.prop("disabled"));
|
||||
|
||||
this.label
|
||||
.addClass(addClasses.join(" "))
|
||||
.removeClass(removeClasses.join(" "));
|
||||
},
|
||||
|
||||
widget: function () {
|
||||
return this.label.parent();
|
||||
},
|
||||
|
||||
_setOptions: function (options) {
|
||||
var label = this.label,
|
||||
currentOptions = this.options,
|
||||
outer = this.widget(),
|
||||
hasIcon = this._hasIcon();
|
||||
|
||||
if (options.disabled !== undefined) {
|
||||
this.input.prop("disabled", !!options.disabled);
|
||||
outer.toggleClass("ui-state-disabled", !!options.disabled);
|
||||
}
|
||||
if (options.mini !== undefined) {
|
||||
outer.toggleClass("ui-mini", !!options.mini);
|
||||
}
|
||||
if (options.theme !== undefined) {
|
||||
label
|
||||
.removeClass("ui-btn-" + currentOptions.theme)
|
||||
.addClass("ui-btn-" + options.theme);
|
||||
}
|
||||
if (options.wrapperClass !== undefined) {
|
||||
outer
|
||||
.removeClass(currentOptions.wrapperClass)
|
||||
.addClass(options.wrapperClass);
|
||||
}
|
||||
if (options.iconpos !== undefined && hasIcon) {
|
||||
label.removeClass("ui-btn-icon-" + currentOptions.iconpos).addClass("ui-btn-icon-" + options.iconpos);
|
||||
} else if (!hasIcon) {
|
||||
label.removeClass("ui-btn-icon-" + currentOptions.iconpos);
|
||||
}
|
||||
this._super(options);
|
||||
}
|
||||
|
||||
}, $.mobile.behaviors.formReset));
|
||||
|
||||
})(jQuery);
|
||||
|
|
@ -4074,6 +4074,7 @@ $.fn.fieldcontain = function(/* options */) {
|
|||
dependencies.push('jqmlistview');
|
||||
dependencies.push('jqmcollapsible');
|
||||
dependencies.push('jqmcontrolgroup');
|
||||
dependencies.push('jqmcheckbox');
|
||||
}
|
||||
|
||||
var currentSelf = this;
|
||||
|
|
@ -5097,358 +5098,6 @@ $.mobile.behaviors.formReset = {
|
|||
|
||||
})( jQuery );
|
||||
|
||||
/*
|
||||
* "checkboxradio" plugin
|
||||
*/
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
var escapeId = $.mobile.path.hashToSelector;
|
||||
|
||||
$.widget( "mobile.checkboxradio", $.extend( {
|
||||
|
||||
initSelector: "input[type='checkbox'],input[type='radio']",
|
||||
|
||||
options: {
|
||||
theme: "inherit",
|
||||
mini: false,
|
||||
wrapperClass: null,
|
||||
enhanced: false,
|
||||
iconpos: "left"
|
||||
|
||||
},
|
||||
_create: function() {
|
||||
var input = this.element,
|
||||
o = this.options,
|
||||
inheritAttr = function( input, dataAttr ) {
|
||||
return input.jqmData( dataAttr ) ||
|
||||
input.closest( "form, fieldset" ).jqmData( dataAttr );
|
||||
},
|
||||
label = this.options.enhanced ?
|
||||
{
|
||||
element: this.element.siblings( "label" ),
|
||||
isParent: false
|
||||
} :
|
||||
this._findLabel(),
|
||||
inputtype = input[0].type,
|
||||
checkedClass = "ui-" + inputtype + "-on",
|
||||
uncheckedClass = "ui-" + inputtype + "-off";
|
||||
|
||||
if ( inputtype !== "checkbox" && inputtype !== "radio" ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( this.element[0].disabled ) {
|
||||
this.options.disabled = true;
|
||||
}
|
||||
|
||||
o.iconpos = inheritAttr( input, "iconpos" ) ||
|
||||
label.element.attr( "data-" + $.mobile.ns + "iconpos" ) || o.iconpos,
|
||||
|
||||
// Establish options
|
||||
o.mini = inheritAttr( input, "mini" ) || o.mini;
|
||||
|
||||
// Expose for other methods
|
||||
$.extend( this, {
|
||||
input: input,
|
||||
label: label.element,
|
||||
labelIsParent: label.isParent,
|
||||
inputtype: inputtype,
|
||||
checkedClass: checkedClass,
|
||||
uncheckedClass: uncheckedClass
|
||||
});
|
||||
|
||||
if ( !this.options.enhanced ) {
|
||||
this._enhance();
|
||||
}
|
||||
|
||||
this._on( label.element, {
|
||||
mouseover: "_handleLabelVMouseOver",
|
||||
click: "_handleLabelVClick"
|
||||
});
|
||||
|
||||
this._on( input, {
|
||||
mousedown: "_cacheVals",
|
||||
click: "_handleInputVClick",
|
||||
focus: "_handleInputFocus",
|
||||
blur: "_handleInputBlur"
|
||||
});
|
||||
|
||||
this._handleFormReset();
|
||||
this.refresh();
|
||||
},
|
||||
|
||||
_findLabel: function() {
|
||||
var parentLabel, label, isParent,
|
||||
input = this.element,
|
||||
labelsList = input[ 0 ].labels;
|
||||
|
||||
if( labelsList && labelsList.length > 0 ) {
|
||||
label = $( labelsList[ 0 ] );
|
||||
isParent = $.contains( label[ 0 ], input[ 0 ] );
|
||||
} else {
|
||||
parentLabel = input.closest( "label" );
|
||||
isParent = ( parentLabel.length > 0 );
|
||||
|
||||
// NOTE: Windows Phone could not find the label through a selector
|
||||
// filter works though.
|
||||
label = isParent ? parentLabel :
|
||||
$( this.document[ 0 ].getElementsByTagName( "label" ) )
|
||||
.filter( "[for='" + escapeId( input[ 0 ].id ) + "']" )
|
||||
.first();
|
||||
}
|
||||
|
||||
return {
|
||||
element: label,
|
||||
isParent: isParent
|
||||
};
|
||||
},
|
||||
|
||||
_enhance: function() {
|
||||
this.label.addClass( "ui-btn ui-corner-all");
|
||||
|
||||
if ( this.labelIsParent ) {
|
||||
this.input.add( this.label ).wrapAll( this._wrapper() );
|
||||
} else {
|
||||
//this.element.replaceWith( this.input.add( this.label ).wrapAll( this._wrapper() ) );
|
||||
this.element.wrap( this._wrapper() );
|
||||
this.element.parent().prepend( this.label );
|
||||
}
|
||||
|
||||
// Wrap the input + label in a div
|
||||
|
||||
this._setOptions({
|
||||
"theme": this.options.theme,
|
||||
"iconpos": this.options.iconpos,
|
||||
"mini": this.options.mini
|
||||
});
|
||||
|
||||
},
|
||||
|
||||
_wrapper: function() {
|
||||
return $( "<div class='" +
|
||||
( this.options.wrapperClass ? this.options.wrapperClass : "" ) +
|
||||
" ui-" + this.inputtype +
|
||||
( this.options.disabled ? " ui-state-disabled" : "" ) + "' ></div>" );
|
||||
},
|
||||
|
||||
_handleInputFocus: function() {
|
||||
this.label.addClass( $.mobile.focusClass );
|
||||
},
|
||||
|
||||
_handleInputBlur: function() {
|
||||
this.label.removeClass( $.mobile.focusClass );
|
||||
},
|
||||
|
||||
_handleInputVClick: function() {
|
||||
// Adds checked attribute to checked input when keyboard is used
|
||||
this.element.prop( "checked", this.element.is( ":checked" ) );
|
||||
this._getInputSet().not( this.element ).prop( "checked", false );
|
||||
this._updateAll( true );
|
||||
},
|
||||
|
||||
_handleLabelVMouseOver: function( event ) {
|
||||
if ( this.label.parent().hasClass( "ui-state-disabled" ) ) {
|
||||
event.stopPropagation();
|
||||
}
|
||||
},
|
||||
|
||||
_handleLabelVClick: function( event ) {
|
||||
var input = this.element;
|
||||
|
||||
if ( input.is( ":disabled" ) ) {
|
||||
event.preventDefault();
|
||||
return;
|
||||
}
|
||||
|
||||
this._cacheVals();
|
||||
|
||||
input.prop( "checked", this.inputtype === "radio" && true || !input.prop( "checked" ) );
|
||||
|
||||
// trigger click handler's bound directly to the input as a substitute for
|
||||
// how label clicks behave normally in the browsers
|
||||
// TODO: it would be nice to let the browser's handle the clicks and pass them
|
||||
// through to the associate input. we can swallow that click at the parent
|
||||
// wrapper element level
|
||||
input.triggerHandler( "click" );
|
||||
|
||||
// Input set for common radio buttons will contain all the radio
|
||||
// buttons, but will not for checkboxes. clearing the checked status
|
||||
// of other radios ensures the active button state is applied properly
|
||||
this._getInputSet().not( input ).prop( "checked", false );
|
||||
|
||||
this._updateAll();
|
||||
return false;
|
||||
},
|
||||
|
||||
_cacheVals: function() {
|
||||
this._getInputSet().each( function() {
|
||||
$( this ).attr("data-" + $.mobile.ns + "cacheVal", this.checked );
|
||||
});
|
||||
},
|
||||
|
||||
// Returns those radio buttons that are supposed to be in the same group as
|
||||
// this radio button. In the case of a checkbox or a radio lacking a name
|
||||
// attribute, it returns this.element.
|
||||
_getInputSet: function() {
|
||||
var selector, formId,
|
||||
radio = this.element[ 0 ],
|
||||
name = radio.name,
|
||||
form = radio.form,
|
||||
doc = this.element.parents().last().get( 0 ),
|
||||
|
||||
// A radio is always a member of its own group
|
||||
radios = this.element;
|
||||
|
||||
// Only start running selectors if this is an attached radio button with a name
|
||||
if ( name && this.inputtype === "radio" && doc ) {
|
||||
selector = "input[type='radio'][name='" + escapeId( name ) + "']";
|
||||
|
||||
// If we're inside a form
|
||||
if ( form ) {
|
||||
formId = form.getAttribute( "id" );
|
||||
|
||||
// If the form has an ID, collect radios scattered throught the document which
|
||||
// nevertheless are part of the form by way of the value of their form attribute
|
||||
if ( formId ) {
|
||||
radios = $( selector + "[form='" + escapeId( formId ) + "']", doc );
|
||||
}
|
||||
|
||||
// Also add to those the radios in the form itself
|
||||
radios = $( form ).find( selector ).filter( function() {
|
||||
|
||||
// Some radios inside the form may belong to some other form by virtue of
|
||||
// having a form attribute defined on them, so we must filter them out here
|
||||
return ( this.form === form );
|
||||
}).add( radios );
|
||||
|
||||
// If we're outside a form
|
||||
} else {
|
||||
|
||||
// Collect all those radios which are also outside of a form and match our name
|
||||
radios = $( selector, doc ).filter( function() {
|
||||
return !this.form;
|
||||
});
|
||||
}
|
||||
}
|
||||
return radios;
|
||||
},
|
||||
|
||||
_updateAll: function( changeTriggered ) {
|
||||
var self = this;
|
||||
|
||||
this._getInputSet().each( function() {
|
||||
var $this = $( this );
|
||||
|
||||
if ( ( this.checked || self.inputtype === "checkbox" ) && !changeTriggered ) {
|
||||
$this.trigger( "change" );
|
||||
}
|
||||
})
|
||||
.checkboxradio( "refresh" );
|
||||
},
|
||||
|
||||
_reset: function() {
|
||||
this.refresh();
|
||||
},
|
||||
|
||||
// Is the widget supposed to display an icon?
|
||||
_hasIcon: function() {
|
||||
var controlgroup, controlgroupWidget,
|
||||
controlgroupConstructor = $.mobile.controlgroup;
|
||||
|
||||
// If the controlgroup widget is defined ...
|
||||
if ( controlgroupConstructor ) {
|
||||
controlgroup = this.element.closest(
|
||||
":mobile-controlgroup," +
|
||||
controlgroupConstructor.prototype.initSelector );
|
||||
|
||||
// ... and the checkbox is in a controlgroup ...
|
||||
if ( controlgroup.length > 0 ) {
|
||||
|
||||
// ... look for a controlgroup widget instance, and ...
|
||||
controlgroupWidget = $.data( controlgroup[ 0 ], "mobile-controlgroup" );
|
||||
|
||||
// ... if found, decide based on the option value, ...
|
||||
return ( ( controlgroupWidget ? controlgroupWidget.options.type :
|
||||
|
||||
// ... otherwise decide based on the "type" data attribute.
|
||||
controlgroup.attr( "data-" + $.mobile.ns + "type" ) ) !== "horizontal" );
|
||||
}
|
||||
}
|
||||
|
||||
// Normally, the widget displays an icon.
|
||||
return true;
|
||||
},
|
||||
|
||||
refresh: function() {
|
||||
var isChecked = this.element[ 0 ].checked,
|
||||
active = $.mobile.activeBtnClass,
|
||||
iconposClass = "ui-btn-icon-" + this.options.iconpos,
|
||||
addClasses = [],
|
||||
removeClasses = [];
|
||||
|
||||
if ( this._hasIcon() ) {
|
||||
removeClasses.push( active );
|
||||
addClasses.push( iconposClass );
|
||||
} else {
|
||||
removeClasses.push( iconposClass );
|
||||
( isChecked ? addClasses : removeClasses ).push( active );
|
||||
}
|
||||
|
||||
if ( isChecked ) {
|
||||
addClasses.push( this.checkedClass );
|
||||
removeClasses.push( this.uncheckedClass );
|
||||
} else {
|
||||
addClasses.push( this.uncheckedClass );
|
||||
removeClasses.push( this.checkedClass );
|
||||
}
|
||||
|
||||
this.widget().toggleClass( "ui-state-disabled", this.element.prop( "disabled" ) );
|
||||
|
||||
this.label
|
||||
.addClass( addClasses.join( " " ) )
|
||||
.removeClass( removeClasses.join( " " ) );
|
||||
},
|
||||
|
||||
widget: function() {
|
||||
return this.label.parent();
|
||||
},
|
||||
|
||||
_setOptions: function( options ) {
|
||||
var label = this.label,
|
||||
currentOptions = this.options,
|
||||
outer = this.widget(),
|
||||
hasIcon = this._hasIcon();
|
||||
|
||||
if ( options.disabled !== undefined ) {
|
||||
this.input.prop( "disabled", !!options.disabled );
|
||||
outer.toggleClass( "ui-state-disabled", !!options.disabled );
|
||||
}
|
||||
if ( options.mini !== undefined ) {
|
||||
outer.toggleClass( "ui-mini", !!options.mini );
|
||||
}
|
||||
if ( options.theme !== undefined ) {
|
||||
label
|
||||
.removeClass( "ui-btn-" + currentOptions.theme )
|
||||
.addClass( "ui-btn-" + options.theme );
|
||||
}
|
||||
if ( options.wrapperClass !== undefined ) {
|
||||
outer
|
||||
.removeClass( currentOptions.wrapperClass )
|
||||
.addClass( options.wrapperClass );
|
||||
}
|
||||
if ( options.iconpos !== undefined && hasIcon ) {
|
||||
label.removeClass( "ui-btn-icon-" + currentOptions.iconpos ).addClass( "ui-btn-icon-" + options.iconpos );
|
||||
} else if ( !hasIcon ) {
|
||||
label.removeClass( "ui-btn-icon-" + currentOptions.iconpos );
|
||||
}
|
||||
this._super( options );
|
||||
}
|
||||
|
||||
}, $.mobile.behaviors.formReset ) );
|
||||
|
||||
})( jQuery );
|
||||
|
||||
(function( $, undefined ) {
|
||||
|
||||
$.fn.selectmenu = function() {
|
||||
|
|
|
|||
|
|
@ -575,57 +575,3 @@ li.ui-block-e {
|
|||
overflow: hidden;
|
||||
clip: rect(1px,1px,1px,1px);
|
||||
}
|
||||
|
||||
|
||||
.ui-checkbox,
|
||||
.ui-radio {
|
||||
margin: .5em 0;
|
||||
position: relative;
|
||||
}
|
||||
.ui-checkbox .ui-btn,
|
||||
.ui-radio .ui-btn {
|
||||
margin: 0;
|
||||
text-align: left;
|
||||
white-space: normal; /* Nowrap + ellipsis doesn't work on label. Issue #1419. */
|
||||
z-index: 2;
|
||||
}
|
||||
.ui-controlgroup .ui-checkbox .ui-btn.ui-focus,
|
||||
.ui-controlgroup .ui-radio .ui-btn.ui-focus {
|
||||
z-index: 3;
|
||||
}
|
||||
.ui-checkbox .ui-btn-icon-top,
|
||||
.ui-radio .ui-btn-icon-top,
|
||||
.ui-checkbox .ui-btn-icon-bottom,
|
||||
.ui-radio .ui-btn-icon-bottom {
|
||||
text-align: center;
|
||||
}
|
||||
.ui-controlgroup-horizontal .ui-checkbox .ui-btn:after,
|
||||
.ui-controlgroup-horizontal .ui-radio .ui-btn:after {
|
||||
content: none;
|
||||
display: none;
|
||||
}
|
||||
/* Native input positioning */
|
||||
.ui-checkbox input,
|
||||
.ui-radio input {
|
||||
position: absolute;
|
||||
left: .466em;
|
||||
top: 50%;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
margin: -11px 0 0 0;
|
||||
outline: 0 !important;
|
||||
z-index: 1;
|
||||
}
|
||||
.ui-controlgroup-horizontal .ui-checkbox input,
|
||||
.ui-controlgroup-horizontal .ui-radio input {
|
||||
left: 50%;
|
||||
margin-left: -9px;
|
||||
}
|
||||
.ui-checkbox input:disabled,
|
||||
.ui-radio input:disabled {
|
||||
position: absolute !important;
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
clip: rect(1px,1px,1px,1px);
|
||||
}
|
||||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="tvPeoplePage" data-role="page" class="page libraryPage" data-require="jqmcontrolgroup,jqmpanel,scripts/tvpeople">
|
||||
<div id="tvPeoplePage" data-role="page" class="page libraryPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,scripts/tvpeople">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="tvrecommended.html"><iron-icon icon="info"></iron-icon>${TabSuggestions}</a>
|
||||
<a href="tvlatest.html"><iron-icon icon="new-releases"></iron-icon>${TabLatest}</a>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<title>Emby</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="tvShowsPage" data-role="page" class="page libraryPage" data-require="jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/tvshows,scripts/queryfilters">
|
||||
<div id="tvShowsPage" data-role="page" class="page libraryPage" data-require="jqmcheckbox,jqmcontrolgroup,jqmpanel,jqmcollapsible,scripts/tvshows,scripts/queryfilters">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="tvrecommended.html"><iron-icon icon="info"></iron-icon>${TabSuggestions}</a>
|
||||
<a href="tvlatest.html"><iron-icon icon="new-releases"></iron-icon>${TabLatest}</a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue