mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
rework live stream handling
This commit is contained in:
Luke Pulverenti
parent
fd25ff8c13
commit
a6d492c13d
27 changed files with 313 additions and 1301 deletions
|
|
@ -25,7 +25,9 @@
|
|||
|
||||
results[i] = {
|
||||
top: box.top,
|
||||
left: box.left
|
||||
left: box.left,
|
||||
width: box.width,
|
||||
height: box.height
|
||||
};
|
||||
}
|
||||
|
||||
|
|
@ -45,10 +47,10 @@
|
|||
var pos = getOffsets([options.positionTo])[0];
|
||||
|
||||
if (options.positionY != 'top') {
|
||||
pos.top += options.positionTo.offsetHeight / 2;
|
||||
pos.top += (pos.height || 0) / 2;
|
||||
}
|
||||
|
||||
pos.left += options.positionTo.offsetWidth / 2;
|
||||
pos.left += (pos.width || 0) / 2;
|
||||
|
||||
var height = dlg.offsetHeight || 300;
|
||||
var width = dlg.offsetWidth || 160;
|
||||
|
|
|
|||
|
|
@ -281,7 +281,7 @@
|
|||
}));
|
||||
}
|
||||
};
|
||||
if (!dlg.animationConfig || !dlg.animate) {
|
||||
if (!dlg.animationConfig) {
|
||||
onAnimationFinish();
|
||||
return;
|
||||
}
|
||||
|
|
@ -312,7 +312,7 @@
|
|||
}
|
||||
};
|
||||
|
||||
if (!dlg.animationConfig || !dlg.animate) {
|
||||
if (!dlg.animationConfig) {
|
||||
onAnimationFinish();
|
||||
return;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -28,7 +28,6 @@
|
|||
font-weight: 500;
|
||||
/* Disable webkit tap highlighting */
|
||||
-webkit-tap-highlight-color: rgba(0,0,0,0);
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.emby-button::-moz-focus-inner {
|
||||
|
|
|
|||
113
dashboard-ui/components/accessschedule/accessschedule.js
Normal file
113
dashboard-ui/components/accessschedule/accessschedule.js
Normal file
|
|
@ -0,0 +1,113 @@
|
|||
define(['dialogHelper', 'datetime', 'emby-select', 'paper-icon-button-light', 'formDialogStyle'], function (dialogHelper, datetime) {
|
||||
|
||||
function getDisplayTime(hours) {
|
||||
|
||||
var minutes = 0;
|
||||
|
||||
var pct = hours % 1;
|
||||
|
||||
if (pct) {
|
||||
minutes = parseInt(pct * 60);
|
||||
}
|
||||
|
||||
return datetime.getDisplayTime(new Date(2000, 1, 1, hours, minutes, 0, 0));
|
||||
}
|
||||
|
||||
function populateHours(context) {
|
||||
|
||||
var html = '';
|
||||
|
||||
for (var i = 0; i < 24; i++) {
|
||||
|
||||
html += '<option value="' + i + '">' + getDisplayTime(i) + '</option>';
|
||||
}
|
||||
|
||||
html += '<option value="24">' + getDisplayTime(0) + '</option>';
|
||||
|
||||
context.querySelector('#selectStart').innerHTML = html;
|
||||
context.querySelector('#selectEnd').innerHTML = html;
|
||||
}
|
||||
|
||||
function loadSchedule(context, schedule) {
|
||||
|
||||
context.querySelector('#selectDay').value = schedule.DayOfWeek || 'Sunday';
|
||||
context.querySelector('#selectStart').value = schedule.StartHour || 0;
|
||||
context.querySelector('#selectEnd').value = schedule.EndHour || 0;
|
||||
}
|
||||
|
||||
function submitSchedule(context, options) {
|
||||
|
||||
var updatedSchedule = {
|
||||
DayOfWeek: context.querySelector('#selectDay').value,
|
||||
StartHour: context.querySelector('#selectStart').value,
|
||||
EndHour: context.querySelector('#selectEnd').value
|
||||
};
|
||||
|
||||
if (parseFloat(updatedSchedule.StartHour) >= parseFloat(updatedSchedule.EndHour)) {
|
||||
|
||||
alert(Globalize.translate('ErrorMessageStartHourGreaterThanEnd'));
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
context.submitted = true;
|
||||
options.schedule = Object.assign(options.schedule, updatedSchedule);
|
||||
dialogHelper.close(context);
|
||||
}
|
||||
|
||||
return {
|
||||
show: function (options) {
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
var xhr = new XMLHttpRequest();
|
||||
xhr.open('GET', 'components/accessschedule/accessschedule.template.html', true);
|
||||
|
||||
xhr.onload = function (e) {
|
||||
|
||||
var template = this.response;
|
||||
var dlg = dialogHelper.createDialog({
|
||||
removeOnClose: true,
|
||||
size: 'small'
|
||||
});
|
||||
|
||||
dlg.classList.add('formDialog');
|
||||
|
||||
var html = '';
|
||||
|
||||
html += Globalize.translateDocument(template);
|
||||
|
||||
dlg.innerHTML = html;
|
||||
|
||||
populateHours(dlg);
|
||||
loadSchedule(dlg, options.schedule);
|
||||
|
||||
dialogHelper.open(dlg);
|
||||
|
||||
dlg.addEventListener('close', function () {
|
||||
|
||||
if (dlg.submitted) {
|
||||
resolve(options.schedule);
|
||||
} else {
|
||||
reject();
|
||||
}
|
||||
});
|
||||
|
||||
dlg.querySelector('.btnCancel').addEventListener('click', function (e) {
|
||||
|
||||
dialogHelper.close(dlg);
|
||||
});
|
||||
|
||||
dlg.querySelector('form').addEventListener('submit', function (e) {
|
||||
|
||||
submitSchedule(dlg, options);
|
||||
|
||||
e.preventDefault();
|
||||
return false;
|
||||
});
|
||||
}
|
||||
|
||||
xhr.send();
|
||||
});
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
@ -0,0 +1,39 @@
|
|||
<div class="formDialogHeader">
|
||||
<button is="paper-icon-button-light" class="btnCancel autoSize" tabindex="-1"><i class="md-icon"></i></button>
|
||||
<h3 class="formDialogHeaderTitle">
|
||||
${HeaderAccessSchedule}
|
||||
</h3>
|
||||
</div>
|
||||
<div class="formDialogContent smoothScrollY" style="padding-top:2em;">
|
||||
<div class="dialogContentInner dialog-content-centered">
|
||||
<form class="scheduleForm" style="margin:auto;">
|
||||
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectDay" label="${LabelAccessDay}">
|
||||
<option value="Sunday">${OptionSunday}</option>
|
||||
<option value="Monday">${OptionMonday}</option>
|
||||
<option value="Tuesday">${OptionTuesday}</option>
|
||||
<option value="Wednesday">${OptionWednesday}</option>
|
||||
<option value="Thursday">${OptionThursday}</option>
|
||||
<option value="Friday">${OptionFriday}</option>
|
||||
<option value="Saturday">${OptionSaturday}</option>
|
||||
<option value="Everyday">${OptionEveryday}</option>
|
||||
<option value="Weekday">${OptionWeekdays}</option>
|
||||
<option value="Weekend">${OptionWeekends}</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" class="selectHour" id="selectStart" label="${LabelAccessStart}"></select>
|
||||
</div>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" class="selectHour" id="selectEnd" label="${LabelAccessEnd}"></select>
|
||||
</div>
|
||||
|
||||
<div class="formDialogFooter">
|
||||
<button is="emby-button" type="submit" class="raised button-submit block formDialogFooterItem">
|
||||
<span>${ButtonAdd}</span>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -45,10 +45,8 @@ define(['browser'], function (browser) {
|
|||
|
||||
if (isPluginpage) {
|
||||
dependencies.push('jqmpopup');
|
||||
dependencies.push('jqmcollapsible');
|
||||
dependencies.push('legacy/dashboard');
|
||||
dependencies.push('legacy/selectmenu');
|
||||
dependencies.push('jqmcontrolgroup');
|
||||
dependencies.push('jqmlistview');
|
||||
dependencies.push('fnchecked');
|
||||
}
|
||||
|
|
|
|||
|
|
@ -512,25 +512,13 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
|||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin: 1.5em 0 1em;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.ui-body-a .detailSectionHeader {
|
||||
border: 1px solid #ddd;
|
||||
border-width: 0 0 1px 0;
|
||||
}
|
||||
|
||||
.ui-body-b .detailSectionHeader {
|
||||
border: 1px solid #444;
|
||||
border-width: 0 0 1px 0;
|
||||
}
|
||||
|
||||
.detailSectionHeader, .detailSectionHeader h3 {
|
||||
font-size: 20px;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.detailSectionHeader button {
|
||||
font-size: 13px;
|
||||
.detailSectionHeader > h1 {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.detailSectionHeaderButton {
|
||||
|
|
@ -702,10 +690,6 @@ span.itemCommunityRating:not(:empty) + .userDataIcons {
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.mediaInfoItem {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
@media all and (max-width: 600px) {
|
||||
|
||||
.portraitDetailImageContainer + .primaryDetailsContainer {
|
||||
|
|
|
|||
|
|
@ -35,10 +35,18 @@ html {
|
|||
margin: 0;
|
||||
padding: 0;
|
||||
height: 100%;
|
||||
font-family: 'San Francisco', 'Helvetica Neue', Roboto, 'Open Sans', 'Segoe UI', sans-serif;
|
||||
font-family: -apple-system, 'San Francisco', 'Helvetica Neue', Roboto, 'Open Sans', 'Segoe UI', sans-serif;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-family: -apple-system-headline, 'San Francisco', 'Helvetica Neue', Roboto, 'Open Sans', 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: -apple-system-subheadline, 'San Francisco', 'Helvetica Neue', Roboto, 'Open Sans', 'Segoe UI', sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
overflow-y: scroll !important;
|
||||
/* This is needed to prevent a horizontal scrollbar while neon-animated-pages are animating. */
|
||||
|
|
|
|||
|
|
@ -28,6 +28,16 @@ body:not(.dashboardDocument) .mainDrawerButton {
|
|||
height: 50px;
|
||||
}
|
||||
|
||||
/*.viewMenuBar, .ui-body-b .libraryViewNav {
|
||||
background: rgba(34,35,38,.90);
|
||||
-webkit-backdrop-filter: blur(5px);
|
||||
backdrop-filter: blur(5px);
|
||||
}
|
||||
|
||||
.viewMenuBar.semiTransparent {
|
||||
background-color: rgba(15, 15, 15, .3);
|
||||
}*/
|
||||
|
||||
.emby-tab-button {
|
||||
font-weight: 400;
|
||||
text-transform: none !important;
|
||||
|
|
@ -55,6 +65,10 @@ h1, h1 a {
|
|||
font-weight: 400;
|
||||
}
|
||||
|
||||
.cardImageContainer {
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.noSecondaryNavPage .itemBackdrop {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
|
@ -67,10 +81,6 @@ h1, h1 a {
|
|||
font-size: 200% !important;
|
||||
}
|
||||
|
||||
.alphabetPicker {
|
||||
right: 5px !important;
|
||||
}
|
||||
|
||||
.txtSearch {
|
||||
padding-bottom: .5em !important;
|
||||
text-indent: 0 !important;
|
||||
|
|
@ -84,3 +94,9 @@ h1, h1 a {
|
|||
.categorySyncButton, .btnSync {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.dialog.background-theme-b {
|
||||
background: rgba(28,28,28,.88);
|
||||
-webkit-backdrop-filter: blur(5px);
|
||||
backdrop-filter: blur(5px);
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="jqmcontrolgroup,scripts/gamestudiospage">
|
||||
<div id="gameStudiosPage" data-role="page" class="page libraryPage listPage" data-require="scripts/gamestudiospage">
|
||||
<div class="libraryViewNav scopedLibraryViewNav">
|
||||
<a href="gamesrecommended.html">${TabSuggestions}</a>
|
||||
<a href="games.html">${TabGames}</a>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="displayPreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderDisplaySettings}" data-menubutton="false">
|
||||
<div id="displayPreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderDisplaySettings}" data-backbutton="true">
|
||||
<div data-role="content">
|
||||
<form class="displayPreferencesForm userProfileSettingsForm" style="margin: 0 auto;">
|
||||
<div class="detailSection languageSection hide">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="homeScreenPreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderHomeScreenSettings}" data-menubutton="false">
|
||||
<div id="homeScreenPreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderHomeScreenSettings}" data-backbutton="true">
|
||||
|
||||
<div data-role="content">
|
||||
<form class="homeScreenPreferencesForm userProfileSettingsForm" style="margin: 0 auto;">
|
||||
|
|
@ -9,9 +9,8 @@
|
|||
</h1>
|
||||
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectHomeSection1" class="selectLabel">${LabelHomePageSection1}</label>
|
||||
<select id="selectHomeSection1" data-mini="true">
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectHomeSection1" label="${LabelHomePageSection1}">
|
||||
<option value="">${OptionAuto}</option>
|
||||
<option value="latestmedia">${OptionLatestMedia}</option>
|
||||
<option value="latestchannelmedia">${OptionLatestChannelMedia}</option>
|
||||
|
|
@ -23,10 +22,8 @@
|
|||
<option value="resume">${OptionResumablemedia}</option>
|
||||
</select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectHomeSection2" class="selectLabel">${LabelHomePageSection2}</label>
|
||||
<select id="selectHomeSection2" data-mini="true">
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectHomeSection2" label="${LabelHomePageSection2}">
|
||||
<option value="">${OptionAuto}</option>
|
||||
<option value="latestmedia">${OptionLatestMedia}</option>
|
||||
<option value="latestchannelmedia">${OptionLatestChannelMedia}</option>
|
||||
|
|
@ -39,10 +36,8 @@
|
|||
<option value="none">${OptionNone}</option>
|
||||
</select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectHomeSection3" class="selectLabel">${LabelHomePageSection3}</label>
|
||||
<select id="selectHomeSection3" data-mini="true">
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectHomeSection3" label="${LabelHomePageSection3}">
|
||||
<option value="">${OptionAuto}</option>
|
||||
<option value="latestmedia">${OptionLatestMedia}</option>
|
||||
<option value="latestchannelmedia">${OptionLatestChannelMedia}</option>
|
||||
|
|
@ -55,10 +50,8 @@
|
|||
<option value="none">${OptionNone}</option>
|
||||
</select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectHomeSection4" class="selectLabel">${LabelHomePageSection4}</label>
|
||||
<select id="selectHomeSection4" data-mini="true">
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectHomeSection4" label="${LabelHomePageSection4}">
|
||||
<option value="">${OptionAuto}</option>
|
||||
<option value="latestmedia">${OptionLatestMedia}</option>
|
||||
<option value="latestchannelmedia">${OptionLatestChannelMedia}</option>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="languagePreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderPlaybackSettings}" data-menubutton="false">
|
||||
<div id="languagePreferencesPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderPlaybackSettings}" data-backbutton="true">
|
||||
|
||||
<div data-role="content">
|
||||
|
||||
|
|
@ -10,11 +10,9 @@
|
|||
${HeaderAudioSettings}
|
||||
</h1>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectAudioLanguage" class="selectLabel">${LabelAudioLanguagePreference}</label>
|
||||
<select id="selectAudioLanguage" data-mini="true"></select>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectAudioLanguage" label="${LabelAudioLanguagePreference}"></select>
|
||||
</div>
|
||||
<br />
|
||||
<label class="checkboxContainer">
|
||||
<input type="checkbox" is="emby-checkbox" class="chkPlayDefaultAudioTrack" />
|
||||
<span>${LabelPlayDefaultAudioTrack}</span>
|
||||
|
|
@ -25,33 +23,30 @@
|
|||
${HeaderSubtitleSettings}
|
||||
</h1>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectSubtitleLanguage" class="selectLabel">${LabelSubtitleLanguagePreference}</label>
|
||||
<select id="selectSubtitleLanguage" data-mini="true"></select>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectSubtitleLanguage" label="${LabelSubtitleLanguagePreference}"></select>
|
||||
</div>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectSubtitlePlaybackMode" label="${LabelSubtitlePlaybackMode}">
|
||||
<option value="Default">${OptionDefaultSubtitles}</option>
|
||||
<option value="Smart">${OptionSmartSubtitles}</option>
|
||||
<option value="OnlyForced">${OptionOnlyForcedSubtitles}</option>
|
||||
<option value="Always">${OptionAlwaysPlaySubtitles}</option>
|
||||
<option value="None">${OptionNoSubtitles}</option>
|
||||
</select>
|
||||
<div class="fieldDescription subtitlesDefaultHelp subtitlesHelp hide">${OptionDefaultSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesSmartHelp subtitlesHelp hide">${OptionSmartSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesAlwaysHelp subtitlesHelp hide">${OptionAlwaysPlaySubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesOnlyForcedHelp subtitlesHelp hide">${OptionOnlyForcedSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesNoneHelp subtitlesHelp hide">${OptionNoSubtitlesHelp}</div>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
</div> <br />
|
||||
<label for="selectSubtitlePlaybackMode" class="selectLabel">${LabelSubtitlePlaybackMode}</label>
|
||||
<select id="selectSubtitlePlaybackMode" data-mini="true">
|
||||
<option value="Default">${OptionDefaultSubtitles}</option>
|
||||
<option value="Smart">${OptionSmartSubtitles}</option>
|
||||
<option value="OnlyForced">${OptionOnlyForcedSubtitles}</option>
|
||||
<option value="Always">${OptionAlwaysPlaySubtitles}</option>
|
||||
<option value="None">${OptionNoSubtitles}</option>
|
||||
</select>
|
||||
<div class="fieldDescription subtitlesDefaultHelp subtitlesHelp hide">${OptionDefaultSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesSmartHelp subtitlesHelp hide">${OptionSmartSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesAlwaysHelp subtitlesHelp hide">${OptionAlwaysPlaySubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesOnlyForcedHelp subtitlesHelp hide">${OptionOnlyForcedSubtitlesHelp}</div>
|
||||
<div class="fieldDescription subtitlesNoneHelp subtitlesHelp hide">${OptionNoSubtitlesHelp}</div>
|
||||
|
||||
</div>
|
||||
<div class="detailSection cinemaModeOptions hide">
|
||||
<h1>
|
||||
${HeaderCinemaMode}
|
||||
</h1>
|
||||
<br/>
|
||||
<br />
|
||||
<div class="checkboxContainer checkboxContainer-withDescription">
|
||||
<label>
|
||||
<input type="checkbox" is="emby-checkbox" class="chkEnableCinemaMode" />
|
||||
|
|
@ -67,16 +62,12 @@
|
|||
${HeaderAdvanced}
|
||||
</h1>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectMaxBitrate" class="selectLabel">${LabelMaxStreamingBitrate}</label>
|
||||
<select id="selectMaxBitrate" data-mini="true"></select>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectMaxBitrate" label="${LabelMaxStreamingBitrate}"></select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectMaxChromecastBitrate" class="selectLabel">${LabelMaxChromecastBitrate}</label>
|
||||
<select id="selectMaxChromecastBitrate" data-mini="true"></select>
|
||||
<div class="selectContainer">
|
||||
<select is="emby-select" id="selectMaxChromecastBitrate" label="${LabelMaxChromecastBitrate}"></select>
|
||||
</div>
|
||||
<br />
|
||||
<label class="checkboxContainer">
|
||||
<input type="checkbox" is="emby-checkbox" class="chkEpisodeAutoPlay" />
|
||||
<span>${OptionPlayNextEpisodeAutomatically}</span>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderSettings}">
|
||||
<div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-title="${HeaderSettings}" data-backbutton="true">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="readOnlyContent" style="margin: 0 auto;">
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="libraryReportManagerPage" data-role="page" class="page libraryPage noSecondaryNavPage reportsPage" data-title="${HeaderReports}" data-require="jQuery,paper-icon-button-light,jqmpanel,jqmcollapsible,jqmtable,scripts/reports,detailtablecss">
|
||||
<div id="libraryReportManagerPage" data-role="page" class="page libraryPage noSecondaryNavPage reportsPage" data-title="${HeaderReports}" data-require="jQuery,paper-icon-button-light,jqmpanel,jqmtable,scripts/reports,detailtablecss">
|
||||
<style>
|
||||
/* Page and overlay */
|
||||
.ui-page-theme-b .ui-panel-wrapper {
|
||||
|
|
|
|||
|
|
@ -96,7 +96,7 @@
|
|||
|
||||
if (!options.categories) {
|
||||
currentCategory = Globalize.translate('HeaderTopPlugins');
|
||||
html += '<div class="detailSectionHeader">' + currentCategory + '</div>';
|
||||
html += '<div class="detailSectionHeader"><h1>' + currentCategory + '</h1></div>';
|
||||
var topPlugins = allPlugins.slice(0).sort(function (a, b) {
|
||||
|
||||
if (a.installs > b.installs) {
|
||||
|
|
@ -153,7 +153,7 @@
|
|||
html += '<br/>';
|
||||
}
|
||||
|
||||
html += '<div class="detailSectionHeader">' + category + '</div>';
|
||||
html += '<div class="detailSectionHeader"><h1>' + category + '</h1></div>';
|
||||
html += '<div class="itemsContainer vertical-wrap">';
|
||||
hasOpenTag = true;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1330,22 +1330,17 @@ var AppInfo = {};
|
|||
|
||||
define("dashboardcss", ['css!css/dashboard']);
|
||||
|
||||
define("jqmbase", ['dashboardcss', 'css!thirdparty/jquerymobile-1.4.5/jquery.mobile.custom.theme.css']);
|
||||
define("jqmtable", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.table", 'css!thirdparty/jquerymobile-1.4.5/jqm.table.css']);
|
||||
define("jqmtable", ["thirdparty/jquerymobile-1.4.5/jqm.table", 'css!thirdparty/jquerymobile-1.4.5/jqm.table.css']);
|
||||
|
||||
define("jqmwidget", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.widget"]);
|
||||
define("jqmwidget", ["thirdparty/jquerymobile-1.4.5/jqm.widget"]);
|
||||
|
||||
define("jqmslider", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.slider", 'css!thirdparty/jquerymobile-1.4.5/jqm.slider.css']);
|
||||
define("jqmslider", ["thirdparty/jquerymobile-1.4.5/jqm.slider", 'css!thirdparty/jquerymobile-1.4.5/jqm.slider.css']);
|
||||
|
||||
define("jqmpopup", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.popup", 'css!thirdparty/jquerymobile-1.4.5/jqm.popup.css']);
|
||||
define("jqmpopup", ["thirdparty/jquerymobile-1.4.5/jqm.popup", 'css!thirdparty/jquerymobile-1.4.5/jqm.popup.css']);
|
||||
|
||||
define("jqmlistview", ['jqmbase', 'css!thirdparty/jquerymobile-1.4.5/jqm.listview.css']);
|
||||
define("jqmlistview", ['css!thirdparty/jquerymobile-1.4.5/jqm.listview.css']);
|
||||
|
||||
define("jqmcontrolgroup", ['jqmbase', 'css!thirdparty/jquerymobile-1.4.5/jqm.controlgroup.css']);
|
||||
|
||||
define("jqmcollapsible", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.collapsible", 'css!thirdparty/jquerymobile-1.4.5/jqm.collapsible.css']);
|
||||
|
||||
define("jqmpanel", ['jqmbase', "thirdparty/jquerymobile-1.4.5/jqm.panel", 'css!thirdparty/jquerymobile-1.4.5/jqm.panel.css']);
|
||||
define("jqmpanel", ["thirdparty/jquerymobile-1.4.5/jqm.panel", 'css!thirdparty/jquerymobile-1.4.5/jqm.panel.css']);
|
||||
|
||||
define("slideshow", [embyWebComponentsBowerPath + "/slideshow/slideshow"], returnFirstDependency);
|
||||
|
||||
|
|
@ -2268,7 +2263,7 @@ var AppInfo = {};
|
|||
|
||||
defineRoute({
|
||||
path: '/mypreferenceshome.html',
|
||||
dependencies: ['emby-checkbox', 'emby-button'],
|
||||
dependencies: ['emby-checkbox', 'emby-button', 'emby-select'],
|
||||
autoFocus: false,
|
||||
transition: 'fade',
|
||||
controller: 'scripts/mypreferenceshome'
|
||||
|
|
@ -2276,7 +2271,7 @@ var AppInfo = {};
|
|||
|
||||
defineRoute({
|
||||
path: '/mypreferenceslanguages.html',
|
||||
dependencies: ['emby-button', 'emby-checkbox'],
|
||||
dependencies: ['emby-button', 'emby-checkbox', 'emby-select'],
|
||||
autoFocus: false,
|
||||
transition: 'fade',
|
||||
controller: 'scripts/mypreferenceslanguages'
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
define(['jQuery', 'listViewStyle', 'paper-icon-button-light'], function ($) {
|
||||
define(['jQuery', 'datetime', 'listViewStyle', 'paper-icon-button-light'], function ($, datetime) {
|
||||
|
||||
function populateRatings(allParentalRatings, page) {
|
||||
|
||||
|
|
@ -116,13 +116,13 @@
|
|||
var li = '<div class="listItem">';
|
||||
|
||||
li += '<div class="listItemBody">';
|
||||
li += '<h3 class="listItemBodyTest">';
|
||||
li += '<h3 class="listItemBodyText">';
|
||||
li += h;
|
||||
li += '</h3>';
|
||||
li += '</div>';
|
||||
|
||||
li += '<button type="button" is="paper-icon-button-light" class="blockedTag btnDeleteTag listItemButton" data-tag="' + h + '"><i class="md-icon">delete</i></button>';
|
||||
|
||||
|
||||
li += '</div>';
|
||||
|
||||
return li;
|
||||
|
|
@ -156,24 +156,25 @@
|
|||
|
||||
function renderAccessSchedule(page, schedules) {
|
||||
|
||||
var html = '<ul data-role="listview" data-inset="true" data-split-icon="minus">';
|
||||
var html = '';
|
||||
var index = 0;
|
||||
|
||||
html += schedules.map(function (a) {
|
||||
|
||||
var itemHtml = '';
|
||||
|
||||
itemHtml += '<li class="liSchedule" data-day="' + a.DayOfWeek + '" data-start="' + a.StartHour + '" data-end="' + a.EndHour + '">';
|
||||
itemHtml += '<div class="liSchedule listItem" data-day="' + a.DayOfWeek + '" data-start="' + a.StartHour + '" data-end="' + a.EndHour + '">';
|
||||
|
||||
itemHtml += '<a href="#">';
|
||||
itemHtml += '<h3>' + Globalize.translate('Option' + a.DayOfWeek) + '</h3>';
|
||||
itemHtml += '<p>' + getDisplayTime(a.StartHour) + ' - ' + getDisplayTime(a.EndHour) + '</p>';
|
||||
itemHtml += '</a>';
|
||||
itemHtml += '<div class="listItemBody two-line">';
|
||||
itemHtml += '<h3 class="listItemBodyText">';
|
||||
itemHtml += Globalize.translate('Option' + a.DayOfWeek);
|
||||
itemHtml += '</h3>';
|
||||
itemHtml += '<div class="listItemBodyText secondary">' + getDisplayTime(a.StartHour) + ' - ' + getDisplayTime(a.EndHour) + '</div>';
|
||||
itemHtml += '</div>';
|
||||
|
||||
itemHtml += '<a href="#" data-icon="delete" class="btnDelete" data-index="' + index + '">';
|
||||
itemHtml += '</a>';
|
||||
itemHtml += '<button type="button" is="paper-icon-button-light" class="btnDelete listItemButton" data-index="' + index + '"><i class="md-icon">delete</i></button>';
|
||||
|
||||
itemHtml += '</li>';
|
||||
itemHtml += '</div>';
|
||||
|
||||
index++;
|
||||
|
||||
|
|
@ -181,11 +182,10 @@
|
|||
|
||||
}).join('');
|
||||
|
||||
html += '</ul>';
|
||||
var accessScheduleList = page.querySelector('.accessScheduleList');
|
||||
accessScheduleList.innerHTML = html;
|
||||
|
||||
var elem = $('.accessScheduleList', page).html(html).trigger('create');
|
||||
|
||||
$('.btnDelete', elem).on('click', function () {
|
||||
$('.btnDelete', accessScheduleList).on('click', function () {
|
||||
|
||||
deleteAccessSchedule(page, schedules, parseInt(this.getAttribute('data-index')));
|
||||
});
|
||||
|
|
@ -204,7 +204,7 @@
|
|||
|
||||
user.Policy.MaxParentalRating = $('#selectMaxParentalRating', page).val() || null;
|
||||
|
||||
user.Policy.BlockUnratedItems = $('.chkUnratedItem', page).get().filter(function(i) {
|
||||
user.Policy.BlockUnratedItems = $('.chkUnratedItem', page).get().filter(function (i) {
|
||||
|
||||
return i.checked;
|
||||
|
||||
|
|
@ -237,16 +237,6 @@
|
|||
saveUser(result, page);
|
||||
});
|
||||
|
||||
// Disable default form submission
|
||||
return false;
|
||||
},
|
||||
|
||||
onScheduleFormSubmit: function () {
|
||||
|
||||
var page = $(this).parents('.page');
|
||||
|
||||
saveSchedule(page);
|
||||
|
||||
// Disable default form submission
|
||||
return false;
|
||||
}
|
||||
|
|
@ -262,65 +252,29 @@
|
|||
minutes = parseInt(pct * 60);
|
||||
}
|
||||
|
||||
return new Date(2000, 1, 1, hours, minutes, 0, 0).toLocaleTimeString();
|
||||
}
|
||||
|
||||
function populateHours(page) {
|
||||
|
||||
var html = '';
|
||||
|
||||
for (var i = 0; i < 24; i++) {
|
||||
|
||||
html += '<option value="' + i + '">' + getDisplayTime(i) + '</option>';
|
||||
}
|
||||
|
||||
html += '<option value="24">' + getDisplayTime(0) + '</option>';
|
||||
|
||||
$('#selectStart', page).html(html);
|
||||
$('#selectEnd', page).html(html);
|
||||
return datetime.getDisplayTime(new Date(2000, 1, 1, hours, minutes, 0, 0));
|
||||
}
|
||||
|
||||
function showSchedulePopup(page, schedule, index) {
|
||||
|
||||
schedule = schedule || {};
|
||||
|
||||
$('#popupSchedule', page).popup('open');
|
||||
require(['components/accessschedule/accessschedule'], function (accessschedule) {
|
||||
accessschedule.show({
|
||||
schedule: schedule
|
||||
}).then(function (updatedSchedule) {
|
||||
|
||||
$('#fldScheduleIndex', page).val(index);
|
||||
var schedules = getSchedulesFromPage(page);
|
||||
|
||||
$('#selectDay', page).val(schedule.DayOfWeek || 'Sunday');
|
||||
$('#selectStart', page).val(schedule.StartHour || 0);
|
||||
$('#selectEnd', page).val(schedule.EndHour || 0);
|
||||
}
|
||||
if (index == -1) {
|
||||
index = schedules.length;
|
||||
}
|
||||
|
||||
function saveSchedule(page) {
|
||||
schedules[index] = updatedSchedule;
|
||||
|
||||
var schedule = {
|
||||
DayOfWeek: $('#selectDay', page).val(),
|
||||
StartHour: $('#selectStart', page).val(),
|
||||
EndHour: $('#selectEnd', page).val()
|
||||
};
|
||||
|
||||
if (parseFloat(schedule.StartHour) >= parseFloat(schedule.EndHour)) {
|
||||
|
||||
alert(Globalize.translate('ErrorMessageStartHourGreaterThanEnd'));
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
var schedules = getSchedulesFromPage(page);
|
||||
|
||||
var index = parseInt($('#fldScheduleIndex', page).val());
|
||||
|
||||
if (index == -1) {
|
||||
index = schedules.length;
|
||||
}
|
||||
|
||||
schedules[index] = schedule;
|
||||
|
||||
renderAccessSchedule(page, schedules);
|
||||
|
||||
$('#popupSchedule', page).popup('close');
|
||||
renderAccessSchedule(page, schedules);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function getSchedulesFromPage(page) {
|
||||
|
|
@ -379,9 +333,6 @@
|
|||
showBlockedTagPopup(page);
|
||||
});
|
||||
|
||||
populateHours(page);
|
||||
|
||||
$('.scheduleForm').off('submit', UserParentalControlPage.onScheduleFormSubmit).on('submit', UserParentalControlPage.onScheduleFormSubmit);
|
||||
$('.userParentalControlForm').off('submit', UserParentalControlPage.onSubmit).on('submit', UserParentalControlPage.onSubmit);
|
||||
|
||||
}).on('pageshow', "#userParentalControlPage", function () {
|
||||
|
|
|
|||
|
|
@ -1,102 +0,0 @@
|
|||
|
||||
|
||||
|
||||
.ui-collapsible {
|
||||
margin: 0 -1em;
|
||||
}
|
||||
.ui-collapsible-inset,
|
||||
.ui-collapsible-set {
|
||||
margin: .5em 0;
|
||||
}
|
||||
.ui-collapsible-heading {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
position: relative;
|
||||
}
|
||||
.ui-collapsible-heading .ui-btn {
|
||||
text-align: left;
|
||||
margin: 0;
|
||||
border-left-width: 0;
|
||||
border-right-width: 0;
|
||||
}
|
||||
.ui-collapsible-heading .ui-btn-icon-top,
|
||||
.ui-collapsible-heading .ui-btn-icon-bottom {
|
||||
text-align: center;
|
||||
}
|
||||
.ui-collapsible-inset .ui-collapsible-heading .ui-btn {
|
||||
border-right-width: 1px;
|
||||
border-left-width: 1px;
|
||||
}
|
||||
.ui-collapsible-collapsed + .ui-collapsible:not(.ui-collapsible-inset) > .ui-collapsible-heading .ui-btn {
|
||||
border-top-width: 0;
|
||||
}
|
||||
.ui-collapsible-set .ui-collapsible:not(.ui-collapsible-inset) .ui-collapsible-heading .ui-btn {
|
||||
border-top-width: 1px;
|
||||
}
|
||||
.ui-collapsible-heading-status {
|
||||
position: absolute !important;
|
||||
height: 1px;
|
||||
width: 1px;
|
||||
overflow: hidden;
|
||||
clip: rect(1px,1px,1px,1px);
|
||||
}
|
||||
.ui-collapsible-content {
|
||||
display: block;
|
||||
margin: 0;
|
||||
padding: .5em 1em;
|
||||
}
|
||||
.ui-collapsible-themed-content .ui-collapsible-content {
|
||||
border-left-width: 0;
|
||||
border-right-width: 0;
|
||||
border-top-width: 0;
|
||||
border-bottom-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
.ui-collapsible-inset.ui-collapsible-themed-content .ui-collapsible-content {
|
||||
border-left-width: 1px;
|
||||
border-right-width: 1px;
|
||||
}
|
||||
.ui-collapsible-inset .ui-collapsible-content {
|
||||
margin: 0;
|
||||
}
|
||||
.ui-collapsible-content-collapsed {
|
||||
display: none;
|
||||
}
|
||||
.ui-collapsible-set > .ui-collapsible.ui-corner-all {
|
||||
-webkit-border-radius: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
.ui-collapsible-heading,
|
||||
.ui-collapsible-heading > .ui-btn {
|
||||
-webkit-border-radius: inherit;
|
||||
border-radius: inherit;
|
||||
}
|
||||
.ui-collapsible-set .ui-collapsible.ui-first-child {
|
||||
-webkit-border-top-right-radius: inherit;
|
||||
border-top-right-radius: inherit;
|
||||
-webkit-border-top-left-radius: inherit;
|
||||
border-top-left-radius: inherit;
|
||||
}
|
||||
.ui-collapsible-content,
|
||||
.ui-collapsible-set .ui-collapsible.ui-last-child {
|
||||
-webkit-border-bottom-right-radius: inherit;
|
||||
border-bottom-right-radius: inherit;
|
||||
-webkit-border-bottom-left-radius: inherit;
|
||||
border-bottom-left-radius: inherit;
|
||||
}
|
||||
.ui-collapsible-themed-content:not(.ui-collapsible-collapsed) > .ui-collapsible-heading {
|
||||
-webkit-border-bottom-right-radius: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
-webkit-border-bottom-left-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
.ui-collapsible-set .ui-collapsible {
|
||||
margin: -1px -1em 0;
|
||||
}
|
||||
.ui-collapsible-set .ui-collapsible-inset {
|
||||
margin: -1px 0 0;
|
||||
}
|
||||
.ui-collapsible-set .ui-collapsible.ui-first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
|
@ -1,388 +0,0 @@
|
|||
define(['jqmwidget'], function () {
|
||||
|
||||
(function ($, window, undefined) {
|
||||
var rbrace = /(?:\{[\s\S]*\}|\[[\s\S]*\])$/;
|
||||
|
||||
$.extend($.mobile, {
|
||||
|
||||
// Namespace used framework-wide for data-attrs. Default is no namespace
|
||||
|
||||
// Retrieve an attribute from an element and perform some massaging of the value
|
||||
|
||||
getAttribute: function (element, key) {
|
||||
var data;
|
||||
|
||||
element = element.jquery ? element[0] : element;
|
||||
|
||||
if (element && element.getAttribute) {
|
||||
data = element.getAttribute("data-" + key);
|
||||
}
|
||||
|
||||
// Copied from core's src/data.js:dataAttr()
|
||||
// Convert from a string to a proper data type
|
||||
try {
|
||||
data = data === "true" ? true :
|
||||
data === "false" ? false :
|
||||
data === "null" ? null :
|
||||
// Only convert to a number if it doesn't change the string
|
||||
+data + "" === data ? +data :
|
||||
rbrace.test(data) ? JSON.parse(data) :
|
||||
data;
|
||||
} catch (err) { }
|
||||
|
||||
return data;
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
})(jQuery, this);
|
||||
|
||||
(function ($, undefined) {
|
||||
|
||||
var rInitialLetter = /([A-Z])/g,
|
||||
|
||||
// Construct iconpos class from iconpos value
|
||||
iconposClass = function (iconpos) {
|
||||
return ("ui-btn-icon-" + (iconpos === null ? "left" : iconpos));
|
||||
};
|
||||
|
||||
$.widget("mobile.collapsible", {
|
||||
options: {
|
||||
enhanced: false,
|
||||
expandCueText: null,
|
||||
collapseCueText: null,
|
||||
collapsed: true,
|
||||
heading: "h1,h2,h3,h4,h5,h6,legend",
|
||||
collapsedIcon: null,
|
||||
expandedIcon: null,
|
||||
iconpos: null,
|
||||
theme: null,
|
||||
contentTheme: null,
|
||||
inset: null,
|
||||
corners: null,
|
||||
mini: null
|
||||
},
|
||||
|
||||
_create: function () {
|
||||
var elem = this.element,
|
||||
ui = {
|
||||
accordion: elem
|
||||
.closest("[data-role='collapsible-set']," +
|
||||
"[data-role='collapsibleset']" +
|
||||
($.mobile.collapsibleset ? ", :mobile-collapsibleset" :
|
||||
""))
|
||||
.addClass("ui-collapsible-set")
|
||||
};
|
||||
|
||||
this._ui = ui;
|
||||
this._renderedOptions = this._getOptions(this.options);
|
||||
|
||||
if (this.options.enhanced) {
|
||||
ui.heading = this.element.children(".ui-collapsible-heading");
|
||||
ui.content = ui.heading.next();
|
||||
ui.anchor = ui.heading.children();
|
||||
ui.status = ui.anchor.children(".ui-collapsible-heading-status");
|
||||
} else {
|
||||
this._enhance(elem, ui);
|
||||
}
|
||||
|
||||
this._on(ui.heading, {
|
||||
"tap": function () {
|
||||
ui.heading.find("a").first().addClass($.mobile.activeBtnClass);
|
||||
},
|
||||
|
||||
"click": function (event) {
|
||||
this._handleExpandCollapse(!ui.heading.hasClass("ui-collapsible-heading-collapsed"));
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// Adjust the keys inside options for inherited values
|
||||
_getOptions: function (options) {
|
||||
var key,
|
||||
accordion = this._ui.accordion,
|
||||
accordionWidget = this._ui.accordionWidget;
|
||||
|
||||
// Copy options
|
||||
options = $.extend({}, options);
|
||||
|
||||
if (accordion.length && !accordionWidget) {
|
||||
this._ui.accordionWidget =
|
||||
accordionWidget = accordion.data("mobile-collapsibleset");
|
||||
}
|
||||
|
||||
for (key in options) {
|
||||
|
||||
// Retrieve the option value first from the options object passed in and, if
|
||||
// null, from the parent accordion or, if that's null too, or if there's no
|
||||
// parent accordion, then from the defaults.
|
||||
options[key] =
|
||||
(options[key] != null) ? options[key] :
|
||||
(accordionWidget) ? accordionWidget.options[key] :
|
||||
accordion.length ? $.mobile.getAttribute(accordion[0],
|
||||
key.replace(rInitialLetter, "-$1").toLowerCase()) :
|
||||
null;
|
||||
|
||||
if (null == options[key]) {
|
||||
options[key] = $.mobile.collapsible.defaults[key];
|
||||
}
|
||||
}
|
||||
|
||||
return options;
|
||||
},
|
||||
|
||||
_themeClassFromOption: function (prefix, value) {
|
||||
return (value ? (value === "none" ? "" : prefix + value) : "");
|
||||
},
|
||||
|
||||
_enhance: function (elem, ui) {
|
||||
var iconclass,
|
||||
opts = this._renderedOptions,
|
||||
contentThemeClass = this._themeClassFromOption("ui-body-", opts.contentTheme);
|
||||
|
||||
elem.addClass("ui-collapsible " +
|
||||
(opts.inset ? "ui-collapsible-inset " : "") +
|
||||
(opts.inset && opts.corners ? "ui-corner-all " : "") +
|
||||
(contentThemeClass ? "ui-collapsible-themed-content " : ""));
|
||||
ui.originalHeading = elem.children(this.options.heading).first(),
|
||||
ui.content = elem
|
||||
.wrapInner("<div " +
|
||||
"class='ui-collapsible-content " +
|
||||
contentThemeClass + "'></div>")
|
||||
.children(".ui-collapsible-content"),
|
||||
ui.heading = ui.originalHeading;
|
||||
|
||||
// Replace collapsibleHeading if it's a legend
|
||||
if (ui.heading.is("legend")) {
|
||||
ui.heading = $("<div role='heading'>" + ui.heading.html() + "</div>");
|
||||
ui.placeholder = $("<div><!-- placeholder for legend --></div>").insertBefore(ui.originalHeading);
|
||||
ui.originalHeading.remove();
|
||||
}
|
||||
|
||||
iconclass = (opts.collapsed ? (opts.collapsedIcon ? "ui-icon-" + opts.collapsedIcon : "") :
|
||||
(opts.expandedIcon ? "ui-icon-" + opts.expandedIcon : ""));
|
||||
|
||||
ui.status = $("<span class='ui-collapsible-heading-status'></span>");
|
||||
ui.anchor = ui.heading
|
||||
.detach()
|
||||
//modify markup & attributes
|
||||
.addClass("ui-collapsible-heading")
|
||||
.append(ui.status)
|
||||
.wrapInner("<a href='#' class='ui-collapsible-heading-toggle'></a>")
|
||||
.find("a")
|
||||
.first()
|
||||
.addClass("ui-btn " +
|
||||
(iconclass ? iconclass + " " : "") +
|
||||
(iconclass ? iconposClass(opts.iconpos) +
|
||||
" " : "") +
|
||||
this._themeClassFromOption("ui-btn-", opts.theme) + " " +
|
||||
(opts.mini ? "ui-mini " : ""));
|
||||
|
||||
//drop heading in before content
|
||||
ui.heading.insertBefore(ui.content);
|
||||
|
||||
this._handleExpandCollapse(this.options.collapsed);
|
||||
|
||||
return ui;
|
||||
},
|
||||
|
||||
refresh: function () {
|
||||
this._applyOptions(this.options);
|
||||
this._renderedOptions = this._getOptions(this.options);
|
||||
},
|
||||
|
||||
_applyOptions: function (options) {
|
||||
var isCollapsed, newTheme, oldTheme, hasCorners, hasIcon,
|
||||
elem = this.element,
|
||||
currentOpts = this._renderedOptions,
|
||||
ui = this._ui,
|
||||
anchor = ui.anchor,
|
||||
status = ui.status,
|
||||
opts = this._getOptions(options);
|
||||
|
||||
// First and foremost we need to make sure the collapsible is in the proper
|
||||
// state, in case somebody decided to change the collapsed option at the
|
||||
// same time as another option
|
||||
if (options.collapsed !== undefined) {
|
||||
this._handleExpandCollapse(options.collapsed);
|
||||
}
|
||||
|
||||
isCollapsed = elem.hasClass("ui-collapsible-collapsed");
|
||||
|
||||
// We only need to apply the cue text for the current state right away.
|
||||
// The cue text for the alternate state will be stored in the options
|
||||
// and applied the next time the collapsible's state is toggled
|
||||
if (isCollapsed) {
|
||||
if (opts.expandCueText !== undefined) {
|
||||
status.text(opts.expandCueText);
|
||||
}
|
||||
} else {
|
||||
if (opts.collapseCueText !== undefined) {
|
||||
status.text(opts.collapseCueText);
|
||||
}
|
||||
}
|
||||
|
||||
// Update icon
|
||||
|
||||
// Is it supposed to have an icon?
|
||||
hasIcon =
|
||||
|
||||
// If the collapsedIcon is being set, consult that
|
||||
(opts.collapsedIcon !== undefined ? opts.collapsedIcon !== false :
|
||||
|
||||
// Otherwise consult the existing option value
|
||||
currentOpts.collapsedIcon !== false);
|
||||
|
||||
|
||||
// If any icon-related options have changed, make sure the new icon
|
||||
// state is reflected by first removing all icon-related classes
|
||||
// reflecting the current state and then adding all icon-related
|
||||
// classes for the new state
|
||||
if (!(opts.iconpos === undefined &&
|
||||
opts.collapsedIcon === undefined &&
|
||||
opts.expandedIcon === undefined)) {
|
||||
|
||||
// Remove all current icon-related classes
|
||||
anchor.removeClass([iconposClass(currentOpts.iconpos)]
|
||||
.concat((currentOpts.expandedIcon ?
|
||||
["ui-icon-" + currentOpts.expandedIcon] : []))
|
||||
.concat((currentOpts.collapsedIcon ?
|
||||
["ui-icon-" + currentOpts.collapsedIcon] : []))
|
||||
.join(" "));
|
||||
|
||||
// Add new classes if an icon is supposed to be present
|
||||
if (hasIcon) {
|
||||
anchor.addClass(
|
||||
[iconposClass(opts.iconpos !== undefined ?
|
||||
opts.iconpos : currentOpts.iconpos)]
|
||||
.concat(isCollapsed ?
|
||||
["ui-icon-" + (opts.collapsedIcon !== undefined ?
|
||||
opts.collapsedIcon :
|
||||
currentOpts.collapsedIcon)] :
|
||||
["ui-icon-" + (opts.expandedIcon !== undefined ?
|
||||
opts.expandedIcon :
|
||||
currentOpts.expandedIcon)])
|
||||
.join(" "));
|
||||
}
|
||||
}
|
||||
|
||||
if (opts.theme !== undefined) {
|
||||
oldTheme = this._themeClassFromOption("ui-btn-", currentOpts.theme);
|
||||
newTheme = this._themeClassFromOption("ui-btn-", opts.theme);
|
||||
anchor.removeClass(oldTheme).addClass(newTheme);
|
||||
}
|
||||
|
||||
if (opts.contentTheme !== undefined) {
|
||||
oldTheme = this._themeClassFromOption("ui-body-",
|
||||
currentOpts.contentTheme);
|
||||
newTheme = this._themeClassFromOption("ui-body-",
|
||||
opts.contentTheme);
|
||||
ui.content.removeClass(oldTheme).addClass(newTheme);
|
||||
}
|
||||
|
||||
if (opts.inset !== undefined) {
|
||||
elem.toggleClass("ui-collapsible-inset", opts.inset);
|
||||
hasCorners = !!(opts.inset && (opts.corners || currentOpts.corners));
|
||||
}
|
||||
|
||||
if (opts.corners !== undefined) {
|
||||
hasCorners = !!(opts.corners && (opts.inset || currentOpts.inset));
|
||||
}
|
||||
|
||||
if (hasCorners !== undefined) {
|
||||
elem.toggleClass("ui-corner-all", hasCorners);
|
||||
}
|
||||
|
||||
if (opts.mini !== undefined) {
|
||||
anchor.toggleClass("ui-mini", opts.mini);
|
||||
}
|
||||
},
|
||||
|
||||
_setOptions: function (options) {
|
||||
this._applyOptions(options);
|
||||
this._super(options);
|
||||
this._renderedOptions = this._getOptions(this.options);
|
||||
},
|
||||
|
||||
_handleExpandCollapse: function (isCollapse) {
|
||||
var opts = this._renderedOptions,
|
||||
ui = this._ui;
|
||||
|
||||
ui.status.text(isCollapse ? opts.expandCueText : opts.collapseCueText);
|
||||
ui.heading
|
||||
.toggleClass("ui-collapsible-heading-collapsed", isCollapse)
|
||||
.find("a").first()
|
||||
.toggleClass("ui-icon-" + opts.expandedIcon, !isCollapse)
|
||||
|
||||
// logic or cause same icon for expanded/collapsed state would remove the ui-icon-class
|
||||
.toggleClass("ui-icon-" + opts.collapsedIcon, (isCollapse || opts.expandedIcon === opts.collapsedIcon))
|
||||
.removeClass($.mobile.activeBtnClass);
|
||||
|
||||
this.element.toggleClass("ui-collapsible-collapsed", isCollapse);
|
||||
ui.content
|
||||
.toggleClass("ui-collapsible-content-collapsed", isCollapse)
|
||||
.attr("aria-hidden", isCollapse)
|
||||
.trigger("updatelayout");
|
||||
this.options.collapsed = isCollapse;
|
||||
this._trigger(isCollapse ? "collapse" : "expand");
|
||||
},
|
||||
|
||||
expand: function () {
|
||||
this._handleExpandCollapse(false);
|
||||
},
|
||||
|
||||
collapse: function () {
|
||||
this._handleExpandCollapse(true);
|
||||
},
|
||||
|
||||
_destroy: function () {
|
||||
var ui = this._ui,
|
||||
opts = this.options;
|
||||
|
||||
if (opts.enhanced) {
|
||||
return;
|
||||
}
|
||||
|
||||
if (ui.placeholder) {
|
||||
ui.originalHeading.insertBefore(ui.placeholder);
|
||||
ui.placeholder.remove();
|
||||
ui.heading.remove();
|
||||
} else {
|
||||
ui.status.remove();
|
||||
ui.heading
|
||||
.removeClass("ui-collapsible-heading ui-collapsible-heading-collapsed")
|
||||
.children()
|
||||
.contents()
|
||||
.unwrap();
|
||||
}
|
||||
|
||||
ui.anchor.contents().unwrap();
|
||||
ui.content.contents().unwrap();
|
||||
this.element
|
||||
.removeClass("ui-collapsible ui-collapsible-collapsed " +
|
||||
"ui-collapsible-themed-content ui-collapsible-inset ui-corner-all");
|
||||
}
|
||||
});
|
||||
|
||||
// Defaults to be used by all instances of collapsible if per-instance values
|
||||
// are unset or if nothing is specified by way of inheritance from an accordion.
|
||||
// Note that this hash does not contain options "collapsed" or "heading",
|
||||
// because those are not inheritable.
|
||||
$.mobile.collapsible.defaults = {
|
||||
expandCueText: " click to expand contents",
|
||||
collapseCueText: " click to collapse contents",
|
||||
collapsedIcon: "plus",
|
||||
contentTheme: "inherit",
|
||||
expandedIcon: "minus",
|
||||
iconpos: "left",
|
||||
inset: true,
|
||||
corners: true,
|
||||
theme: "inherit",
|
||||
mini: false
|
||||
};
|
||||
|
||||
})(jQuery);
|
||||
|
||||
});
|
||||
|
|
@ -1,121 +0,0 @@
|
|||
div[data-role="controlgroup"], fieldset[data-role="controlgroup"] {
|
||||
padding: 0;
|
||||
margin: .5em 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
div[data-role="controlgroup"] + *, fieldset[data-role="controlgroup"] + * {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"].ui-mini .ui-btn-icon-notext,
|
||||
*[data-role="controlgroup"] .ui-mini.ui-btn-icon-notext {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] .ui-btn,
|
||||
*[data-role="controlgroup"] .ui-checkbox,
|
||||
*[data-role="controlgroup"] .ui-radio,
|
||||
*[data-role="controlgroup"] .ui-select {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] .ui-btn:focus,
|
||||
*[data-role="controlgroup"] .ui-btn.ui-focus {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn,
|
||||
*[data-role="controlgroup"][data-type="horizontal"] li > .ui-btn,
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-checkbox,
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-radio,
|
||||
*[data-role="controlgroup"][data-type="horizontal"].ui-select {
|
||||
float: left;
|
||||
clear: none;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] button.ui-btn,
|
||||
*[data-role="controlgroup"] .ui-btn-icon-notext {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn-icon-notext,
|
||||
*[data-role="controlgroup"][data-type="horizontal"] button.ui-btn-icon-notext {
|
||||
width: 1.5em;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] .ui-btn-icon-notext {
|
||||
height: auto;
|
||||
padding: .7em 1em;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"]:not([data-type="horizontal"]) .ui-btn {
|
||||
border-bottom-width: 0;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"]:not([data-type="horizontal"]) .ui-checkbox:last-child .ui-btn {
|
||||
border-bottom-width: 1px;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn {
|
||||
border-right-width: 0;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn:last-child {
|
||||
border-right-width: 1px;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-radio:last-child label {
|
||||
border-right-width: 1px;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] .ui-btn-corner-all,
|
||||
*[data-role="controlgroup"] .ui-btn.ui-corner-all {
|
||||
-webkit-border-radius: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] .ui-radio,
|
||||
*[data-role="controlgroup"] .ui-checkbox,
|
||||
*[data-role="controlgroup"] .ui-select,
|
||||
*[data-role="controlgroup"] li {
|
||||
-webkit-border-radius: inherit;
|
||||
border-radius: inherit;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn:first-child {
|
||||
-webkit-border-top-left-radius: inherit;
|
||||
border-top-left-radius: inherit;
|
||||
-webkit-border-bottom-left-radius: inherit;
|
||||
border-bottom-left-radius: inherit;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"][data-type="horizontal"] .ui-btn:last-child {
|
||||
-webkit-border-top-right-radius: inherit;
|
||||
border-top-right-radius: inherit;
|
||||
-webkit-border-bottom-right-radius: inherit;
|
||||
border-bottom-right-radius: inherit;
|
||||
}
|
||||
|
||||
*[data-role="controlgroup"] a.ui-shadow:not(:focus),
|
||||
*[data-role="controlgroup"] button.ui-shadow:not(:focus),
|
||||
*[data-role="controlgroup"] div.ui-shadow:not(.ui-focus) {
|
||||
-moz-box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
/* Fixes legend not wrapping on IE10 */
|
||||
fieldset[data-role="controlgroup"] legend {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.ui-textinput-autogrow-resize {
|
||||
-webkit-transition: height 0.25s;
|
||||
-o-transition: height 0.25s;
|
||||
-moz-transition: height 0.25s;
|
||||
transition: height 0.25s;
|
||||
}
|
||||
|
|
@ -1,4 +1,14 @@
|
|||
/* preset breakpoint to switch to stacked grid styles below 35em (560px) */
|
||||
/* "page" containers - full-screen views, one should always be in view post-pageload */
|
||||
.ui-mobile [data-role=dialog] {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* preset breakpoint to switch to stacked grid styles below 35em (560px) */
|
||||
@media (max-width: 35em) {
|
||||
.ui-responsive > .ui-block-a,
|
||||
.ui-responsive > .ui-block-b,
|
||||
|
|
|
|||
|
|
@ -1,4 +1,14 @@
|
|||
.ui-popup.ui-body-a {
|
||||
/* "page" containers - full-screen views, one should always be in view post-pageload */
|
||||
.ui-mobile [data-role=dialog] {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.ui-popup.ui-body-a {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.ui-popup.ui-body-b {
|
||||
|
|
|
|||
|
|
@ -1,441 +0,0 @@
|
|||
/*
|
||||
* jQuery Mobile v1.4.5
|
||||
* http://jquerymobile.com
|
||||
*
|
||||
* Copyright 2010, 2014 jQuery Foundation, Inc. and other contributors
|
||||
* Released under the MIT license.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
*/
|
||||
|
||||
/* Globals */
|
||||
|
||||
/* Font
|
||||
-----------------------------------------------------------------------------------------------------------*/
|
||||
|
||||
button,
|
||||
.ui-btn {
|
||||
line-height: 1.3 /*{global-font-family}*/;
|
||||
}
|
||||
|
||||
legend {
|
||||
color: inherit;
|
||||
}
|
||||
/* Form labels (overrides font-weight bold in bars, and mini font-size) */
|
||||
.ui-mobile label,
|
||||
div.ui-controlgroup-label {
|
||||
font-weight: normal;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* Buttons
|
||||
-----------------------------------------------------------------------------------------------------------*/
|
||||
|
||||
.ui-btn,
|
||||
label.ui-btn, ul[data-role="listview"] a + a {
|
||||
font-weight: bold;
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.ui-btn, ul[data-role="listview"] a + a {
|
||||
text-decoration: none !important;
|
||||
}
|
||||
|
||||
.ui-btn-active {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* Corner rounding
|
||||
-----------------------------------------------------------------------------------------------------------*/
|
||||
/* Class ui-btn-corner-all deprecated in 1.4 */
|
||||
|
||||
.ui-corner-all {
|
||||
-webkit-border-radius: .3125em /*{global-radii-blocks}*/;
|
||||
border-radius: .3125em /*{global-radii-blocks}*/;
|
||||
}
|
||||
/* Buttons */
|
||||
.ui-btn-corner-all,
|
||||
.ui-btn.ui-corner-all,
|
||||
/* Slider track */
|
||||
.ui-slider-track.ui-corner-all,
|
||||
/* Count bubble */
|
||||
.ui-li-count {
|
||||
-webkit-border-radius: .3125em /*{global-radii-buttons}*/;
|
||||
border-radius: .3125em /*{global-radii-buttons}*/;
|
||||
}
|
||||
/* Icon-only buttons */
|
||||
.ui-btn-icon-notext.ui-btn-corner-all,
|
||||
.ui-btn-icon-notext.ui-corner-all {
|
||||
-webkit-border-radius: 1em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
/* Radius clip workaround for cleaning up corner trapping */
|
||||
.ui-btn-corner-all,
|
||||
.ui-corner-all {
|
||||
-webkit-background-clip: padding;
|
||||
background-clip: padding-box;
|
||||
}
|
||||
|
||||
/* Icons
|
||||
-----------------------------------------------------------------------------------------------------------*/
|
||||
|
||||
.ui-btn-icon-left:after,
|
||||
.ui-btn-icon-right:after,
|
||||
.ui-btn-icon-top:after,
|
||||
.ui-btn-icon-bottom:after,
|
||||
.ui-btn-icon-notext:after,
|
||||
ul[data-role="listview"] a + a:after {
|
||||
background-color: #666 /*{global-icon-color}*/;
|
||||
background-color: rgba(0,0,0,.3) /*{global-icon-disc}*/;
|
||||
background-position: center center;
|
||||
background-repeat: no-repeat;
|
||||
-webkit-border-radius: 1em;
|
||||
border-radius: 1em;
|
||||
}
|
||||
|
||||
/* Alt icons */
|
||||
.ui-alt-icon.ui-btn:after,
|
||||
.ui-alt-icon .ui-btn:after,
|
||||
html .ui-alt-icon.ui-checkbox-off:after,
|
||||
html .ui-alt-icon.ui-radio-off:after,
|
||||
html .ui-alt-icon .ui-checkbox-off:after,
|
||||
html .ui-alt-icon .ui-radio-off:after {
|
||||
background-color: #666 /*{global-icon-color}*/;
|
||||
background-color: rgba(0,0,0,.15) /*{global-icon-disc}*/;
|
||||
}
|
||||
|
||||
/* No disc */
|
||||
.ui-nodisc-icon.ui-btn:after,
|
||||
.ui-nodisc-icon .ui-btn:after {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* Checkbox and radio */
|
||||
.ui-btn.ui-checkbox-off:after,
|
||||
.ui-btn.ui-checkbox-on:after,
|
||||
.ui-btn.ui-radio-off:after,
|
||||
.ui-btn.ui-radio-on:after {
|
||||
display: block;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin: -9px 2px 0 2px;
|
||||
}
|
||||
|
||||
.ui-checkbox-off:after,
|
||||
.ui-btn.ui-radio-off:after {
|
||||
filter: Alpha(Opacity=30);
|
||||
opacity: .3;
|
||||
}
|
||||
|
||||
.ui-btn.ui-checkbox-off:after,
|
||||
.ui-btn.ui-checkbox-on:after {
|
||||
-webkit-border-radius: .1875em;
|
||||
border-radius: .1875em;
|
||||
}
|
||||
|
||||
.ui-btn.ui-checkbox-off:after {
|
||||
background-color: #666;
|
||||
background-color: rgba(0,0,0,.3);
|
||||
}
|
||||
|
||||
.ui-radio .ui-btn.ui-radio-on:after {
|
||||
background-image: none;
|
||||
background-color: #fff;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border-width: 5px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
.ui-alt-icon.ui-btn.ui-radio-on:after,
|
||||
.ui-alt-icon .ui-btn.ui-radio-on:after {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
/*
|
||||
* jQuery Mobile v1.4.5
|
||||
* http://jquerymobile.com
|
||||
*
|
||||
* Copyright 2010, 2014 jQuery Foundation, Inc. and other contributors
|
||||
* Released under the MIT license.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
*/
|
||||
|
||||
.ui-mobile fieldset,
|
||||
.ui-page {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui-mobile a img,
|
||||
.ui-mobile fieldset {
|
||||
border-width: 0;
|
||||
}
|
||||
/* Fixes for fieldset issues on IE10 and FF (see #6077) */
|
||||
.ui-mobile fieldset {
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
@-moz-document url-prefix() {
|
||||
.ui-mobile fieldset {
|
||||
display: table-column;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
/* Viewport */
|
||||
.ui-mobile-viewport {
|
||||
margin: 0;
|
||||
overflow-x: visible;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
-ms-text-size-adjust: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
/* Issue #2066 */
|
||||
body.ui-mobile-viewport,
|
||||
div.ui-mobile-viewport {
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
/* "page" containers - full-screen views, one should always be in view post-pageload */
|
||||
.ui-mobile [data-role=dialog] {
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
min-height: 100%;
|
||||
position: absolute;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* On ios4, setting focus on the page element causes flashing during transitions when there is an outline, so we turn off outlines */
|
||||
.ui-page {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.ui-mobile .ui-page-active {
|
||||
display: block;
|
||||
overflow: visible;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
@media screen and (orientation: portrait) {
|
||||
.ui-mobile .ui-page {
|
||||
min-height: 420px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (orientation: landscape) {
|
||||
.ui-mobile .ui-page {
|
||||
min-height: 300px;
|
||||
}
|
||||
}
|
||||
|
||||
/* Fouc */
|
||||
.ui-mobile-rendering > * {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
/* Headers, content panels */
|
||||
.ui-bar,
|
||||
.ui-body {
|
||||
position: relative;
|
||||
padding: .4em 1em;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.ui-bar h1,
|
||||
.ui-bar h2,
|
||||
.ui-bar h3,
|
||||
.ui-bar h4,
|
||||
.ui-bar h5,
|
||||
.ui-bar h6 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: 1em;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Buttons and icons */
|
||||
.ui-btn, ul[data-role="listview"] a + a {
|
||||
font-size: 16px;
|
||||
margin: .5em 0;
|
||||
padding: .7em 1em;
|
||||
display: block;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.ui-btn-icon-notext, ul[data-role="listview"] a + a {
|
||||
padding: 0;
|
||||
width: 1.75em;
|
||||
height: 1.75em;
|
||||
text-indent: -9999px;
|
||||
white-space: nowrap !important;
|
||||
}
|
||||
|
||||
.ui-mini {
|
||||
font-size: 12.5px;
|
||||
}
|
||||
|
||||
.ui-mini .ui-btn {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
.ui-mini.ui-btn-icon-notext,
|
||||
.ui-mini .ui-btn-icon-notext {
|
||||
font-size: 16px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.ui-btn-inline {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: .625em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-left {
|
||||
padding-left: 2.5em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-right {
|
||||
padding-right: 2.5em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-top {
|
||||
padding-top: 2.5em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-bottom {
|
||||
padding-bottom: 2.5em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-left:after,
|
||||
.ui-btn-icon-right:after,
|
||||
.ui-btn-icon-top:after,
|
||||
.ui-btn-icon-bottom:after,
|
||||
.ui-btn-icon-notext:after,
|
||||
ul[data-role="listview"] a + a:after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
}
|
||||
|
||||
.ui-btn-icon-notext:after,
|
||||
.ui-btn-icon-left:after,
|
||||
.ui-btn-icon-right:after,
|
||||
ul[data-role="listview"] a + a:after {
|
||||
top: 50%;
|
||||
margin-top: -11px;
|
||||
}
|
||||
|
||||
.ui-btn-icon-left:after {
|
||||
left: .5625em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-right:after {
|
||||
right: .5625em;
|
||||
}
|
||||
|
||||
.ui-mini.ui-btn-icon-left:after,
|
||||
.ui-mini .ui-btn-icon-left:after {
|
||||
left: .37em;
|
||||
}
|
||||
|
||||
.ui-mini.ui-btn-icon-right:after,
|
||||
.ui-mini .ui-btn-icon-right:after {
|
||||
right: .37em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-notext:after,
|
||||
.ui-btn-icon-top:after,
|
||||
.ui-btn-icon-bottom:after,
|
||||
ul[data-role="listview"] a + a:after {
|
||||
left: 50%;
|
||||
margin-left: -11px;
|
||||
}
|
||||
|
||||
.ui-btn-icon-top:after {
|
||||
top: .5625em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-bottom:after {
|
||||
top: auto;
|
||||
bottom: .5625em;
|
||||
}
|
||||
/* Buttons in header position classes */
|
||||
.ui-btn-left > [class*="ui-"],
|
||||
.ui-btn-right > [class*="ui-"] {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.ui-btn-left,
|
||||
.ui-btn-right {
|
||||
position: absolute;
|
||||
top: .24em;
|
||||
}
|
||||
|
||||
.ui-btn-left {
|
||||
left: .4em;
|
||||
}
|
||||
|
||||
.ui-btn-right {
|
||||
right: .4em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-notext.ui-btn-left {
|
||||
top: .3125em;
|
||||
left: .3125em;
|
||||
}
|
||||
|
||||
.ui-btn-icon-notext.ui-btn-right {
|
||||
top: .3125em;
|
||||
right: .3125em;
|
||||
}
|
||||
|
||||
/* Button elements */
|
||||
button.ui-btn,
|
||||
*[data-role="controlgroup"] button.ui-btn-icon-notext {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
button.ui-btn-inline {
|
||||
width: auto;
|
||||
}
|
||||
/* Firefox adds a 1px border in a button element. We negate this to make sure they have the same height as other buttons in controlgroups. */
|
||||
button.ui-btn::-moz-focus-inner {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
button.ui-btn-icon-notext,
|
||||
*[data-role="controlgroup"][data-type="horizontal"] button.ui-btn {
|
||||
-webkit-box-sizing: content-box;
|
||||
-moz-box-sizing: content-box;
|
||||
box-sizing: content-box;
|
||||
width: 1.75em;
|
||||
}
|
||||
|
||||
/* Form labels */
|
||||
.ui-mobile label,
|
||||
*[data-role="controlgroup"] label {
|
||||
display: block;
|
||||
margin: 0 0 .4em;
|
||||
}
|
||||
|
|
@ -16,6 +16,7 @@
|
|||
.ui-body-a .button-cancel {
|
||||
background: #fff;
|
||||
color: inherit;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.button-submit {
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
<div id="userParentalControlPage" data-role="page" class="page type-interior userProfilesPage" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Users" data-require="jqmpopup,scripts/userparentalcontrol,emby-checkbox,emby-button,emby-collapse,emby-select">
|
||||
<div id="userParentalControlPage" data-role="page" class="page type-interior userProfilesPage" data-helpurl="https://github.com/MediaBrowser/Wiki/wiki/Users" data-require="scripts/userparentalcontrol,emby-checkbox,emby-button,emby-select">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="content-primary">
|
||||
|
|
@ -22,9 +22,9 @@
|
|||
<br />
|
||||
|
||||
<div>
|
||||
<div>
|
||||
<h1 style="display:inline-block;vertical-align:middle;">${LabelBlockContentWithTags}</h1>
|
||||
<button is="emby-button" type="button" class="raised btnAddBlockedTag submit mini" style="margin-left:1em;" title="${ButtonAdd}">
|
||||
<div class="detailSectionHeader">
|
||||
<h1>${LabelBlockContentWithTags}</h1>
|
||||
<button is="emby-button" type="button" class="raised btnAddBlockedTag submit mini" style="margin-left:1em;" title="${ButtonAddUser}">
|
||||
<i class="md-icon">add</i>
|
||||
<span>${ButtonAdd}</span>
|
||||
</button>
|
||||
|
|
@ -35,20 +35,22 @@
|
|||
</div>
|
||||
<br />
|
||||
|
||||
<div class="accessScheduleSection" style="display: none;">
|
||||
<div is="emby-collapse" title="${HeaderAccessSchedule}">
|
||||
<div class="collapseContent">
|
||||
<p>${HeaderAccessScheduleHelp}</p>
|
||||
<div>
|
||||
<div class="detailSectionHeader">
|
||||
<h1>${HeaderAccessSchedule}</h1>
|
||||
<button is="emby-button" type="button" class="raised btnAddSchedule submit mini" style="margin-left:1em;" title="${ButtonAddUser}">
|
||||
<i class="md-icon">add</i>
|
||||
<span>${ButtonAdd}</span>
|
||||
</button>
|
||||
</div>
|
||||
<p>${HeaderAccessScheduleHelp}</p>
|
||||
<div class="accessScheduleList paperList">
|
||||
|
||||
<button class="btnAddSchedule" type="button" data-icon="plus" data-mini="true">${ButtonAddSchedule}</button>
|
||||
|
||||
<div class="accessScheduleList">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
</div>
|
||||
|
||||
<br />
|
||||
<div>
|
||||
<button is="emby-button" type="submit" class="raised button-submit block">
|
||||
<span>${ButtonSave}</span>
|
||||
|
|
@ -56,54 +58,6 @@
|
|||
</div>
|
||||
|
||||
</form>
|
||||
|
||||
<div data-role="popup" id="popupSchedule" class="popup" data-theme="a">
|
||||
|
||||
<div class="ui-bar-a" style="text-align: center; padding: 5px 20px;">
|
||||
<h3 style="margin: .5em;">${HeaderSchedule}</h3>
|
||||
</div>
|
||||
|
||||
<div style="padding:10px 5px 0;">
|
||||
|
||||
<form class="scheduleForm" style="min-width:210px;">
|
||||
|
||||
<div>
|
||||
<label for="selectDay">${LabelAccessDay}</label>
|
||||
<select id="selectDay" data-mini="true">
|
||||
<option value="Sunday">${OptionSunday}</option>
|
||||
<option value="Monday">${OptionMonday}</option>
|
||||
<option value="Tuesday">${OptionTuesday}</option>
|
||||
<option value="Wednesday">${OptionWednesday}</option>
|
||||
<option value="Thursday">${OptionThursday}</option>
|
||||
<option value="Friday">${OptionFriday}</option>
|
||||
<option value="Saturday">${OptionSaturday}</option>
|
||||
<option value="Everyday">${OptionEveryday}</option>
|
||||
<option value="Weekday">${OptionWeekdays}</option>
|
||||
<option value="Weekend">${OptionWeekends}</option>
|
||||
</select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectStart">${LabelAccessStart}</label>
|
||||
<select class="selectHour" id="selectStart" data-mini="true"></select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<label for="selectEnd">${LabelAccessEnd}</label>
|
||||
<select class="selectHour" id="selectEnd" data-mini="true"></select>
|
||||
</div>
|
||||
<br />
|
||||
<div>
|
||||
<input type="hidden" id="fldScheduleIndex" />
|
||||
<button type="submit" data-icon="plus" data-theme="b" data-mini="true">${ButtonAdd}</button>
|
||||
<button type="button" data-icon="delete" data-mini="true" onclick="$(this).parents('.popup').popup('close');">${ButtonCancel}</button>
|
||||
</div>
|
||||
<br />
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -3,9 +3,9 @@
|
|||
<div data-role="content">
|
||||
<div class="content-primary">
|
||||
<div class="detailSectionHeader">
|
||||
<h3 style="margin:.6em 0;vertical-align:middle;display:inline-block;">
|
||||
<h1>
|
||||
<span style="vertical-align:middle;">${HeaderUsers}</span>
|
||||
</h3>
|
||||
</h1>
|
||||
<button is="emby-button" type="button" class="raised btnAddUser submit mini" style="margin-left:1em;" title="${ButtonAddUser}">
|
||||
<i class="md-icon">add</i>
|
||||
<span>${ButtonAdd}</span>
|
||||
|
|
@ -14,9 +14,9 @@
|
|||
<div class="localUsers itemsContainer vertical-wrap" style="text-align:left;margin-top:.5em;"></div>
|
||||
|
||||
<div class="detailSectionHeader" style="margin-top:2.5em;">
|
||||
<h3 style="margin:.6em 0;vertical-align:middle;display:inline-block;">
|
||||
<h1>
|
||||
${HeaderGuests}
|
||||
</h3>
|
||||
</h1>
|
||||
<button is="emby-button" type="button" class="raised btnInvite submit mini" style="margin-left:1em;" title="${ButtonInviteUser}">
|
||||
<i class="md-icon">add</i>
|
||||
<span>${ButtonAdd}</span>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue