paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-03 21:43:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

settings_display: Refactor code to use a single handler.

Browse Source 
This commit refactors the display settings code to use
a single handler similar to what we do in notification
settings. We still keep default language and emojiset
setting as they are handled differently and they do
not call 'change_display_setting' directly on changing
input.

We refactor the 'change_display_setting' to directly
accept status element as parameter and not class as
a string. We also add a common class to the subsection
div such that we can get status element for each of
them easily.
This commit is contained in:
Sahil Batra
2021-10-08 23:33:38 +05:30
committed by Tim Abbott
parent 78da9d21f3
commit 38cf2d07a6
2 changed files with 29 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
static/js/settings_display.js
View File

@@ -5,7 +5,7 @@ import * as emojisets from "./emojisets";
import {$t_html, get_language_name} from "./i18n";
import * as loading from "./loading";
import * as overlays from "./overlays";
import * as settings_config from "./settings_config";
import * as settings_org from "./settings_org";
import * as settings_ui from "./settings_ui";
import * as ui_report from "./ui_report";
import {user_settings} from "./user_settings";
@@ -22,8 +22,7 @@ export function set_default_language_name(name) {
user_default_language_name = name;
}
function change_display_setting(data, status_element, success_msg_html, sticky) {
const $status_el = $("#user-display-settings").find(`${status_element}`);
function change_display_setting(data, $status_el, success_msg_html, sticky) {
const status_is_sticky = $status_el.data("is_sticky");
const display_message_html = status_is_sticky
? $status_el.data("sticky_msg_html")
@@ -74,30 +73,30 @@ export function set_up(settings_panel) {
// Common handler for sending requests to the server when an input
// element is changed.
const all_display_settings = settings_config.get_all_display_settings();
for (const setting of all_display_settings.settings.user_display_settings) {
container.find(`.${CSS.escape(setting)}`).on("change", function () {
const data = {};
data[setting] = JSON.stringify($(this).prop("checked"));
container.on("change", "input[type=checkbox], select", function (e) {
const input_elem = $(e.currentTarget);
const setting = input_elem.attr("name");
const data = {};
data[setting] = settings_org.get_input_element_value(this);
const status_element = input_elem.closest(".subsection-parent").find(".alert-notification");
if (["left_side_userlist"].includes(setting)) {
change_display_setting(
data,
".display-settings-status",
$t_html(
{
defaultMessage:
"Saved. Please <z-link>reload</z-link> for the change to take effect.",
},
{"z-link": (content_html) => `<a class='reload_link'>${content_html}</a>`},
),
true,
);
} else {
change_display_setting(data, ".display-settings-status");
}
});
}
if (["left_side_userlist"].includes(setting)) {
change_display_setting(
data,
status_element,
$t_html(
{
defaultMessage:
"Saved. Please <z-link>reload</z-link> for the change to take effect.",
},
{"z-link": (content_html) => `<a class='reload_link'>${content_html}</a>`},
),
true,
);
} else {
change_display_setting(data, status_element);
}
});
$("#user_default_language_modal")
.find(".language")
@@ -115,7 +114,7 @@ export function set_up(settings_panel) {
change_display_setting(
data,
".language-settings-status",
container.find(".language-settings-status"),
$t_html(
{
defaultMessage:
@@ -133,26 +132,6 @@ export function set_up(settings_panel) {
overlays.open_modal("#user_default_language_modal");
});
container.find(".setting_twenty_four_hour_time").on("change", function () {
const data = {twenty_four_hour_time: this.value};
change_display_setting(data, ".time-settings-status");
});
container.find(".setting_demote_inactive_streams").on("change", function () {
const data = {demote_inactive_streams: this.value};
change_display_setting(data, ".display-settings-status");
});
container.find(".setting_color_scheme").on("change", function () {
const data = {color_scheme: this.value};
change_display_setting(data, ".display-settings-status");
});
container.find(".setting_default_view").on("change", function () {
const data = {default_view: this.value};
change_display_setting(data, ".display-settings-status");
});
$("body").on("click", ".reload_link", () => {
window.location.reload();
});
@@ -179,11 +158,6 @@ export function set_up(settings_panel) {
},
});
});
container.find(".translate_emoticons").on("change", function () {
const data = {translate_emoticons: JSON.stringify(this.checked)};
change_display_setting(data, ".emoji-settings-status");
});
}
export async function report_emojiset_change(settings_panel) {

6
static/templates/settings/display_settings.hbs
View File

@@ -20,7 +20,7 @@
</div>
{{/unless}}
<div class="display-settings {{#if for_realm_settings}}org-subsection-parent{{/if}}">
<div class="display-settings {{#if for_realm_settings}}org-subsection-parent{{else}}subsection-parent{{/if}}">
<div class="subsection-header">
<h3>{{t "Display settings" }}</h3>
{{> settings_save_discard_widget section_name="display-settings" show_only_indicator=(not for_realm_settings) }}
@@ -62,7 +62,7 @@
</div>
</div>
<div class="time-settings {{#if for_realm_settings}}org-subsection-parent{{/if}}">
<div class="time-settings {{#if for_realm_settings}}org-subsection-parent{{else}}subsection-parent{{/if}}">
<div class="subsection-header">
<h3>{{t "Time settings" }}</h3>
{{> settings_save_discard_widget section_name="time-settings" show_only_indicator=(not for_realm_settings) }}
@@ -78,7 +78,7 @@
</div>
</div>
<div class="emoji-settings {{#if for_realm_settings}}org-subsection-parent{{/if}}">
<div class="emoji-settings {{#if for_realm_settings}}org-subsection-parent{{else}}subsection-parent{{/if}}">
<div class="subsection-header">
<h3 class="light">{{t "Emoji settings" }}</h3>
{{> settings_save_discard_widget section_name="emoji-settings" show_only_indicator=(not for_realm_settings) }}