From 57a4f360e5a6f9f096217a095c95e2189d364e53 Mon Sep 17 00:00:00 2001 From: Lam Nguyen Date: Tue, 4 Nov 2025 14:52:17 -0800 Subject: [PATCH 1/4] Browser: Add alert for incompatible browser version --- assets/js/browser-incompatibility.js | 40 ++++++++++++++++++++++++++++ layouts/partials/scripts.html | 3 +++ 2 files changed, 43 insertions(+) create mode 100644 assets/js/browser-incompatibility.js diff --git a/assets/js/browser-incompatibility.js b/assets/js/browser-incompatibility.js new file mode 100644 index 00000000..6c088972 --- /dev/null +++ b/assets/js/browser-incompatibility.js @@ -0,0 +1,40 @@ +navigator.browserVersion = (() => { + var ua = navigator.userAgent; + var tem; + var M = + ua.match(/(opera|chrome|safari|firefox|msie|trident(?=\/))\/?\s*(\d+)/i) || + []; + if (/trident/i.test(M[1])) { + tem = /\brv[ :]+(\d+)/g.exec(ua) || []; + return 'IE ' + (tem[1] || ''); + } + if (M[1] === 'Chrome') { + tem = ua.match(/\b(OPR|Edge)\/(\d+)/); + if (tem != null) return tem.slice(1).join(' ').replace('OPR', 'Opera'); + } + M = M[2] ? [M[1], M[2]] : [navigator.appName, navigator.appVersion, '-?']; + tem = ua.match(/version\/(\d+)/i); + if (tem != null) M.splice(1, 1, tem[1]); + return M.join(' '); +})(); + +const currentBrowser = navigator.browserVersion.split(' ').at(0); +const currentVersion = navigator.browserVersion.split(' ').at(1); + +// Minimum version for FULL support. Source - https://caniuse.com/css-nesting +const supportedNestedCSS = { + Safari: 17.2, + Chrome: 112, + Firefox: 117, + Opera: 106, +}; + +// Set the alert if first time visiting +if (!localStorage.getItem('isBrowserVersionChecked')) { + if (currentVersion < supportedNestedCSS[currentBrowser]) { + alert( + `Incompatible browser\n\nPlease update your browser from ${currentBrowser} ${currentVersion} to ${currentBrowser} ${supportedNestedCSS[currentBrowser]} for full support.` + ); + } + localStorage.setItem('isBrowserVersionChecked', true); +} diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index eba49ca6..6bca1ddd 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -2,6 +2,9 @@ {{ $codecopyv2 := resources.Get "/js/code-copy-v2.js" | fingerprint "sha512" }} +{{ $browserIncompatibility := resources.Get "/js/browser-incompatibility.js" | fingerprint "sha512" }} + + {{ $siteDropdown := resources.Get "/js/site-dropdown.js" | fingerprint "sha512" }} From 78fc9ec1653679cd106ce411f7474a51fb3a4f85 Mon Sep 17 00:00:00 2001 From: Lam Nguyen Date: Tue, 4 Nov 2025 14:58:43 -0800 Subject: [PATCH 2/4] Browser: Changed var name --- assets/js/browser-incompatibility.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/assets/js/browser-incompatibility.js b/assets/js/browser-incompatibility.js index 6c088972..8fa61ad1 100644 --- a/assets/js/browser-incompatibility.js +++ b/assets/js/browser-incompatibility.js @@ -22,7 +22,7 @@ const currentBrowser = navigator.browserVersion.split(' ').at(0); const currentVersion = navigator.browserVersion.split(' ').at(1); // Minimum version for FULL support. Source - https://caniuse.com/css-nesting -const supportedNestedCSS = { +const supportedNestedCSSVersion = { Safari: 17.2, Chrome: 112, Firefox: 117, @@ -31,9 +31,9 @@ const supportedNestedCSS = { // Set the alert if first time visiting if (!localStorage.getItem('isBrowserVersionChecked')) { - if (currentVersion < supportedNestedCSS[currentBrowser]) { + if (currentVersion < supportedNestedCSSVersion[currentBrowser]) { alert( - `Incompatible browser\n\nPlease update your browser from ${currentBrowser} ${currentVersion} to ${currentBrowser} ${supportedNestedCSS[currentBrowser]} for full support.` + `Incompatible browser\n\nPlease update your browser from ${currentBrowser} ${currentVersion} to ${currentBrowser} ${supportedNestedCSSVersion[currentBrowser]} for full support.` ); } localStorage.setItem('isBrowserVersionChecked', true); From cfeb67e6a52a03c27683da07dfa62663f9e1df16 Mon Sep 17 00:00:00 2001 From: Lam Nguyen Date: Wed, 5 Nov 2025 10:10:36 -0800 Subject: [PATCH 3/4] Browser: Add comments to browser usage in script.html --- layouts/partials/scripts.html | 1 + 1 file changed, 1 insertion(+) diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index 6bca1ddd..c3477a9a 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -2,6 +2,7 @@ {{ $codecopyv2 := resources.Get "/js/code-copy-v2.js" | fingerprint "sha512" }} + {{ $browserIncompatibility := resources.Get "/js/browser-incompatibility.js" | fingerprint "sha512" }} From 0a43b958f226f655a43826a1b26d41c7b7daf972 Mon Sep 17 00:00:00 2001 From: Lam Nguyen Date: Wed, 5 Nov 2025 10:39:47 -0800 Subject: [PATCH 4/4] Browser: Change wording on alert --- assets/js/browser-incompatibility.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/browser-incompatibility.js b/assets/js/browser-incompatibility.js index 8fa61ad1..6d570869 100644 --- a/assets/js/browser-incompatibility.js +++ b/assets/js/browser-incompatibility.js @@ -33,7 +33,7 @@ const supportedNestedCSSVersion = { if (!localStorage.getItem('isBrowserVersionChecked')) { if (currentVersion < supportedNestedCSSVersion[currentBrowser]) { alert( - `Incompatible browser\n\nPlease update your browser from ${currentBrowser} ${currentVersion} to ${currentBrowser} ${supportedNestedCSSVersion[currentBrowser]} for full support.` + `Unsupported browser\n\n${currentBrowser} ${currentVersion} may not display this site correctly.\nUpdate to at least ${currentBrowser} ${supportedNestedCSSVersion[currentBrowser]} for the best experience.` ); } localStorage.setItem('isBrowserVersionChecked', true);