diff --git a/.github/ISSUE_TEMPLATE/-send-your-theme.md b/.github/ISSUE_TEMPLATE/-send-your-theme.md index aa74779..e9f988f 100644 --- a/.github/ISSUE_TEMPLATE/-send-your-theme.md +++ b/.github/ISSUE_TEMPLATE/-send-your-theme.md @@ -1,9 +1,9 @@ --- -name: "❤ Send Your Theme" +name: "❤ Send Your Theme" about: An easy way to submit your theme if you don't know how to do it via pull request. title: "[NEWTHEME] Name of your theme" labels: new theme -assignees: Neikon +assignees: Neikon, BeyondMagic --- @@ -12,10 +12,11 @@ Replace the .......... with the corresponding information. Example: ``` { "title": "the best dark theme", - "link": "https://github.com/myTheme", + "link": "https://github.com/myuser/myTheme", "description": "a dark theme", - "image": "https://raw.githubusercontent.com/previewthemepicture.png" - "tags": [ "John", "dark", "minimal","oneline", "............." ] + "image": "https://raw.githubusercontent.com/previewthemepicture.png", + "tags": [ "John", "dark", "minimal","oneline", "............." ], + "repository": "https://github.com/myuser/myTheme" } ``` ################# DELETE UNTIL HERE ################# @@ -25,7 +26,8 @@ Replace the .......... with the corresponding information. Example: "title": "..........", "link": "..........", "description": "..........", - "image": ".........." - "tags": [ "your username/name", "theme type: dark", "theme type: light", "............." ] + "image": "..........", + "tags": [ "your username/name", "theme type: dark", "theme type: light", "............." ], + "repository": ".........." } ``` diff --git a/README.md b/README.md index af8605d..05e57d9 100644 --- a/README.md +++ b/README.md @@ -36,13 +36,15 @@ A collection site of Firefox userchrome themes, mostly from FirefoxCSS Reddit.What do you think =?

Feel free to send me any feedback via issue or my twitter @Neikon66.

