From 9f881ebe34ee3ad3eec629d694184d1f07b009cd Mon Sep 17 00:00:00 2001 From: Anders Kaseorg Date: Sat, 27 Feb 2021 15:57:20 -0800 Subject: [PATCH] js: Convert static/js/resize.js to ES6 module. Signed-off-by: Anders Kaseorg --- .eslintrc.json | 1 - frontend_tests/node_tests/activity.js | 3 +- frontend_tests/node_tests/compose.js | 3 +- frontend_tests/node_tests/narrow.js | 2 +- frontend_tests/node_tests/narrow_activate.js | 2 +- frontend_tests/node_tests/stream_search.js | 7 +++- frontend_tests/node_tests/top_left_corner.js | 2 +- frontend_tests/node_tests/tutorial.js | 3 +- frontend_tests/node_tests/ui_init.js | 6 ++- static/js/bundles/app.js | 1 - static/js/compose.js | 1 + static/js/global.d.ts | 1 - static/js/message_edit.js | 1 + static/js/message_events.js | 1 + static/js/message_util.js | 1 + static/js/narrow.js | 1 + static/js/popovers.js | 1 + static/js/resize.js | 44 +++++++++----------- static/js/stream_list.js | 1 + static/js/stream_popover.js | 1 + static/js/top_left_corner.js | 1 + static/js/ui_init.js | 1 + static/js/user_search.js | 2 + 23 files changed, 51 insertions(+), 36 deletions(-) diff --git a/.eslintrc.json b/.eslintrc.json index 82e841ed82..e852f7f63c 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -186,7 +186,6 @@ "realm_night_logo": false, "recent_topics": false, "reminder": false, - "resize": false, "scroll_bar": false, "search": false, "search_pill_widget": false, diff --git a/frontend_tests/node_tests/activity.js b/frontend_tests/node_tests/activity.js index 4261041b4f..1842c5809b 100644 --- a/frontend_tests/node_tests/activity.js +++ b/frontend_tests/node_tests/activity.js @@ -62,6 +62,7 @@ const _stream_popover = { }; const _resize = { + __esModule: true, resize_sidebars: () => {}, resize_page_components: () => {}, }; @@ -75,7 +76,7 @@ set_global("document", _document); rewiremock("../../static/js/keydown_util").with(_keydown_util); rewiremock("../../static/js/pm_list").with(_pm_list); set_global("popovers", _popovers); -set_global("resize", _resize); +rewiremock("../../static/js/resize").with(_resize); rewiremock("../../static/js/scroll_util").with(_scroll_util); set_global("stream_popover", _stream_popover); set_global("ui", _ui); diff --git a/frontend_tests/node_tests/compose.js b/frontend_tests/node_tests/compose.js index d837b8a3ed..7ae44254d4 100644 --- a/frontend_tests/node_tests/compose.js +++ b/frontend_tests/node_tests/compose.js @@ -72,7 +72,8 @@ rewiremock("../../static/js/markdown").with(markdown); const loading = {__esModule: true}; rewiremock("../../static/js/loading").with(loading); const page_params = set_global("page_params", {}); -const resize = set_global("resize", {}); +const resize = {__esModule: true}; +rewiremock("../../static/js/resize").with(resize); const subs = set_global("subs", {}); const ui_util = set_global("ui_util", {}); diff --git a/frontend_tests/node_tests/narrow.js b/frontend_tests/node_tests/narrow.js index d7ea21bb11..4a7c9ac53b 100644 --- a/frontend_tests/node_tests/narrow.js +++ b/frontend_tests/node_tests/narrow.js @@ -11,7 +11,7 @@ const $ = require("../zjsunit/zjquery"); set_global("page_params", { stop_words: ["what", "about"], }); -set_global("resize", { +rewiremock("../../static/js/resize").with({ resize_page_components: () => {}, resize_stream_filters_container: () => {}, }); diff --git a/frontend_tests/node_tests/narrow_activate.js b/frontend_tests/node_tests/narrow_activate.js index 3e7b3790f5..233209a8ef 100644 --- a/frontend_tests/node_tests/narrow_activate.js +++ b/frontend_tests/node_tests/narrow_activate.js @@ -7,7 +7,7 @@ const rewiremock = require("rewiremock/node"); const {set_global, zrequire} = require("../zjsunit/namespace"); const {run_test} = require("../zjsunit/test"); -set_global("resize", { +rewiremock("../../static/js/resize").with({ resize_stream_filters_container: () => {}, }); diff --git a/frontend_tests/node_tests/stream_search.js b/frontend_tests/node_tests/stream_search.js index 11864f0966..da97f63527 100644 --- a/frontend_tests/node_tests/stream_search.js +++ b/frontend_tests/node_tests/stream_search.js @@ -2,6 +2,8 @@ const {strict: assert} = require("assert"); +const rewiremock = require("rewiremock/node"); + const {set_global, zrequire} = require("../zjsunit/namespace"); const {run_test} = require("../zjsunit/test"); const $ = require("../zjsunit/zjquery"); @@ -11,7 +13,7 @@ const $ = require("../zjsunit/zjquery"); const noop = () => {}; -set_global("resize", { +rewiremock("../../static/js/resize").with({ resize_page_components: noop, resize_stream_filters_container: noop, }); @@ -19,6 +21,8 @@ set_global("resize", { const popovers = set_global("popovers", {}); const stream_popover = set_global("stream_popover", {}); +rewiremock.enable(); + const stream_list = zrequire("stream_list"); function expand_sidebar() { @@ -189,3 +193,4 @@ run_test("expanding_sidebar", () => { assert.deepEqual(events, ["popovers.hide_all", "stream_popover.show_streamlist_sidebar"]); }); +rewiremock.disable(); diff --git a/frontend_tests/node_tests/top_left_corner.js b/frontend_tests/node_tests/top_left_corner.js index b1d8774a32..bacc4cecde 100644 --- a/frontend_tests/node_tests/top_left_corner.js +++ b/frontend_tests/node_tests/top_left_corner.js @@ -8,7 +8,7 @@ const {set_global, zrequire} = require("../zjsunit/namespace"); const {run_test} = require("../zjsunit/test"); const $ = require("../zjsunit/zjquery"); -set_global("resize", { +rewiremock("../../static/js/resize").with({ resize_stream_filters_container: () => {}, }); rewiremock.enable(); diff --git a/frontend_tests/node_tests/tutorial.js b/frontend_tests/node_tests/tutorial.js index b19dd68ad3..89d7a8a008 100644 --- a/frontend_tests/node_tests/tutorial.js +++ b/frontend_tests/node_tests/tutorial.js @@ -32,7 +32,8 @@ const message_list = set_global("message_list", {}); const message_util = set_global("message_util", {}); const notifications = set_global("notifications", {}); const overlays = set_global("overlays", {}); -const resize = set_global("resize", {}); +const resize = {__esModule: true}; +rewiremock("../../static/js/resize").with(resize); let stream_list = set_global("stream_list", {}); let unread_ops = set_global("unread_ops", {}); const unread_ui = {__esModule: true}; diff --git a/frontend_tests/node_tests/ui_init.js b/frontend_tests/node_tests/ui_init.js index 1af1ada666..61fc202fce 100644 --- a/frontend_tests/node_tests/ui_init.js +++ b/frontend_tests/node_tests/ui_init.js @@ -36,9 +36,11 @@ set_global("document", { set_global("csrf_token", "whatever"); -const resize = set_global("resize", { +const resize = { + __esModule: true, handler: () => {}, -}); +}; +rewiremock("../../static/js/resize").with(resize); const page_params = set_global("page_params", {}); page_params.realm_default_streams = []; diff --git a/static/js/bundles/app.js b/static/js/bundles/app.js index c66d74a951..056caf0738 100644 --- a/static/js/bundles/app.js +++ b/static/js/bundles/app.js @@ -26,7 +26,6 @@ import "../narrow"; import "../reload"; import "../compose_actions"; import "../subs"; -import "../resize"; import "../list_widget"; import "../floating_recipient_bar"; import "../lightbox"; diff --git a/static/js/compose.js b/static/js/compose.js index 68f2ddb485..acd0f38052 100644 --- a/static/js/compose.js +++ b/static/js/compose.js @@ -19,6 +19,7 @@ import * as markdown from "./markdown"; import * as peer_data from "./peer_data"; import * as people from "./people"; import * as rendered_markdown from "./rendered_markdown"; +import * as resize from "./resize"; import * as rtl from "./rtl"; import * as sent_messages from "./sent_messages"; import * as settings_config from "./settings_config"; diff --git a/static/js/global.d.ts b/static/js/global.d.ts index c0494d6978..abf75c37a3 100644 --- a/static/js/global.d.ts +++ b/static/js/global.d.ts @@ -59,7 +59,6 @@ declare let realm_icon: any; declare let realm_logo: any; declare let recent_topics: any; declare let reminder: any; -declare let resize: any; declare let scroll_bar: any; declare let search: any; declare let search_pill_widget: any; diff --git a/static/js/message_edit.js b/static/js/message_edit.js index 7105020864..e1c24eddf4 100644 --- a/static/js/message_edit.js +++ b/static/js/message_edit.js @@ -10,6 +10,7 @@ import * as echo from "./echo"; import * as loading from "./loading"; import * as markdown from "./markdown"; import * as message_viewport from "./message_viewport"; +import * as resize from "./resize"; import * as rows from "./rows"; import * as stream_data from "./stream_data"; import * as upload from "./upload"; diff --git a/static/js/message_events.js b/static/js/message_events.js index 8bf16e5fa5..04a76a397a 100644 --- a/static/js/message_events.js +++ b/static/js/message_events.js @@ -11,6 +11,7 @@ const message_edit_history = require("./message_edit_history"); const narrow_state = require("./narrow_state"); const pm_list = require("./pm_list"); const recent_senders = require("./recent_senders"); +const resize = require("./resize"); const stream_data = require("./stream_data"); const stream_topic_history = require("./stream_topic_history"); const unread_ui = require("./unread_ui"); diff --git a/static/js/message_util.js b/static/js/message_util.js index 322fc55fd9..267831386d 100644 --- a/static/js/message_util.js +++ b/static/js/message_util.js @@ -1,6 +1,7 @@ "use strict"; const loading = require("./loading"); +const resize = require("./resize"); const unread_ui = require("./unread_ui"); exports.do_unread_count_updates = function do_unread_count_updates(messages) { diff --git a/static/js/narrow.js b/static/js/narrow.js index 777a2f200a..fe097bacc3 100644 --- a/static/js/narrow.js +++ b/static/js/narrow.js @@ -10,6 +10,7 @@ const message_edit = require("./message_edit"); const {MessageListData} = require("./message_list_data"); const narrow_state = require("./narrow_state"); const people = require("./people"); +const resize = require("./resize"); const search_pill = require("./search_pill"); const stream_data = require("./stream_data"); const stream_topic_history = require("./stream_topic_history"); diff --git a/static/js/popovers.js b/static/js/popovers.js index 2c3e29cfe8..e910bbaa3b 100644 --- a/static/js/popovers.js +++ b/static/js/popovers.js @@ -26,6 +26,7 @@ const muting = require("./muting"); const muting_ui = require("./muting_ui"); const narrow_state = require("./narrow_state"); const people = require("./people"); +const resize = require("./resize"); const rows = require("./rows"); const settings_config = require("./settings_config"); const settings_data = require("./settings_data"); diff --git a/static/js/resize.js b/static/js/resize.js index 528b7d0332..60c9fb4279 100644 --- a/static/js/resize.js +++ b/static/js/resize.js @@ -1,10 +1,8 @@ -"use strict"; +import autosize from "autosize"; -const autosize = require("autosize"); - -const condense = require("./condense"); -const message_viewport = require("./message_viewport"); -const util = require("./util"); +import * as condense from "./condense"; +import * as message_viewport from "./message_viewport"; +import * as util from "./util"; let narrow_window = false; @@ -115,7 +113,7 @@ function left_userlist_get_new_heights() { return res; } -exports.watch_manual_resize = function (element) { +export function watch_manual_resize(element) { return (function on_box_resize(cb) { const box = document.querySelector(element); @@ -155,19 +153,19 @@ exports.watch_manual_resize = function (element) { // will be re-enabled when this component is next opened. autosize.destroy($(element)).height(height + "px"); }); -}; +} -exports.resize_bottom_whitespace = function (h) { +export function resize_bottom_whitespace(h) { $("#bottom_whitespace").height(h.bottom_whitespace_height); -}; +} -exports.resize_stream_filters_container = function (h) { +export function resize_stream_filters_container(h) { h = narrow_window ? left_userlist_get_new_heights() : get_new_heights(); - exports.resize_bottom_whitespace(h); + resize_bottom_whitespace(h); $("#stream-filters-container").css("max-height", h.stream_filters_max_height); -}; +} -exports.resize_sidebars = function () { +export function resize_sidebars() { let sidebar; if (page_params.left_side_userlist) { @@ -204,17 +202,17 @@ exports.resize_sidebars = function () { $("#stream-filters-container").css("max-height", h.stream_filters_max_height); return h; -}; +} -exports.resize_page_components = function () { - const h = exports.resize_sidebars(); - exports.resize_bottom_whitespace(h); +export function resize_page_components() { + const h = resize_sidebars(); + resize_bottom_whitespace(h); panels.resize_app(); -}; +} let _old_width = $(window).width(); -exports.handler = function () { +export function handler() { const new_width = $(window).width(); if (new_width !== _old_width) { @@ -229,7 +227,7 @@ exports.handler = function () { if (!mobile) { popovers.hide_all(); } - exports.resize_page_components(); + resize_page_components(); // Re-compute and display/remove [More] links to messages condense.condense_and_collapse($(".message_table .message_row")); @@ -244,6 +242,4 @@ exports.handler = function () { navigate.scroll_to_selected(); } -}; - -window.resize = exports; +} diff --git a/static/js/stream_list.js b/static/js/stream_list.js index 432f304c3a..e7174f9319 100644 --- a/static/js/stream_list.js +++ b/static/js/stream_list.js @@ -8,6 +8,7 @@ const render_stream_sidebar_row = require("../templates/stream_sidebar_row.hbs") const keydown_util = require("./keydown_util"); const {ListCursor} = require("./list_cursor"); const narrow_state = require("./narrow_state"); +const resize = require("./resize"); const scroll_util = require("./scroll_util"); const stream_color = require("./stream_color"); const stream_data = require("./stream_data"); diff --git a/static/js/stream_popover.js b/static/js/stream_popover.js index 0bf3ea5d45..bba182074c 100644 --- a/static/js/stream_popover.js +++ b/static/js/stream_popover.js @@ -12,6 +12,7 @@ const channel = require("./channel"); const message_edit = require("./message_edit"); const muting = require("./muting"); const muting_ui = require("./muting_ui"); +const resize = require("./resize"); const stream_color = require("./stream_color"); const stream_data = require("./stream_data"); diff --git a/static/js/top_left_corner.js b/static/js/top_left_corner.js index c7955f825d..01e178706e 100644 --- a/static/js/top_left_corner.js +++ b/static/js/top_left_corner.js @@ -1,5 +1,6 @@ import * as people from "./people"; import * as pm_list from "./pm_list"; +import * as resize from "./resize"; import * as unread_ui from "./unread_ui"; export function update_count_in_dom(unread_count_elem, count) { diff --git a/static/js/ui_init.js b/static/js/ui_init.js index b16c8a2da6..a909258eb2 100644 --- a/static/js/ui_init.js +++ b/static/js/ui_init.js @@ -26,6 +26,7 @@ const people = require("./people"); const pm_conversations = require("./pm_conversations"); const pm_list = require("./pm_list"); const reload = require("./reload"); +const resize = require("./resize"); const rows = require("./rows"); const sent_messages = require("./sent_messages"); const spoilers = require("./spoilers"); diff --git a/static/js/user_search.js b/static/js/user_search.js index 0e5bee9224..7803c56806 100644 --- a/static/js/user_search.js +++ b/static/js/user_search.js @@ -1,3 +1,5 @@ +import * as resize from "./resize"; + export class UserSearch { // This is mostly view code to manage the user search widget // above the buddy list. We rely on other code to manage the