From bdb03c71631acd2fcfc330044f1068fa664dd83f Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Fri, 18 Nov 2022 09:22:35 +0200 Subject: [PATCH 1/4] Modernize JS; use ES2015 --- package.json | 9 ++-- src/js.js | 114 +++++++++++++++++++++++---------------------------- 2 files changed, 57 insertions(+), 66 deletions(-) diff --git a/package.json b/package.json index a1fb5e5..b862924 100644 --- a/package.json +++ b/package.json @@ -55,7 +55,7 @@ "browser" ], "parserOptions": { - "ecmaVersion": 5, + "ecmaVersion": 2015, "sourceType": "script" }, "space": true, @@ -63,8 +63,11 @@ "capitalized-comments": "off", "default-case": "off", "no-negated-condition": "off", - "no-var": "off", - "prefer-destructuring": "off", + "object-curly-spacing": [ + "error", + "always" + ], + "prefer-template": "error", "space-before-function-paren": [ "error", "never" diff --git a/src/js.js b/src/js.js index 55f399e..ace4b62 100644 --- a/src/js.js +++ b/src/js.js @@ -1,18 +1,15 @@ (function() { 'use strict'; - // Read a page's GET URL variables and return them as an associative array. - // Source: https://jquery-howto.blogspot.com/2009/09/get-url-parameters-values-with-jquery.html function getUrlParameters() { - var vars = []; - var hash; - var location = window.location; - var hashes = location.href.slice(location.href.indexOf('?') + 1).split('&'); - - for (var i = 0; i < hashes.length; i++) { - hash = hashes[i].split('='); - vars.push(hash[0]); - vars[hash[0]] = hash[1]; + // TODO: Replace with URLSearchParams later + const hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); + const vars = []; + + for (const hash of hashes) { + const [name, value] = hash.split('='); + vars.push(name); + vars[name] = value; } return vars; @@ -24,36 +21,27 @@ } function jsonp(path) { - var head = document.head; - var script = document.createElement('script'); + const script = document.createElement('script'); - script.src = path + '?callback=callback'; - head.insertBefore(script, head.firstChild); + script.src = `${path}?callback=callback`; + document.head.insertBefore(script, document.head.firstChild); } - var parameters = getUrlParameters(); - // Parameters - var user = parameters.user; - var repo = parameters.repo; - var type = parameters.type; - var count = parameters.count; - var size = parameters.size; - var v = parameters.v; - var noText = parameters.text; + const { user, repo, type, count, size, text: noText, v } = getUrlParameters(); // Elements - var button = document.querySelector('.gh-btn'); - var mainButton = document.querySelector('.github-btn'); - var text = document.querySelector('.gh-text'); - var counter = document.querySelector('.gh-count'); + const button = document.querySelector('.gh-btn'); + const mainButton = document.querySelector('.github-btn'); + const text = document.querySelector('.gh-text'); + const counter = document.querySelector('.gh-count'); // Constants - var LABEL_SUFFIX = ' on GitHub'; - var GITHUB_URL = 'https://github.com/'; - var API_URL = 'https://api.github.com/'; - var REPO_URL = GITHUB_URL + user + '/' + repo; - var USER_REPO = user + '/' + repo; + const LABEL_SUFFIX = 'on GitHub'; + const GITHUB_URL = 'https://github.com/'; + const API_URL = 'https://api.github.com/'; + const REPO_URL = `${GITHUB_URL + user}/${repo}`; + const USER_REPO = `${user}/${repo}`; window.callback = function(obj) { if (obj.data.message === 'Not Found') { @@ -64,10 +52,10 @@ case 'watch': { if (v === '2') { counter.textContent = obj.data.subscribers_count && addCommas(obj.data.subscribers_count); - counter.setAttribute('aria-label', counter.textContent + ' watchers' + LABEL_SUFFIX); + counter.setAttribute('aria-label', `${counter.textContent} watchers ${LABEL_SUFFIX}`); } else { counter.textContent = obj.data.stargazers_count && addCommas(obj.data.stargazers_count); - counter.setAttribute('aria-label', counter.textContent + ' stargazers' + LABEL_SUFFIX); + counter.setAttribute('aria-label', `${counter.textContent} stargazers ${LABEL_SUFFIX}`); } break; @@ -75,19 +63,19 @@ case 'star': { counter.textContent = obj.data.stargazers_count && addCommas(obj.data.stargazers_count); - counter.setAttribute('aria-label', counter.textContent + ' stargazers' + LABEL_SUFFIX); + counter.setAttribute('aria-label', `${counter.textContent} stargazers ${LABEL_SUFFIX}`); break; } case 'fork': { counter.textContent = obj.data.network_count && addCommas(obj.data.network_count); - counter.setAttribute('aria-label', counter.textContent + ' forks' + LABEL_SUFFIX); + counter.setAttribute('aria-label', `${counter.textContent} forks ${LABEL_SUFFIX}`); break; } case 'follow': { counter.textContent = obj.data.followers && addCommas(obj.data.followers); - counter.setAttribute('aria-label', counter.textContent + ' followers' + LABEL_SUFFIX); + counter.setAttribute('aria-label', `${counter.textContent} followers ${LABEL_SUFFIX}`); break; } } @@ -102,73 +90,73 @@ // Set href to be URL for repo button.href = REPO_URL; - var title; + let title; // Add the class, change the text label, set count link href switch (type) { case 'watch': { if (v === '2') { - mainButton.className += ' github-watchers'; + mainButton.classList.add('github-watchers'); text.textContent = 'Watch'; - counter.href = REPO_URL + '/watchers'; + counter.href = `${REPO_URL}/watchers`; } else { - mainButton.className += ' github-stargazers'; + mainButton.classList.add('github-stargazers'); text.textContent = 'Star'; - counter.href = REPO_URL + '/stargazers'; + counter.href = `${REPO_URL}/stargazers`; } - title = text.textContent + ' ' + USER_REPO; + title = `${text.textContent} ${USER_REPO}`; break; } case 'star': { - mainButton.className += ' github-stargazers'; + mainButton.classList.add('github-stargazers'); text.textContent = 'Star'; - counter.href = REPO_URL + '/stargazers'; - title = text.textContent + ' ' + USER_REPO; + counter.href = `${REPO_URL}/stargazers`; + title = `${text.textContent} ${USER_REPO}`; break; } case 'fork': { - mainButton.className += ' github-forks'; + mainButton.classList.add('github-forks'); text.textContent = 'Fork'; - button.href = REPO_URL + '/fork'; - counter.href = REPO_URL + '/network'; - title = text.textContent + ' ' + USER_REPO; + button.href = `${REPO_URL}/fork`; + counter.href = `${REPO_URL}/network`; + title = `${text.textContent} ${USER_REPO}`; break; } case 'follow': { - mainButton.className += ' github-me'; - text.textContent = 'Follow @' + user; + mainButton.classList.add('github-me'); + text.textContent = `Follow @${user}`; button.href = GITHUB_URL + user; - counter.href = GITHUB_URL + user + '?tab=followers'; + counter.href = `${GITHUB_URL + user}?tab=followers`; title = text.textContent; break; } case 'sponsor': { - mainButton.className += ' github-me'; - text.textContent = 'Sponsor @' + user; - button.href = GITHUB_URL + 'sponsors/' + user; + mainButton.classList.add('github-me'); + text.textContent = `Sponsor @${user}`; + button.href = `${GITHUB_URL}sponsors/${user}`; title = text.textContent; break; } } if (noText === 'false') { - button.className += ' no-text'; + button.classList.add('no-text'); text.setAttribute('aria-hidden', true); text.style.display = 'none'; text.textContent = ''; } - button.setAttribute('aria-label', title + LABEL_SUFFIX); - document.title = title + LABEL_SUFFIX; + button.setAttribute('aria-label', `${title} ${LABEL_SUFFIX}`); + document.title = `${title} ${LABEL_SUFFIX}`; // Change the size if requested if (size === 'large') { - mainButton.className += ' github-btn-large'; + mainButton.classList.add('github-btn-large'); } // If count is not requested or type is sponsor, @@ -178,8 +166,8 @@ } if (type === 'follow') { - jsonp(API_URL + 'users/' + user); + jsonp(`${API_URL}users/${user}`); } else { - jsonp(API_URL + 'repos/' + user + '/' + repo); + jsonp(`${API_URL}repos/${user}/${repo}`); } })(); From a6a0f26f0f3676b1c2612fdaecf9fb47ae1af825 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Wed, 7 Dec 2022 21:56:10 +0200 Subject: [PATCH 2/4] Only allow specific query params --- src/js.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) diff --git a/src/js.js b/src/js.js index ace4b62..f62efe7 100644 --- a/src/js.js +++ b/src/js.js @@ -1,15 +1,20 @@ (function() { 'use strict'; + const allowedQueryParams = new Set(['user', 'repo', 'type', 'count', 'size', 'text', 'v']); + function getUrlParameters() { // TODO: Replace with URLSearchParams later const hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); const vars = []; for (const hash of hashes) { - const [name, value] = hash.split('='); - vars.push(name); - vars[name] = value; + const [parameter, value] = hash.split('='); + + if (allowedQueryParams.has(parameter)) { + vars.push(parameter); + vars[parameter] = value; + } } return vars; From 99bdf760a8e617181c063af8027ccce4fabd4869 Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Thu, 8 Dec 2022 08:26:48 +0200 Subject: [PATCH 3/4] Use a Map() --- src/js.js | 16 +++++++++++----- 1 file changed, 11 insertions(+), 5 deletions(-) diff --git a/src/js.js b/src/js.js index f62efe7..ff124d4 100644 --- a/src/js.js +++ b/src/js.js @@ -6,18 +6,17 @@ function getUrlParameters() { // TODO: Replace with URLSearchParams later const hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&'); - const vars = []; + const parameters = new Map(); for (const hash of hashes) { const [parameter, value] = hash.split('='); if (allowedQueryParams.has(parameter)) { - vars.push(parameter); - vars[parameter] = value; + parameters.set(parameter, value); } } - return vars; + return parameters; } // Add commas to numbers @@ -33,7 +32,14 @@ } // Parameters - const { user, repo, type, count, size, text: noText, v } = getUrlParameters(); + const parameters = getUrlParameters(); + const user = parameters.get('user'); + const repo = parameters.get('repo'); + const type = parameters.get('type'); + const count = parameters.get('count'); + const size = parameters.get('size'); + const noText = parameters.get('text'); + const v = parameters.get('v'); // Elements const button = document.querySelector('.gh-btn'); From 04cc9fc7b1c35f7bf26e7bf74d5245702a9aa54c Mon Sep 17 00:00:00 2001 From: XhmikosR Date: Thu, 8 Dec 2022 09:06:20 +0200 Subject: [PATCH 4/4] Update docs/github-btn.html --- docs/github-btn.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/github-btn.html b/docs/github-btn.html index 8594b36..c4c03fb 100644 --- a/docs/github-btn.html +++ b/docs/github-btn.html @@ -1 +1 @@ - \ No newline at end of file + \ No newline at end of file