diff --git a/dev/js/main.js b/dev/js/main.js index 2cd8e1b..8c98cd3 100644 --- a/dev/js/main.js +++ b/dev/js/main.js @@ -81,109 +81,134 @@ function createLightbox (id) { * ====================== */ - document.getElementById('searchInput').addEventListener('keydown', e => { + const search = /** @type {HTMLInputElement} */ (document.getElementById('searchInput')) - if (e.key === "Enter") toggleSortType(false) + search.addEventListener('keydown', e => { + + if (e.key === "Enter") + sort(localStorage.sort, search.value) }) - document.getElementById('searchButton').addEventListener('click', () => toggleSortType(false)) + const search_button = /** @type {HTMLInputElement} */ (document.getElementById('searchButton')) + search_button.addEventListener('click', () => sort(localStorage.sort, search.value)) /* Load Content * ============ */ - // add our sorting button - const sortTrigger = document.getElementById('js-sortSwitcher') - sortTrigger.addEventListener('click', () => toggleSortType(true)) - - // When localstorage is not set, use "latest" order type - if (!localStorage['sort']) localStorage['sort'] = 'latest' - - function repeatToggle (nextType) { - - localStorage['sort'] = nextType - return toggleSortType(false) - - } - - function toggleSortType (change) { - - if (document.querySelectorAll('.card')) - document.querySelectorAll('.card').forEach(e => e.remove()); - - fetch('themes.json') - .then(data => data.json()) - .then(parsedData => { - - const search = document.getElementById('searchInput').value - - if (search) { - - function matches (text, partial) { return text.toLowerCase().indexOf(partial.toLowerCase()) > -1 } - - const parsedAsArray = Object.entries(parsedData) - let searchResults = parsedAsArray.filter(element => matches(`${element[1].title}, ${element[1].tags}`, search)) - - searchResults.forEach(result => { - - const card = new Card(result[1], +result[0]) - card.render(outputContainer) - - }) - - sortTrigger.title = `"${search}"` - - return - - } - - switch (localStorage['sort']) { - - // sort from the oldest theme added - case 'latest': - if (change) return repeatToggle('random') - parsedData.reverse() - break; - - // sort randomly - case 'random': - if (change) return repeatToggle('oldest') - for (let i = parsedData.length - 1; i > 0; i--) { - - const j = Math.floor(Math.random() * (i + 1)); - [parsedData[i], parsedData[j]] = [parsedData[j], parsedData[i]] - - } - break; - - // sort from the most recent theme added - default: - if (change) return repeatToggle('latest'); - - } - - // TODO: make a better way to preview the current sorting - sortTrigger.title = localStorage['sort'] - - parsedData.forEach((entry, index) => { - - const card = new Card (entry, index) - card.render(outputContainer) + /* + * If sorting is not set yet in `localStorage`, + * then use as default `latest` kind. + */ + if (!localStorage.sort) + localStorage.sort = 'latest' + + /* + * Add event to sort when an option is chosen.. + */ + const sort_menu = /** @type {HTMLSelectElement} */ (document.getElementById('js-sort-menu')) + sort_menu.addEventListener('change', () => { + const name = /** @type {string} */ (sort_menu.selectedOptions[0].getAttribute('name')) + sort(name) + }) + + sort(localStorage.sort) + const current_option = sort_menu.options.namedItem(localStorage.sort) + if (current_option) + current_option.selected = true + + /** + * Toggle the sorting type of the themes. + * + * @param {string} kind How to sort the themes. + * @param {string=} filter Term to filter the themes. + **/ + function sort (kind, filter) { + + localStorage.sort = kind + + // Remove all themes cards from the page. + const cards_container = document.getElementById('themes_container') + if (cards_container) + cards_container.innerHTML = '' + + fetch('themes.json') + .then(data => data.json()) + .then(async data => { + + data = Object.entries(data) + + if (filter) { + + /** + * Match any substring (partial) from a string (text). + * @param {string} text + * @param {string} partial + */ + function matches (text, partial) { + return text.toLowerCase().indexOf(partial.toLowerCase()) > -1 + } + + data = data.filter(element => matches(`${element[1].title}, ${element[1].tags}`, search.value)) + + } + + switch (localStorage.sort) { + + /* + * Sort from the most recent theme added. + */ + case 'latest': + data.reverse() + break + + /* + * Ascending sorting of stars from repositories. + */ + case 'updated': + // item1.attr.localeCompare(item2.attr); + data.sort((a, b) => b[1].pushed_at.localeCompare(a[1].pushed_at)) + break + + /* + * Ascending sorting of stars from repositories. + */ + case 'stars': + data.sort((a, b) => b[1].stargazers_count - a[1].stargazers_count) + break + + /* + * Randomly sorting of themes. + */ + case 'random': + for (let i = data.length - 1; i > 0; i--) { + const j = Math.floor(Math.random() * (i + 1)); + [data[i], data[j]] = [data[j], data[i]] + } + break + + /* + * Sort from the least recent theme added (oldest). + * Since it's sorted like this by default from the file, do nothing. + */ + default: + + } + + for (const [index, entry] of data) + { + const card = new Card(entry, index) + card.render(outputContainer) + await new Promise(r => setTimeout(r, 666)); + } + + }) +} - }) - - }) - } - // add themes const outputContainer = document.getElementById('themes_container') - if (outputContainer) toggleSortType(false); - - - - /* Theme Handling * ============== */ diff --git a/dev/pug/disclaimer.pug b/dev/pug/disclaimer.pug index 77299db..aeb66e9 100644 --- a/dev/pug/disclaimer.pug +++ b/dev/pug/disclaimer.pug @@ -1,5 +1,13 @@ extends layout/default +block header + header#main_header + h3.header-branding FirefoxCSS Store + + nav#main_nav + a(href='index.html') Theme List + a#js-themeSwitcher(href='#') + i.fas.fa-moon block content diff --git a/dev/pug/includes/header.pug b/dev/pug/includes/header.pug index 5e409cb..a4579c3 100644 --- a/dev/pug/includes/header.pug +++ b/dev/pug/includes/header.pug @@ -5,8 +5,12 @@ header#main_header a(href='index.html') Theme List a#js-themeSwitcher(href='#') i.fas.fa-moon - a#js-sortSwitcher(href='#') - i.fas.fa-sort + select#js-sort-menu + option(name='updated') Updated + option(name='stars') Stars + option(name='latest') Latest + option(name='oldest') Oldest + option(name='random') Random div.searchform(method='get') .inputgroup input.searchinput#searchInput(type='text', placeholder='Search') diff --git a/dev/pug/layout/default.pug b/dev/pug/layout/default.pug index e5859ea..dcc5f24 100644 --- a/dev/pug/layout/default.pug +++ b/dev/pug/layout/default.pug @@ -25,4 +25,4 @@ html include ../includes/footer script(src='assets/js/main.js') - script(src='https://kit.fontawesome.com/1c8bd05656.js' crossorigin='anonymous') + script(src='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/js/all.min.js' type="text/javascript") diff --git a/dev/scss/base/_typography.scss b/dev/scss/base/_typography.scss index 89c44e9..b0fb6d9 100644 --- a/dev/scss/base/_typography.scss +++ b/dev/scss/base/_typography.scss @@ -13,7 +13,6 @@ body { } - a { text-decoration: none; @@ -25,6 +24,7 @@ a { &:hover { color: var(--linkc-hover) } &:focus { outline: var(--focus-thickness) solid var(--focus-colour); } + } diff --git a/docs/assets/js/main.js b/docs/assets/js/main.js index 5390e98..903332a 100644 --- a/docs/assets/js/main.js +++ b/docs/assets/js/main.js @@ -1,9 +1,19 @@ "use strict"; +function _regeneratorRuntime() { "use strict"; /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/facebook/regenerator/blob/main/LICENSE */ _regeneratorRuntime = function _regeneratorRuntime() { return e; }; var t, e = {}, r = Object.prototype, n = r.hasOwnProperty, o = Object.defineProperty || function (t, e, r) { t[e] = r.value; }, i = "function" == typeof Symbol ? Symbol : {}, a = i.iterator || "@@iterator", c = i.asyncIterator || "@@asyncIterator", u = i.toStringTag || "@@toStringTag"; function define(t, e, r) { return Object.defineProperty(t, e, { value: r, enumerable: !0, configurable: !0, writable: !0 }), t[e]; } try { define({}, ""); } catch (t) { define = function define(t, e, r) { return t[e] = r; }; } function wrap(t, e, r, n) { var i = e && e.prototype instanceof Generator ? e : Generator, a = Object.create(i.prototype), c = new Context(n || []); return o(a, "_invoke", { value: makeInvokeMethod(t, r, c) }), a; } function tryCatch(t, e, r) { try { return { type: "normal", arg: t.call(e, r) }; } catch (t) { return { type: "throw", arg: t }; } } e.wrap = wrap; var h = "suspendedStart", l = "suspendedYield", f = "executing", s = "completed", y = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} var p = {}; define(p, a, function () { return this; }); var d = Object.getPrototypeOf, v = d && d(d(values([]))); v && v !== r && n.call(v, a) && (p = v); var g = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(p); function defineIteratorMethods(t) { ["next", "throw", "return"].forEach(function (e) { define(t, e, function (t) { return this._invoke(e, t); }); }); } function AsyncIterator(t, e) { function invoke(r, o, i, a) { var c = tryCatch(t[r], t, o); if ("throw" !== c.type) { var u = c.arg, h = u.value; return h && "object" == _typeof(h) && n.call(h, "__await") ? e.resolve(h.__await).then(function (t) { invoke("next", t, i, a); }, function (t) { invoke("throw", t, i, a); }) : e.resolve(h).then(function (t) { u.value = t, i(u); }, function (t) { return invoke("throw", t, i, a); }); } a(c.arg); } var r; o(this, "_invoke", { value: function value(t, n) { function callInvokeWithMethodAndArg() { return new e(function (e, r) { invoke(t, n, e, r); }); } return r = r ? r.then(callInvokeWithMethodAndArg, callInvokeWithMethodAndArg) : callInvokeWithMethodAndArg(); } }); } function makeInvokeMethod(e, r, n) { var o = h; return function (i, a) { if (o === f) throw Error("Generator is already running"); if (o === s) { if ("throw" === i) throw a; return { value: t, done: !0 }; } for (n.method = i, n.arg = a;;) { var c = n.delegate; if (c) { var u = maybeInvokeDelegate(c, n); if (u) { if (u === y) continue; return u; } } if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) { if (o === h) throw o = s, n.arg; n.dispatchException(n.arg); } else "return" === n.method && n.abrupt("return", n.arg); o = f; var p = tryCatch(e, r, n); if ("normal" === p.type) { if (o = n.done ? s : l, p.arg === y) continue; return { value: p.arg, done: n.done }; } "throw" === p.type && (o = s, n.method = "throw", n.arg = p.arg); } }; } function maybeInvokeDelegate(e, r) { var n = r.method, o = e.iterator[n]; if (o === t) return r.delegate = null, "throw" === n && e.iterator["return"] && (r.method = "return", r.arg = t, maybeInvokeDelegate(e, r), "throw" === r.method) || "return" !== n && (r.method = "throw", r.arg = new TypeError("The iterator does not provide a '" + n + "' method")), y; var i = tryCatch(o, e.iterator, r.arg); if ("throw" === i.type) return r.method = "throw", r.arg = i.arg, r.delegate = null, y; var a = i.arg; return a ? a.done ? (r[e.resultName] = a.value, r.next = e.nextLoc, "return" !== r.method && (r.method = "next", r.arg = t), r.delegate = null, y) : a : (r.method = "throw", r.arg = new TypeError("iterator result is not an object"), r.delegate = null, y); } function pushTryEntry(t) { var e = { tryLoc: t[0] }; 1 in t && (e.catchLoc = t[1]), 2 in t && (e.finallyLoc = t[2], e.afterLoc = t[3]), this.tryEntries.push(e); } function resetTryEntry(t) { var e = t.completion || {}; e.type = "normal", delete e.arg, t.completion = e; } function Context(t) { this.tryEntries = [{ tryLoc: "root" }], t.forEach(pushTryEntry, this), this.reset(!0); } function values(e) { if (e || "" === e) { var r = e[a]; if (r) return r.call(e); if ("function" == typeof e.next) return e; if (!isNaN(e.length)) { var o = -1, i = function next() { for (; ++o < e.length;) if (n.call(e, o)) return next.value = e[o], next.done = !1, next; return next.value = t, next.done = !0, next; }; return i.next = i; } } throw new TypeError(_typeof(e) + " is not iterable"); } return GeneratorFunction.prototype = GeneratorFunctionPrototype, o(g, "constructor", { value: GeneratorFunctionPrototype, configurable: !0 }), o(GeneratorFunctionPrototype, "constructor", { value: GeneratorFunction, configurable: !0 }), GeneratorFunction.displayName = define(GeneratorFunctionPrototype, u, "GeneratorFunction"), e.isGeneratorFunction = function (t) { var e = "function" == typeof t && t.constructor; return !!e && (e === GeneratorFunction || "GeneratorFunction" === (e.displayName || e.name)); }, e.mark = function (t) { return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, define(t, u, "GeneratorFunction")), t.prototype = Object.create(g), t; }, e.awrap = function (t) { return { __await: t }; }, defineIteratorMethods(AsyncIterator.prototype), define(AsyncIterator.prototype, c, function () { return this; }), e.AsyncIterator = AsyncIterator, e.async = function (t, r, n, o, i) { void 0 === i && (i = Promise); var a = new AsyncIterator(wrap(t, r, n, o), i); return e.isGeneratorFunction(r) ? a : a.next().then(function (t) { return t.done ? t.value : a.next(); }); }, defineIteratorMethods(g), define(g, u, "Generator"), define(g, a, function () { return this; }), define(g, "toString", function () { return "[object Generator]"; }), e.keys = function (t) { var e = Object(t), r = []; for (var n in e) r.push(n); return r.reverse(), function next() { for (; r.length;) { var t = r.pop(); if (t in e) return next.value = t, next.done = !1, next; } return next.done = !0, next; }; }, e.values = values, Context.prototype = { constructor: Context, reset: function reset(e) { if (this.prev = 0, this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(resetTryEntry), !e) for (var r in this) "t" === r.charAt(0) && n.call(this, r) && !isNaN(+r.slice(1)) && (this[r] = t); }, stop: function stop() { this.done = !0; var t = this.tryEntries[0].completion; if ("throw" === t.type) throw t.arg; return this.rval; }, dispatchException: function dispatchException(e) { if (this.done) throw e; var r = this; function handle(n, o) { return a.type = "throw", a.arg = e, r.next = n, o && (r.method = "next", r.arg = t), !!o; } for (var o = this.tryEntries.length - 1; o >= 0; --o) { var i = this.tryEntries[o], a = i.completion; if ("root" === i.tryLoc) return handle("end"); if (i.tryLoc <= this.prev) { var c = n.call(i, "catchLoc"), u = n.call(i, "finallyLoc"); if (c && u) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } else if (c) { if (this.prev < i.catchLoc) return handle(i.catchLoc, !0); } else { if (!u) throw Error("try statement without catch or finally"); if (this.prev < i.finallyLoc) return handle(i.finallyLoc); } } } }, abrupt: function abrupt(t, e) { for (var r = this.tryEntries.length - 1; r >= 0; --r) { var o = this.tryEntries[r]; if (o.tryLoc <= this.prev && n.call(o, "finallyLoc") && this.prev < o.finallyLoc) { var i = o; break; } } i && ("break" === t || "continue" === t) && i.tryLoc <= e && e <= i.finallyLoc && (i = null); var a = i ? i.completion : {}; return a.type = t, a.arg = e, i ? (this.method = "next", this.next = i.finallyLoc, y) : this.complete(a); }, complete: function complete(t, e) { if ("throw" === t.type) throw t.arg; return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && e && (this.next = e), y; }, finish: function finish(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.finallyLoc === t) return this.complete(r.completion, r.afterLoc), resetTryEntry(r), y; } }, "catch": function _catch(t) { for (var e = this.tryEntries.length - 1; e >= 0; --e) { var r = this.tryEntries[e]; if (r.tryLoc === t) { var n = r.completion; if ("throw" === n.type) { var o = n.arg; resetTryEntry(r); } return o; } } throw Error("illegal catch attempt"); }, delegateYield: function delegateYield(e, r, n) { return this.delegate = { iterator: values(e), resultName: r, nextLoc: n }, "next" === this.method && (this.arg = t), y; } }, e; } +function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); } +function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } +function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } } +function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } +function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; } +function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } } +function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; } +function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); } +function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; } function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); } -function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } -function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor); } } -function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; } +function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); } +function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } } +function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; } function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; } function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); } function sanatise(unsanatisedInput) { @@ -46,87 +56,140 @@ function createLightbox(id) { * ====================== */ - document.getElementById('searchInput').addEventListener('keydown', function (e) { - if (e.key === "Enter") toggleSortType(false); + var search = /** @type {HTMLInputElement} */document.getElementById('searchInput'); + search.addEventListener('keydown', function (e) { + if (e.key === "Enter") sort(localStorage.sort, search.value); }); - document.getElementById('searchButton').addEventListener('click', function () { - return toggleSortType(false); + var search_button = /** @type {HTMLInputElement} */document.getElementById('searchButton'); + search_button.addEventListener('click', function () { + return sort(localStorage.sort, search.value); }); /* Load Content * ============ */ - // add our sorting button - var sortTrigger = document.getElementById('js-sortSwitcher'); - sortTrigger.addEventListener('click', function () { - return toggleSortType(true); + /* + * If sorting is not set yet in `localStorage`, + * then use as default `latest` kind. + */ + if (!localStorage.sort) localStorage.sort = 'latest'; + + /* + * Add event to sort when an option is chosen.. + */ + var sort_menu = /** @type {HTMLSelectElement} */document.getElementById('js-sort-menu'); + sort_menu.addEventListener('change', function () { + var name = /** @type {string} */sort_menu.selectedOptions[0].getAttribute('name'); + sort(name); }); + sort(localStorage.sort); + var current_option = sort_menu.options.namedItem(localStorage.sort); + if (current_option) current_option.selected = true; - // When localstorage is not set, use "latest" order type - if (!localStorage['sort']) localStorage['sort'] = 'latest'; - function repeatToggle(nextType) { - localStorage['sort'] = nextType; - return toggleSortType(false); - } - function toggleSortType(change) { - if (document.querySelectorAll('.card')) document.querySelectorAll('.card').forEach(function (e) { - return e.remove(); - }); + /** + * Toggle the sorting type of the themes. + * + * @param {string} kind How to sort the themes. + * @param {string=} filter Term to filter the themes. + **/ + function sort(kind, filter) { + localStorage.sort = kind; + + // Remove all themes cards from the page. + var cards_container = document.getElementById('themes_container'); + if (cards_container) cards_container.innerHTML = ''; fetch('themes.json').then(function (data) { return data.json(); - }).then(function (parsedData) { - var search = document.getElementById('searchInput').value; - if (search) { - var matches = function matches(text, partial) { - return text.toLowerCase().indexOf(partial.toLowerCase()) > -1; - }; - var parsedAsArray = Object.entries(parsedData); - var searchResults = parsedAsArray.filter(function (element) { - return matches("".concat(element[1].title, ", ").concat(element[1].tags), search); - }); - searchResults.forEach(function (result) { - var card = new Card(result[1], +result[0]); - card.render(outputContainer); - }); - sortTrigger.title = "\"".concat(search, "\""); - return; - } - switch (localStorage['sort']) { - // sort from the oldest theme added - case 'latest': - if (change) return repeatToggle('random'); - parsedData.reverse(); - break; - - // sort randomly - case 'random': - if (change) return repeatToggle('oldest'); - for (var i = parsedData.length - 1; i > 0; i--) { - var j = Math.floor(Math.random() * (i + 1)); - var _ref = [parsedData[j], parsedData[i]]; - parsedData[i] = _ref[0]; - parsedData[j] = _ref[1]; + }).then( /*#__PURE__*/function () { + var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(data) { + var matches, i, j, _ref2, _iterator, _step, _step$value, index, entry, card; + return _regeneratorRuntime().wrap(function _callee$(_context) { + while (1) switch (_context.prev = _context.next) { + case 0: + data = Object.entries(data); + if (filter) { + /** + * Match any substring (partial) from a string (text). + * @param {string} text + * @param {string} partial + */ + matches = function matches(text, partial) { + return text.toLowerCase().indexOf(partial.toLowerCase()) > -1; + }; + data = data.filter(function (element) { + return matches("".concat(element[1].title, ", ").concat(element[1].tags), search.value); + }); + } + _context.t0 = localStorage.sort; + _context.next = _context.t0 === 'latest' ? 5 : _context.t0 === 'updated' ? 7 : _context.t0 === 'stars' ? 9 : _context.t0 === 'random' ? 11 : 13; + break; + case 5: + data.reverse(); + return _context.abrupt("break", 13); + case 7: + // item1.attr.localeCompare(item2.attr); + data.sort(function (a, b) { + return b[1].pushed_at.localeCompare(a[1].pushed_at); + }); + return _context.abrupt("break", 13); + case 9: + data.sort(function (a, b) { + return b[1].stargazers_count - a[1].stargazers_count; + }); + return _context.abrupt("break", 13); + case 11: + for (i = data.length - 1; i > 0; i--) { + j = Math.floor(Math.random() * (i + 1)); + _ref2 = [data[j], data[i]]; + data[i] = _ref2[0]; + data[j] = _ref2[1]; + } + return _context.abrupt("break", 13); + case 13: + _iterator = _createForOfIteratorHelper(data); + _context.prev = 14; + _iterator.s(); + case 16: + if ((_step = _iterator.n()).done) { + _context.next = 24; + break; + } + _step$value = _slicedToArray(_step.value, 2), index = _step$value[0], entry = _step$value[1]; + card = new Card(entry, index); + card.render(outputContainer); + _context.next = 22; + return new Promise(function (r) { + return setTimeout(r, 666); + }); + case 22: + _context.next = 16; + break; + case 24: + _context.next = 29; + break; + case 26: + _context.prev = 26; + _context.t1 = _context["catch"](14); + _iterator.e(_context.t1); + case 29: + _context.prev = 29; + _iterator.f(); + return _context.finish(29); + case 32: + case "end": + return _context.stop(); } - break; - - // sort from the most recent theme added - default: - if (change) return repeatToggle('latest'); - } - - // TODO: make a better way to preview the current sorting - sortTrigger.title = localStorage['sort']; - parsedData.forEach(function (entry, index) { - var card = new Card(entry, index); - card.render(outputContainer); - }); - }); + }, _callee, null, [[14, 26, 29, 32]]); + })); + return function (_x) { + return _ref.apply(this, arguments); + }; + }()); } // add themes var outputContainer = document.getElementById('themes_container'); - if (outputContainer) toggleSortType(false); /* Theme Handling * ============== diff --git a/docs/assets/js/main.min.js b/docs/assets/js/main.min.js index 63c285c..cd51eff 100644 --- a/docs/assets/js/main.min.js +++ b/docs/assets/js/main.min.js @@ -1 +1 @@ -"use strict";function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function _classCallCheck(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function _defineProperties(e,t){for(var n=0;n\n
\n

').concat(this._title,'

\n \n \n \n
\n
\n \n \n

').concat(this._description,'

\n \n
\n
\n \n Download\n
\n \n ');e.insertAdjacentHTML("beforeend",t)}}])}(),removeLightbox=function(){return document.body.getElementsById("lightbox").remove()};function createLightbox(e){var t=document.getElementById("theme-".concat(e)),n=t.querySelector("h3"),o=t.querySelector("img"),r='\n \n ');t.insertAdjacentHTML("afterend",r)}!function(){document.getElementById("searchInput").addEventListener("keydown",function(e){"Enter"===e.key&&n(!1)}),document.getElementById("searchButton").addEventListener("click",function(){return n(!1)});var e=document.getElementById("js-sortSwitcher");function t(e){return localStorage.sort=e,n(!1)}function n(n){document.querySelectorAll(".card")&&document.querySelectorAll(".card").forEach(function(e){return e.remove()}),fetch("themes.json").then(function(e){return e.json()}).then(function(r){var i=document.getElementById("searchInput").value;if(i){return Object.entries(r).filter(function(e){return t="".concat(e[1].title,", ").concat(e[1].tags),n=i,t.toLowerCase().indexOf(n.toLowerCase())>-1;var t,n}).forEach(function(e){new Card(e[1],+e[0]).render(o)}),void(e.title='"'.concat(i,'"'))}switch(localStorage.sort){case"latest":if(n)return t("random");r.reverse();break;case"random":if(n)return t("oldest");for(var a=r.length-1;a>0;a--){var c=Math.floor(Math.random()*(a+1)),s=[r[c],r[a]];r[a]=s[0],r[c]=s[1]}break;default:if(n)return t("latest")}e.title=localStorage.sort,r.forEach(function(e,t){new Card(e,t).render(o)})})}e.addEventListener("click",function(){return n(!0)}),localStorage.sort||(localStorage.sort="latest");var o=document.getElementById("themes_container");o&&n(!1);var r=window.matchMedia("(prefers-color-scheme: dark)").matches?"night":"day",i=document.getElementById("js-themeSwitcher"),a=i.querySelector("i");localStorage.theme||(localStorage.theme="day"===r?"day":"night"),"night"===localStorage.theme?(a.classList.toggle("fa-sun"),a.classList.toggle("fa-moon"),document.documentElement.classList.add("nightmode")):document.documentElement.classList.add("daymode"),i.addEventListener("click",function(){return document.documentElement.classList.toggle("nightmode"),document.documentElement.classList.toggle("daymode"),a.classList.toggle("fa-sun"),a.classList.toggle("fa-moon"),void("night"===localStorage.theme?localStorage.theme="day":localStorage.theme="night")})}(); \ No newline at end of file +"use strict";function _regeneratorRuntime(){_regeneratorRuntime=function(){return e};var t,e={},r=Object.prototype,n=r.hasOwnProperty,o=Object.defineProperty||function(t,e,r){t[e]=r.value},a="function"==typeof Symbol?Symbol:{},i=a.iterator||"@@iterator",c=a.asyncIterator||"@@asyncIterator",u=a.toStringTag||"@@toStringTag";function l(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{l({},"")}catch(t){l=function(t,e,r){return t[e]=r}}function s(t,e,r,n){var a=e&&e.prototype instanceof v?e:v,i=Object.create(a.prototype),c=new O(n||[]);return o(i,"_invoke",{value:k(t,r,c)}),i}function f(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}e.wrap=s;var h="suspendedStart",d="suspendedYield",y="executing",p="completed",m={};function v(){}function g(){}function b(){}var _={};l(_,i,function(){return this});var w=Object.getPrototypeOf,L=w&&w(w(A([])));L&&L!==r&&n.call(L,i)&&(_=L);var E=b.prototype=v.prototype=Object.create(_);function x(t){["next","throw","return"].forEach(function(e){l(t,e,function(t){return this._invoke(e,t)})})}function S(t,e){function r(o,a,i,c){var u=f(t[o],t,a);if("throw"!==u.type){var l=u.arg,s=l.value;return s&&"object"==_typeof(s)&&n.call(s,"__await")?e.resolve(s.__await).then(function(t){r("next",t,i,c)},function(t){r("throw",t,i,c)}):e.resolve(s).then(function(t){l.value=t,i(l)},function(t){return r("throw",t,i,c)})}c(u.arg)}var a;o(this,"_invoke",{value:function(t,n){function o(){return new e(function(e,o){r(t,n,e,o)})}return a=a?a.then(o,o):o()}})}function k(e,r,n){var o=h;return function(a,i){if(o===y)throw Error("Generator is already running");if(o===p){if("throw"===a)throw i;return{value:t,done:!0}}for(n.method=a,n.arg=i;;){var c=n.delegate;if(c){var u=j(c,n);if(u){if(u===m)continue;return u}}if("next"===n.method)n.sent=n._sent=n.arg;else if("throw"===n.method){if(o===h)throw o=p,n.arg;n.dispatchException(n.arg)}else"return"===n.method&&n.abrupt("return",n.arg);o=y;var l=f(e,r,n);if("normal"===l.type){if(o=n.done?p:d,l.arg===m)continue;return{value:l.arg,done:n.done}}"throw"===l.type&&(o=p,n.method="throw",n.arg=l.arg)}}}function j(e,r){var n=r.method,o=e.iterator[n];if(o===t)return r.delegate=null,"throw"===n&&e.iterator.return&&(r.method="return",r.arg=t,j(e,r),"throw"===r.method)||"return"!==n&&(r.method="throw",r.arg=new TypeError("The iterator does not provide a '"+n+"' method")),m;var a=f(o,e.iterator,r.arg);if("throw"===a.type)return r.method="throw",r.arg=a.arg,r.delegate=null,m;var i=a.arg;return i?i.done?(r[e.resultName]=i.value,r.next=e.nextLoc,"return"!==r.method&&(r.method="next",r.arg=t),r.delegate=null,m):i:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,m)}function T(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function I(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function O(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(T,this),this.reset(!0)}function A(e){if(e||""===e){var r=e[i];if(r)return r.call(e);if("function"==typeof e.next)return e;if(!isNaN(e.length)){var o=-1,a=function r(){for(;++o=0;--a){var i=this.tryEntries[a],c=i.completion;if("root"===i.tryLoc)return o("end");if(i.tryLoc<=this.prev){var u=n.call(i,"catchLoc"),l=n.call(i,"finallyLoc");if(u&&l){if(this.prev=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),I(r),m}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;I(r)}return o}}throw Error("illegal catch attempt")},delegateYield:function(e,r,n){return this.delegate={iterator:A(e),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=t),m}},e}function _slicedToArray(t,e){return _arrayWithHoles(t)||_iterableToArrayLimit(t,e)||_unsupportedIterableToArray(t,e)||_nonIterableRest()}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function _iterableToArrayLimit(t,e){var r=null==t?null:"undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(null!=r){var n,o,a,i,c=[],u=!0,l=!1;try{if(a=(r=r.call(t)).next,0===e){if(Object(r)!==r)return;u=!1}else for(;!(u=(n=a.call(r)).done)&&(c.push(n.value),c.length!==e);u=!0);}catch(t){l=!0,o=t}finally{try{if(!u&&null!=r.return&&(i=r.return(),Object(i)!==i))return}finally{if(l)throw o}}return c}}function _arrayWithHoles(t){if(Array.isArray(t))return t}function _createForOfIteratorHelper(t,e){var r="undefined"!=typeof Symbol&&t[Symbol.iterator]||t["@@iterator"];if(!r){if(Array.isArray(t)||(r=_unsupportedIterableToArray(t))||e&&t&&"number"==typeof t.length){r&&(t=r);var n=0,o=function(){};return{s:o,n:function(){return n>=t.length?{done:!0}:{done:!1,value:t[n++]}},e:function(t){throw t},f:o}}throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}var a,i=!0,c=!1;return{s:function(){r=r.call(t)},n:function(){var t=r.next();return i=t.done,t},e:function(t){c=!0,a=t},f:function(){try{i||null==r.return||r.return()}finally{if(c)throw a}}}}function _unsupportedIterableToArray(t,e){if(t){if("string"==typeof t)return _arrayLikeToArray(t,e);var r={}.toString.call(t).slice(8,-1);return"Object"===r&&t.constructor&&(r=t.constructor.name),"Map"===r||"Set"===r?Array.from(t):"Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r)?_arrayLikeToArray(t,e):void 0}}function _arrayLikeToArray(t,e){(null==e||e>t.length)&&(e=t.length);for(var r=0,n=Array(e);r\n
\n

').concat(this._title,'

\n \n \n \n
\n
\n \n \n

').concat(this._description,'

\n \n
\n
\n \n Download\n
\n \n ');t.insertAdjacentHTML("beforeend",e)}}])}(),removeLightbox=function(){return document.body.getElementsById("lightbox").remove()};function createLightbox(t){var e=document.getElementById("theme-".concat(t)),r=e.querySelector("h3"),n=e.querySelector("img"),o='\n \n ');e.insertAdjacentHTML("afterend",o)}!function(){var t=document.getElementById("searchInput");t.addEventListener("keydown",function(e){"Enter"===e.key&&n(localStorage.sort,t.value)}),document.getElementById("searchButton").addEventListener("click",function(){return n(localStorage.sort,t.value)}),localStorage.sort||(localStorage.sort="latest");var e=document.getElementById("js-sort-menu");e.addEventListener("change",function(){n(e.selectedOptions[0].getAttribute("name"))}),n(localStorage.sort);var r=e.options.namedItem(localStorage.sort);function n(e,r){localStorage.sort=e;var n=document.getElementById("themes_container");n&&(n.innerHTML=""),fetch("themes.json").then(function(t){return t.json()}).then(function(){var e=_asyncToGenerator(_regeneratorRuntime().mark(function e(n){var a,i,c,u,l,s,f,h,d;return _regeneratorRuntime().wrap(function(e){for(;;)switch(e.prev=e.next){case 0:n=Object.entries(n),r&&(a=function(t,e){return t.toLowerCase().indexOf(e.toLowerCase())>-1},n=n.filter(function(e){return a("".concat(e[1].title,", ").concat(e[1].tags),t.value)})),e.t0=localStorage.sort,e.next="latest"===e.t0?5:"updated"===e.t0?7:"stars"===e.t0?9:"random"===e.t0?11:13;break;case 5:return n.reverse(),e.abrupt("break",13);case 7:return n.sort(function(t,e){return e[1].pushed_at.localeCompare(t[1].pushed_at)}),e.abrupt("break",13);case 9:return n.sort(function(t,e){return e[1].stargazers_count-t[1].stargazers_count}),e.abrupt("break",13);case 11:for(i=n.length-1;i>0;i--)c=Math.floor(Math.random()*(i+1)),u=[n[c],n[i]],n[i]=u[0],n[c]=u[1];return e.abrupt("break",13);case 13:l=_createForOfIteratorHelper(n),e.prev=14,l.s();case 16:if((s=l.n()).done){e.next=24;break}return f=_slicedToArray(s.value,2),h=f[0],d=f[1],new Card(d,h).render(o),e.next=22,new Promise(function(t){return setTimeout(t,666)});case 22:e.next=16;break;case 24:e.next=29;break;case 26:e.prev=26,e.t1=e.catch(14),l.e(e.t1);case 29:return e.prev=29,l.f(),e.finish(29);case 32:case"end":return e.stop()}},e,null,[[14,26,29,32]])}));return function(t){return e.apply(this,arguments)}}())}r&&(r.selected=!0);var o=document.getElementById("themes_container"),a=window.matchMedia("(prefers-color-scheme: dark)").matches?"night":"day",i=document.getElementById("js-themeSwitcher"),c=i.querySelector("i");localStorage.theme||(localStorage.theme="day"===a?"day":"night"),"night"===localStorage.theme?(c.classList.toggle("fa-sun"),c.classList.toggle("fa-moon"),document.documentElement.classList.add("nightmode")):document.documentElement.classList.add("daymode"),i.addEventListener("click",function(){return document.documentElement.classList.toggle("nightmode"),document.documentElement.classList.toggle("daymode"),c.classList.toggle("fa-sun"),c.classList.toggle("fa-moon"),void("night"===localStorage.theme?localStorage.theme="day":localStorage.theme="night")})}(); \ No newline at end of file diff --git a/docs/disclaimer.html b/docs/disclaimer.html index 96ae8f0..803e7fa 100644 --- a/docs/disclaimer.html +++ b/docs/disclaimer.html @@ -12,14 +12,7 @@

FirefoxCSS Store

- +

Disclaimer

@@ -70,6 +63,6 @@

Contact Us

DisclaimerInstallation GuideSubmit your Theme
- + \ No newline at end of file diff --git a/docs/index.html b/docs/index.html index a5c0d19..ced38d8 100644 --- a/docs/index.html +++ b/docs/index.html @@ -12,7 +12,14 @@

FirefoxCSS Store

-