config.js 26 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866
  1. /* vim: set expandtab sw=4 ts=4 sts=4: */
  2. /**
  3. * Functions used in configuration forms and on user preferences pages
  4. */
  5. /**
  6. * checks whether browser supports web storage
  7. *
  8. * @param type the type of storage i.e. localStorage or sessionStorage
  9. *
  10. * @returns bool
  11. */
  12. function isStorageSupported (type, warn) {
  13. try {
  14. window[type].setItem('PMATest', 'test');
  15. // Check whether key-value pair was set successfully
  16. if (window[type].getItem('PMATest') === 'test') {
  17. // Supported, remove test variable from storage
  18. window[type].removeItem('PMATest');
  19. return true;
  20. }
  21. } catch (error) {
  22. // Not supported
  23. if (warn) {
  24. PMA_ajaxShowMessage(PMA_messages.strNoLocalStorage, false);
  25. }
  26. }
  27. return false;
  28. }
  29. /**
  30. * Unbind all event handlers before tearing down a page
  31. */
  32. AJAX.registerTeardown('config.js', function () {
  33. $('.optbox input[id], .optbox select[id], .optbox textarea[id]').off('change').off('keyup');
  34. $('.optbox input[type=button][name=submit_reset]').off('click');
  35. $('div.tabs_contents').off();
  36. $('#import_local_storage, #export_local_storage').off('click');
  37. $('form.prefs-form').off('change').off('submit');
  38. $(document).off('click', 'div.click-hide-message');
  39. $('#prefs_autoload').find('a').off('click');
  40. });
  41. AJAX.registerOnload('config.js', function () {
  42. var $topmenu_upt = $('#topmenu2.user_prefs_tabs');
  43. $topmenu_upt.find('li.active a').attr('rel', 'samepage');
  44. $topmenu_upt.find('li:not(.active) a').attr('rel', 'newpage');
  45. });
  46. // default values for fields
  47. var defaultValues = {};
  48. /**
  49. * Returns field type
  50. *
  51. * @param {Element} field
  52. */
  53. function getFieldType (field) {
  54. var $field = $(field);
  55. var tagName = $field.prop('tagName');
  56. if (tagName === 'INPUT') {
  57. return $field.attr('type');
  58. } else if (tagName === 'SELECT') {
  59. return 'select';
  60. } else if (tagName === 'TEXTAREA') {
  61. return 'text';
  62. }
  63. return '';
  64. }
  65. /**
  66. * Enables or disables the "restore default value" button
  67. *
  68. * @param {Element} field
  69. * @param {boolean} display
  70. */
  71. function setRestoreDefaultBtn (field, display) {
  72. var $el = $(field).closest('td').find('.restore-default img');
  73. $el[display ? 'show' : 'hide']();
  74. }
  75. /**
  76. * Marks field depending on its value (system default or custom)
  77. *
  78. * @param {Element} field
  79. */
  80. function markField (field) {
  81. var $field = $(field);
  82. var type = getFieldType($field);
  83. var isDefault = checkFieldDefault($field, type);
  84. // checkboxes uses parent <span> for marking
  85. var $fieldMarker = (type === 'checkbox') ? $field.parent() : $field;
  86. setRestoreDefaultBtn($field, !isDefault);
  87. $fieldMarker[isDefault ? 'removeClass' : 'addClass']('custom');
  88. }
  89. /**
  90. * Sets field value
  91. *
  92. * value must be of type:
  93. * o undefined (omitted) - restore default value (form default, not PMA default)
  94. * o String - if field_type is 'text'
  95. * o boolean - if field_type is 'checkbox'
  96. * o Array of values - if field_type is 'select'
  97. *
  98. * @param {Element} field
  99. * @param {String} field_type see {@link #getFieldType}
  100. * @param {String|Boolean} value
  101. */
  102. function setFieldValue (field, field_type, value) {
  103. var $field = $(field);
  104. switch (field_type) {
  105. case 'text':
  106. case 'number':
  107. $field.val(value);
  108. break;
  109. case 'checkbox':
  110. $field.prop('checked', value);
  111. break;
  112. case 'select':
  113. var options = $field.prop('options');
  114. var i;
  115. var imax = options.length;
  116. var i, imax = options.length;
  117. for (i = 0; i < imax; i++) {
  118. options[i].selected = (value.indexOf(options[i].value) != -1);
  119. }
  120. break;
  121. }
  122. markField($field);
  123. }
  124. /**
  125. * Gets field value
  126. *
  127. * Will return one of:
  128. * o String - if type is 'text'
  129. * o boolean - if type is 'checkbox'
  130. * o Array of values - if type is 'select'
  131. *
  132. * @param {Element} field
  133. * @param {String} field_type returned by {@link #getFieldType}
  134. * @type Boolean|String|String[]
  135. */
  136. function getFieldValue (field, field_type) {
  137. var $field = $(field);
  138. switch (field_type) {
  139. case 'text':
  140. case 'number':
  141. return $field.prop('value');
  142. case 'checkbox':
  143. return $field.prop('checked');
  144. case 'select':
  145. var options = $field.prop('options');
  146. var i;
  147. var imax = options.length;
  148. var items = [];
  149. for (i = 0; i < imax; i++) {
  150. if (options[i].selected) {
  151. items.push(options[i].value);
  152. }
  153. }
  154. return items;
  155. }
  156. return null;
  157. }
  158. /**
  159. * Returns values for all fields in fieldsets
  160. */
  161. function getAllValues () {
  162. var $elements = $('fieldset input, fieldset select, fieldset textarea');
  163. var values = {};
  164. var type;
  165. var value;
  166. for (var i = 0; i < $elements.length; i++) {
  167. type = getFieldType($elements[i]);
  168. value = getFieldValue($elements[i], type);
  169. if (typeof value !== 'undefined') {
  170. // we only have single selects, fatten array
  171. if (type === 'select') {
  172. value = value[0];
  173. }
  174. values[$elements[i].name] = value;
  175. }
  176. }
  177. return values;
  178. }
  179. /**
  180. * Checks whether field has its default value
  181. *
  182. * @param {Element} field
  183. * @param {String} type
  184. * @return boolean
  185. */
  186. function checkFieldDefault (field, type) {
  187. var $field = $(field);
  188. var field_id = $field.attr('id');
  189. if (typeof defaultValues[field_id] === 'undefined') {
  190. return true;
  191. }
  192. var isDefault = true;
  193. var currentValue = getFieldValue($field, type);
  194. if (type !== 'select') {
  195. isDefault = currentValue === defaultValues[field_id];
  196. } else {
  197. // compare arrays, will work for our representation of select values
  198. if (currentValue.length !== defaultValues[field_id].length) {
  199. isDefault = false;
  200. } else {
  201. for (var i = 0; i < currentValue.length; i++) {
  202. if (currentValue[i] !== defaultValues[field_id][i]) {
  203. isDefault = false;
  204. break;
  205. }
  206. }
  207. }
  208. }
  209. return isDefault;
  210. }
  211. /**
  212. * Returns element's id prefix
  213. * @param {Element} element
  214. */
  215. function getIdPrefix (element) {
  216. return $(element).attr('id').replace(/[^-]+$/, '');
  217. }
  218. // ------------------------------------------------------------------
  219. // Form validation and field operations
  220. //
  221. // form validator assignments
  222. var validate = {};
  223. // form validator list
  224. var validators = {
  225. // regexp: numeric value
  226. _regexp_numeric: /^[0-9]+$/,
  227. // regexp: extract parts from PCRE expression
  228. _regexp_pcre_extract: /(.)(.*)\1(.*)?/,
  229. /**
  230. * Validates positive number
  231. *
  232. * @param {boolean} isKeyUp
  233. */
  234. PMA_validatePositiveNumber: function (isKeyUp) {
  235. if (isKeyUp && this.value === '') {
  236. return true;
  237. }
  238. var result = this.value !== '0' && validators._regexp_numeric.test(this.value);
  239. return result ? true : PMA_messages.error_nan_p;
  240. },
  241. /**
  242. * Validates non-negative number
  243. *
  244. * @param {boolean} isKeyUp
  245. */
  246. PMA_validateNonNegativeNumber: function (isKeyUp) {
  247. if (isKeyUp && this.value === '') {
  248. return true;
  249. }
  250. var result = validators._regexp_numeric.test(this.value);
  251. return result ? true : PMA_messages.error_nan_nneg;
  252. },
  253. /**
  254. * Validates port number
  255. *
  256. * @param {boolean} isKeyUp
  257. */
  258. PMA_validatePortNumber: function (isKeyUp) {
  259. if (this.value === '') {
  260. return true;
  261. }
  262. var result = validators._regexp_numeric.test(this.value) && this.value !== '0';
  263. return result && this.value <= 65535 ? true : PMA_messages.error_incorrect_port;
  264. },
  265. /**
  266. * Validates value according to given regular expression
  267. *
  268. * @param {boolean} isKeyUp
  269. * @param {string} regexp
  270. */
  271. PMA_validateByRegex: function (isKeyUp, regexp) {
  272. if (isKeyUp && this.value === '') {
  273. return true;
  274. }
  275. // convert PCRE regexp
  276. var parts = regexp.match(validators._regexp_pcre_extract);
  277. var valid = this.value.match(new RegExp(parts[2], parts[3])) !== null;
  278. return valid ? true : PMA_messages.error_invalid_value;
  279. },
  280. /**
  281. * Validates upper bound for numeric inputs
  282. *
  283. * @param {boolean} isKeyUp
  284. * @param {int} max_value
  285. */
  286. PMA_validateUpperBound: function (isKeyUp, max_value) {
  287. var val = parseInt(this.value, 10);
  288. if (isNaN(val)) {
  289. return true;
  290. }
  291. return val <= max_value ? true : PMA_sprintf(PMA_messages.error_value_lte, max_value);
  292. },
  293. // field validators
  294. _field: {
  295. },
  296. // fieldset validators
  297. _fieldset: {
  298. }
  299. };
  300. /**
  301. * Registers validator for given field
  302. *
  303. * @param {String} id field id
  304. * @param {String} type validator (key in validators object)
  305. * @param {boolean} onKeyUp whether fire on key up
  306. * @param {Array} params validation function parameters
  307. */
  308. function validateField (id, type, onKeyUp, params) {
  309. if (typeof validators[type] === 'undefined') {
  310. return;
  311. }
  312. if (typeof validate[id] === 'undefined') {
  313. validate[id] = [];
  314. }
  315. validate[id].push([type, params, onKeyUp]);
  316. }
  317. /**
  318. * Returns validation functions associated with form field
  319. *
  320. * @param {String} field_id form field id
  321. * @param {boolean} onKeyUpOnly see validateField
  322. * @type Array
  323. * @return array of [function, parameters to be passed to function]
  324. */
  325. function getFieldValidators (field_id, onKeyUpOnly) {
  326. // look for field bound validator
  327. var name = field_id && field_id.match(/[^-]+$/)[0];
  328. if (typeof validators._field[name] !== 'undefined') {
  329. return [[validators._field[name], null]];
  330. }
  331. // look for registered validators
  332. var functions = [];
  333. if (typeof validate[field_id] !== 'undefined') {
  334. // validate[field_id]: array of [type, params, onKeyUp]
  335. for (var i = 0, imax = validate[field_id].length; i < imax; i++) {
  336. if (onKeyUpOnly && !validate[field_id][i][2]) {
  337. continue;
  338. }
  339. functions.push([validators[validate[field_id][i][0]], validate[field_id][i][1]]);
  340. }
  341. }
  342. return functions;
  343. }
  344. /**
  345. * Displays errors for given form fields
  346. *
  347. * WARNING: created DOM elements must be identical with the ones made by
  348. * PhpMyAdmin\Config\FormDisplayTemplate::displayInput()!
  349. *
  350. * @param {Object} error_list list of errors in the form {field id: error array}
  351. */
  352. function displayErrors (error_list) {
  353. var tempIsEmpty = function (item) {
  354. return item !== '';
  355. };
  356. for (var field_id in error_list) {
  357. var errors = error_list[field_id];
  358. var $field = $('#' + field_id);
  359. var isFieldset = $field.attr('tagName') === 'FIELDSET';
  360. var $errorCnt;
  361. if (isFieldset) {
  362. $errorCnt = $field.find('dl.errors');
  363. } else {
  364. $errorCnt = $field.siblings('.inline_errors');
  365. }
  366. // remove empty errors (used to clear error list)
  367. errors = $.grep(errors, tempIsEmpty);
  368. // CSS error class
  369. if (!isFieldset) {
  370. // checkboxes uses parent <span> for marking
  371. var $fieldMarker = ($field.attr('type') === 'checkbox') ? $field.parent() : $field;
  372. $fieldMarker[errors.length ? 'addClass' : 'removeClass']('field-error');
  373. }
  374. if (errors.length) {
  375. // if error container doesn't exist, create it
  376. if ($errorCnt.length === 0) {
  377. if (isFieldset) {
  378. $errorCnt = $('<dl class="errors" />');
  379. $field.find('table').before($errorCnt);
  380. } else {
  381. $errorCnt = $('<dl class="inline_errors" />');
  382. $field.closest('td').append($errorCnt);
  383. }
  384. }
  385. var html = '';
  386. for (var i = 0, imax = errors.length; i < imax; i++) {
  387. html += '<dd>' + errors[i] + '</dd>';
  388. }
  389. $errorCnt.html(html);
  390. } else if ($errorCnt !== null) {
  391. // remove useless error container
  392. $errorCnt.remove();
  393. }
  394. }
  395. }
  396. /**
  397. * Validates fieldset and puts errors in 'errors' object
  398. *
  399. * @param {Element} fieldset
  400. * @param {boolean} isKeyUp
  401. * @param {Object} errors
  402. */
  403. function validate_fieldset (fieldset, isKeyUp, errors) {
  404. var $fieldset = $(fieldset);
  405. if ($fieldset.length && typeof validators._fieldset[$fieldset.attr('id')] !== 'undefined') {
  406. var fieldset_errors = validators._fieldset[$fieldset.attr('id')].apply($fieldset[0], [isKeyUp]);
  407. for (var field_id in fieldset_errors) {
  408. if (typeof errors[field_id] === 'undefined') {
  409. errors[field_id] = [];
  410. }
  411. if (typeof fieldset_errors[field_id] === 'string') {
  412. fieldset_errors[field_id] = [fieldset_errors[field_id]];
  413. }
  414. $.merge(errors[field_id], fieldset_errors[field_id]);
  415. }
  416. }
  417. }
  418. /**
  419. * Validates form field and puts errors in 'errors' object
  420. *
  421. * @param {Element} field
  422. * @param {boolean} isKeyUp
  423. * @param {Object} errors
  424. */
  425. function validate_field (field, isKeyUp, errors) {
  426. var args;
  427. var result;
  428. var $field = $(field);
  429. var field_id = $field.attr('id');
  430. errors[field_id] = [];
  431. var functions = getFieldValidators(field_id, isKeyUp);
  432. for (var i = 0; i < functions.length; i++) {
  433. if (typeof functions[i][1] !== 'undefined' && functions[i][1] !== null) {
  434. args = functions[i][1].slice(0);
  435. } else {
  436. args = [];
  437. }
  438. args.unshift(isKeyUp);
  439. result = functions[i][0].apply($field[0], args);
  440. if (result !== true) {
  441. if (typeof result === 'string') {
  442. result = [result];
  443. }
  444. $.merge(errors[field_id], result);
  445. }
  446. }
  447. }
  448. /**
  449. * Validates form field and parent fieldset
  450. *
  451. * @param {Element} field
  452. * @param {boolean} isKeyUp
  453. */
  454. function validate_field_and_fieldset (field, isKeyUp) {
  455. var $field = $(field);
  456. var errors = {};
  457. validate_field($field, isKeyUp, errors);
  458. validate_fieldset($field.closest('fieldset.optbox'), isKeyUp, errors);
  459. displayErrors(errors);
  460. }
  461. function loadInlineConfig () {
  462. if (!Array.isArray(configInlineParams)) {
  463. return;
  464. }
  465. for (var i = 0; i < configInlineParams.length; ++i) {
  466. if (typeof configInlineParams[i] === 'function') {
  467. configInlineParams[i]();
  468. }
  469. }
  470. }
  471. function setupValidation () {
  472. validate = {};
  473. configScriptLoaded = true;
  474. if (configScriptLoaded && typeof configInlineParams !== 'undefined') {
  475. loadInlineConfig();
  476. }
  477. // register validators and mark custom values
  478. var $elements = $('.optbox input[id], .optbox select[id], .optbox textarea[id]');
  479. $elements.each(function () {
  480. markField(this);
  481. var $el = $(this);
  482. $el.on('change', function () {
  483. validate_field_and_fieldset(this, false);
  484. markField(this);
  485. });
  486. var tagName = $el.attr('tagName');
  487. // text fields can be validated after each change
  488. if (tagName === 'INPUT' && $el.attr('type') === 'text') {
  489. $el.keyup(function () {
  490. validate_field_and_fieldset($el, true);
  491. markField($el);
  492. });
  493. }
  494. // disable textarea spellcheck
  495. if (tagName === 'TEXTAREA') {
  496. $el.attr('spellcheck', false);
  497. }
  498. });
  499. // check whether we've refreshed a page and browser remembered modified
  500. // form values
  501. var $check_page_refresh = $('#check_page_refresh');
  502. if ($check_page_refresh.length === 0 || $check_page_refresh.val() === '1') {
  503. // run all field validators
  504. var errors = {};
  505. for (var i = 0; i < $elements.length; i++) {
  506. validate_field($elements[i], false, errors);
  507. }
  508. // run all fieldset validators
  509. $('fieldset.optbox').each(function () {
  510. validate_fieldset(this, false, errors);
  511. });
  512. displayErrors(errors);
  513. } else if ($check_page_refresh) {
  514. $check_page_refresh.val('1');
  515. }
  516. }
  517. AJAX.registerOnload('config.js', function () {
  518. setupValidation();
  519. });
  520. //
  521. // END: Form validation and field operations
  522. // ------------------------------------------------------------------
  523. // ------------------------------------------------------------------
  524. // Tabbed forms
  525. //
  526. /**
  527. * Sets active tab
  528. *
  529. * @param {String} tab_id
  530. */
  531. function setTab (tab_id) {
  532. $('ul.tabs').each(function () {
  533. var $this = $(this);
  534. if (!$this.find('li a[href="#' + tab_id + '"]').length) {
  535. return;
  536. }
  537. $this.find('li').removeClass('active').find('a[href="#' + tab_id + '"]').parent().addClass('active');
  538. $this.parent().find('div.tabs_contents fieldset').hide().filter('#' + tab_id).show();
  539. var hashValue = 'tab_' + tab_id;
  540. location.hash = hashValue;
  541. $this.parent().find('input[name=tab_hash]').val(hashValue);
  542. });
  543. }
  544. function setupConfigTabs () {
  545. var forms = $('form.config-form');
  546. forms.each(function () {
  547. var $this = $(this);
  548. var $tabs = $this.find('ul.tabs');
  549. if (!$tabs.length) {
  550. return;
  551. }
  552. // add tabs events and activate one tab (the first one or indicated by location hash)
  553. $tabs.find('li').removeClass('active');
  554. $tabs.find('a')
  555. .click(function (e) {
  556. e.preventDefault();
  557. setTab($(this).attr('href').substr(1));
  558. })
  559. .filter(':first')
  560. .parent()
  561. .addClass('active');
  562. $this.find('div.tabs_contents fieldset').hide().filter(':first').show();
  563. });
  564. }
  565. function adjustPrefsNotification () {
  566. var $prefsAutoLoad = $('#prefs_autoload');
  567. var $tableNameControl = $('#table_name_col_no');
  568. var $prefsAutoShowing = ($prefsAutoLoad.css('display') !== 'none');
  569. if ($prefsAutoShowing && $tableNameControl.length) {
  570. $tableNameControl.css('top', '55px');
  571. }
  572. }
  573. AJAX.registerOnload('config.js', function () {
  574. setupConfigTabs();
  575. adjustPrefsNotification();
  576. // tab links handling, check each 200ms
  577. // (works with history in FF, further browser support here would be an overkill)
  578. var prev_hash;
  579. var tab_check_fnc = function () {
  580. if (location.hash !== prev_hash) {
  581. prev_hash = location.hash;
  582. if (prev_hash.match(/^#tab_[a-zA-Z0-9_]+$/)) {
  583. // session ID is sometimes appended here
  584. var hash = prev_hash.substr(5).split('&')[0];
  585. if ($('#' + hash).length) {
  586. setTab(hash);
  587. }
  588. }
  589. }
  590. };
  591. tab_check_fnc();
  592. setInterval(tab_check_fnc, 200);
  593. });
  594. //
  595. // END: Tabbed forms
  596. // ------------------------------------------------------------------
  597. // ------------------------------------------------------------------
  598. // Form reset buttons
  599. //
  600. AJAX.registerOnload('config.js', function () {
  601. $('.optbox input[type=button][name=submit_reset]').on('click', function () {
  602. var fields = $(this).closest('fieldset').find('input, select, textarea');
  603. for (var i = 0, imax = fields.length; i < imax; i++) {
  604. setFieldValue(fields[i], getFieldType(fields[i]), defaultValues[fields[i].id]);
  605. }
  606. });
  607. });
  608. //
  609. // END: Form reset buttons
  610. // ------------------------------------------------------------------
  611. // ------------------------------------------------------------------
  612. // "Restore default" and "set value" buttons
  613. //
  614. /**
  615. * Restores field's default value
  616. *
  617. * @param {String} field_id
  618. */
  619. function restoreField (field_id) {
  620. var $field = $('#' + field_id);
  621. if ($field.length === 0 || defaultValues[field_id] === undefined) {
  622. return;
  623. }
  624. setFieldValue($field, getFieldType($field), defaultValues[field_id]);
  625. }
  626. function setupRestoreField () {
  627. $('div.tabs_contents')
  628. .on('mouseenter', '.restore-default, .set-value', function () {
  629. $(this).css('opacity', 1);
  630. })
  631. .on('mouseleave', '.restore-default, .set-value', function () {
  632. $(this).css('opacity', 0.25);
  633. })
  634. .on('click', '.restore-default, .set-value', function (e) {
  635. e.preventDefault();
  636. var href = $(this).attr('href');
  637. var field_sel;
  638. if ($(this).hasClass('restore-default')) {
  639. field_sel = href;
  640. restoreField(field_sel.substr(1));
  641. } else {
  642. field_sel = href.match(/^[^=]+/)[0];
  643. var value = href.match(/\=(.+)$/)[1];
  644. setFieldValue($(field_sel), 'text', value);
  645. }
  646. $(field_sel).trigger('change');
  647. })
  648. .find('.restore-default, .set-value')
  649. // inline-block for IE so opacity inheritance works
  650. .css({ display: 'inline-block', opacity: 0.25 });
  651. }
  652. AJAX.registerOnload('config.js', function () {
  653. setupRestoreField();
  654. });
  655. //
  656. // END: "Restore default" and "set value" buttons
  657. // ------------------------------------------------------------------
  658. // ------------------------------------------------------------------
  659. // User preferences import/export
  660. //
  661. AJAX.registerOnload('config.js', function () {
  662. offerPrefsAutoimport();
  663. var $radios = $('#import_local_storage, #export_local_storage');
  664. if (!$radios.length) {
  665. return;
  666. }
  667. // enable JavaScript dependent fields
  668. $radios
  669. .prop('disabled', false)
  670. .add('#export_text_file, #import_text_file')
  671. .click(function () {
  672. var enable_id = $(this).attr('id');
  673. var disable_id;
  674. if (enable_id.match(/local_storage$/)) {
  675. disable_id = enable_id.replace(/local_storage$/, 'text_file');
  676. } else {
  677. disable_id = enable_id.replace(/text_file$/, 'local_storage');
  678. }
  679. $('#opts_' + disable_id).addClass('disabled').find('input').prop('disabled', true);
  680. $('#opts_' + enable_id).removeClass('disabled').find('input').prop('disabled', false);
  681. });
  682. // detect localStorage state
  683. var ls_supported = isStorageSupported('localStorage', true);
  684. var ls_exists = ls_supported ? (window.localStorage.config || false) : false;
  685. $('div.localStorage-' + (ls_supported ? 'un' : '') + 'supported').hide();
  686. $('div.localStorage-' + (ls_exists ? 'empty' : 'exists')).hide();
  687. if (ls_exists) {
  688. updatePrefsDate();
  689. }
  690. $('form.prefs-form').change(function () {
  691. var $form = $(this);
  692. var disabled = false;
  693. if (!ls_supported) {
  694. disabled = $form.find('input[type=radio][value$=local_storage]').prop('checked');
  695. } else if (!ls_exists && $form.attr('name') === 'prefs_import' &&
  696. $('#import_local_storage')[0].checked
  697. ) {
  698. disabled = true;
  699. }
  700. $form.find('input[type=submit]').prop('disabled', disabled);
  701. }).submit(function (e) {
  702. var $form = $(this);
  703. if ($form.attr('name') === 'prefs_export' && $('#export_local_storage')[0].checked) {
  704. e.preventDefault();
  705. // use AJAX to read JSON settings and save them
  706. savePrefsToLocalStorage($form);
  707. } else if ($form.attr('name') === 'prefs_import' && $('#import_local_storage')[0].checked) {
  708. // set 'json' input and submit form
  709. $form.find('input[name=json]').val(window.localStorage.config);
  710. }
  711. });
  712. $(document).on('click', 'div.click-hide-message', function () {
  713. $(this)
  714. .hide()
  715. .parent('.group')
  716. .css('height', '')
  717. .next('form')
  718. .show();
  719. });
  720. });
  721. /**
  722. * Saves user preferences to localStorage
  723. *
  724. * @param {Element} form
  725. */
  726. function savePrefsToLocalStorage (form) {
  727. $form = $(form);
  728. var submit = $form.find('input[type=submit]');
  729. submit.prop('disabled', true);
  730. $.ajax({
  731. url: 'prefs_manage.php',
  732. cache: false,
  733. type: 'POST',
  734. data: {
  735. ajax_request: true,
  736. server: PMA_commonParams.get('server'),
  737. submit_get_json: true
  738. },
  739. success: function (data) {
  740. if (typeof data !== 'undefined' && data.success === true) {
  741. window.localStorage.config = data.prefs;
  742. window.localStorage.config_mtime = data.mtime;
  743. window.localStorage.config_mtime_local = (new Date()).toUTCString();
  744. updatePrefsDate();
  745. $('div.localStorage-empty').hide();
  746. $('div.localStorage-exists').show();
  747. var group = $form.parent('.group');
  748. group.css('height', group.height() + 'px');
  749. $form.hide('fast');
  750. $form.prev('.click-hide-message').show('fast');
  751. } else {
  752. PMA_ajaxShowMessage(data.error);
  753. }
  754. },
  755. complete: function () {
  756. submit.prop('disabled', false);
  757. }
  758. });
  759. }
  760. /**
  761. * Updates preferences timestamp in Import form
  762. */
  763. function updatePrefsDate () {
  764. var d = new Date(window.localStorage.config_mtime_local);
  765. var msg = PMA_messages.strSavedOn.replace(
  766. '@DATE@',
  767. PMA_formatDateTime(d)
  768. );
  769. $('#opts_import_local_storage').find('div.localStorage-exists').html(msg);
  770. }
  771. /**
  772. * Prepares message which informs that localStorage preferences are available and can be imported or deleted
  773. */
  774. function offerPrefsAutoimport () {
  775. var has_config = (isStorageSupported('localStorage')) && (window.localStorage.config || false);
  776. var $cnt = $('#prefs_autoload');
  777. if (!$cnt.length || !has_config) {
  778. return;
  779. }
  780. $cnt.find('a').click(function (e) {
  781. e.preventDefault();
  782. var $a = $(this);
  783. if ($a.attr('href') === '#no') {
  784. $cnt.remove();
  785. $.post('index.php', {
  786. server: PMA_commonParams.get('server'),
  787. prefs_autoload: 'hide'
  788. }, null, 'html');
  789. return;
  790. } else if ($a.attr('href') === '#delete') {
  791. $cnt.remove();
  792. localStorage.clear();
  793. $.post('index.php', {
  794. server: PMA_commonParams.get('server'),
  795. prefs_autoload: 'hide'
  796. }, null, 'html');
  797. return;
  798. }
  799. $cnt.find('input[name=json]').val(window.localStorage.config);
  800. $cnt.find('form').submit();
  801. });
  802. $cnt.show();
  803. }
  804. //
  805. // END: User preferences import/export
  806. // ------------------------------------------------------------------