mirror of https://github.com/zulip/zulip.git
ts: Migrate scroll_bar.js to typescript.
Remove the winjs specific `getScrollbarWidth` property while we're at it; WinJS isn't relevant anymore. Reorders methods due to TypeScript files enforcing define-before-use when this commit was drafted.
This commit is contained in:
parent
6199be39da
commit
eed6f67fca
|
@ -144,7 +144,7 @@ EXEMPT_FILES = make_set(
|
||||||
"web/src/reminder.js",
|
"web/src/reminder.js",
|
||||||
"web/src/resize.js",
|
"web/src/resize.js",
|
||||||
"web/src/rows.js",
|
"web/src/rows.js",
|
||||||
"web/src/scroll_bar.js",
|
"web/src/scroll_bar.ts",
|
||||||
"web/src/search_pill_widget.js",
|
"web/src/search_pill_widget.js",
|
||||||
"web/src/sent_messages.js",
|
"web/src/sent_messages.js",
|
||||||
"web/src/sentry.ts",
|
"web/src/sentry.ts",
|
||||||
|
|
|
@ -9,11 +9,10 @@ import {user_settings} from "./user_settings";
|
||||||
// number of element widths based on the value detected here.
|
// number of element widths based on the value detected here.
|
||||||
//
|
//
|
||||||
// From https://stackoverflow.com/questions/13382516/getting-scroll-bar-width-using-javascript
|
// From https://stackoverflow.com/questions/13382516/getting-scroll-bar-width-using-javascript
|
||||||
function getScrollbarWidth() {
|
function getScrollbarWidth(): number {
|
||||||
const outer = document.createElement("div");
|
const outer = document.createElement("div");
|
||||||
outer.style.visibility = "hidden";
|
outer.style.visibility = "hidden";
|
||||||
outer.style.width = "100px";
|
outer.style.width = "100px";
|
||||||
outer.style.msOverflowStyle = "scrollbar"; // needed for WinJS apps
|
|
||||||
|
|
||||||
document.body.append(outer);
|
document.body.append(outer);
|
||||||
|
|
||||||
|
@ -34,9 +33,17 @@ function getScrollbarWidth() {
|
||||||
return widthNoScroll - widthWithScroll;
|
return widthNoScroll - widthWithScroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
let sbWidth;
|
export function set_layout_width(): void {
|
||||||
|
if (user_settings.fluid_layout_width) {
|
||||||
|
$(".header-main, .app .app-main, #compose-container").css("max-width", "inherit");
|
||||||
|
} else {
|
||||||
|
$(".header-main, .app .app-main, #compose-container").css("max-width", "1400px");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
export function initialize() {
|
let sbWidth: number;
|
||||||
|
|
||||||
|
export function initialize(): void {
|
||||||
// Workaround for browsers with fixed scrollbars
|
// Workaround for browsers with fixed scrollbars
|
||||||
sbWidth = getScrollbarWidth();
|
sbWidth = getScrollbarWidth();
|
||||||
if (sbWidth > 0) {
|
if (sbWidth > 0) {
|
||||||
|
@ -45,11 +52,3 @@ export function initialize() {
|
||||||
}
|
}
|
||||||
set_layout_width();
|
set_layout_width();
|
||||||
}
|
}
|
||||||
|
|
||||||
export function set_layout_width() {
|
|
||||||
if (user_settings.fluid_layout_width) {
|
|
||||||
$(".header-main, .app .app-main, #compose-container").css("max-width", "inherit");
|
|
||||||
} else {
|
|
||||||
$(".header-main, .app .app-main, #compose-container").css("max-width", "1400px");
|
|
||||||
}
|
|
||||||
}
|
|
Loading…
Reference in New Issue