Refactor web instance to add missing supported plugins options, rename routes and display remaining GitHub requests (#20)

action/dist/index.js

@@ -1,4 +1,4 @@
-module.exports=(()=>{var _Mathhypot=Math.hypot,_Mathacos=Math.acos,_Mathtan=Math.tan,_Mathasin=Math.asin,_Mathsin=Math.sin,_Mathcos=Math.cos,_MathPI=Math.PI,_Mathsqrt=Math.sqrt,_NumberisInteger=Number.isInteger,_Stringprototype=String.prototype,_NumberPOSITIVE_INFINITY=Number.POSITIVE_INFINITY,_NumberNEGATIVE_INFINITY=Number.NEGATIVE_INFINITY,_NumberMAX_SAFE_INTEGER=Number.MAX_SAFE_INTEGER,_Mathround=Math.round,_StringfromCharCode=String.fromCharCode,_Mathabs=Math.abs,_Mathpow=Math.pow,_Mathceil=Math.ceil,_Mathfloor=Math.floor,_Mathmax=Math.max,_Mathmin=Math.min;function __webpack_require__(e){if(__webpack_module_cache__[e])return __webpack_module_cache__[e].exports;var t=__webpack_module_cache__[e]={exports:{}},r=!0;try{__webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),r=!1}finally{r&&delete __webpack_module_cache__[e]}return t.exports}var __webpack_modules__={75935:(e,t,r)=>{"use strict";async function n({log:e=!0}={}){const t=e?console.debug:()=>null;t(`metrics/setup > setup`);const n="src/templates",a={templates:{},settings:{},statics:r.ab+"html",node_modules:f.resolve("node_modules")};if(t(`metrics/setup > load settings.json`),h.existsSync(r.ab+"settings.json")?(a.settings=JSON.parse(`${await h.promises.readFile(f.resolve("settings.json"))}`),t(`metrics/setup > load settings.json > success`)):t(`metrics/setup > load settings.json > (missing)`),a.settings.templates||(a.settings.templates={default:"classic",enabled:[]}),a.settings.plugins||(a.settings.plugins={}),a.settings.plugins.base={parts:["header","activity","community","repositories","metadata"]},a.settings.debug&&t(a.settings),t(`metrics/setup > load package.json`),h.existsSync(r.ab+"package.json")?(a.package=JSON.parse(`${await h.promises.readFile(f.resolve("package.json"))}`),t(`metrics/setup > load package.json > success`)):(t(`metrics/setup > load package.json > (missing)`),a.package={version:"2.8.0-beta",author:"lowlighter"}),h.existsSync(r.ab+"templates"))for(const e of await h.promises.readdir(n)){if(/.*[.]mjs$/.test(e))continue;t(`metrics/setup > load template [${e}]`);const r=[`${n}/${e}/query.graphql`,`${n}/${e}/image.svg`,`${n}/${e}/style.css`,`${n}/${e}/fonts.css`],[o,i,s,l]=await Promise.all(r.map(async e=>`${await h.promises.readFile(f.resolve(e))}`));a.templates[e]={query:o,image:i,style:s,fonts:l},t(`metrics/setup > load template [${e}] > success`),a.settings.debug&&Object.defineProperty(a.templates,e,{get(){t(`metrics/setup > reload template [${e}]`);const[n,a,o,i]=r.map(e=>`${h.readFileSync(f.resolve(e))}`);return t(`metrics/setup > reload template [${e}] > success`),{query:n,image:a,style:o,fonts:i}}})}else t(`metrics/setup > load templates from build`),a.templates=JSON.parse(Buffer.from(`eyJjbGFzc2ljIjp7InF1ZXJ5IjoicXVlcnkgTWV0cmljcyB7XHJcbiAgdXNlcihsb2dpbjogJGxvZ2luKSB7XHJcbiAgICBkYXRhYmFzZUlkXHJcbiAgICBuYW1lXHJcbiAgICBsb2dpblxyXG4gICAgY3JlYXRlZEF0XHJcbiAgICBhdmF0YXJVcmxcclxuICAgIHdlYnNpdGVVcmxcclxuICAgIGlzSGlyZWFibGVcclxuICAgIGdpc3RzIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgcmVwb3NpdG9yaWVzKGxhc3Q6ICRyZXBvc2l0b3JpZXMsIGlzRm9yazogZmFsc2UsIG93bmVyQWZmaWxpYXRpb25zOiBPV05FUikge1xyXG4gICAgICB0b3RhbENvdW50XHJcbiAgICAgIHRvdGFsRGlza1VzYWdlXHJcbiAgICAgIG5vZGVzIHtcclxuICAgICAgICBuYW1lXHJcbiAgICAgICAgd2F0Y2hlcnMge1xyXG4gICAgICAgICAgdG90YWxDb3VudFxyXG4gICAgICAgIH1cclxuICAgICAgICBzdGFyZ2F6ZXJzIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgbGFuZ3VhZ2VzKGZpcnN0OiA0KSB7XHJcbiAgICAgICAgICBlZGdlcyB7XHJcbiAgICAgICAgICAgIHNpemVcclxuICAgICAgICAgICAgbm9kZSB7XHJcbiAgICAgICAgICAgICAgY29sb3JcclxuICAgICAgICAgICAgICBuYW1lXHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICAgaXNzdWVzX29wZW46IGlzc3VlcyhzdGF0ZXM6IE9QRU4pIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgaXNzdWVzX2Nsb3NlZDogaXNzdWVzKHN0YXRlczogQ0xPU0VEKSB7XHJcbiAgICAgICAgICB0b3RhbENvdW50XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHByX29wZW46IHB1bGxSZXF1ZXN0cyhzdGF0ZXM6IE9QRU4pIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgcHJfbWVyZ2VkOiBwdWxsUmVxdWVzdHMoc3RhdGVzOiBNRVJHRUQpIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgcmVsZWFzZXMge1xyXG4gICAgICAgICAgdG90YWxDb3VudFxyXG4gICAgICAgIH1cclxuICAgICAgICBmb3JrQ291bnRcclxuICAgICAgICBsaWNlbnNlSW5mbyB7XHJcbiAgICAgICAgICBzcGR4SWRcclxuICAgICAgICB9XHJcbiAgICAgIH1cclxuICAgIH1cclxuICAgIHBhY2thZ2VzIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3RhcnJlZFJlcG9zaXRvcmllcyB7XHJcbiAgICAgIHRvdGFsQ291bnRcclxuICAgIH1cclxuICAgIHdhdGNoaW5nIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3BvbnNvcnNoaXBzQXNTcG9uc29yIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3BvbnNvcnNoaXBzQXNNYWludGFpbmVyIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgY29udHJpYnV0aW9uc0NvbGxlY3Rpb24ge1xyXG4gICAgICB0b3RhbFJlcG9zaXRvcmllc1dpdGhDb250cmlidXRlZENvbW1pdHNcclxuICAgICAgdG90YWxDb21taXRDb250cmlidXRpb25zXHJcbiAgICAgIHJlc3RyaWN0ZWRDb250cmlidXRpb25zQ291bnRcclxuICAgICAgdG90YWxJc3N1ZUNvbnRyaWJ1dGlvbnNcclxuICAgICAgdG90YWxQdWxsUmVxdWVzdENvbnRyaWJ1dGlvbnNcc
Line truncated
+module.exports=(()=>{var _Mathhypot=Math.hypot,_Mathacos=Math.acos,_Mathtan=Math.tan,_Mathasin=Math.asin,_Mathsin=Math.sin,_Mathcos=Math.cos,_MathPI=Math.PI,_Mathsqrt=Math.sqrt,_NumberisInteger=Number.isInteger,_Stringprototype=String.prototype,_NumberPOSITIVE_INFINITY=Number.POSITIVE_INFINITY,_NumberNEGATIVE_INFINITY=Number.NEGATIVE_INFINITY,_NumberMAX_SAFE_INTEGER=Number.MAX_SAFE_INTEGER,_Mathround=Math.round,_StringfromCharCode=String.fromCharCode,_Mathabs=Math.abs,_Mathpow=Math.pow,_Mathceil=Math.ceil,_Mathfloor=Math.floor,_Mathmax=Math.max,_Mathmin=Math.min;function __webpack_require__(e){if(__webpack_module_cache__[e])return __webpack_module_cache__[e].exports;var t=__webpack_module_cache__[e]={exports:{}},r=!0;try{__webpack_modules__[e].call(t.exports,t,t.exports,__webpack_require__),r=!1}finally{r&&delete __webpack_module_cache__[e]}return t.exports}var __webpack_modules__={75935:(e,t,r)=>{"use strict";async function n({log:e=!0}={}){const t=e?console.debug:()=>null;t(`metrics/setup > setup`);const n="src/templates",a={templates:{},settings:{},statics:r.ab+"html",node_modules:f.resolve("node_modules")};if(t(`metrics/setup > load settings.json`),h.existsSync(r.ab+"settings.json")?(a.settings=JSON.parse(`${await h.promises.readFile(f.resolve("settings.json"))}`),t(`metrics/setup > load settings.json > success`)):t(`metrics/setup > load settings.json > (missing)`),a.settings.templates||(a.settings.templates={default:"classic",enabled:[]}),a.settings.plugins||(a.settings.plugins={}),a.settings.plugins.base={parts:["header","activity","community","repositories","metadata"]},a.settings.debug&&t(a.settings),t(`metrics/setup > load package.json`),h.existsSync(r.ab+"package.json")?(a.package=JSON.parse(`${await h.promises.readFile(f.resolve("package.json"))}`),t(`metrics/setup > load package.json > success`)):(t(`metrics/setup > load package.json > (missing)`),a.package={version:"2.8.0-beta",author:"lowlighter"}),h.existsSync(r.ab+"templates"))for(const e of await h.promises.readdir(n)){if(/.*[.]mjs$/.test(e))continue;t(`metrics/setup > load template [${e}]`);const r=[`${n}/${e}/query.graphql`,`${n}/${e}/image.svg`,`${n}/${e}/style.css`,`${n}/${e}/fonts.css`],[o,i,s,l]=await Promise.all(r.map(async e=>`${await h.promises.readFile(f.resolve(e))}`));a.templates[e]={query:o,image:i,style:s,fonts:l},t(`metrics/setup > load template [${e}] > success`),a.settings.debug&&Object.defineProperty(a.templates,e,{get(){t(`metrics/setup > reload template [${e}]`);const[n,a,o,i]=r.map(e=>`${h.readFileSync(f.resolve(e))}`);return t(`metrics/setup > reload template [${e}] > success`),{query:n,image:a,style:o,fonts:i}}})}else t(`metrics/setup > load templates from build`),a.templates=JSON.parse(Buffer.from(`eyJjbGFzc2ljIjp7InF1ZXJ5IjoicXVlcnkgTWV0cmljcyB7XHJcbiAgdXNlcihsb2dpbjogJGxvZ2luKSB7XHJcbiAgICBkYXRhYmFzZUlkXHJcbiAgICBuYW1lXHJcbiAgICBsb2dpblxyXG4gICAgY3JlYXRlZEF0XHJcbiAgICBhdmF0YXJVcmxcclxuICAgIHdlYnNpdGVVcmxcclxuICAgIGlzSGlyZWFibGVcclxuICAgIGdpc3RzIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgcmVwb3NpdG9yaWVzKGxhc3Q6ICRyZXBvc2l0b3JpZXMsIGlzRm9yazogZmFsc2UsIG93bmVyQWZmaWxpYXRpb25zOiBPV05FUikge1xyXG4gICAgICB0b3RhbENvdW50XHJcbiAgICAgIHRvdGFsRGlza1VzYWdlXHJcbiAgICAgIG5vZGVzIHtcclxuICAgICAgICBuYW1lXHJcbiAgICAgICAgd2F0Y2hlcnMge1xyXG4gICAgICAgICAgdG90YWxDb3VudFxyXG4gICAgICAgIH1cclxuICAgICAgICBzdGFyZ2F6ZXJzIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgbGFuZ3VhZ2VzKGZpcnN0OiA0KSB7XHJcbiAgICAgICAgICBlZGdlcyB7XHJcbiAgICAgICAgICAgIHNpemVcclxuICAgICAgICAgICAgbm9kZSB7XHJcbiAgICAgICAgICAgICAgY29sb3JcclxuICAgICAgICAgICAgICBuYW1lXHJcbiAgICAgICAgICAgIH1cclxuICAgICAgICAgIH1cclxuICAgICAgICB9XHJcbiAgICAgICAgaXNzdWVzX29wZW46IGlzc3VlcyhzdGF0ZXM6IE9QRU4pIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgaXNzdWVzX2Nsb3NlZDogaXNzdWVzKHN0YXRlczogQ0xPU0VEKSB7XHJcbiAgICAgICAgICB0b3RhbENvdW50XHJcbiAgICAgICAgfVxyXG4gICAgICAgIHByX29wZW46IHB1bGxSZXF1ZXN0cyhzdGF0ZXM6IE9QRU4pIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgcHJfbWVyZ2VkOiBwdWxsUmVxdWVzdHMoc3RhdGVzOiBNRVJHRUQpIHtcclxuICAgICAgICAgIHRvdGFsQ291bnRcclxuICAgICAgICB9XHJcbiAgICAgICAgcmVsZWFzZXMge1xyXG4gICAgICAgICAgdG90YWxDb3VudFxyXG4gICAgICAgIH1cclxuICAgICAgICBmb3JrQ291bnRcclxuICAgICAgICBsaWNlbnNlSW5mbyB7XHJcbiAgICAgICAgICBzcGR4SWRcclxuICAgICAgICB9XHJcbiAgICAgIH1cclxuICAgIH1cclxuICAgIHBhY2thZ2VzIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3RhcnJlZFJlcG9zaXRvcmllcyB7XHJcbiAgICAgIHRvdGFsQ291bnRcclxuICAgIH1cclxuICAgIHdhdGNoaW5nIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3BvbnNvcnNoaXBzQXNTcG9uc29yIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgc3BvbnNvcnNoaXBzQXNNYWludGFpbmVyIHtcclxuICAgICAgdG90YWxDb3VudFxyXG4gICAgfVxyXG4gICAgY29udHJpYnV0aW9uc0NvbGxlY3Rpb24ge1xyXG4gICAgICB0b3RhbFJlcG9zaXRvcmllc1dpdGhDb250cmlidXRlZENvbW1pdHNcclxuICAgICAgdG90YWxDb21taXRDb250cmlidXRpb25zXHJcbiAgICAgIHJlc3RyaWN0ZWRDb250cmlidXRpb25zQ291bnRcclxuICAgICAgdG90YWxJc3N1ZUNvbnRyaWJ1dGlvbnNcclxuICAgICAgdG90YWxQdWxsUmVxdWVzdENvbnRyaWJ1dGlvbnNcc
Line truncated
               query Gists {
                 user(login: "${e}") {
                   gists(last: 100) {

src/app.mjs

@@ -47,31 +47,25 @@
       const actions = {flush:new Map()}
       app.get("/", limiter, (req, res) => res.sendFile(`${conf.statics}/index.html`))
       app.get("/index.html", limiter, (req, res) => res.sendFile(`${conf.statics}/index.html`))
-      app.get("/app.js", limiter, (req, res) => res.sendFile(`${conf.statics}/app.js`))
-      app.get("/style.css", limiter, (req, res) => res.sendFile(`${conf.statics}/style.css`))
-      app.get("/.version", limiter, (req, res) => res.status(200).send(conf.package.version))
       app.get("/favicon.ico", limiter, (req, res) => res.sendStatus(204))
-      app.get("/plugins.list", limiter, (req, res) => res.status(200).json(enabled))
-      app.get("/templates.list", limiter, (req, res) => res.status(200).json(templates))
-      app.get("/plugins.base.parts.list", limiter, (req, res) => res.status(200).json(conf.settings.plugins.base.parts))
-      app.get("/ejs.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/ejs/ejs.min.js`))
-      app.get("/axios.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/axios/dist/axios.min.js`))
-      app.get("/axios.min.map", limiter, (req, res) => res.sendFile(`${conf.node_modules}/axios/dist/axios.min.map`))
-      app.get("/vue.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue/dist/vue.min.js`))
-      app.get("/vue.prism.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue-prism-component/dist/vue-prism-component.min.js`))
-      app.get("/vue-prism-component.min.js.map", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue-prism-component/dist/vue-prism-component.min.js.map`))
-      app.get("/prism.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/prism.js`))
-      app.get("/prism.yaml.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/components/prism-yaml.min.js`))
-      app.get("/prism.markdown.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/components/prism-markdown.min.js`))
-      app.get("/style.prism.css", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/themes/prism-tomorrow.css`))
-      app.get("/placeholder.json", limiter, async (req, res) => {
-        const template = req.query.template || conf.settings.templates.default
-        if (!(template in Templates))
-          return res.sendStatus(404)
-        const {style, image, fonts} = conf.templates[template]
-        res.status(200).json({style, image, fonts})
-      })
-      app.get("/action.flush", limiter, async (req, res) => {
+      app.get("/.version", limiter, (req, res) => res.status(200).send(conf.package.version))
+      app.get("/.requests", limiter, async (req, res) => res.status(200).json((await rest.rateLimit.get()).data.rate))
+      app.get("/.templates", limiter, (req, res) => res.status(200).json(templates))
+      app.get("/.plugins", limiter, (req, res) => res.status(200).json(enabled))
+      app.get("/.plugins.base", limiter, (req, res) => res.status(200).json(conf.settings.plugins.base.parts))
+      app.get("/.css/style.css", limiter, (req, res) => res.sendFile(`${conf.statics}/style.css`))
+      app.get("/.css/style.prism.css", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/themes/prism-tomorrow.css`))
+      app.get("/.js/app.js", limiter, (req, res) => res.sendFile(`${conf.statics}/app.js`))
+      app.get("/.js/ejs.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/ejs/ejs.min.js`))
+      app.get("/.js/axios.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/axios/dist/axios.min.js`))
+      app.get("/.js/axios.min.map", limiter, (req, res) => res.sendFile(`${conf.node_modules}/axios/dist/axios.min.map`))
+      app.get("/.js/vue.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue/dist/vue.min.js`))
+      app.get("/.js/vue.prism.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue-prism-component/dist/vue-prism-component.min.js`))
+      app.get("/.js/vue-prism-component.min.js.map", limiter, (req, res) => res.sendFile(`${conf.node_modules}/vue-prism-component/dist/vue-prism-component.min.js.map`))
+      app.get("/.js/prism.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/prism.js`))
+      app.get("/.js/prism.yaml.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/components/prism-yaml.min.js`))
+      app.get("/.js/prism.markdown.min.js", limiter, (req, res) => res.sendFile(`${conf.node_modules}/prismjs/components/prism-markdown.min.js`))
+      app.get("/.uncache", limiter, async (req, res) => {
         const {token, user} = req.query
         if (token) {
           if (actions.flush.has(token)) {

src/html/app.js

@@ -1,9 +1,9 @@
 ;(async function() {
   //Init
     const url = new URLSearchParams(window.location.search)
-    const {data:templates} = await axios.get("/templates.list")
-    const {data:plugins} = await axios.get("/plugins.list")
-    const {data:base} = await axios.get("/plugins.base.parts.list")
+    const {data:templates} = await axios.get("/.templates")
+    const {data:plugins} = await axios.get("/.plugins")
+    const {data:base} = await axios.get("/.plugins.base")
     const {data:version} = await axios.get("/.version")
   //App
     return new Vue({
@@ -18,6 +18,7 @@
           version,
           user:url.get("user") || "",
           palette:url.get("palette") || (window.matchMedia && window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light") || "light",
+          requests:{limit:0, used:0, remaining:0, reset:0},
           plugins:{
             base,
             list:plugins,
@@ -45,10 +46,13 @@
               "pagespeed.detailed":false,
               "habits.from":100,
               "music.playlist":"",
-              "music.mode":"playlist",
               "music.limit":4,
               "posts.limit":4,
               "posts.source":"dev.to",
+              "isocalendar.duration":"half-year",
+              "projects.limit":4,
+              "topics.sort":"stars",
+              "topics.limit":12,
             },
           },
           templates:{
@@ -130,6 +134,8 @@
                 const url = this.url.replace(new RegExp(`${this.user}(\\?|$)`), "placeholder$1")
                 this.templates.placeholder = this.serialize((await axios.get(url)).data)
                 this.generated.content = ""
+              //Start GitHub rate limiter tracker
+                this.ghlimit()
             },
           //Generate metrics and flush cache
             async generate() {
@@ -139,7 +145,7 @@
                 this.generated.pending = true
               //Compute metrics
                 try {
-                  await axios.get(`/action.flush?&token=${(await axios.get(`/action.flush?user=${this.user}`)).data.token}`)
+                  await axios.get(`/.uncache?&token=${(await axios.get(`/.uncache?user=${this.user}`)).data.token}`)
                   this.generated.content = this.serialize((await axios.get(this.url)).data)
                 } catch {
                   this.generated.error = true
@@ -152,6 +158,13 @@
             serialize(svg) {
               return `data:image/svg+xml;base64,${btoa(unescape(encodeURIComponent(svg)))}`
             },
+          //Update reate limit requests
+            async ghlimit() {
+              const {data:requests} = await axios.get("/.requests")
+              this.requests = requests
+              setTimeout(() => this.ghlimit(), 30*1000)
+              console.log("yeh")
+            }
         },
     })
 })()

src/html/index.html

@@ -6,8 +6,8 @@
     <meta name="description" content="A SVG image generator which includes activity, community and repositories metrics about your GitHub account that you can includes on your profile">
     <meta name="author" content="lowlighter">
     <link rel="icon" href="data:,">
-    <link rel="stylesheet" href="/style.css">
-    <link rel="stylesheet" href="/style.prism.css" />
+    <link rel="stylesheet" href="/.css/style.css">
+    <link rel="stylesheet" href="/.css/style.prism.css" />
   </head>
   <body>
     <!-- Vue app -->
@@ -51,25 +51,80 @@
                   </label>
                 </div>
                 <i>*Additional plugins may be available when used as GitHub Action</i>
-                <template v-if="(plugins.enabled.pagespeed)||(plugins.enabled.habits)||(plugins.enabled.music)||(plugins.enabled.posts)">
+                <template v-if="(plugins.enabled.music)||(plugins.enabled.pagespeed)||(plugins.enabled.habits)||(plugins.enabled.posts)||(plugins.enabled.isocalendar)||(plugins.enabled.projects)||(plugins.enabled.topics)">
                   <h3>2.3 Configure additional plugins</h3>
                   <div class="options">
-                    <label v-if="plugins.enabled.pagespeed">
-                      Detailed PageSpeed report
-                      <input type="checkbox" v-model="plugins.options['pagespeed.detailed']" @change="load">
-                    </label>
-                    <label v-if="(plugins.enabled.music)&&(plugins.options['music.mode'] === 'playlist')">
-                      Playlist embed link
-                      <input type="text" v-model="plugins.options['music.playlist']" placeholder="https://embed.music.apple.com/en/playlist/">
-                    </label>
-                    <label v-if="plugins.enabled.habits">
-                      Number of events for habits
-                      <input type="number" v-model="plugins.options['habits.from']" min="1" max="100">
-                    </label>
-                    <label v-if="plugins.enabled.posts">
-                      Posts source
-                      <input type="text" v-model="plugins.options['posts.source']" disabled>
-                    </label>
+                    <div class="options-group" v-if="plugins.enabled.music">
+                      <h4>{{ plugins.descriptions.music }}</h4>
+                      <label>
+                        Playlist embed link
+                        <input type="text" v-model="plugins.options['music.playlist']" placeholder="https://embed.music.apple.com/en/playlist/">
+                      </label>
+                      <label>
+                        Number of tracks to display
+                        <input type="number" v-model="plugins.options['music.limit']" min="1" @change="load">
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.pagespeed">
+                      <h4>{{ plugins.descriptions.pagespeed }}</h4>
+                      <label>
+                        Detailed PageSpeed report
+                        <input type="checkbox" v-model="plugins.options['pagespeed.detailed']" @change="load">
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.habits">
+                      <h4>{{ plugins.descriptions.habits }}</h4>
+                      <label>
+                        Number of events for habits
+                        <input type="number" v-model="plugins.options['habits.from']" min="1" max="100">
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.posts">
+                      <h4>{{ plugins.descriptions.posts }}</h4>
+                      <label>
+                        Posts source
+                        <select v-model="plugins.options['posts.source']" disabled>
+                          <option value="dev.to">dev.to</option>
+                        </select>
+                      </label>
+                      <label>
+                        Number of posts to display
+                        <input type="number" v-model="plugins.options['posts.limit']" min="1" @change="load">
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.isocalendar">
+                      <h4>{{ plugins.descriptions.isocalendar }}</h4>
+                      <label>
+                        Isocalendar duration
+                        <select v-model="plugins.options['isocalendar.duration']">
+                          <option value="half-year">Half year</option>
+                          <option value="full-year">Full year</option>
+                        </select>
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.topics">
+                      <h4>{{ plugins.descriptions.topics }}</h4>
+                      <label>
+                        Topics sorting
+                        <select v-model="plugins.options['topics.sort']">
+                          <option value="starred">Recently starred by you</option>
+                          <option value="stars">Most stars</option>
+                          <option value="activity">Recent actity</option>
+                          <option value="random">Random</option>
+                        </select>
+                      </label>
+                      <label>
+                        Number of topics to display
+                        <input type="number" v-model="plugins.options['topics.limit']" @change="load">
+                      </label>
+                    </div>
+                    <div class="options-group" v-if="plugins.enabled.projects">
+                      <h4>{{ plugins.descriptions.projects }}</h4>
+                      <label>
+                        Number of projects to display
+                        <input type="number" v-model="plugins.options['projects.limit']" min="1" max="100" @change="load">
+                      </label>
+                    </div>
                   </div>
                 </template>
               </template>
@@ -128,15 +183,19 @@
           </section>
         </section>
       </template>
+      <!-- GitHub requests tracker -->
+      <template>
+        <div class="gh-requests">{{ requests.remaining }} GitHub request{{ requests.remaining > 1 ? "s" : "" }} remaining</div>
+      </template>
     </main>
     <!-- Scripts -->
-    <script src="/axios.min.js"></script>
-    <script src="/prism.min.js"></script>
-    <script src="/prism.markdown.min.js"></script>
-    <script src="/prism.yaml.min.js"></script>
-    <script src="/ejs.min.js"></script>
-    <script src="/vue.min.js"></script>
-    <script src="/vue.prism.min.js"></script>
-    <script src="/app.js"></script>
+    <script src="/.js/axios.min.js"></script>
+    <script src="/.js/prism.min.js"></script>
+    <script src="/.js/prism.markdown.min.js"></script>
+    <script src="/.js/prism.yaml.min.js"></script>
+    <script src="/.js/ejs.min.js"></script>
+    <script src="/.js/vue.min.js"></script>
+    <script src="/.js/vue.prism.min.js"></script>
+    <script src="/.js/app.js"></script>
   </body>
 </html>

src/html/style.css

@@ -142,6 +142,16 @@
     display: flex;
     flex-direction: column;
   }
+  .options-group {
+    display: flex;
+    flex-direction: column;
+  }
+  .options-group label {
+    margin: 0;
+  }
+  .options-group h4 {
+    margin-bottom: 0;
+  }
 /* Code snippets */
   .code {
     display: flex;
@@ -193,4 +203,11 @@
     display: flex;
     justify-content: center;
     align-items: center;
+  }
+/* Github requests */
+  .gh-requests {
+    position: fixed;
+    right: .25rem;
+    bottom: .25rem;
+    font-size: .8rem;
   }

src/metrics.mjs

@@ -167,8 +167,8 @@
             followup:{issues:{count:0}, pr:{count:0}},
             habits:{indents:{style:`########`}},
             languages:{favorites:new Array(7).fill(null).map((_, x) => ({x, name:"######", color:"#ebedf0", value:1/(x+1)}))},
-            topics:{list:[...new Array(12).fill(null).map(() => ({name:"######", description:"", icon:null})), {name:`And ## more...`, description:"", icon:null}]},
-            projects:{list:[...new Array(4).fill(null).map(() => ({name:"########", updated:"########", progress:{enabled:true, todo:"##", doing:"##", done:"##", total:"##"}}))]},
+            topics:{list:[...new Array("topics.limit" in q ? Math.max(Number(q["topics.limit"])||0, 0) : 12).fill(null).map(() => ({name:"######", description:"", icon:null})), {name:`And ## more...`, description:"", icon:null}]},
+            projects:{list:[...new Array("projects.limit" in q ? Math.max(Number(q["projects.limit"])||0, 0) : 4).fill(null).map(() => ({name:"########", updated:"########", progress:{enabled:true, todo:"##", doing:"##", done:"##", total:"##"}}))]},
           }[key]??{})]
         )),
       })