mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
refactor edit user page to use new js format
This commit is contained in:
Luke Pulverenti
parent
31cd730c33
commit
637e5741be
2 changed files with 172 additions and 146 deletions
|
|
@ -12,7 +12,7 @@
|
||||||
<a href="#" data-role="button" class="ui-btn-active">Profile</a>
|
<a href="#" data-role="button" class="ui-btn-active">Profile</a>
|
||||||
<a href="#" data-role="button" onclick="Dashboard.navigate('userimage.html', true);">Image</a>
|
<a href="#" data-role="button" onclick="Dashboard.navigate('userimage.html', true);">Image</a>
|
||||||
<a href="#" data-role="button" onclick="Dashboard.navigate('updatepassword.html', true);">Password</a>
|
<a href="#" data-role="button" onclick="Dashboard.navigate('updatepassword.html', true);">Password</a>
|
||||||
<a href="#" data-role="button" onclick="Dashboard.navigate('library.html', true);">Media Library</a>
|
<a class="lnkMediaLibrary" style="display:none;" href="#" data-role="button" onclick="Dashboard.navigate('library.html', true);">Media Library</a>
|
||||||
</div>
|
</div>
|
||||||
<form id="editUserProfileForm">
|
<form id="editUserProfileForm">
|
||||||
<ul data-role="listview" class="ulForm">
|
<ul data-role="listview" class="ulForm">
|
||||||
|
|
|
||||||
|
|
@ -1,20 +1,174 @@
|
||||||
var EditUserPage = {
|
(function ($, window, document) {
|
||||||
|
|
||||||
|
function populateLanguages(select, allCultures) {
|
||||||
|
|
||||||
|
var html = "";
|
||||||
|
|
||||||
|
html += "<option value=''>None</option>";
|
||||||
|
|
||||||
|
for (var i = 0, length = allCultures.length; i < length; i++) {
|
||||||
|
|
||||||
|
var culture = allCultures[i];
|
||||||
|
|
||||||
|
html += "<option value='" + culture.ThreeLetterISOLanguageName + "'>" + culture.DisplayName + "</option>";
|
||||||
|
}
|
||||||
|
|
||||||
|
select.html(html).selectmenu("refresh");
|
||||||
|
}
|
||||||
|
|
||||||
|
function populateRatings(allParentalRatings, page) {
|
||||||
|
|
||||||
|
var html = "";
|
||||||
|
|
||||||
|
html += "<option value=''>None</option>";
|
||||||
|
|
||||||
|
for (var i = 0, length = allParentalRatings.length; i < length; i++) {
|
||||||
|
|
||||||
|
var rating = allParentalRatings[i];
|
||||||
|
|
||||||
|
html += "<option value='" + rating.Value + "'>" + rating.Name + "</option>";
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#selectMaxParentalRating', page).html(html).selectmenu("refresh");
|
||||||
|
}
|
||||||
|
|
||||||
|
function loadUser(page, user, loggedInUser, parentalRatingsPromise, allCulturesPromise) {
|
||||||
|
|
||||||
|
if (loggedInUser.Configuration.IsAdministrator) {
|
||||||
|
$('.lnkMediaLibrary', page).show();
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!loggedInUser.Configuration.IsAdministrator || user.Id == loggedInUser.Id) {
|
||||||
|
|
||||||
|
$('#fldIsAdmin', page).hide();
|
||||||
|
$('#fldMaxParentalRating', page).hide();
|
||||||
|
} else {
|
||||||
|
$('#fldIsAdmin', page).show();
|
||||||
|
$('#fldMaxParentalRating', page).show();
|
||||||
|
}
|
||||||
|
|
||||||
|
Dashboard.setPageTitle(user.Name || "Add User");
|
||||||
|
|
||||||
|
$('#txtUserName', page).val(user.Name);
|
||||||
|
|
||||||
|
parentalRatingsPromise.done(function (allParentalRatings) {
|
||||||
|
|
||||||
|
populateRatings(allParentalRatings, page);
|
||||||
|
|
||||||
|
var ratingValue = "";
|
||||||
|
|
||||||
|
if (user.Configuration.MaxParentalRating) {
|
||||||
|
|
||||||
|
for (var i = 0, length = allParentalRatings.length; i < length; i++) {
|
||||||
|
|
||||||
|
var rating = allParentalRatings[i];
|
||||||
|
|
||||||
|
if (user.Configuration.MaxParentalRating >= rating.Value) {
|
||||||
|
ratingValue = rating.Value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
$('#selectMaxParentalRating', page).val(ratingValue).selectmenu("refresh");
|
||||||
|
});
|
||||||
|
|
||||||
|
allCulturesPromise.done(function (allCultures) {
|
||||||
|
|
||||||
|
populateLanguages($('#selectAudioLanguage', page), allCultures);
|
||||||
|
populateLanguages($('#selectSubtitleLanguage', page), allCultures);
|
||||||
|
|
||||||
|
$('#selectAudioLanguage', page).val(user.Configuration.AudioLanguagePreference || "").selectmenu("refresh");
|
||||||
|
$('#selectSubtitleLanguage', page).val(user.Configuration.SubtitleLanguagePreference || "").selectmenu("refresh");
|
||||||
|
});
|
||||||
|
|
||||||
|
$('#chkForcedSubtitlesOnly', page).checked(user.Configuration.UseForcedSubtitlesOnly || false).checkboxradio("refresh");
|
||||||
|
$('#chkIsAdmin', page).checked(user.Configuration.IsAdministrator || false).checkboxradio("refresh");
|
||||||
|
|
||||||
|
Dashboard.hideLoadingMsg();
|
||||||
|
}
|
||||||
|
|
||||||
|
function onSaveComplete(page) {
|
||||||
|
|
||||||
|
Dashboard.hideLoadingMsg();
|
||||||
|
|
||||||
|
var userId = getParameterByName("userId");
|
||||||
|
|
||||||
|
Dashboard.validateCurrentUser(page);
|
||||||
|
|
||||||
|
if (userId) {
|
||||||
|
Dashboard.alert("Settings saved.");
|
||||||
|
} else {
|
||||||
|
Dashboard.navigate("userprofiles.html");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function saveUser(user, page) {
|
||||||
|
|
||||||
|
user.Name = $('#txtUserName', page).val();
|
||||||
|
user.Configuration.MaxParentalRating = $('#selectMaxParentalRating', page).val() || null;
|
||||||
|
|
||||||
|
user.Configuration.IsAdministrator = $('#chkIsAdmin', page).checked();
|
||||||
|
|
||||||
|
user.Configuration.AudioLanguagePreference = $('#selectAudioLanguage', page).val();
|
||||||
|
user.Configuration.SubtitleLanguagePreference = $('#selectSubtitleLanguage', page).val();
|
||||||
|
user.Configuration.UseForcedSubtitlesOnly = $('#chkForcedSubtitlesOnly', page).checked();
|
||||||
|
|
||||||
|
var userId = getParameterByName("userId");
|
||||||
|
|
||||||
|
if (userId) {
|
||||||
|
ApiClient.updateUser(user).done(function () {
|
||||||
|
onSaveComplete(page);
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
ApiClient.createUser(user).done(function () {
|
||||||
|
onSaveComplete(page);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function editUserPage() {
|
||||||
|
|
||||||
|
var self = this;
|
||||||
|
|
||||||
|
self.onSubmit = function () {
|
||||||
|
|
||||||
|
var page = $(this).parents('.page');
|
||||||
|
|
||||||
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
|
var userId = getParameterByName("userId");
|
||||||
|
|
||||||
|
if (!userId) {
|
||||||
|
saveUser({
|
||||||
|
Configuration: {}
|
||||||
|
}, page);
|
||||||
|
} else {
|
||||||
|
ApiClient.getUser(userId).done(function (result) {
|
||||||
|
saveUser(result, page);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// Disable default form submission
|
||||||
|
return false;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
window.EditUserPage = new editUserPage();
|
||||||
|
|
||||||
|
$(document).on('pageshow', "#editUserPage", function () {
|
||||||
|
|
||||||
|
var page = this;
|
||||||
|
|
||||||
onPageShow: function () {
|
|
||||||
Dashboard.showLoadingMsg();
|
Dashboard.showLoadingMsg();
|
||||||
|
|
||||||
var userId = getParameterByName("userId");
|
var userId = getParameterByName("userId");
|
||||||
|
|
||||||
if (userId) {
|
if (userId) {
|
||||||
$('#userProfileNavigation', this).show();
|
$('#userProfileNavigation', page).show();
|
||||||
} else {
|
} else {
|
||||||
$('#userProfileNavigation', this).hide();
|
$('#userProfileNavigation', page).hide();
|
||||||
}
|
}
|
||||||
|
|
||||||
var promise4 = ApiClient.getCultures();
|
|
||||||
|
|
||||||
var promise3 = ApiClient.getParentalRatings();
|
|
||||||
|
|
||||||
var promise1;
|
var promise1;
|
||||||
|
|
||||||
if (!userId) {
|
if (!userId) {
|
||||||
|
|
@ -33,145 +187,17 @@
|
||||||
|
|
||||||
var promise2 = Dashboard.getCurrentUser();
|
var promise2 = Dashboard.getCurrentUser();
|
||||||
|
|
||||||
$.when(promise1, promise2, promise3, promise4).done(function (response1, response2, response3, response4) {
|
var parentalRatingsPromise = ApiClient.getParentalRatings();
|
||||||
|
|
||||||
EditUserPage.loadUser(response1[0] || response1, response2[0], response3[0], response4[0]);
|
var allCulturesPromise = ApiClient.getCultures();
|
||||||
|
|
||||||
|
$.when(promise1, promise2).done(function (response1, response2) {
|
||||||
|
|
||||||
|
loadUser(page, response1[0] || response1, response2[0], parentalRatingsPromise, allCulturesPromise);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
|
||||||
$("#editUserProfileForm input:first").focus();
|
$("#editUserProfileForm input:first").focus();
|
||||||
},
|
});
|
||||||
|
|
||||||
loadUser: function (user, loggedInUser, allParentalRatings, allCultures) {
|
})(jQuery, window, document);
|
||||||
|
|
||||||
var page = $($.mobile.activePage);
|
|
||||||
|
|
||||||
EditUserPage.populateLanguages($('#selectAudioLanguage', page), allCultures);
|
|
||||||
EditUserPage.populateLanguages($('#selectSubtitleLanguage', page), allCultures);
|
|
||||||
EditUserPage.populateRatings(allParentalRatings, page);
|
|
||||||
|
|
||||||
if (!loggedInUser.Configuration.IsAdministrator || user.Id == loggedInUser.Id) {
|
|
||||||
|
|
||||||
$('#fldIsAdmin', page).hide();
|
|
||||||
$('#fldMaxParentalRating', page).hide();
|
|
||||||
} else {
|
|
||||||
$('#fldIsAdmin', page).show();
|
|
||||||
$('#fldMaxParentalRating', page).show();
|
|
||||||
}
|
|
||||||
|
|
||||||
Dashboard.setPageTitle(user.Name || "Add User");
|
|
||||||
|
|
||||||
$('#txtUserName', page).val(user.Name);
|
|
||||||
|
|
||||||
var ratingValue = "";
|
|
||||||
|
|
||||||
if (user.Configuration.MaxParentalRating) {
|
|
||||||
|
|
||||||
for (var i = 0, length = allParentalRatings.length; i < length; i++) {
|
|
||||||
|
|
||||||
var rating = allParentalRatings[i];
|
|
||||||
|
|
||||||
if (user.Configuration.MaxParentalRating >= rating.Value) {
|
|
||||||
ratingValue = rating.Value;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
$('#selectMaxParentalRating', page).val(ratingValue).selectmenu("refresh");
|
|
||||||
|
|
||||||
$('#selectAudioLanguage', page).val(user.Configuration.AudioLanguagePreference || "").selectmenu("refresh");
|
|
||||||
$('#selectSubtitleLanguage', page).val(user.Configuration.SubtitleLanguagePreference || "").selectmenu("refresh");
|
|
||||||
|
|
||||||
$('#chkForcedSubtitlesOnly', page).checked(user.Configuration.UseForcedSubtitlesOnly || false).checkboxradio("refresh");
|
|
||||||
$('#chkIsAdmin', page).checked(user.Configuration.IsAdministrator || false).checkboxradio("refresh");
|
|
||||||
|
|
||||||
Dashboard.hideLoadingMsg();
|
|
||||||
},
|
|
||||||
|
|
||||||
populateLanguages: function (select, allCultures) {
|
|
||||||
|
|
||||||
var html = "";
|
|
||||||
|
|
||||||
html += "<option value=''>None</option>";
|
|
||||||
|
|
||||||
for (var i = 0, length = allCultures.length; i < length; i++) {
|
|
||||||
|
|
||||||
var culture = allCultures[i];
|
|
||||||
|
|
||||||
html += "<option value='" + culture.ThreeLetterISOLanguageName + "'>" + culture.DisplayName + "</option>";
|
|
||||||
}
|
|
||||||
|
|
||||||
select.html(html).selectmenu("refresh");
|
|
||||||
},
|
|
||||||
|
|
||||||
populateRatings: function (allParentalRatings, page) {
|
|
||||||
|
|
||||||
var html = "";
|
|
||||||
|
|
||||||
html += "<option value=''>None</option>";
|
|
||||||
|
|
||||||
for (var i = 0, length = allParentalRatings.length; i < length; i++) {
|
|
||||||
|
|
||||||
var rating = allParentalRatings[i];
|
|
||||||
|
|
||||||
html += "<option value='" + rating.Value + "'>" + rating.Name + "</option>";
|
|
||||||
}
|
|
||||||
|
|
||||||
$('#selectMaxParentalRating', page).html(html).selectmenu("refresh");
|
|
||||||
},
|
|
||||||
|
|
||||||
saveUser: function (user) {
|
|
||||||
|
|
||||||
var page = $($.mobile.activePage);
|
|
||||||
|
|
||||||
user.Name = $('#txtUserName', page).val();
|
|
||||||
user.Configuration.MaxParentalRating = $('#selectMaxParentalRating', page).val() || null;
|
|
||||||
|
|
||||||
user.Configuration.IsAdministrator = $('#chkIsAdmin', page).checked();
|
|
||||||
|
|
||||||
user.Configuration.AudioLanguagePreference = $('#selectAudioLanguage', page).val();
|
|
||||||
user.Configuration.SubtitleLanguagePreference = $('#selectSubtitleLanguage', page).val();
|
|
||||||
user.Configuration.UseForcedSubtitlesOnly = $('#chkForcedSubtitlesOnly', page).checked();
|
|
||||||
|
|
||||||
var userId = getParameterByName("userId");
|
|
||||||
|
|
||||||
if (userId) {
|
|
||||||
ApiClient.updateUser(user).done(EditUserPage.saveComplete);
|
|
||||||
} else {
|
|
||||||
ApiClient.createUser(user).done(EditUserPage.saveComplete);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
saveComplete: function () {
|
|
||||||
Dashboard.hideLoadingMsg();
|
|
||||||
|
|
||||||
var userId = getParameterByName("userId");
|
|
||||||
|
|
||||||
Dashboard.validateCurrentUser($.mobile.activePage);
|
|
||||||
|
|
||||||
if (userId) {
|
|
||||||
Dashboard.alert("Settings saved.");
|
|
||||||
} else {
|
|
||||||
Dashboard.navigate("userprofiles.html");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
onSubmit: function () {
|
|
||||||
Dashboard.showLoadingMsg();
|
|
||||||
|
|
||||||
var userId = getParameterByName("userId");
|
|
||||||
|
|
||||||
if (!userId) {
|
|
||||||
EditUserPage.saveUser({
|
|
||||||
Configuration: {}
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
ApiClient.getUser(userId).done(EditUserPage.saveUser);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Disable default form submission
|
|
||||||
return false;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
$(document).on('pageshow', "#editUserPage", EditUserPage.onPageShow);
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue