settings: Rename classes for display settings elements.

We rename the class of display setting elements by prefixing
them with 'setting_' for clarity.
This commit is contained in:
Sahil Batra
2021-08-10 13:05:20 +05:30
committed by Tim Abbott
parent 9c17e7019d
commit d05730a199
4 changed files with 28 additions and 28 deletions

View File

@@ -299,8 +299,8 @@ async function test_alert_words_section(page: Page): Promise<void> {
} }
async function change_language(page: Page, language_data_code: string): Promise<void> { async function change_language(page: Page, language_data_code: string): Promise<void> {
await page.waitForSelector("#user-display-settings .default_language", {visible: true}); await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true});
await page.click("#user-display-settings .default_language"); await page.click("#user-display-settings .setting_default_language");
await page.waitForSelector("#user_default_language_modal", {visible: true}); await page.waitForSelector("#user_default_language_modal", {visible: true});
const language_selector = `a[data-code="${CSS.escape(language_data_code)}"]`; const language_selector = `a[data-code="${CSS.escape(language_data_code)}"]`;
await page.click(language_selector); await page.click(language_selector);
@@ -313,10 +313,10 @@ async function check_language_setting_status(page: Page): Promise<void> {
} }
async function assert_language_changed_to_chinese(page: Page): Promise<void> { async function assert_language_changed_to_chinese(page: Page): Promise<void> {
await page.waitForSelector("#user-display-settings .default_language", {visible: true}); await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true});
const default_language = await common.get_text_from_selector( const default_language = await common.get_text_from_selector(
page, page,
"#user-display-settings .default_language", "#user-display-settings .setting_default_language",
); );
assert.strictEqual( assert.strictEqual(
default_language, default_language,
@@ -342,7 +342,7 @@ async function test_default_language_setting(page: Page): Promise<void> {
// Check that the saved indicator appears // Check that the saved indicator appears
await check_language_setting_status(page); await check_language_setting_status(page);
await page.click(".reload_link"); await page.click(".reload_link");
await page.waitForSelector("#user-display-settings .default_language", {visible: true}); await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true});
await assert_language_changed_to_chinese(page); await assert_language_changed_to_chinese(page);
await test_i18n_language_precedence(page); await test_i18n_language_precedence(page);
await page.waitForSelector(display_settings_section, {visible: true}); await page.waitForSelector(display_settings_section, {visible: true});
@@ -357,7 +357,7 @@ async function test_default_language_setting(page: Page): Promise<void> {
await page.waitForSelector(display_settings_section, {visible: true}); await page.waitForSelector(display_settings_section, {visible: true});
await page.click(display_settings_section); await page.click(display_settings_section);
await page.waitForSelector("#user-display-settings .language-settings-status", {visible: true}); await page.waitForSelector("#user-display-settings .language-settings-status", {visible: true});
await page.waitForSelector("#user-display-settings .default_language", {visible: true}); await page.waitForSelector("#user-display-settings .setting_default_language", {visible: true});
} }
async function test_notifications_section(page: Page): Promise<void> { async function test_notifications_section(page: Page): Promise<void> {

View File

@@ -46,18 +46,18 @@ export function set_up() {
container.find(".display-settings-status").hide(); container.find(".display-settings-status").hide();
container.find(".demote_inactive_streams").val(user_settings.demote_inactive_streams); container.find(".setting_demote_inactive_streams").val(user_settings.demote_inactive_streams);
container.find(".color_scheme").val(user_settings.color_scheme); container.find(".setting_color_scheme").val(user_settings.color_scheme);
container.find(".default_view").val(user_settings.default_view); container.find(".setting_default_view").val(user_settings.default_view);
container container
.find(".twenty_four_hour_time") .find(".setting_twenty_four_hour_time")
.val(JSON.stringify(user_settings.twenty_four_hour_time)); .val(JSON.stringify(user_settings.twenty_four_hour_time));
container container
.find(`.emojiset_choice[value="${CSS.escape(user_settings.emojiset)}"]`) .find(`.setting_emojiset_choice[value="${CSS.escape(user_settings.emojiset)}"]`)
.prop("checked", true); .prop("checked", true);
$(`${CSS.escape(language_modal_elem)} [data-dismiss]`).on("click", () => { $(`${CSS.escape(language_modal_elem)} [data-dismiss]`).on("click", () => {
@@ -121,23 +121,23 @@ export function set_up() {
); );
}); });
container.find(".default_language").on("click", (e) => { container.find(".setting_default_language").on("click", (e) => {
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
overlays.open_modal(language_modal_elem); overlays.open_modal(language_modal_elem);
}); });
container.find(".demote_inactive_streams").on("change", function () { container.find(".setting_demote_inactive_streams").on("change", function () {
const data = {demote_inactive_streams: this.value}; const data = {demote_inactive_streams: this.value};
change_display_setting(data, container, patch_url, ".display-settings-status"); change_display_setting(data, container, patch_url, ".display-settings-status");
}); });
container.find(".color_scheme").on("change", function () { container.find(".setting_color_scheme").on("change", function () {
const data = {color_scheme: this.value}; const data = {color_scheme: this.value};
change_display_setting(data, container, patch_url, ".display-settings-status"); change_display_setting(data, container, patch_url, ".display-settings-status");
}); });
container.find(".default_view").on("change", function () { container.find(".setting_default_view").on("change", function () {
const data = {default_view: this.value}; const data = {default_view: this.value};
change_display_setting(data, container, patch_url, ".display-settings-status"); change_display_setting(data, container, patch_url, ".display-settings-status");
}); });
@@ -146,12 +146,12 @@ export function set_up() {
window.location.reload(); window.location.reload();
}); });
container.find(".twenty_four_hour_time").on("change", function () { container.find(".setting_twenty_four_hour_time").on("change", function () {
const data = {twenty_four_hour_time: this.value}; const data = {twenty_four_hour_time: this.value};
change_display_setting(data, container, patch_url, ".time-settings-status"); change_display_setting(data, container, patch_url, ".time-settings-status");
}); });
container.find(".emojiset_choice").on("click", function () { container.find(".setting_emojiset_choice").on("click", function () {
const data = {emojiset: $(this).val()}; const data = {emojiset: $(this).val()};
const current_emojiset = user_settings.emojiset; const current_emojiset = user_settings.emojiset;
if (current_emojiset === data.emojiset) { if (current_emojiset === data.emojiset) {
@@ -208,10 +208,10 @@ export function update_page() {
container.find(".default_language_name").text(default_language_name); container.find(".default_language_name").text(default_language_name);
container.find(".translate_emoticons").prop("checked", user_settings.translate_emoticons); container.find(".translate_emoticons").prop("checked", user_settings.translate_emoticons);
container container
.find(".twenty_four_hour_time") .find(".setting_twenty_four_hour_time")
.val(JSON.stringify(user_settings.twenty_four_hour_time)); .val(JSON.stringify(user_settings.twenty_four_hour_time));
container.find(".color_scheme").val(JSON.stringify(user_settings.color_scheme)); container.find(".setting_color_scheme").val(JSON.stringify(user_settings.color_scheme));
container.find(".default_view").val(user_settings.default_view); container.find(".setting_default_view").val(user_settings.default_view);
// TODO: Set emojiset selector here. // TODO: Set emojiset selector here.
// Longer term, we'll want to automate this function // Longer term, we'll want to automate this function

View File

@@ -338,7 +338,7 @@ td .button {
display: inline-block; display: inline-block;
} }
#user-display-settings .default_language { #user-display-settings .setting_default_language {
text-decoration: none; text-decoration: none;
} }
@@ -485,7 +485,7 @@ input[type="checkbox"] {
margin-top: 10px; margin-top: 10px;
} }
#user-display-settings .default_language { #user-display-settings .setting_default_language {
margin-left: 20px; margin-left: 20px;
} }

View File

@@ -7,7 +7,7 @@
<div class="input-group"> <div class="input-group">
<label class="inline-block title">{{t "Default language" }}</label> <label class="inline-block title">{{t "Default language" }}</label>
<button type="button" class="default_language button btn-link rounded small inline-block"> <button type="button" class="setting_default_language button btn-link rounded small inline-block">
<span class="default_language_name">{{default_language_name}}</span> <span class="default_language_name">{{default_language_name}}</span>
<i class="fa fa-pencil"></i> <i class="fa fa-pencil"></i>
</button> </button>
@@ -24,7 +24,7 @@
<label for="default_view" class="dropdown-title">{{t "Default view" }} <label for="default_view" class="dropdown-title">{{t "Default view" }}
{{> ../help_link_widget link="/help/change-default-view" }} {{> ../help_link_widget link="/help/change-default-view" }}
</label> </label>
<select name="default_view" class="default_view"> <select name="default_view" class="setting_default_view">
{{> dropdown_options_widget option_values=default_view_values}} {{> dropdown_options_widget option_values=default_view_values}}
</select> </select>
</div> </div>
@@ -32,7 +32,7 @@
<div class="input-group"> <div class="input-group">
<label for="color_scheme" class="dropdown-title">{{t "Color scheme" }} <label for="color_scheme" class="dropdown-title">{{t "Color scheme" }}
</label> </label>
<select name="color_scheme" class="color_scheme"> <select name="color_scheme" class="setting_color_scheme">
{{> dropdown_options_widget option_values=color_scheme_values}} {{> dropdown_options_widget option_values=color_scheme_values}}
</select> </select>
</div> </div>
@@ -50,7 +50,7 @@
<label for="demote_inactive_streams" class="dropdown-title">{{t "Demote inactive streams" }} <label for="demote_inactive_streams" class="dropdown-title">{{t "Demote inactive streams" }}
{{> ../help_link_widget link="/help/manage-inactive-streams" }} {{> ../help_link_widget link="/help/manage-inactive-streams" }}
</label> </label>
<select name="demote_inactive_streams" class="demote_inactive_streams"> <select name="demote_inactive_streams" class="setting_demote_inactive_streams">
{{> dropdown_options_widget option_values=demote_inactive_streams_values}} {{> dropdown_options_widget option_values=demote_inactive_streams_values}}
</select> </select>
</div> </div>
@@ -62,7 +62,7 @@
<div class="input-group"> <div class="input-group">
<label for="twenty_four_hour_time" class="dropdown-title">{{ settings_label.twenty_four_hour_time }}</label> <label for="twenty_four_hour_time" class="dropdown-title">{{ settings_label.twenty_four_hour_time }}</label>
<select name="twenty_four_hour_time" class="twenty_four_hour_time"> <select name="twenty_four_hour_time" class="setting_twenty_four_hour_time">
{{#each twenty_four_hour_time_values}} {{#each twenty_four_hour_time_values}}
<option value='{{ this.value }}'>{{ this.description }}</option> <option value='{{ this.value }}'>{{ this.description }}</option>
{{/each}} {{/each}}
@@ -78,7 +78,7 @@
<div class="emojiset_choices grey-box"> <div class="emojiset_choices grey-box">
{{#each user_settings.emojiset_choices}} {{#each user_settings.emojiset_choices}}
<label> <label>
<input type="radio" class="emojiset_choice" name="emojiset_group" value="{{this.key}}" /> <input type="radio" class="setting_emojiset_choice" name="emojiset_group" value="{{this.key}}" />
<span>{{this.text}}</span> <span>{{this.text}}</span>
<span class="right"> <span class="right">
{{#if (eq this.key "text") }} {{#if (eq this.key "text") }}