mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
fixes #552 - Add parental control usage limits
This commit is contained in:
parent
101e365db4
commit
c2ea67d056
4 changed files with 221 additions and 8 deletions
|
@ -100,9 +100,67 @@
|
|||
|
||||
$('#selectMaxParentalRating', page).val(ratingValue).selectmenu("refresh");
|
||||
|
||||
if (user.Configuration.IsAdministrator) {
|
||||
$('.accessScheduleSection', page).hide();
|
||||
} else {
|
||||
$('.accessScheduleSection', page).show();
|
||||
}
|
||||
|
||||
renderAccessSchedule(page, user.Configuration.AccessSchedules || []);
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
}
|
||||
|
||||
function getDisplayTime(hour) {
|
||||
|
||||
return new Date(2000, 1, 1, hour, 0, 0, 0).toLocaleTimeString();
|
||||
|
||||
}
|
||||
|
||||
function deleteAccessSchedule(page, schedules, index) {
|
||||
|
||||
schedules.splice(index, 1);
|
||||
|
||||
renderAccessSchedule(page, schedules);
|
||||
}
|
||||
|
||||
function renderAccessSchedule(page, schedules) {
|
||||
|
||||
var html = '<ul data-role="listview" data-inset="true" data-split-icon="minus">';
|
||||
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 += '<a href="#">';
|
||||
itemHtml += '<h3>' + a.DayOfWeek + '</h3>';
|
||||
itemHtml += '<p>' + getDisplayTime(a.StartHour) + ' - ' + getDisplayTime(a.EndHour) + '</p>';
|
||||
itemHtml += '</a>';
|
||||
|
||||
itemHtml += '<a href="#" data-icon="delete" class="btnDelete" data-index="' + index + '">';
|
||||
itemHtml += '</a>';
|
||||
|
||||
itemHtml += '</li>';
|
||||
|
||||
index++;
|
||||
|
||||
return itemHtml;
|
||||
|
||||
}).join('');
|
||||
|
||||
html += '</ul>';
|
||||
|
||||
var elem = $('.accessScheduleList', page).html(html).trigger('create');
|
||||
|
||||
$('.btnDelete', elem).on('click', function () {
|
||||
|
||||
deleteAccessSchedule(page, schedules, parseInt(this.getAttribute('data-index')));
|
||||
});
|
||||
}
|
||||
|
||||
function onSaveComplete(page) {
|
||||
|
||||
Dashboard.hideLoadingMsg();
|
||||
|
@ -120,6 +178,8 @@
|
|||
|
||||
}).get();
|
||||
|
||||
user.Configuration.AccessSchedules = getSchedulesFromPage(page);
|
||||
|
||||
ApiClient.updateUser(user).done(function () {
|
||||
onSaveComplete(page);
|
||||
});
|
||||
|
@ -139,12 +199,103 @@
|
|||
saveUser(result, page);
|
||||
});
|
||||
|
||||
// Disable default form submission
|
||||
return false;
|
||||
},
|
||||
|
||||
onScheduleFormSubmit: function () {
|
||||
|
||||
var page = $(this).parents('.page');
|
||||
|
||||
saveSchedule(page);
|
||||
|
||||
// Disable default form submission
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
$(document).on('pageshow', "#userParentalControlPage", function () {
|
||||
function populateHours(page) {
|
||||
|
||||
var html = '';
|
||||
|
||||
for (var i = 0; i < 24; i++) {
|
||||
|
||||
html += '<option value="' + i + '">' + getDisplayTime(i) + '</option>';
|
||||
}
|
||||
|
||||
$('#selectStart', page).html(html).selectmenu('refresh');
|
||||
$('#selectEnd', page).html(html).selectmenu('refresh');
|
||||
}
|
||||
|
||||
function showSchedulePopup(page, schedule, index) {
|
||||
|
||||
schedule = schedule || {};
|
||||
|
||||
$('#popupSchedule', page).popup('open');
|
||||
|
||||
$('#fldScheduleIndex', page).val(index);
|
||||
|
||||
$('#selectDay', page).val(schedule.DayOfWeek || 'Sunday').selectmenu('refresh');
|
||||
$('#selectStart', page).val(schedule.StartHour || 0).selectmenu('refresh');
|
||||
$('#selectEnd', page).val(schedule.EndHour || 0).selectmenu('refresh');
|
||||
}
|
||||
|
||||
function saveSchedule(page) {
|
||||
|
||||
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');
|
||||
}
|
||||
|
||||
function getSchedulesFromPage(page) {
|
||||
|
||||
return $('.liSchedule', page).map(function () {
|
||||
|
||||
return {
|
||||
DayOfWeek: this.getAttribute('data-day'),
|
||||
StartHour: this.getAttribute('data-start'),
|
||||
EndHour: this.getAttribute('data-end')
|
||||
};
|
||||
|
||||
}).get();
|
||||
}
|
||||
|
||||
$(document).on('pageinit', "#userParentalControlPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
|
||||
$('.btnAddSchedule', page).on('click', function () {
|
||||
|
||||
showSchedulePopup(page, {}, -1);
|
||||
});
|
||||
|
||||
populateHours(page);
|
||||
|
||||
}).on('pageshow', "#userParentalControlPage", function () {
|
||||
|
||||
var page = this;
|
||||
|
||||
|
|
|
@ -36,10 +36,13 @@
|
|||
html += '<ul data-role="listview" style="min-width: 180px;">';
|
||||
html += '<li data-role="list-divider">' + Globalize.translate('HeaderMenu') + '</li>';
|
||||
|
||||
html += '<li><a href="#" class="btnDeleteUser" data-userid="' + userId + '">' + Globalize.translate('ButtonDelete') + '</a></li>';
|
||||
|
||||
html += '<li><a href="useredit.html?userid=' + userId + '">' + Globalize.translate('ButtonOpen') + '</a></li>';
|
||||
|
||||
html += '<li><a href="userlibraryaccess.html?userid=' + userId + '">' + Globalize.translate('ButtonLibraryAccess') + '</a></li>';
|
||||
html += '<li><a href="userparentalcontrol.html?userid=' + userId + '">' + Globalize.translate('ButtonParentalControl') + '</a></li>';
|
||||
|
||||
html += '<li><a href="#" class="btnDeleteUser" data-userid="' + userId + '">' + Globalize.translate('ButtonDelete') + '</a></li>';
|
||||
|
||||
html += '</ul>';
|
||||
|
||||
html += '</div>';
|
||||
|
|
|
@ -30,7 +30,22 @@
|
|||
</div>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
|
||||
<div class="accessScheduleSection" style="display:none;">
|
||||
<div data-role="collapsible">
|
||||
<h2>${HeaderAccessSchedule}</h2>
|
||||
<div>
|
||||
<p>${HeaderAccessScheduleHelp}</p>
|
||||
|
||||
<button class="btnAddSchedule" type="button" data-icon="plus" data-mini="true">${ButtonAddSchedule}</button>
|
||||
|
||||
<div class="accessScheduleList">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br />
|
||||
</div>
|
||||
<ul data-role="listview" class="ulForm">
|
||||
<li>
|
||||
<button type="submit" data-theme="b" data-icon="check">
|
||||
|
@ -38,10 +53,56 @@
|
|||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</form>
|
||||
|
||||
<div data-role="popup" id="popupSchedule" data-theme="a">
|
||||
|
||||
<a href="#" data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">${ButtonClose}</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;">
|
||||
|
||||
<ul data-role="listview" class="ulForm" style="margin-bottom:10px!important;">
|
||||
<li>
|
||||
<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>
|
||||
</select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="selectStart">${LabelAccessStart}</label>
|
||||
<select class="selectHour" id="selectStart" data-mini="true"></select>
|
||||
</li>
|
||||
<li>
|
||||
<label for="selectEnd">${LabelAccessEnd}</label>
|
||||
<select class="selectHour" id="selectEnd" data-mini="true"></select>
|
||||
</li>
|
||||
<li>
|
||||
<input type="hidden" id="fldScheduleIndex" />
|
||||
<button type="submit" data-icon="plus">${ButtonAdd}</button>
|
||||
</li>
|
||||
</ul>
|
||||
</form>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="text/javascript">
|
||||
$('.scheduleForm').off('submit', UserParentalControlPage.onScheduleFormSubmit).on('submit', UserParentalControlPage.onScheduleFormSubmit);
|
||||
$('.userParentalControlForm').off('submit', UserParentalControlPage.onSubmit).on('submit', UserParentalControlPage.onSubmit);
|
||||
</script>
|
||||
</div>
|
||||
|
|
|
@ -22,9 +22,8 @@
|
|||
</h3>
|
||||
</div>
|
||||
<div class="itemsContainer localUsers" style="text-align:left;margin-top:.5em;"></div>
|
||||
<br /><br />
|
||||
|
||||
<div class="ui-bar-a" style="padding: 0 1em;">
|
||||
<div class="ui-bar-a" style="padding: 0 1em;margin-top:2em;">
|
||||
<h3 style="margin:.6em 0;font-size:16px;font-weight:500;">
|
||||
<span style="vertical-align:middle;">${HeaderGuests}</span>
|
||||
<a class="btnInvite" data-role="button" data-icon="plus" href="#" data-rel="popup" data-position-to="window" data-inline="true" data-mini="true" data-iconpos="notext" style="margin: 0 0 0 .5em; vertical-align:middle;">
|
||||
|
@ -33,9 +32,8 @@
|
|||
</h3>
|
||||
</div>
|
||||
<div class="itemsContainer connectUsers" style="text-align:left;margin-top:.5em;"></div>
|
||||
<br /><br />
|
||||
|
||||
<div class="sectionPendingGuests" style="display:none;">
|
||||
<div class="sectionPendingGuests" style="display:none;margin-top:2em;">
|
||||
<div class="ui-bar-a" style="padding: 0 1em;"><h3 style="font-size:16px;font-weight:500;">${HeaderPendingInvitations}</h3></div>
|
||||
<div class="itemsContainer pending" style="text-align:left;margin-top:.5em;"></div>
|
||||
</div>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue