From ea894393f16fd03e04f8343c37dd4f4aee9a24ad Mon Sep 17 00:00:00 2001 From: hackademix Date: Tue, 19 Mar 2019 13:46:58 +0100 Subject: Improved popup initialization perceived speed. --- src/ui/popup.css | 3 +-- src/ui/ui.js | 41 +++++++++++++++++++---------------------- 2 files changed, 20 insertions(+), 24 deletions(-) (limited to 'src/ui') diff --git a/src/ui/popup.css b/src/ui/popup.css index ad5e3d0..ce96023 100644 --- a/src/ui/popup.css +++ b/src/ui/popup.css @@ -28,7 +28,7 @@ body { background: transparent no-repeat center; background-size: 100%; transform: unset; - transition: all 0.3s; + transition: transform 0.3s; border: none; display: block; @@ -221,7 +221,6 @@ body { background-position: left top; background-repeat: no-repeat; min-height: 3em; - transition: height .5s; font-size: 1.2em; vertical-align: middle; } diff --git a/src/ui/ui.js b/src/ui/ui.js index 46d9d7f..7e4d45d 100644 --- a/src/ui/ui.js +++ b/src/ui/ui.js @@ -316,33 +316,30 @@ var UI = (() => { sizer.id = "presets-sizer"; sizer.appendChild(presets.cloneNode(true)); document.body.appendChild(sizer); - setTimeout(async () => { - let presetWidth = sizer.querySelector("input.preset").offsetWidth; - let labelWidth = 0; - for (let l of sizer.querySelectorAll("label.preset")) { - let lw = l.offsetWidth; - debug("lw", l.textContent, lw); - if (lw > labelWidth) labelWidth = lw; - } - - debug(`Preset: %s Label: %s`, presetWidth, labelWidth); - labelWidth += 16; - if (presetWidth < labelWidth) { - for (let ss of document.styleSheets) { - if (ss.href.endsWith("/ui.css")) { - for (let r of ss.cssRules) { - if (/input\.preset:checked.*min-width:/.test(r.cssText)) { - r.style.minWidth = (labelWidth) + "px"; - break; - } + let presetWidth = sizer.querySelector("input.preset").offsetWidth; + let labelWidth = 0; + for (let l of sizer.querySelectorAll("label.preset")) { + let lw = l.offsetWidth; + debug("lw", l.textContent, lw); + if (lw > labelWidth) labelWidth = lw; + } + + debug(`Preset: %s Label: %s`, presetWidth, labelWidth); + labelWidth += 16; + if (presetWidth < labelWidth) { + for (let ss of document.styleSheets) { + if (ss.href.endsWith("/ui.css")) { + for (let r of ss.cssRules) { + if (/input\.preset:checked.*min-width:/.test(r.cssText)) { + r.style.minWidth = (labelWidth) + "px"; + break; } } } } + } - sizer.remove(); - - }, 100); + sizer.remove(); UI.Sites.correctSize = () => {}; // just once, please! } -- cgit v1.2.3