From f126e14599d7d4e6ba9dcbffd5909b5dd734ff7a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Maur=C3=ADcio=20Meneghini=20Fauth?= Date: Wed, 18 Dec 2019 16:36:48 -0300 Subject: [PATCH] Extract js variables from js/messages.php MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Moves JavaScript variables to templates/javascript/variables.twig. Signed-off-by: Maurício Meneghini Fauth --- js/designer/history.js | 2 +- js/designer/move.js | 2 +- js/functions.js | 2 +- js/gis_data_editor.js | 2 +- js/makegrid.js | 2 +- js/messages.php | 248 +--------------------------- js/server/status/monitor.js | 2 +- js/table/change.js | 2 +- libraries/classes/Header.php | 19 +++ libraries/classes/Sanitize.php | 57 ------- templates/javascript/variables.twig | 111 +++++++++++++ 11 files changed, 143 insertions(+), 306 deletions(-) create mode 100644 templates/javascript/variables.twig diff --git a/js/designer/history.js b/js/designer/history.js index 7834627d0e..47084bbb2d 100644 --- a/js/designer/history.js +++ b/js/designer/history.js @@ -8,7 +8,7 @@ /* global contr */ // js/designer/init.js /* global fromArray:writable */ // js/designer/move.js -/* global pmaThemeImage */ // js/messages.php +/* global pmaThemeImage */ // templates/javascript/variables.twig var DesignerHistory = {}; diff --git a/js/designer/move.js b/js/designer/move.js index 32050905e3..50be0363a3 100644 --- a/js/designer/move.js +++ b/js/designer/move.js @@ -6,7 +6,7 @@ /* global DesignerHistory, historyArray, selectField */ // js/designer/history.js /* global contr, db, designerTablesEnabled, displayField, hTabs, jTabs, selectedPage:writable, server */ // js/designer/init.js /* global DesignerPage */ // js/designer/page.js -/* global pmaThemeImage */ // js/messages.php +/* global pmaThemeImage */ // templates/javascript/variables.twig var DesignerMove = {}; diff --git a/js/functions.js b/js/functions.js index 7f943167b2..567e3deed4 100644 --- a/js/functions.js +++ b/js/functions.js @@ -4,7 +4,7 @@ /* global DatabaseStructure */ // js/database/structure.js /* global mysqlDocBuiltin, mysqlDocKeyword */ // js/doclinks.js /* global Indexes */ // js/indexes.js -/* global firstDayOfCalendar, maxInputVars, mysqlDocTemplate, pmaThemeImage */ // js/messages.php +/* global firstDayOfCalendar, maxInputVars, mysqlDocTemplate, pmaThemeImage */ // templates/javascript/variables.twig /* global MicroHistory */ // js/microhistory.js /* global sprintf */ // js/vendor/sprintf.js /* global Int32Array */ // ES6 diff --git a/js/gis_data_editor.js b/js/gis_data_editor.js index 2c8494d625..8f5a871e08 100644 --- a/js/gis_data_editor.js +++ b/js/gis_data_editor.js @@ -6,7 +6,7 @@ */ /* global addZoomPanControllers, loadSVG, selectVisualization, styleOSM, zoomAndPan */ // js/table/gis_visualization.js -/* global pmaThemeImage */ // js/messages.php +/* global pmaThemeImage */ // templates/javascript/variables.twig // eslint-disable-next-line no-unused-vars var gisEditorLoaded = false; diff --git a/js/makegrid.js b/js/makegrid.js index 638e1ad3c3..321e057015 100644 --- a/js/makegrid.js +++ b/js/makegrid.js @@ -1,4 +1,4 @@ -/* global firstDayOfCalendar */ // js/messages.php +/* global firstDayOfCalendar */ // templates/javascript/variables.twig /** * Create advanced table (resize, reorder, and show/hide columns; and also grid editing). diff --git a/js/messages.php b/js/messages.php index b85102c1e3..be53aeeced 100644 --- a/js/messages.php +++ b/js/messages.php @@ -6,6 +6,9 @@ */ declare(strict_types=1); +use PhpMyAdmin\OutputBuffering; +use PhpMyAdmin\Sanitize; + if (! defined('ROOT_PATH')) { define('ROOT_PATH', dirname(__DIR__) . DIRECTORY_SEPARATOR); } @@ -28,15 +31,12 @@ if (! defined('TESTSUITE')) { require_once ROOT_PATH . 'libraries/common.inc.php'; } -// But this one is needed for Sanitize::escapeJsString() -use PhpMyAdmin\Sanitize; - -$buffer = PhpMyAdmin\OutputBuffering::getInstance(); +$buffer = OutputBuffering::getInstance(); $buffer->start(); if (! defined('TESTSUITE')) { register_shutdown_function( function () { - echo PhpMyAdmin\OutputBuffering::getInstance()->getContents(); + echo OutputBuffering::getInstance()->getContents(); } ); } @@ -768,241 +768,5 @@ $js_messages['strStructure'] = __('Structure'); echo "var Messages = [];\n"; foreach ($js_messages as $name => $js_message) { - Sanitize::printJsValue('Messages.' . $name . '', $js_message); + echo Sanitize::getJsValue('Messages.' . $name, $js_message); } - -/* Calendar */ -echo "var themeCalendarImage = '" , $GLOBALS['pmaThemeImage'] - , 'b_calendar.png' , "';\n"; - -/* Calendar First Day */ -echo "var firstDayOfCalendar = '" , $GLOBALS['cfg']['FirstDayOfCalendar'] , "';\n"; - -/* Image path */ -echo "var pmaThemeImage = '" , $GLOBALS['pmaThemeImage'] , "';\n"; - -echo "var mysqlDocTemplate = '" , PhpMyAdmin\Util::getMySQLDocuURL('%s') - , "';\n"; - -//Max input vars allowed by PHP. -$maxInputVars = ini_get('max_input_vars'); -echo 'var maxInputVars = ' - , (false === $maxInputVars || '' == $maxInputVars ? 'false' : (int) $maxInputVars) - , ';' . "\n"; - -echo "if ($.datepicker) {\n"; -/* l10n: Display text for calendar close link */ -Sanitize::printJsValue("$.datepicker.regional['']['closeText']", __('Done')); -/* l10n: Display text for previous month link in calendar */ -Sanitize::printJsValue( - "$.datepicker.regional['']['prevText']", - _pgettext('Previous month', 'Prev') -); -/* l10n: Display text for next month link in calendar */ -Sanitize::printJsValue( - "$.datepicker.regional['']['nextText']", - _pgettext('Next month', 'Next') -); -/* l10n: Display text for current month link in calendar */ -Sanitize::printJsValue("$.datepicker.regional['']['currentText']", __('Today')); -Sanitize::printJsValue( - "$.datepicker.regional['']['monthNames']", - [ - __('January'), - __('February'), - __('March'), - __('April'), - __('May'), - __('June'), - __('July'), - __('August'), - __('September'), - __('October'), - __('November'), - __('December'), - ] -); -Sanitize::printJsValue( - "$.datepicker.regional['']['monthNamesShort']", - [ - /* l10n: Short month name */ - __('Jan'), - /* l10n: Short month name */ - __('Feb'), - /* l10n: Short month name */ - __('Mar'), - /* l10n: Short month name */ - __('Apr'), - /* l10n: Short month name */ - _pgettext('Short month name', 'May'), - /* l10n: Short month name */ - __('Jun'), - /* l10n: Short month name */ - __('Jul'), - /* l10n: Short month name */ - __('Aug'), - /* l10n: Short month name */ - __('Sep'), - /* l10n: Short month name */ - __('Oct'), - /* l10n: Short month name */ - __('Nov'), - /* l10n: Short month name */ - __('Dec'), - ] -); -Sanitize::printJsValue( - "$.datepicker.regional['']['dayNames']", - [ - __('Sunday'), - __('Monday'), - __('Tuesday'), - __('Wednesday'), - __('Thursday'), - __('Friday'), - __('Saturday'), - ] -); -Sanitize::printJsValue( - "$.datepicker.regional['']['dayNamesShort']", - [ - /* l10n: Short week day name for Sunday */ - __('Sun'), - /* l10n: Short week day name for Monday */ - __('Mon'), - /* l10n: Short week day name for Tuesday */ - __('Tue'), - /* l10n: Short week day name for Wednesday */ - __('Wed'), - /* l10n: Short week day name for Thursday */ - __('Thu'), - /* l10n: Short week day name for Friday */ - __('Fri'), - /* l10n: Short week day name for Saturday */ - __('Sat'), - ] -); -Sanitize::printJsValue( - "$.datepicker.regional['']['dayNamesMin']", - [ - /* l10n: Minimal week day name for Sunday */ - __('Su'), - /* l10n: Minimal week day name for Monday */ - __('Mo'), - /* l10n: Minimal week day name for Tuesday */ - __('Tu'), - /* l10n: Minimal week day name for Wednesday */ - __('We'), - /* l10n: Minimal week day name for Thursday */ - __('Th'), - /* l10n: Minimal week day name for Friday */ - __('Fr'), - /* l10n: Minimal week day name for Saturday */ - __('Sa'), - ] -); -/* l10n: Column header for week of the year in calendar */ -Sanitize::printJsValue("$.datepicker.regional['']['weekHeader']", __('Wk')); - -Sanitize::printJsValue( - "$.datepicker.regional['']['showMonthAfterYear']", - /* l10n: Month-year order for calendar, use either "calendar-month-year" - * or "calendar-year-month". - */ - __('calendar-month-year') == 'calendar-year-month' -); -/* l10n: Year suffix for calendar, "none" is empty. */ -$year_suffix = _pgettext('Year suffix', 'none'); -Sanitize::printJsValue( - "$.datepicker.regional['']['yearSuffix']", - ($year_suffix == 'none' ? '' : $year_suffix) -); -?> -$.extend($.datepicker._defaults, $.datepicker.regional['']); -} /* if ($.datepicker) */ - - -$.extend($.timepicker._defaults, $.timepicker.regional['']); -} /* if ($.timepicker) */ - - diff --git a/js/server/status/monitor.js b/js/server/status/monitor.js index 6b482c44f0..954217e35b 100644 --- a/js/server/status/monitor.js +++ b/js/server/status/monitor.js @@ -9,7 +9,7 @@ /* global isStorageSupported */ // js/config.js /* global codeMirrorEditor:writable */ // js/functions.js -/* global firstDayOfCalendar, pmaThemeImage */ // js/messages.php +/* global firstDayOfCalendar, pmaThemeImage */ // templates/javascript/variables.twig /* global variableNames */ // templates/server/status/monitor/index.twig var runtime = {}; diff --git a/js/table/change.js b/js/table/change.js index b1a47c7d2b..60ad7f8033 100644 --- a/js/table/change.js +++ b/js/table/change.js @@ -7,7 +7,7 @@ * */ -/* global extendingValidatorMessages */ // js/messages.php +/* global extendingValidatorMessages */ // templates/javascript/variables.twig /* global openGISEditor, gisEditorLoaded, loadJSAndGISEditor, loadGISEditor */ // js/gis_data_editor.js /** diff --git a/libraries/classes/Header.php b/libraries/classes/Header.php index 60ca365dfb..a3326f5184 100644 --- a/libraries/classes/Header.php +++ b/libraries/classes/Header.php @@ -10,6 +10,7 @@ namespace PhpMyAdmin; use PhpMyAdmin\Html\Generator; use PhpMyAdmin\Navigation\Navigation; +use function ini_get; /** * Class used to output the HTTP and HTML headers @@ -200,6 +201,7 @@ class Header // the user preferences have not been merged at this point $this->_scripts->addFile('messages.php', ['l' => $GLOBALS['lang']]); + $this->_scripts->addCode($this->getVariablesForJavaScript()); $this->_scripts->addFile('config.js'); $this->_scripts->addFile('doclinks.js'); $this->_scripts->addFile('functions.js'); @@ -698,4 +700,21 @@ class Header { return 'v=' . urlencode(PMA_VERSION); } + + /** + * @return string + */ + private function getVariablesForJavaScript(): string + { + global $cfg, $pmaThemeImage; + + $maxInputVars = ini_get('max_input_vars'); + $maxInputVarsValue = $maxInputVars === false || $maxInputVars === '' ? 'false' : (int) $maxInputVars; + + return $this->template->render('javascript/variables', [ + 'first_day_of_calendar' => $cfg['FirstDayOfCalendar'], + 'pma_theme_image' => $pmaThemeImage, + 'max_input_vars' => $maxInputVarsValue, + ]); + } } diff --git a/libraries/classes/Sanitize.php b/libraries/classes/Sanitize.php index fe34b56c00..68d333beb1 100644 --- a/libraries/classes/Sanitize.php +++ b/libraries/classes/Sanitize.php @@ -338,63 +338,6 @@ class Sanitize return $result; } - /** - * Prints an javascript assignment with proper escaping of a value - * and support for assigning array of strings. - * - * @param string $key Name of value to set - * @param mixed $value Value to set, can be either string or array of strings - * - * @return void - */ - public static function printJsValue($key, $value) - { - echo self::getJsValue($key, $value); - } - - /** - * Formats javascript assignment for form validation api - * with proper escaping of a value. - * - * @param string $key Name of value to set - * @param string $value Value to set - * @param boolean $addOn Check if $.validator.format is required or not - * @param boolean $comma Check if comma is required - * - * @return string Javascript code. - */ - public static function getJsValueForFormValidation($key, $value, $addOn, $comma) - { - $result = $key . ': '; - if ($addOn) { - $result .= '$.validator.format('; - } - $result .= self::formatJsVal($value); - if ($addOn) { - $result .= ')'; - } - if ($comma) { - $result .= ', '; - } - return $result; - } - - /** - * Prints javascript assignment for form validation api - * with proper escaping of a value. - * - * @param string $key Name of value to set - * @param string $value Value to set - * @param boolean $addOn Check if $.validator.format is required or not - * @param boolean $comma Check if comma is required - * - * @return void - */ - public static function printJsValueForFormValidation($key, $value, $addOn = false, $comma = true) - { - echo self::getJsValueForFormValidation($key, $value, $addOn, $comma); - } - /** * Removes all variables from request except whitelisted ones. * diff --git a/templates/javascript/variables.twig b/templates/javascript/variables.twig new file mode 100644 index 0000000000..906ba44874 --- /dev/null +++ b/templates/javascript/variables.twig @@ -0,0 +1,111 @@ +{% autoescape 'js' %} +var firstDayOfCalendar = '{{ first_day_of_calendar }}'; +var pmaThemeImage = '{{ pma_theme_image }}'; +var mysqlDocTemplate = '{{ get_mysql_docu_url('%s') }}'; +var maxInputVars = {{ max_input_vars }}; + +{% set show_month_after_year -%} + {% trans %}calendar-month-year{% notes %}Month-year order for calendar, use either "calendar-month-year" or "calendar-year-month".{% endtrans %} +{%- endset -%} +{% set year_suffix -%} + {% trans %}none{% notes %}Year suffix for calendar, "none" is empty.{% endtrans %} +{%- endset -%} + +if ($.datepicker) { + $.datepicker.regional[''].closeText = '{% trans %}Done{% notes %}Display text for calendar close link{% endtrans %}'; + $.datepicker.regional[''].prevText = '{% trans %}Prev{% notes %}Previous month. Display text for previous month link in calendar{% endtrans %}'; + $.datepicker.regional[''].nextText = '{% trans %}Next{% notes %}Next month. Display text for next month link in calendar{% endtrans %}'; + $.datepicker.regional[''].currentText = '{% trans %}Today{% notes %}Display text for current month link in calendar{% endtrans %}'; + $.datepicker.regional[''].monthNames = [ + '{% trans 'January' %}', + '{% trans 'February' %}', + '{% trans 'March' %}', + '{% trans 'April' %}', + '{% trans 'May' %}', + '{% trans 'June' %}', + '{% trans 'July' %}', + '{% trans 'August' %}', + '{% trans 'September' %}', + '{% trans 'October' %}', + '{% trans 'November' %}', + '{% trans 'December' %}', + ]; + $.datepicker.regional[''].monthNamesShort = [ + '{% trans %}Jan{% notes %}Short month name for January{% endtrans %}', + '{% trans %}Feb{% notes %}Short month name for February{% endtrans %}', + '{% trans %}Mar{% notes %}Short month name for March{% endtrans %}', + '{% trans %}Apr{% notes %}Short month name for April{% endtrans %}', + '{% trans %}May{% notes %}Short month name for May{% endtrans %}', + '{% trans %}Jun{% notes %}Short month name for June{% endtrans %}', + '{% trans %}Jul{% notes %}Short month name for July{% endtrans %}', + '{% trans %}Aug{% notes %}Short month name for August{% endtrans %}', + '{% trans %}Sep{% notes %}Short month name for September{% endtrans %}', + '{% trans %}Oct{% notes %}Short month name for October{% endtrans %}', + '{% trans %}Nov{% notes %}Short month name for November{% endtrans %}', + '{% trans %}Dec{% notes %}Short month name for December{% endtrans %}', + ]; + $.datepicker.regional[''].dayNames = [ + '{% trans 'Sunday' %}', + '{% trans 'Monday' %}', + '{% trans 'Tuesday' %}', + '{% trans 'Wednesday' %}', + '{% trans 'Thursday' %}', + '{% trans 'Friday' %}', + '{% trans 'Saturday' %}', + ]; + $.datepicker.regional[''].dayNamesShort = [ + '{% trans %}Sun{% notes %}Short week day name for Sunday{% endtrans %}', + '{% trans %}Mon{% notes %}Short week day name for Monday{% endtrans %}', + '{% trans %}Tue{% notes %}Short week day name for Tuesday{% endtrans %}', + '{% trans %}Wed{% notes %}Short week day name for Wednesday{% endtrans %}', + '{% trans %}Thu{% notes %}Short week day name for Thursday{% endtrans %}', + '{% trans %}Fri{% notes %}Short week day name for Friday{% endtrans %}', + '{% trans %}Sat{% notes %}Short week day name for Saturday{% endtrans %}', + ]; + $.datepicker.regional[''].dayNamesMin = [ + '{% trans %}Su{% notes %}Minimal week day name for Sunday{% endtrans %}', + '{% trans %}Mo{% notes %}Minimal week day name for Monday{% endtrans %}', + '{% trans %}Tu{% notes %}Minimal week day name for Tuesday{% endtrans %}', + '{% trans %}We{% notes %}Minimal week day name for Wednesday{% endtrans %}', + '{% trans %}Th{% notes %}Minimal week day name for Thursday{% endtrans %}', + '{% trans %}Fr{% notes %}Minimal week day name for Friday{% endtrans %}', + '{% trans %}Sa{% notes %}Minimal week day name for Saturday{% endtrans %}', + ]; + $.datepicker.regional[''].weekHeader = '{% trans %}Wk{% notes %}Column header for week of the year in calendar{% endtrans %}'; + $.datepicker.regional[''].showMonthAfterYear = {{ show_month_after_year == 'calendar-year-month' ? 'true' : 'false' }}; + $.datepicker.regional[''].yearSuffix = '{{ year_suffix != 'none' ? year_suffix }}'; + $.extend($.datepicker._defaults, $.datepicker.regional['']); +} + +if ($.timepicker) { + $.timepicker.regional[''].timeText = '{% trans 'Time' %}'; + $.timepicker.regional[''].hourText = '{% trans 'Hour' %}'; + $.timepicker.regional[''].minuteText = '{% trans 'Minute' %}'; + $.timepicker.regional[''].secondText = '{% trans 'Second' %}'; + $.extend($.timepicker._defaults, $.timepicker.regional['']); +} + +function extendingValidatorMessages () { + $.extend($.validator.messages, { + required: '{% trans 'This field is required' %}', + remote: '{% trans 'Please fix this field' %}', + email: '{% trans 'Please enter a valid email address' %}', + url: '{% trans 'Please enter a valid URL' %}', + date: '{% trans 'Please enter a valid date' %}', + dateISO: '{% trans 'Please enter a valid date ( ISO )' %}', + number: '{% trans 'Please enter a valid number' %}', + creditcard: '{% trans 'Please enter a valid credit card number' %}', + digits: '{% trans 'Please enter only digits' %}', + equalTo: '{% trans 'Please enter the same value again' %}', + maxlength: $.validator.format('{% trans 'Please enter no more than {0} characters' %}'), + minlength: $.validator.format('{% trans 'Please enter at least {0} characters' %}'), + rangelength: $.validator.format('{% trans 'Please enter a value between {0} and {1} characters long' %}'), + range: $.validator.format('{% trans 'Please enter a value between {0} and {1}' %}'), + max: $.validator.format('{% trans 'Please enter a value less than or equal to {0}' %}'), + min: $.validator.format('{% trans 'Please enter a value greater than or equal to {0}' %}'), + validationFunctionForDateTime: $.validator.format('{% trans 'Please enter a valid date or time' %}'), + validationFunctionForHex: $.validator.format('{% trans 'Please enter a valid HEX input' %}'), + validationFunctionForFuns: $.validator.format('{% trans 'Error' %}') + }); +} +{% endautoescape %}