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

24 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>
settings: Fix simplebar scrollbar in org settings dropdown. This commit fixes the dropdown_list_widget to use simplebar for scrolling. It was not being used because data-simplebar should not be inserted to the element being rerendered. This commit adds a new element wrapping 'dropdown-list-body' which was being rerendered and data-simplebar is added to that new element 'dropdown-list-wrapper'. Also, there should always be a max-height property on data-simplebar element and it is also added in this commit. There is also a change to set margin of 10px only on the first div element and which is direct children of organization-settings-parent element. This is correct because we only want margin to add some space between the heading of subsection and the first setting of that subsection. Previously, the margin was being added to first div of all the other child containers also and this was adding unnecessary margin to the first div element of different simplebar containers.
2020-07-11 17:18:50 +02:00
<div class="dropdown-list-wrapper" data-simplebar>
<span class="dropdown-list-body"></span>
</div>
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
</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>