⭐ Moe-Counter Compatible Website Hit Counter Written in Gleam
mayu.due.moe
hit-counter
svg
moe
feat(index.html): query parameters
+23
-4
+23
-4
index.html
+23
-4
index.html
···
253
253
<img src="" alt="Mascot" class="mascot" title="Mascot" />
254
254
255
255
<script>
256
+
const themeQueryParameter = new URLSearchParams(
257
+
window.location.search
258
+
).get("theme");
259
+
const defaultConfiguration = {
260
+
id: new URLSearchParams(window.location.search).get("id") || "demo",
261
+
theme: themeQueryParameter || "asoul",
262
+
};
256
263
let inputTimeout;
257
264
const idInput = document.getElementById("idInput");
258
265
const themeSelect = document.getElementById("themeSelect");
259
266
const image = document.getElementById("example");
260
267
const copyCodesInput = document.getElementById("copy-codes");
261
-
let inputValue = "demo";
262
-
let themeValue = "asoul";
268
+
let inputValue = defaultConfiguration.id;
269
+
let themeValue = defaultConfiguration.theme;
263
270
const setCopyCodes = () => {
264
271
copyCodesInput.innerText = `\n\n<img src="${image.src}" alt="${inputValue}" />`;
265
272
};
266
273
const set = () => {
267
-
inputValue = idInput.value || "demo";
268
-
themeValue = themeSelect.value || "asoul";
274
+
if (idInput.value === "" || idInput.value === null) {
275
+
idInput.value = defaultConfiguration.id;
276
+
} else {
277
+
inputValue = idInput.value;
278
+
}
279
+
280
+
if (themeQueryParameter) {
281
+
themeValue = themeQueryParameter;
282
+
themeSelect.value = themeValue;
283
+
} else {
284
+
themeValue = themeSelect.value;
285
+
}
286
+
269
287
image.src = `https://counter.due.moe/get/@${inputValue}?theme=${themeValue}`;
288
+
270
289
setCopyCodes();
271
290
};
272
291
const mascots = [