324 lines
13 KiB
HTML
324 lines
13 KiB
HTML
<div id="properties_toc">
|
|
<div id="properties_profile_toc_general" name="properties_profile_toc_item" onclick="ProfileSelectTab('general');">Preferences</div>
|
|
<div id="properties_profile_toc_account" name="properties_profile_toc_item" onclick="ProfileSelectTab('account');">Account</div>
|
|
</div>
|
|
<div id="properties_bodypanel">
|
|
<div id="properties_bodypanel_general" name="properties_profile_tab" style="display: none;">
|
|
<h3>Game Library</h3>
|
|
<table style="width: 100%;">
|
|
<tr>
|
|
<th>
|
|
Library
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
Pagination mode:
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<select id="profile_pref-LibraryPagination" data-pref="LibraryPagination" onchange="SavePrefValue_Value(this);">
|
|
<option value="paged">Paged</option>
|
|
<option value="infinite">Infinite scrolling</option>
|
|
</select>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td></td>
|
|
</tr>
|
|
<tr>
|
|
<th>
|
|
Game Icons
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<input type="checkbox" id="profile_pref_LibraryShowGameTitle" data-pref="LibraryShowGameTitle" onchange="SavePrefValue_Checkbox(this);"><label for="profile_pref_LibraryShowGameTitle"> Show title</label>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<input type="checkbox" id="profile_pref_LibraryShowGameRating" data-pref="LibraryShowGameRating" onchange="SavePrefValue_Checkbox(this);"><label for="profile_pref_LibraryShowGameRating"> Show rating</label>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<input type="checkbox" id="profile_pref_LibraryShowGameClassification" data-pref="LibraryShowGameClassification" onchange="SavePrefValue_Checkbox(this);"><label for="profile_pref_LibraryShowGameClassification"> Show age classification badges</label>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<table id="profile_pref_LibraryClassificationBadgeSelect">
|
|
<tr>
|
|
<td>Use classification badges from:</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<select id="profile_pref_LibraryPrimaryClassificationBadge" data-primary="primary" onchange="SavePrefValue_ClassBadge(this);">
|
|
</select>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>Fallback to classification badges from:</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
<select id="profile_pref_LibraryFallbackClassificationBadge" onchange="SavePrefValue_ClassBadge(this);">
|
|
</select>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
<div id="properties_bodypanel_account" name="properties_profile_tab" style="display: none;">
|
|
<h3>Reset Password</h3>
|
|
<table style="width: 100%;">
|
|
<tr>
|
|
<th>Old Password</th>
|
|
<td><input type="password" id="profile_oldpassword" style="width: 95%;" /></td>
|
|
</tr>
|
|
<tr>
|
|
<th>New Password</th>
|
|
<td><input type="password" id="profile_newpassword" style="width: 95%;" onkeyup="checkPasswordsMatch();" /></td>
|
|
</tr>
|
|
<tr>
|
|
<th>Confirm Password</th>
|
|
<td><input type="password" id="profile_confirmpassword" style="width: 95%;" onkeyup="checkPasswordsMatch();" /></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="2" id="profile_passwordnotice"></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="2" id="profile_passworderrors" style="color: red;"></td>
|
|
</tr>
|
|
<tr>
|
|
<td colspan="2" style="text-align: right;">
|
|
<button id="profile_resetpassword" value="Reset Password" disabled="disabled" onclick="ResetPassword();">Reset Password</button>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript">
|
|
document.getElementById('modal-heading').innerHTML = userProfile.emailAddress;
|
|
|
|
function ProfileSelectTab(TabName) {
|
|
var tabs = document.getElementsByName('properties_profile_tab');
|
|
for (var i = 0; i < tabs.length; i++) {
|
|
if ((tabs[i].id) == ("properties_bodypanel_" + TabName)) {
|
|
tabs[i].style.display = '';
|
|
} else {
|
|
tabs[i].style.display = 'none';
|
|
}
|
|
}
|
|
|
|
var tocs = document.getElementsByName('properties_profile_toc_item');
|
|
for (var i = 0; i < tocs.length; i++) {
|
|
if ((tocs[i].id) == ("properties_profile_toc_" + TabName)) {
|
|
tocs[i].className = "properties_toc_item_selected";
|
|
} else {
|
|
tocs[i].className = '';
|
|
}
|
|
}
|
|
}
|
|
|
|
function GetPrefInitialValues() {
|
|
var paginationMode = document.getElementById('profile_pref-LibraryPagination');
|
|
paginationMode.value = GetPreference('LibraryPagination', 'paged');
|
|
|
|
ConfigurePrefInitialValue_Checkbox("LibraryShowGameTitle", GetPreference("LibraryShowGameTitle", true));
|
|
ConfigurePrefInitialValue_Checkbox("LibraryShowGameRating", GetPreference("LibraryShowGameRating", true));
|
|
ConfigurePrefInitialValue_Checkbox("LibraryShowGameClassification", GetPreference("LibraryShowGameClassification", true));
|
|
|
|
var primary = document.getElementById('profile_pref_LibraryPrimaryClassificationBadge');
|
|
var secondary = document.getElementById('profile_pref_LibraryFallbackClassificationBadge');
|
|
PopulateClassificationMenus(primary);
|
|
PopulateClassificationMenus(secondary, true);
|
|
|
|
var classificationOrder = JSON.parse(GetPreference("LibraryGameClassificationDisplayOrder", JSON.stringify([ "ESRB" ])));
|
|
primary.value = classificationOrder[0];
|
|
if (classificationOrder[1]) {
|
|
secondary.value = classificationOrder[1];
|
|
}
|
|
|
|
for (var i = 0; i < secondary.childNodes.length; i++) {
|
|
if (secondary.childNodes[i].value == primary.value) {
|
|
secondary.childNodes[i].setAttribute('disabled', 'disabled');
|
|
} else {
|
|
secondary.childNodes[i].removeAttribute('disabled');
|
|
}
|
|
}
|
|
}
|
|
|
|
function PopulateClassificationMenus(targetSelector, IsSecondary) {
|
|
targetSelector.innerHTML = '';
|
|
|
|
if (IsSecondary == true) {
|
|
var defaultOpt = document.createElement('option');
|
|
defaultOpt.value = '-';
|
|
defaultOpt.innerHTML = 'None';
|
|
targetSelector.appendChild(defaultOpt);
|
|
}
|
|
|
|
for (const [key, value] of Object.entries(ClassificationBoards)) {
|
|
var opt = document.createElement('option');
|
|
opt.value = key;
|
|
opt.innerHTML = value;
|
|
targetSelector.appendChild(opt);
|
|
}
|
|
}
|
|
|
|
function ConfigurePrefInitialValue_Checkbox(ValueName, ValueSetting) {
|
|
var valueCheckbox = document.getElementById("profile_pref_" + ValueName);
|
|
if (ValueSetting == "true" || ValueSetting == true) {
|
|
valueCheckbox.checked = true;
|
|
updateDisplay(ValueName, true);
|
|
} else {
|
|
valueCheckbox.checked = false;
|
|
updateDisplay(ValueName, false);
|
|
}
|
|
}
|
|
|
|
function SavePrefValue_Checkbox(e) {
|
|
var ValueName = e.getAttribute("data-pref");
|
|
SetPreference(ValueName, e.checked);
|
|
|
|
updateDisplay(ValueName, e.checked);
|
|
|
|
executeFilter1_1(1);
|
|
}
|
|
|
|
function SavePrefValue_Value(e) {
|
|
var ValueName = e.getAttribute("data-pref");
|
|
SetPreference(ValueName, e.value);
|
|
|
|
executeFilter1_1(1);
|
|
}
|
|
|
|
function updateDisplay(ValueName, ValueSetting) {
|
|
switch(ValueName) {
|
|
case "LibraryShowGameClassification":
|
|
var badgeSelector = document.getElementById("profile_pref_LibraryClassificationBadgeSelect");
|
|
if (ValueSetting == true || ValueSetting == "true") {
|
|
badgeSelector.style.display = '';
|
|
} else {
|
|
badgeSelector.style.display = 'none';
|
|
}
|
|
break;
|
|
}
|
|
}
|
|
|
|
function SavePrefValue_ClassBadge(e) {
|
|
var primary = document.getElementById('profile_pref_LibraryPrimaryClassificationBadge');
|
|
var secondary = document.getElementById('profile_pref_LibraryFallbackClassificationBadge');
|
|
|
|
if (e.getAttribute('data-primary') == 'primary') {
|
|
// reset secondary to "none" if the same board is selected in both
|
|
if (primary.value == secondary.value) {
|
|
secondary.value = '-';
|
|
}
|
|
|
|
// disable in secondary board selected in primary
|
|
for (var i = 0; i < secondary.childNodes.length; i++) {
|
|
if (secondary.childNodes[i].value == primary.value) {
|
|
secondary.childNodes[i].setAttribute('disabled', 'disabled');
|
|
} else {
|
|
secondary.childNodes[i].removeAttribute('disabled');
|
|
}
|
|
}
|
|
}
|
|
|
|
// save values
|
|
var model = [];
|
|
if (secondary.value == '-') {
|
|
model = [ primary.value ];
|
|
} else {
|
|
model = [ primary.value, secondary.value ];
|
|
}
|
|
|
|
SetPreference('LibraryGameClassificationDisplayOrder', JSON.stringify(model));
|
|
|
|
executeFilter1_1(1);
|
|
}
|
|
|
|
function checkPasswordsMatch() {
|
|
var oldPassword = document.getElementById('profile_oldpassword').value;
|
|
var newPassword = document.getElementById('profile_newpassword').value;
|
|
var conPassword = document.getElementById('profile_confirmpassword').value;
|
|
var errorLabel = document.getElementById('profile_passwordnotice');
|
|
var submitButton = document.getElementById('profile_resetpassword');
|
|
|
|
// make sure the new password is not the same as the old one
|
|
if (newPassword == oldPassword) {
|
|
errorLabel.innerHTML = "New password should not match the old password";
|
|
submitButton.setAttribute('disabled', 'disabled');
|
|
} else {
|
|
if (newPassword == conPassword) {
|
|
// check if password meets requirements
|
|
if (newPassword.length > 10) {
|
|
errorLabel.innerHTML = "";
|
|
submitButton.removeAttribute('disabled');
|
|
} else {
|
|
errorLabel.innerHTML = "Password should be at least 10 characters long";
|
|
submitButton.setAttribute('disabled', 'disabled');
|
|
}
|
|
} else {
|
|
errorLabel.innerHTML = "New and confirmed passwords do not match";
|
|
submitButton.setAttribute('disabled', 'disabled');
|
|
}
|
|
}
|
|
}
|
|
|
|
function ResetPassword() {
|
|
var oldPassword = document.getElementById('profile_oldpassword').value;
|
|
var newPassword = document.getElementById('profile_newpassword').value;
|
|
var conPassword = document.getElementById('profile_confirmpassword').value;
|
|
|
|
var model = {
|
|
"OldPassword": oldPassword,
|
|
"NewPassword": newPassword,
|
|
"ConfirmPassword": conPassword
|
|
}
|
|
|
|
ajaxCall(
|
|
'/api/v1.1/Account/ChangePassword',
|
|
'POST',
|
|
function(result) {
|
|
ResetPasswordCallback(result);
|
|
},
|
|
function(error) {
|
|
ResetPasswordCallback(error);
|
|
},
|
|
JSON.stringify(model)
|
|
);
|
|
}
|
|
|
|
function ResetPasswordCallback(result) {
|
|
var errorLabel = document.getElementById('profile_passwordnotice');
|
|
var errorBox = document.getElementById('profile_passworderrors');
|
|
errorBox.innerHTML = '';
|
|
|
|
console.log(result);
|
|
if (result.responseJSON.succeeded == false) {
|
|
for (var i = 0; i < result.responseJSON.errors.length; i++) {
|
|
var errorMessage = document.createElement('p');
|
|
errorMessage.innerHTML = result.responseJSON.errors[i].description;
|
|
errorBox.appendChild(errorMessage);
|
|
}
|
|
} else {
|
|
document.getElementById('profile_oldpassword').value = '';
|
|
document.getElementById('profile_newpassword').value = '';
|
|
document.getElementById('profile_confirmpassword').value = '';
|
|
document.getElementById('profile_resetpassword').setAttribute('disabled', 'disabled');
|
|
errorLabel.innerHTML = "Password changed.";
|
|
}
|
|
}
|
|
|
|
ProfileSelectTab('general');
|
|
GetPrefInitialValues();
|
|
</script>
|