Перейти к содержимому

Изменения документа AdminLocalizationSheet

Редактировал(а) Dmitriy Rybakov 04.10.2024, 00:09
От версии 3.1
отредактировано Dmitriy Rybakov
на 04.10.2024, 00:09
Изменить комментарий: Install extension [org.xwiki.platform:xwiki-platform-administration-ui/15.10.12]
К версии 1.1
отредактировано Admin xWiKi
на 15.10.2019, 13:19
Изменить комментарий: Install extension [org.xwiki.platform:xwiki-platform-administration-ui/11.8.1]

Сводка

Подробности

Свойства страницы
Автор документа
... ... @@ -1,1 +1,1 @@
1 -XWiki.rybakovds
1 +XWiki.admin
XWiki.ConfigurableClass[0]
Отображать в категории
... ... @@ -1,1 +1,0 @@
1 -content
Отображать в разделе
... ... @@ -1,1 +1,0 @@
1 -Localization
Область видимости
... ... @@ -1,1 +1,0 @@
1 -WIKI
Позиция раздела
... ... @@ -1,1 +1,0 @@
1 -200
XWiki.JavaScriptExtension[0]
Код
... ... @@ -1,36 +1,156 @@
1 -define('xwiki-administration-localization', {
2 - prefix: 'XWiki.',
3 - keys: [
4 - 'XWikiPreferences_languages'
5 - ]
1 +/**
2 + * Add a dependency to the "bootstrap-select" plugin, used to display a nice select field that handle
3 + * multiple selection.
4 + */
5 +require.config({
6 + paths: {
7 + 'bootstrap-select': '$services.webjars.url("bootstrap-select", "js/bootstrap-select.min")'
8 + },
9 + shim: {
10 + 'bootstrap-select' : ['jquery', 'bootstrap']
11 + }
6 6  });
7 7  /**
8 8   * Replace the simple text input field for supported locales by a nicer select widget with all available locales
9 9   * ready to be selected.
10 10   *
11 - * Instead of dynamically replace the text input field on the client-side, we could have done on the server-side, by
12 - * using a custom displayer. However, it's a pain to upgrade the XWiki.XWikiPreferences class to add a displayer. The
13 - * class is not even packaged by the administration application.
17 + * Instead of dynamically replace the text input field on the client-side, we could have done on the server-side,
18 + * by using a custom displayer.
19 + * However, it's a pain to upgrade the XWiki.XWikiPreferences class to add a displayer.
20 + * The class is not even packaged by the administration application.
14 14   *
15 15   * We also enable the improved select widget on the "timezone" field to make the user able to filter the choices.
16 16   */
17 -require(['jquery', 'xwiki-l10n!xwiki-administration-localization', 'xwiki-locale-picker'], function($, l10n) {
24 +require(['jquery','bootstrap','bootstrap-select'], function($) {
18 18   'use strict';
19 19  
20 - $('input[name="XWiki.XWikiPreferences_0_languages"]').localePicker({
21 - allowEmpty: false,
22 - multiple: true,
23 - label: l10n.get('XWikiPreferences_languages'),
24 - hint: true
25 - });
27 + var locales = [
28 +#set ($separator = '')
29 +#set ($currentLocale = $services.localization.currentLocale)
30 +#set ($locales = $services.localization.availableLocales)
31 +#foreach ($locale in $sorttool.sort($locales, 'displayName'))
32 + #if ("$!locale" != '')
33 + $separator
34 + { code: '$locale', name: '$escapetool.xml($stringtool.capitalize($locale.getDisplayName($locale))) <small class="text-muted">($stringtool.capitalize($locale.getDisplayName($currentLocale)))</small>'}##
35 + #set ($separator = ',')
36 + #end
37 +#end
38 + ];
26 26  
27 - $('input[name="XWiki.XWikiPreferences_0_default_language"]').localePicker({
28 - allowEmpty: false
29 - });
40 + /**
41 + * Get the initial values of the input
42 + * @return an array of locales codes
43 + */
44 + var getLocalesFromInput = function (input) {
45 + var locales = input.val().split(/,| /);
46 + var results = [];
47 + for (var i = 0; i < locales.length; ++i) {
48 + if (locales[i].trim() != '') {
49 + results[results.length] = locales[i].trim();
50 + }
51 + }
52 + return results;
53 + }
30 30  
31 - // Use the Bootstrap select widget for the other select elements in order to have a consistent UI.
32 - $([
33 - 'select[name="XWiki.XWikiPreferences_0_multilingual"]',
34 - 'select[name="XWiki.XWikiPreferences_0_timezone"]'
35 - ].join()).bootstrapSelect();
55 + /**
56 + * Serialize an array of locales to a string that the XWiki server can handle
57 + */
58 + var serializeArray = function (array) {
59 + // bootstrap-select returns null when nothing is selected.
60 + array = array || [];
61 + var result = '';
62 + var separator = '';
63 + for (var i = 0; i < array.length; ++i) {
64 + if (array[i] != '') {
65 + result += separator;
66 + result += array[i];
67 + separator = ',';
68 + }
69 + }
70 + return result;
71 + }
72 +
73 + /**
74 + * Initialization
75 + */
76 + $(document).ready(function() {
77 +
78 + /**
79 + * Enable the bootstrap-select plugin to have a nicer UI.
80 + */
81 + var enableSelectPicker = function (select) {
82 + // Force 100% width on the select using the form-control CSS class.
83 + select.addClass('form-control').selectpicker({
84 + // Enable the filtering on choices if there is a lot of choices
85 + liveSearch: select.find('option').length > 10
86 + });
87 + }
88 +
89 + //
90 + // Adding the CSS of the boostrap-select plugin
91 + //
92 + var css = $('<link rel="stylesheet" href="$services.webjars.url("bootstrap-select", "css/bootstrap-select.min.css")">');
93 + $('head').append(css);
94 +
95 + // Getting the original input
96 + var localesInput = $('input[name="XWiki.XWikiPreferences_0_languages"]');
97 +
98 + // Creating the select box
99 + var select = $('<select multiple>');
100 +
101 + // Add all available options
102 + var currentLocales = getLocalesFromInput(localesInput);
103 + for (var i = 0; i < locales.length; ++i) {
104 + var option = $('<option>');
105 + option.prop('value', locales[i].code);
106 + option.html(locales[i].name);
107 + if ($.inArray(locales[i].code, currentLocales) > -1) {
108 + option.prop('selected', 'selected');
109 + }
110 + select.append(option);
111 + }
112 +
113 + // Problem: when we save the document, XWiki expects 'XWiki.XWikiPreferences_0_languages' to be a simple text,
114 + // not a "select" field with different values.
115 + // So we keep the old input field as an hidden input which will hold the serialized representation of the
116 + // selected locales.
117 + localesInput.prop('type', 'hidden');
118 +
119 + // Adds the new select widget in the DOM
120 + select.insertAfter(localesInput);
121 +
122 + // Enable the select picker
123 + enableSelectPicker(select);
124 +
125 + // Synchronize the value of the hidden input text with the selected item in the select widget.
126 + select.on('changed.bs.select', function (event) {
127 + localesInput.prop('value', serializeArray(select.val()));
128 + });
129 +
130 + // We can also do it for the "default locale" field.
131 + var defaultLocaleInput = $('input[name="XWiki.XWikiPreferences_0_default_language"]');
132 + var select2 = $('<select>');
133 + select2.prop('name', defaultLocaleInput.prop('name'));
134 + select2.prop('id', defaultLocaleInput.prop('id'));
135 + for (var i = 0; i < locales.length; ++i) {
136 + var option = $('<option>');
137 + option.prop('value', locales[i].code);
138 + option.html(locales[i].name);
139 + if (defaultLocaleInput.val() == locales[i].code) {
140 + option.prop('selected', 'selected');
141 + }
142 + select2.append(option);
143 + }
144 + defaultLocaleInput.replaceWith(select2);
145 +
146 + // Enable bootstrap-select on the "timezone" field
147 + enableSelectPicker($('select[name="XWiki.XWikiPreferences_0_timezone"]'));
148 +
149 + // Enable it on the default locale field too
150 + enableSelectPicker($('select[name="XWiki.XWikiPreferences_0_default_language"]'));
151 +
152 + // Enable it on the last select field to be consistent
153 + enableSelectPicker($('select[name="XWiki.XWikiPreferences_0_multilingual"]'));
154 + });
36 36  });
156 +
Разбор содержимого
... ... @@ -1,1 +1,1 @@
1 -Нет
1 +Да
XWiki.StyleSheetExtension[0]
Код
... ... @@ -1,6 +1,4 @@
1 -/* Do not display the supported language field (we assume it's the following one)
2 - when the multilingual option is set to No. */
3 -form#localization dd:has(> div.dropdown > select[name="XWiki.XWikiPreferences_0_multilingual"] > option[value="0"]:checked) + dt,
4 -form#localization dd:has(> div.dropdown > select[name="XWiki.XWikiPreferences_0_multilingual"] > option[value="0"]:checked) + dt + dd {
5 - display: none;
1 +.bootstrap-select.btn-group .dropdown-menu li.active small.text-muted {
2 + color: inherit;
6 6  }
4 +