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

theme: Change recipient bar color and theme in the same paint.

Browse Source 
`update_recipient_bar_background_color` changes in a paint
after change in theme without using `requestAnimationFrame` to
make sure they happen in the same paint..

Replaced `setTimeout` with `requestAnimationFrame` in
`server_events_dispatch` since `requestAnimationFrame` already
ensures that they happen in the next paint, assuming that was the
intention of `setTimeout` being preset there.
This commit is contained in:
Aman Agrawal
2023-07-02 12:36:30 +00:00
committed by Tim Abbott
parent 1c8bf4f050
commit d547b838ac
4 changed files with 19 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
web/src/click_handlers.js
View File

@@ -847,15 +847,19 @@ export function initialize() {
$("body").on("click", "#gear-menu .dark-theme", (e) => { $("body").on("click", "#gear-menu .dark-theme", (e) => {
// Allow propagation to close gear menu. // Allow propagation to close gear menu.
e.preventDefault(); e.preventDefault();
dark_theme.enable(); requestAnimationFrame(() => {
message_lists.update_recipient_bar_background_color(); dark_theme.enable();
message_lists.update_recipient_bar_background_color();
});
}); });
$("body").on("click", "#gear-menu .light-theme", (e) => { $("body").on("click", "#gear-menu .light-theme", (e) => {
// Allow propagation to close gear menu. // Allow propagation to close gear menu.
e.preventDefault(); e.preventDefault();
dark_theme.disable(); requestAnimationFrame(() => {
message_lists.update_recipient_bar_background_color(); dark_theme.disable();
message_lists.update_recipient_bar_background_color();
});
}); });
$("body").on("click", "#header-container .brand", (e) => { $("body").on("click", "#header-container .brand", (e) => {

4
web/src/server_events_dispatch.js
View File

@@ -746,7 +746,7 @@ export function dispatch_normal_event(event) {
unread_ui.update_unread_banner(); unread_ui.update_unread_banner();
} }
if (event.property === "color_scheme") { if (event.property === "color_scheme") {
setTimeout(() => { requestAnimationFrame(() => {
if (event.value === settings_config.color_scheme_values.night.code) { if (event.value === settings_config.color_scheme_values.night.code) {
dark_theme.enable(); dark_theme.enable();
realm_logo.render(); realm_logo.render();
@@ -758,7 +758,7 @@ export function dispatch_normal_event(event) {
realm_logo.render(); realm_logo.render();
} }
message_lists.update_recipient_bar_background_color(); message_lists.update_recipient_bar_background_color();
}, 300); });
} }
if (event.property === "starred_message_counts") { if (event.property === "starred_message_counts") {
starred_messages_ui.rerender_ui(); starred_messages_ui.rerender_ui();

12
web/src/zcommand.js
View File

@@ -61,8 +61,10 @@ export function switch_to_light_theme() {
send({ send({
command: "/day", command: "/day",
on_success(data) { on_success(data) {
dark_theme.disable(); requestAnimationFrame(() => {
message_lists.update_recipient_bar_background_color(); dark_theme.disable();
message_lists.update_recipient_bar_background_color();
});
feedback_widget.show({ feedback_widget.show({
populate($container) { populate($container) {
const rendered_msg = markdown.parse_non_message(data.msg); const rendered_msg = markdown.parse_non_message(data.msg);
@@ -84,8 +86,10 @@ export function switch_to_dark_theme() {
send({ send({
command: "/night", command: "/night",
on_success(data) { on_success(data) {
dark_theme.enable(); requestAnimationFrame(() => {
message_lists.update_recipient_bar_background_color(); dark_theme.enable();
message_lists.update_recipient_bar_background_color();
});
feedback_widget.show({ feedback_widget.show({
populate($container) { populate($container) {
const rendered_msg = markdown.parse_non_message(data.msg); const rendered_msg = markdown.parse_non_message(data.msg);

2
web/tests/dispatch.test.js
View File

@@ -17,7 +17,7 @@ const test_message = events.test_message;
const test_user = events.test_user; const test_user = events.test_user;
const typing_person1 = events.typing_person1; const typing_person1 = events.typing_person1;
set_global("setTimeout", (func) => func()); set_global("requestAnimationFrame", (func) => func());
const activity = mock_esm("../src/activity"); const activity = mock_esm("../src/activity");
const alert_words_ui = mock_esm("../src/alert_words_ui"); const alert_words_ui = mock_esm("../src/alert_words_ui");