You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
922 lines
24 KiB
922 lines
24 KiB
/** |
|
* Functions used in configuration forms and on user preferences pages |
|
*/ |
|
|
|
/* exported PASSIVE_EVENT_LISTENERS */ |
|
var configInlineParams; |
|
var configScriptLoaded; |
|
/** |
|
* checks whether browser supports web storage |
|
* |
|
* @param {'localStorage' | 'sessionStorage'} type the type of storage i.e. localStorage or sessionStorage |
|
* @param {boolean} warn Wether to show a warning on error |
|
* |
|
* @return {boolean} |
|
*/ |
|
|
|
function isStorageSupported(type) { |
|
let warn = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false; |
|
|
|
try { |
|
window[type].setItem('PMATest', 'test'); // Check whether key-value pair was set successfully |
|
|
|
if (window[type].getItem('PMATest') === 'test') { |
|
// Supported, remove test variable from storage |
|
window[type].removeItem('PMATest'); |
|
return true; |
|
} |
|
} catch (error) { |
|
// Not supported |
|
if (warn) { |
|
Functions.ajaxShowMessage(Messages.strNoLocalStorage, false); |
|
} |
|
} |
|
|
|
return false; |
|
} |
|
/** |
|
* Unbind all event handlers before tearing down a page |
|
*/ |
|
|
|
|
|
AJAX.registerTeardown('config.js', function () { |
|
$('.optbox input[id], .optbox select[id], .optbox textarea[id]').off('change').off('keyup'); |
|
$('.optbox input[type=button][name=submit_reset]').off('click'); |
|
$('div.tab-content').off(); |
|
$('#import_local_storage, #export_local_storage').off('click'); |
|
$('form.prefs-form').off('change').off('submit'); |
|
$(document).off('click', 'div.click-hide-message'); |
|
$('#prefs_autoload').find('a').off('click'); |
|
}); |
|
AJAX.registerOnload('config.js', function () { |
|
var $topmenuUpt = $('#user_prefs_tabs'); |
|
$topmenuUpt.find('a.active').attr('rel', 'samepage'); |
|
$topmenuUpt.find('a:not(.active)').attr('rel', 'newpage'); |
|
}); // default values for fields |
|
|
|
var defaultValues = {}; |
|
/** |
|
* Returns field type |
|
* |
|
* @param {Element} field |
|
* |
|
* @return {string} |
|
*/ |
|
|
|
function getFieldType(field) { |
|
var $field = $(field); |
|
var tagName = $field.prop('tagName'); |
|
|
|
if (tagName === 'INPUT') { |
|
return $field.attr('type'); |
|
} else if (tagName === 'SELECT') { |
|
return 'select'; |
|
} else if (tagName === 'TEXTAREA') { |
|
return 'text'; |
|
} |
|
|
|
return ''; |
|
} |
|
/** |
|
* Enables or disables the "restore default value" button |
|
* |
|
* @param {Element} field |
|
* @param {boolean} display |
|
* |
|
* @return {void} |
|
*/ |
|
|
|
|
|
function setRestoreDefaultBtn(field, display) { |
|
var $el = $(field).closest('td').find('.restore-default img'); |
|
$el[display ? 'show' : 'hide'](); |
|
} |
|
/** |
|
* Marks field depending on its value (system default or custom) |
|
* |
|
* @param {Element | JQuery<Element>} field |
|
* |
|
* @return {void} |
|
*/ |
|
|
|
|
|
function markField(field) { |
|
var $field = $(field); |
|
var type = getFieldType($field); |
|
var isDefault = checkFieldDefault($field, type); // checkboxes uses parent <span> for marking |
|
|
|
var $fieldMarker = type === 'checkbox' ? $field.parent() : $field; |
|
setRestoreDefaultBtn($field, !isDefault); |
|
$fieldMarker[isDefault ? 'removeClass' : 'addClass']('custom'); |
|
} |
|
/** |
|
* Sets field value |
|
* |
|
* value must be of type: |
|
* o undefined (omitted) - restore default value (form default, not PMA default) |
|
* o String - if field_type is 'text' |
|
* o boolean - if field_type is 'checkbox' |
|
* o Array of values - if field_type is 'select' |
|
* |
|
* @param {Element} field |
|
* @param {string} fieldType see {@link #getFieldType} |
|
* @param {string | boolean} value |
|
*/ |
|
|
|
|
|
function setFieldValue(field, fieldType, value) { |
|
var $field = $(field); |
|
|
|
switch (fieldType) { |
|
case 'text': |
|
case 'number': |
|
$field.val(value); |
|
break; |
|
|
|
case 'checkbox': |
|
$field.prop('checked', value); |
|
break; |
|
|
|
case 'select': |
|
var options = $field.prop('options'); |
|
var i; |
|
var imax = options.length; |
|
|
|
for (i = 0; i < imax; i++) { |
|
options[i].selected = value.indexOf(options[i].value) !== -1; |
|
} |
|
|
|
break; |
|
} |
|
|
|
markField($field); |
|
} |
|
/** |
|
* Gets field value |
|
* |
|
* Will return one of: |
|
* o String - if type is 'text' |
|
* o boolean - if type is 'checkbox' |
|
* o Array of values - if type is 'select' |
|
* |
|
* @param {Element} field |
|
* @param {string} fieldType returned by {@link #getFieldType} |
|
* |
|
* @return {boolean | string | string[] | null} |
|
*/ |
|
|
|
|
|
function getFieldValue(field, fieldType) { |
|
var $field = $(field); |
|
|
|
switch (fieldType) { |
|
case 'text': |
|
case 'number': |
|
return $field.prop('value'); |
|
|
|
case 'checkbox': |
|
return $field.prop('checked'); |
|
|
|
case 'select': |
|
var options = $field.prop('options'); |
|
var i; |
|
var imax = options.length; |
|
var items = []; |
|
|
|
for (i = 0; i < imax; i++) { |
|
if (options[i].selected) { |
|
items.push(options[i].value); |
|
} |
|
} |
|
|
|
return items; |
|
} |
|
|
|
return null; |
|
} |
|
/** |
|
* Returns values for all fields in fieldsets |
|
* |
|
* @return {object} |
|
*/ |
|
// eslint-disable-next-line no-unused-vars |
|
|
|
|
|
function getAllValues() { |
|
var $elements = $('fieldset input, fieldset select, fieldset textarea'); |
|
var values = {}; |
|
var type; |
|
var value; |
|
|
|
for (var i = 0; i < $elements.length; i++) { |
|
type = getFieldType($elements[i]); |
|
value = getFieldValue($elements[i], type); |
|
|
|
if (typeof value !== 'undefined') { |
|
// we only have single selects, fatten array |
|
if (type === 'select') { |
|
value = value[0]; |
|
} |
|
|
|
values[$elements[i].name] = value; |
|
} |
|
} |
|
|
|
return values; |
|
} |
|
/** |
|
* Checks whether field has its default value |
|
* |
|
* @param {Element} field |
|
* @param {string} type |
|
* |
|
* @return {boolean} |
|
*/ |
|
|
|
|
|
function checkFieldDefault(field, type) { |
|
var $field = $(field); |
|
var fieldId = $field.attr('id'); |
|
|
|
if (typeof defaultValues[fieldId] === 'undefined') { |
|
return true; |
|
} |
|
|
|
var isDefault = true; |
|
var currentValue = getFieldValue($field, type); |
|
|
|
if (type !== 'select') { |
|
isDefault = currentValue === defaultValues[fieldId]; |
|
} else { |
|
// compare arrays, will work for our representation of select values |
|
if (currentValue.length !== defaultValues[fieldId].length) { |
|
isDefault = false; |
|
} else { |
|
for (var i = 0; i < currentValue.length; i++) { |
|
if (currentValue[i] !== defaultValues[fieldId][i]) { |
|
isDefault = false; |
|
break; |
|
} |
|
} |
|
} |
|
} |
|
|
|
return isDefault; |
|
} |
|
/** |
|
* Returns element's id prefix |
|
* @param {Element} element |
|
* |
|
* @return {string} |
|
*/ |
|
// eslint-disable-next-line no-unused-vars |
|
|
|
|
|
function getIdPrefix(element) { |
|
return $(element).attr('id').replace(/[^-]+$/, ''); |
|
} // ------------------------------------------------------------------ |
|
// Form validation and field operations |
|
// |
|
// form validator assignments |
|
|
|
|
|
var validate = {}; // form validator list |
|
|
|
var validators = { |
|
// regexp: numeric value |
|
regExpNumeric: /^[0-9]+$/, |
|
// regexp: extract parts from PCRE expression |
|
regExpPcreExtract: /(.)(.*)\1(.*)?/, |
|
|
|
/** |
|
* Validates positive number |
|
* |
|
* @param {boolean} isKeyUp |
|
* |
|
* @return {boolean} |
|
*/ |
|
validatePositiveNumber: function (isKeyUp) { |
|
if (isKeyUp && this.value === '') { |
|
return true; |
|
} |
|
|
|
var result = this.value !== '0' && validators.regExpNumeric.test(this.value); |
|
return result ? true : Messages.error_nan_p; |
|
}, |
|
|
|
/** |
|
* Validates non-negative number |
|
* |
|
* @param {boolean} isKeyUp |
|
* |
|
* @return {boolean} |
|
*/ |
|
validateNonNegativeNumber: function (isKeyUp) { |
|
if (isKeyUp && this.value === '') { |
|
return true; |
|
} |
|
|
|
var result = validators.regExpNumeric.test(this.value); |
|
return result ? true : Messages.error_nan_nneg; |
|
}, |
|
|
|
/** |
|
* Validates port number |
|
* |
|
* @return {true|string} |
|
*/ |
|
validatePortNumber: function () { |
|
if (this.value === '') { |
|
return true; |
|
} |
|
|
|
var result = validators.regExpNumeric.test(this.value) && this.value !== '0'; |
|
return result && this.value <= 65535 ? true : Messages.error_incorrect_port; |
|
}, |
|
|
|
/** |
|
* Validates value according to given regular expression |
|
* |
|
* @param {boolean} isKeyUp |
|
* @param {string} regexp |
|
* |
|
* @return {true|string} |
|
*/ |
|
validateByRegex: function (isKeyUp, regexp) { |
|
if (isKeyUp && this.value === '') { |
|
return true; |
|
} // convert PCRE regexp |
|
|
|
|
|
var parts = regexp.match(validators.regExpPcreExtract); |
|
var valid = this.value.match(new RegExp(parts[2], parts[3])) !== null; |
|
return valid ? true : Messages.error_invalid_value; |
|
}, |
|
|
|
/** |
|
* Validates upper bound for numeric inputs |
|
* |
|
* @param {boolean} isKeyUp |
|
* @param {number} maxValue |
|
* |
|
* @return {true|string} |
|
*/ |
|
validateUpperBound: function (isKeyUp, maxValue) { |
|
var val = parseInt(this.value, 10); |
|
|
|
if (isNaN(val)) { |
|
return true; |
|
} |
|
|
|
return val <= maxValue ? true : Functions.sprintf(Messages.error_value_lte, maxValue); |
|
}, |
|
// field validators |
|
field: {}, |
|
// fieldset validators |
|
fieldset: {} |
|
}; |
|
/** |
|
* Registers validator for given field |
|
* |
|
* @param {string} id field id |
|
* @param {string} type validator (key in validators object) |
|
* @param {boolean} onKeyUp whether fire on key up |
|
* @param {Array} params validation function parameters |
|
*/ |
|
// eslint-disable-next-line no-unused-vars |
|
|
|
function registerFieldValidator(id, type, onKeyUp, params) { |
|
if (typeof validators[type] === 'undefined') { |
|
return; |
|
} |
|
|
|
if (typeof validate[id] === 'undefined') { |
|
validate[id] = []; |
|
} |
|
|
|
if (validate[id].length === 0) { |
|
validate[id].push([type, params, onKeyUp]); |
|
} |
|
} |
|
/** |
|
* Returns validation functions associated with form field |
|
* |
|
* @param {String} fieldId form field id |
|
* @param {boolean} onKeyUpOnly see registerFieldValidator |
|
* |
|
* @return {any[]} of [function, parameters to be passed to function] |
|
*/ |
|
|
|
|
|
function getFieldValidators(fieldId, onKeyUpOnly) { |
|
// look for field bound validator |
|
var name = fieldId && fieldId.match(/[^-]+$/)[0]; |
|
|
|
if (typeof validators.field[name] !== 'undefined') { |
|
return [[validators.field[name], null]]; |
|
} // look for registered validators |
|
|
|
|
|
var functions = []; |
|
|
|
if (typeof validate[fieldId] !== 'undefined') { |
|
// validate[field_id]: array of [type, params, onKeyUp] |
|
for (var i = 0, imax = validate[fieldId].length; i < imax; i++) { |
|
if (onKeyUpOnly && !validate[fieldId][i][2]) { |
|
continue; |
|
} |
|
|
|
functions.push([validators[validate[fieldId][i][0]], validate[fieldId][i][1]]); |
|
} |
|
} |
|
|
|
return functions; |
|
} |
|
/** |
|
* Displays errors for given form fields |
|
* |
|
* WARNING: created DOM elements must be identical with the ones made by |
|
* PhpMyAdmin\Config\FormDisplayTemplate::displayInput()! |
|
* |
|
* @param {object} errorList list of errors in the form {field id: error array} |
|
*/ |
|
|
|
|
|
function displayErrors(errorList) { |
|
var tempIsEmpty = function (item) { |
|
return item !== ''; |
|
}; |
|
|
|
for (var fieldId in errorList) { |
|
var errors = errorList[fieldId]; |
|
var $field = $('#' + fieldId); |
|
var isFieldset = $field.attr('tagName') === 'FIELDSET'; |
|
var $errorCnt; |
|
|
|
if (isFieldset) { |
|
$errorCnt = $field.find('dl.errors'); |
|
} else { |
|
$errorCnt = $field.siblings('.inline_errors'); |
|
} // remove empty errors (used to clear error list) |
|
|
|
|
|
errors = $.grep(errors, tempIsEmpty); // CSS error class |
|
|
|
if (!isFieldset) { |
|
// checkboxes uses parent <span> for marking |
|
var $fieldMarker = $field.attr('type') === 'checkbox' ? $field.parent() : $field; |
|
$fieldMarker[errors.length ? 'addClass' : 'removeClass']('field-error'); |
|
} |
|
|
|
if (errors.length) { |
|
// if error container doesn't exist, create it |
|
if ($errorCnt.length === 0) { |
|
if (isFieldset) { |
|
$errorCnt = $('<dl class="errors"></dl>'); |
|
$field.find('table').before($errorCnt); |
|
} else { |
|
$errorCnt = $('<dl class="inline_errors"></dl>'); |
|
$field.closest('td').append($errorCnt); |
|
} |
|
} |
|
|
|
var html = ''; |
|
|
|
for (var i = 0, imax = errors.length; i < imax; i++) { |
|
html += '<dd>' + errors[i] + '</dd>'; |
|
} |
|
|
|
$errorCnt.html(html); |
|
} else if ($errorCnt !== null) { |
|
// remove useless error container |
|
$errorCnt.remove(); |
|
} |
|
} |
|
} |
|
/** |
|
* Validates fields and fieldsets and call displayError function as required |
|
*/ |
|
|
|
|
|
function setDisplayError() { |
|
var elements = $('.optbox input[id], .optbox select[id], .optbox textarea[id]'); // run all field validators |
|
|
|
var errors = {}; |
|
|
|
for (var i = 0; i < elements.length; i++) { |
|
validateField(elements[i], false, errors); |
|
} // run all fieldset validators |
|
|
|
|
|
$('fieldset.optbox').each(function () { |
|
validateFieldset(this, false, errors); |
|
}); |
|
displayErrors(errors); |
|
} |
|
/** |
|
* Validates fieldset and puts errors in 'errors' object |
|
* |
|
* @param {Element} fieldset |
|
* @param {boolean} isKeyUp |
|
* @param {object} errors |
|
*/ |
|
|
|
|
|
function validateFieldset(fieldset, isKeyUp, errors) { |
|
var $fieldset = $(fieldset); |
|
|
|
if ($fieldset.length && typeof validators.fieldset[$fieldset.attr('id')] !== 'undefined') { |
|
var fieldsetErrors = validators.fieldset[$fieldset.attr('id')].apply($fieldset[0], [isKeyUp]); |
|
|
|
for (var fieldId in fieldsetErrors) { |
|
if (typeof errors[fieldId] === 'undefined') { |
|
errors[fieldId] = []; |
|
} |
|
|
|
if (typeof fieldsetErrors[fieldId] === 'string') { |
|
fieldsetErrors[fieldId] = [fieldsetErrors[fieldId]]; |
|
} |
|
|
|
$.merge(errors[fieldId], fieldsetErrors[fieldId]); |
|
} |
|
} |
|
} |
|
/** |
|
* Validates form field and puts errors in 'errors' object |
|
* |
|
* @param {Element} field |
|
* @param {boolean} isKeyUp |
|
* @param {object} errors |
|
*/ |
|
|
|
|
|
function validateField(field, isKeyUp, errors) { |
|
var args; |
|
var result; |
|
var $field = $(field); |
|
var fieldId = $field.attr('id'); |
|
errors[fieldId] = []; |
|
var functions = getFieldValidators(fieldId, isKeyUp); |
|
|
|
for (var i = 0; i < functions.length; i++) { |
|
if (typeof functions[i][1] !== 'undefined' && functions[i][1] !== null) { |
|
args = functions[i][1].slice(0); |
|
} else { |
|
args = []; |
|
} |
|
|
|
args.unshift(isKeyUp); |
|
result = functions[i][0].apply($field[0], args); |
|
|
|
if (result !== true) { |
|
if (typeof result === 'string') { |
|
result = [result]; |
|
} |
|
|
|
$.merge(errors[fieldId], result); |
|
} |
|
} |
|
} |
|
/** |
|
* Validates form field and parent fieldset |
|
* |
|
* @param {Element} field |
|
* @param {boolean} isKeyUp |
|
*/ |
|
|
|
|
|
function validateFieldAndFieldset(field, isKeyUp) { |
|
var $field = $(field); |
|
var errors = {}; |
|
validateField($field, isKeyUp, errors); |
|
validateFieldset($field.closest('fieldset.optbox'), isKeyUp, errors); |
|
displayErrors(errors); |
|
} |
|
|
|
function loadInlineConfig() { |
|
if (!Array.isArray(configInlineParams)) { |
|
return; |
|
} |
|
|
|
for (var i = 0; i < configInlineParams.length; ++i) { |
|
if (typeof configInlineParams[i] === 'function') { |
|
configInlineParams[i](); |
|
} |
|
} |
|
} |
|
|
|
function setupValidation() { |
|
validate = {}; |
|
configScriptLoaded = true; |
|
|
|
if (configScriptLoaded && typeof configInlineParams !== 'undefined') { |
|
loadInlineConfig(); |
|
} // register validators and mark custom values |
|
|
|
|
|
var $elements = $('.optbox input[id], .optbox select[id], .optbox textarea[id]'); |
|
$elements.each(function () { |
|
markField(this); |
|
var $el = $(this); |
|
$el.on('change', function () { |
|
validateFieldAndFieldset(this, false); |
|
markField(this); |
|
}); |
|
var tagName = $el.attr('tagName'); // text fields can be validated after each change |
|
|
|
if (tagName === 'INPUT' && $el.attr('type') === 'text') { |
|
$el.on('keyup', function () { |
|
validateFieldAndFieldset($el, true); |
|
markField($el); |
|
}); |
|
} // disable textarea spellcheck |
|
|
|
|
|
if (tagName === 'TEXTAREA') { |
|
$el.attr('spellcheck', false); |
|
} |
|
}); // check whether we've refreshed a page and browser remembered modified |
|
// form values |
|
|
|
var $checkPageRefresh = $('#check_page_refresh'); |
|
|
|
if ($checkPageRefresh.length === 0 || $checkPageRefresh.val() === '1') { |
|
// run all field validators |
|
var errors = {}; |
|
|
|
for (var i = 0; i < $elements.length; i++) { |
|
validateField($elements[i], false, errors); |
|
} // run all fieldset validators |
|
|
|
|
|
$('fieldset.optbox').each(function () { |
|
validateFieldset(this, false, errors); |
|
}); |
|
displayErrors(errors); |
|
} else if ($checkPageRefresh) { |
|
$checkPageRefresh.val('1'); |
|
} |
|
} |
|
|
|
AJAX.registerOnload('config.js', function () { |
|
setupValidation(); |
|
}); // |
|
// END: Form validation and field operations |
|
// ------------------------------------------------------------------ |
|
|
|
function adjustPrefsNotification() { |
|
var $prefsAutoLoad = $('#prefs_autoload'); |
|
var $tableNameControl = $('#table_name_col_no'); |
|
var $prefsAutoShowing = $prefsAutoLoad.css('display') !== 'none'; |
|
|
|
if ($prefsAutoShowing && $tableNameControl.length) { |
|
$tableNameControl.css('top', '55px'); |
|
} |
|
} |
|
|
|
AJAX.registerOnload('config.js', function () { |
|
adjustPrefsNotification(); |
|
}); // ------------------------------------------------------------------ |
|
// Form reset buttons |
|
// |
|
|
|
AJAX.registerOnload('config.js', function () { |
|
$('.optbox input[type=button][name=submit_reset]').on('click', function () { |
|
var fields = $(this).closest('fieldset').find('input, select, textarea'); |
|
|
|
for (var i = 0, imax = fields.length; i < imax; i++) { |
|
setFieldValue(fields[i], getFieldType(fields[i]), defaultValues[fields[i].id]); |
|
} |
|
|
|
setDisplayError(); |
|
}); |
|
}); // |
|
// END: Form reset buttons |
|
// ------------------------------------------------------------------ |
|
// ------------------------------------------------------------------ |
|
// "Restore default" and "set value" buttons |
|
// |
|
|
|
/** |
|
* Restores field's default value |
|
* |
|
* @param {string} fieldId |
|
* |
|
* @return {void} |
|
*/ |
|
|
|
function restoreField(fieldId) { |
|
var $field = $('#' + fieldId); |
|
|
|
if ($field.length === 0 || defaultValues[fieldId] === undefined) { |
|
return; |
|
} |
|
|
|
setFieldValue($field, getFieldType($field), defaultValues[fieldId]); |
|
} |
|
|
|
function setupRestoreField() { |
|
$('div.tab-content').on('mouseenter', '.restore-default, .set-value', function () { |
|
$(this).css('opacity', 1); |
|
}).on('mouseleave', '.restore-default, .set-value', function () { |
|
$(this).css('opacity', 0.25); |
|
}).on('click', '.restore-default, .set-value', function (e) { |
|
e.preventDefault(); |
|
var href = $(this).attr('href'); |
|
var fieldSel; |
|
|
|
if ($(this).hasClass('restore-default')) { |
|
fieldSel = href; |
|
restoreField(fieldSel.substr(1)); |
|
} else { |
|
fieldSel = href.match(/^[^=]+/)[0]; |
|
var value = href.match(/=(.+)$/)[1]; |
|
setFieldValue($(fieldSel), 'text', value); |
|
} |
|
|
|
$(fieldSel).trigger('change'); |
|
}).find('.restore-default, .set-value') // inline-block for IE so opacity inheritance works |
|
.css({ |
|
display: 'inline-block', |
|
opacity: 0.25 |
|
}); |
|
} |
|
|
|
AJAX.registerOnload('config.js', function () { |
|
setupRestoreField(); |
|
}); // |
|
// END: "Restore default" and "set value" buttons |
|
// ------------------------------------------------------------------ |
|
// ------------------------------------------------------------------ |
|
// User preferences import/export |
|
// |
|
|
|
AJAX.registerOnload('config.js', function () { |
|
offerPrefsAutoimport(); |
|
var $radios = $('#import_local_storage, #export_local_storage'); |
|
|
|
if (!$radios.length) { |
|
return; |
|
} // enable JavaScript dependent fields |
|
|
|
|
|
$radios.prop('disabled', false).add('#export_text_file, #import_text_file').on('click', function () { |
|
var enableId = $(this).attr('id'); |
|
var disableId; |
|
|
|
if (enableId.match(/local_storage$/)) { |
|
disableId = enableId.replace(/local_storage$/, 'text_file'); |
|
} else { |
|
disableId = enableId.replace(/text_file$/, 'local_storage'); |
|
} |
|
|
|
$('#opts_' + disableId).addClass('disabled').find('input').prop('disabled', true); |
|
$('#opts_' + enableId).removeClass('disabled').find('input').prop('disabled', false); |
|
}); // detect localStorage state |
|
|
|
var lsSupported = isStorageSupported('localStorage', true); |
|
var lsExists = lsSupported ? window.localStorage.config || false : false; |
|
$('div.localStorage-' + (lsSupported ? 'un' : '') + 'supported').hide(); |
|
$('div.localStorage-' + (lsExists ? 'empty' : 'exists')).hide(); |
|
|
|
if (lsExists) { |
|
updatePrefsDate(); |
|
} |
|
|
|
$('form.prefs-form').on('change', function () { |
|
var $form = $(this); |
|
var disabled = false; |
|
|
|
if (!lsSupported) { |
|
disabled = $form.find('input[type=radio][value$=local_storage]').prop('checked'); |
|
} else if (!lsExists && $form.attr('name') === 'prefs_import' && $('#import_local_storage')[0].checked) { |
|
disabled = true; |
|
} |
|
|
|
$form.find('input[type=submit]').prop('disabled', disabled); |
|
}).on('submit', function (e) { |
|
var $form = $(this); |
|
|
|
if ($form.attr('name') === 'prefs_export' && $('#export_local_storage')[0].checked) { |
|
e.preventDefault(); // use AJAX to read JSON settings and save them |
|
|
|
savePrefsToLocalStorage($form); |
|
} else if ($form.attr('name') === 'prefs_import' && $('#import_local_storage')[0].checked) { |
|
// set 'json' input and submit form |
|
$form.find('input[name=json]').val(window.localStorage.config); |
|
} |
|
}); |
|
$(document).on('click', 'div.click-hide-message', function () { |
|
$(this).hide().parent('.card-body').css('height', '').next('form').show(); |
|
}); |
|
}); |
|
/** |
|
* Saves user preferences to localStorage |
|
* |
|
* @param {Element} form |
|
*/ |
|
|
|
function savePrefsToLocalStorage(form) { |
|
var $form = $(form); |
|
var submit = $form.find('input[type=submit]'); |
|
submit.prop('disabled', true); |
|
$.ajax({ |
|
url: 'index.php?route=/preferences/manage', |
|
cache: false, |
|
type: 'POST', |
|
data: { |
|
'ajax_request': true, |
|
'server': CommonParams.get('server'), |
|
'submit_get_json': true |
|
}, |
|
success: function (data) { |
|
if (typeof data !== 'undefined' && data.success === true) { |
|
window.localStorage.config = data.prefs; |
|
window.localStorage.configMtime = data.mtime; |
|
window.localStorage.configMtimeLocal = new Date().toUTCString(); |
|
updatePrefsDate(); |
|
$('div.localStorage-empty').hide(); |
|
$('div.localStorage-exists').show(); |
|
var group = $form.parent('.card-body'); |
|
group.css('height', group.height() + 'px'); |
|
$form.hide('fast'); |
|
$form.prev('.click-hide-message').show('fast'); |
|
} else { |
|
Functions.ajaxShowMessage(data.error); |
|
} |
|
}, |
|
complete: function () { |
|
submit.prop('disabled', false); |
|
} |
|
}); |
|
} |
|
/** |
|
* Updates preferences timestamp in Import form |
|
*/ |
|
|
|
|
|
function updatePrefsDate() { |
|
var d = new Date(window.localStorage.configMtimeLocal); |
|
var msg = Messages.strSavedOn.replace('@DATE@', Functions.formatDateTime(d)); |
|
$('#opts_import_local_storage').find('div.localStorage-exists').html(msg); |
|
} |
|
/** |
|
* Prepares message which informs that localStorage preferences are available and can be imported or deleted |
|
*/ |
|
|
|
|
|
function offerPrefsAutoimport() { |
|
var hasConfig = isStorageSupported('localStorage') && (window.localStorage.config || false); |
|
var $cnt = $('#prefs_autoload'); |
|
|
|
if (!$cnt.length || !hasConfig) { |
|
return; |
|
} |
|
|
|
$cnt.find('a').on('click', function (e) { |
|
e.preventDefault(); |
|
var $a = $(this); |
|
|
|
if ($a.attr('href') === '#no') { |
|
$cnt.remove(); |
|
$.post('index.php', { |
|
'server': CommonParams.get('server'), |
|
'prefs_autoload': 'hide' |
|
}, null, 'html'); |
|
return; |
|
} else if ($a.attr('href') === '#delete') { |
|
$cnt.remove(); |
|
localStorage.clear(); |
|
$.post('index.php', { |
|
'server': CommonParams.get('server'), |
|
'prefs_autoload': 'hide' |
|
}, null, 'html'); |
|
return; |
|
} |
|
|
|
$cnt.find('input[name=json]').val(window.localStorage.config); |
|
$cnt.find('form').trigger('submit'); |
|
}); |
|
$cnt.show(); |
|
} |
|
/** |
|
* @type {boolean} Support for passive event listener option |
|
*/ |
|
|
|
|
|
var PASSIVE_EVENT_LISTENERS = function () { |
|
var passive = false; |
|
|
|
try { |
|
var options = Object.defineProperty({}, 'passive', { |
|
get: function () { |
|
return passive = true; |
|
} |
|
}); |
|
window.addEventListener('_', null, options); |
|
window.removeEventListener('_', null, options); |
|
} catch (error) {// passive not supported |
|
} |
|
|
|
return passive; |
|
}(); |