Mirror
/
zulip
mirror of https://github.com/zulip/zulip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
zulip/static/templates/settings/dropdown_list_widget.hbs

22 lines
1.1 KiB
Handlebars
Raw Normal View History

dropdown-list-widget: Rename setting_name -> widget_name. This change is another in a series of commits that allows us to use DLW outside of realm_settings.
2020-05-18 23:08:30 +02:00
<div class="input-group dropdown-list-widget" id="{{widget_name}}_widget">
<label for="{{widget_name}}" id="{{widget_name}}_label" class="inline-block">
settings: Extract DropdownListWidget from default_code_language_widget. We extract a general purpose widget to create dropdown lists with search. This widget is used for default code block language, but can be easily extended to cover notifications_stream and similar options. The current usage is: ```js const widget = DropdownListWidget({ setting_name: 'realm_alpha_beta', data: [{name: 'hello', value: 'world'}, {...}, ...], subsection: 'msg-editing', default_text: 'Nothing is selected', }); ``` and ```handlebars {{> dropdown_list_widget setting_name="realm_alpha_beta" list_placeholder=(t 'Filter the data') reset_button_text=(t '[Unset]') label=admin_settings_label.realm_alpha_beta }} ``` This can further be refined by shifting more variables from handlebars to javascript in the future.
2020-04-10 06:30:14 +02:00
{{ label }}
dropdown-list-widget: Rename setting_name -> widget_name. This change is another in a series of commits that allows us to use DLW outside of realm_settings.
2020-05-18 23:08:30 +02:00
<span class="{{widget_name}}_setting dropup actual-dropdown-menu prop-element" id="id_{{widget_name}}"
name="{{widget_name}}" aria-labelledby="{{widget_name}}_label">
settings: Extract DropdownListWidget from default_code_language_widget. We extract a general purpose widget to create dropdown lists with search. This widget is used for default code block language, but can be easily extended to cover notifications_stream and similar options. The current usage is: ```js const widget = DropdownListWidget({ setting_name: 'realm_alpha_beta', data: [{name: 'hello', value: 'world'}, {...}, ...], subsection: 'msg-editing', default_text: 'Nothing is selected', }); ``` and ```handlebars {{> dropdown_list_widget setting_name="realm_alpha_beta" list_placeholder=(t 'Filter the data') reset_button_text=(t '[Unset]') label=admin_settings_label.realm_alpha_beta }} ``` This can further be refined by shifting more variables from handlebars to javascript in the future.
2020-04-10 06:30:14 +02:00
<button class="button small rounded dropdown-toggle" data-toggle="dropdown">
dropdown-list-widget: Rename setting_name -> widget_name. This change is another in a series of commits that allows us to use DLW outside of realm_settings.
2020-05-18 23:08:30 +02:00
<span id="{{widget_name}}_name"></span>
settings: Extract DropdownListWidget from default_code_language_widget. We extract a general purpose widget to create dropdown lists with search. This widget is used for default code block language, but can be easily extended to cover notifications_stream and similar options. The current usage is: ```js const widget = DropdownListWidget({ setting_name: 'realm_alpha_beta', data: [{name: 'hello', value: 'world'}, {...}, ...], subsection: 'msg-editing', default_text: 'Nothing is selected', }); ``` and ```handlebars {{> dropdown_list_widget setting_name="realm_alpha_beta" list_placeholder=(t 'Filter the data') reset_button_text=(t '[Unset]') label=admin_settings_label.realm_alpha_beta }} ``` This can further be refined by shifting more variables from handlebars to javascript in the future.
2020-04-10 06:30:14 +02:00
<i class="fa fa-pencil"></i>
</button>
<ul class="dropdown-menu modal-bg" role="menu">
<li class="dropdown-search" role="presentation">
<input class="no-input-change-detection" type="text" role="menuitem" placeholder="{{list_placeholder}}" autofocus/>
</li>
<span class="dropdown-list-body" data-simplebar></span>
</ul>
</span>
</label>
dropdown-list-widget: Properly handle disabled state. We wrap the [reset] anchor tag in a button so that we can set 'disabled' attribute on it. We change the styles to hide the [reset] button and the pencil icon when the widget is disabled. We also need to call `e.preventDefault()` in the event handler since now the anchor tag behaves as a button.
2020-05-19 07:01:53 +02:00
<button class="button small dropdown_list_reset_button">
<a>{{reset_button_text}}</a>
</button>
settings: Extract DropdownListWidget from default_code_language_widget. We extract a general purpose widget to create dropdown lists with search. This widget is used for default code block language, but can be easily extended to cover notifications_stream and similar options. The current usage is: ```js const widget = DropdownListWidget({ setting_name: 'realm_alpha_beta', data: [{name: 'hello', value: 'world'}, {...}, ...], subsection: 'msg-editing', default_text: 'Nothing is selected', }); ``` and ```handlebars {{> dropdown_list_widget setting_name="realm_alpha_beta" list_placeholder=(t 'Filter the data') reset_button_text=(t '[Unset]') label=admin_settings_label.realm_alpha_beta }} ``` This can further be refined by shifting more variables from handlebars to javascript in the future.
2020-04-10 06:30:14 +02:00
</div>