From bffebb9304099822e06838917ed2894a6638ebc7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Fri, 24 Sep 2021 20:37:59 +0200 Subject: [PATCH 1/4] Convert index to TS MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/usercontent/{index.js => index.ts} | 34 ++++++++++++-------------- 1 file changed, 16 insertions(+), 18 deletions(-) rename src/usercontent/{index.js => index.ts} (61%) diff --git a/src/usercontent/index.js b/src/usercontent/index.ts similarity index 61% rename from src/usercontent/index.js rename to src/usercontent/index.ts index c03126ec80..f143f16720 100644 --- a/src/usercontent/index.js +++ b/src/usercontent/index.ts @@ -1,5 +1,5 @@ let hasCalled = false; -function remoteRender(event) { +function remoteRender(event: MessageEvent): void { const data = event.data; // If we're handling secondary calls, start from scratch @@ -11,10 +11,11 @@ function remoteRender(event) { const img = document.createElement("span"); // we'll mask it as an image img.id = "img"; - const a = document.createElement("a"); + const a: HTMLAnchorElement = document.createElement("a"); a.id = "a"; a.rel = "noreferrer noopener"; a.download = data.download; + // @ts-ignore a.style = data.style; a.style.fontFamily = "Arial, Helvetica, Sans-Serif"; a.href = window.URL.createObjectURL(data.blob); @@ -23,24 +24,21 @@ function remoteRender(event) { // Apply image style after so we can steal the anchor's colour. // Style copied from a rendered version of mx_MFileBody_download_icon - img.style = (data.imgStyle || "" + - "width: 12px; height: 12px;" + - "-webkit-mask-size: 12px;" + - "mask-size: 12px;" + - "-webkit-mask-position: center;" + - "mask-position: center;" + - "-webkit-mask-repeat: no-repeat;" + - "mask-repeat: no-repeat;" + - "display: inline-block;") + "" + - - // Always add these styles - `-webkit-mask-image: url('${data.imgSrc}');` + - `mask-image: url('${data.imgSrc}');` + - `background-color: ${a.style.color};`; + // @ts-ignore + img.style = data.imgStyle ?? ""; + img.style.width = "12px"; + img.style.height = "12px"; + img.style.webkitMaskSize = "12px"; + img.style.webkitMaskPosition = "center"; + img.style.webkitMaskRepeat = "no-repeat"; + img.style.display = "inline-block"; + img.style.webkitMaskImage = `url('${data.imgSrc}')`; + img.style.backgroundColor = `${a.style.color}`; const body = document.body; // Don't display scrollbars if the link takes more than one line to display. - body.style = "margin: 0px; overflow: hidden"; + body.style .margin = "0px"; + body.style.overflow = "hidden"; body.appendChild(a); if (event.data.auto) { @@ -48,7 +46,7 @@ function remoteRender(event) { } } -window.onmessage = function(e) { +window.onmessage = function(e: MessageEvent): void { if (e.origin === window.location.origin) { if (e.data.blob) remoteRender(e); } From 27f74b3ebd0a72e192e2d9bc7c07de00813b47c4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 25 Sep 2021 07:53:38 +0200 Subject: [PATCH 2/4] Remove unnecessary type MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/usercontent/index.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/usercontent/index.ts b/src/usercontent/index.ts index f143f16720..82e8ee0d81 100644 --- a/src/usercontent/index.ts +++ b/src/usercontent/index.ts @@ -11,7 +11,7 @@ function remoteRender(event: MessageEvent): void { const img = document.createElement("span"); // we'll mask it as an image img.id = "img"; - const a: HTMLAnchorElement = document.createElement("a"); + const a = document.createElement("a"); a.id = "a"; a.rel = "noreferrer noopener"; a.download = data.download; From 1a2476609c0bea8505063eae00a08b5c37930c68 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 25 Sep 2021 07:55:40 +0200 Subject: [PATCH 3/4] Fix code to be equivalent to the previous one MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/usercontent/index.ts | 23 +++++++++++++---------- 1 file changed, 13 insertions(+), 10 deletions(-) diff --git a/src/usercontent/index.ts b/src/usercontent/index.ts index 82e8ee0d81..eaa8c86ec6 100644 --- a/src/usercontent/index.ts +++ b/src/usercontent/index.ts @@ -24,16 +24,19 @@ function remoteRender(event: MessageEvent): void { // Apply image style after so we can steal the anchor's colour. // Style copied from a rendered version of mx_MFileBody_download_icon - // @ts-ignore - img.style = data.imgStyle ?? ""; - img.style.width = "12px"; - img.style.height = "12px"; - img.style.webkitMaskSize = "12px"; - img.style.webkitMaskPosition = "center"; - img.style.webkitMaskRepeat = "no-repeat"; - img.style.display = "inline-block"; - img.style.webkitMaskImage = `url('${data.imgSrc}')`; - img.style.backgroundColor = `${a.style.color}`; + if (data.imgStyle) { + // @ts-ignore + img.style = data.imgStyle; + } else { + img.style.width = "12px"; + img.style.height = "12px"; + img.style.webkitMaskSize = "12px"; + img.style.webkitMaskPosition = "center"; + img.style.webkitMaskRepeat = "no-repeat"; + img.style.display = "inline-block"; + img.style.webkitMaskImage = `url('${data.imgSrc}')`; + img.style.backgroundColor = `${a.style.color}`; + } const body = document.body; // Don't display scrollbars if the link takes more than one line to display. From 3450e91e32cc830a07226f7a2cfe12a0cb8a22b7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=C5=A0imon=20Brandner?= Date: Sat, 25 Sep 2021 09:58:01 +0200 Subject: [PATCH 4/4] Improve typing MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Šimon Brandner --- src/usercontent/index.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/usercontent/index.ts b/src/usercontent/index.ts index eaa8c86ec6..df551e88e6 100644 --- a/src/usercontent/index.ts +++ b/src/usercontent/index.ts @@ -8,10 +8,10 @@ function remoteRender(event: MessageEvent): void { } hasCalled = true; - const img = document.createElement("span"); // we'll mask it as an image + const img: HTMLSpanElement = document.createElement("span"); // we'll mask it as an image img.id = "img"; - const a = document.createElement("a"); + const a: HTMLAnchorElement = document.createElement("a"); a.id = "a"; a.rel = "noreferrer noopener"; a.download = data.download;