Skip to content

Commit 28160ea

Browse files
BeyondMagicBeyondMagic
committed
build(site): add sorting features
1 parent 2502188 commit 28160ea

File tree

3 files changed

+1529
-233
lines changed

3 files changed

+1529
-233
lines changed

‎docs/assets/js/main.js

Lines changed: 117 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,12 @@
11
"use strict";
22

3+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
4+
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."); }
5+
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; } }
6+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
7+
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, 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 normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it["return"] != null) it["return"](); } finally { if (didErr) throw err; } } }; }
8+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
9+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
310
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); }
411
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
512
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); } }
@@ -46,87 +53,149 @@ function createLightbox(id) {
4653
* ======================
4754
*/
4855

49-
document.getElementById('searchInput').addEventListener('keydown', function (e) {
50-
if (e.key === "Enter") toggleSortType(false);
56+
var search = /** @type {HTMLInputElement} */document.getElementById('searchInput');
57+
search.addEventListener('keydown', function (e) {
58+
if (e.key === "Enter") sort(search.value);
5159
});
5260
document.getElementById('searchButton').addEventListener('click', function () {
53-
return toggleSortType(false);
61+
return false;
5462
});
5563

5664
/* Load Content
5765
* ============
5866
*/
5967

60-
// add our sorting button
61-
var sortTrigger = document.getElementById('js-sortSwitcher');
62-
sortTrigger.addEventListener('click', function () {
63-
return toggleSortType(true);
68+
/*
69+
* If sorting is not set yet in `localStorage`,
70+
* then use as default `latest` kind.
71+
*/
72+
if (!localStorage.sort) localStorage.sort = 'latest';
73+
74+
/*
75+
* Make the sort icon a button.
76+
*/
77+
var sort_trigger = /** @type {HTMLElement} */document.getElementById('js-sortSwitcher');
78+
sort_trigger.addEventListener('click', function () {
79+
return toggle_sorting();
6480
});
81+
sort();
6582

66-
// When localstorage is not set, use "latest" order type
67-
if (!localStorage['sort']) localStorage['sort'] = 'latest';
68-
function repeatToggle(nextType) {
69-
localStorage['sort'] = nextType;
70-
return toggleSortType(false);
83+
/**
84+
* Toggle the sorting type of the themes.
85+
**/
86+
function toggle_sorting() {
87+
switch (localStorage.sort) {
88+
case 'latest':
89+
localStorage.sort = 'updated';
90+
break;
91+
case 'updated':
92+
localStorage.sort = 'stars';
93+
break;
94+
case 'stars':
95+
localStorage.sort = 'random';
96+
break;
97+
case 'random':
98+
localStorage.sort = 'oldest';
99+
break;
100+
default:
101+
localStorage.sort = 'latest';
102+
}
103+
return sort();
71104
}
72-
function toggleSortType(change) {
73-
if (document.querySelectorAll('.card')) document.querySelectorAll('.card').forEach(function (e) {
74-
return e.remove();
75-
});
105+
106+
/**
107+
* Toggle the sorting type of the themes.
108+
*
109+
* @param {string=} filter Term to filter the themes.
110+
**/
111+
function sort(filter) {
112+
sort_trigger.title = "\"".concat(localStorage.sort, "\"");
113+
114+
// Remove all themes cards from the page.
115+
var cards_container = document.getElementById('themes_container');
116+
if (cards_container) cards_container.innerHTML = '';
76117
fetch('themes.json').then(function (data) {
77118
return data.json();
78-
}).then(function (parsedData) {
79-
var search = document.getElementById('searchInput').value;
80-
if (search) {
119+
}).then(function (data) {
120+
data = Object.entries(data);
121+
if (filter) {
122+
/**
123+
* Match any substring (partial) from a string (text).
124+
* @param {string} text
125+
* @param {string} partial
126+
*/
81127
var matches = function matches(text, partial) {
82128
return text.toLowerCase().indexOf(partial.toLowerCase()) > -1;
83129
};
84-
var parsedAsArray = Object.entries(parsedData);
85-
var searchResults = parsedAsArray.filter(function (element) {
86-
return matches("".concat(element[1].title, ", ").concat(element[1].tags), search);
87-
});
88-
searchResults.forEach(function (result) {
89-
var card = new Card(result[1], +result[0]);
90-
card.render(outputContainer);
130+
data = data.filter(function (element) {
131+
return matches("".concat(element[1].title, ", ").concat(element[1].tags), search.value);
91132
});
92-
sortTrigger.title = "\"".concat(search, "\"");
93-
return;
94133
}
95-
switch (localStorage['sort']) {
96-
// sort from the oldest theme added
134+
switch (localStorage.sort) {
135+
/*
136+
* Sort from the most recent theme added.
137+
*/
97138
case 'latest':
98-
if (change) return repeatToggle('random');
99-
parsedData.reverse();
139+
data.reverse();
140+
break;
141+
142+
/*
143+
* Ascending sorting of stars from repositories.
144+
*/
145+
case 'updated':
146+
// item1.attr.localeCompare(item2.attr);
147+
data.sort(function (a, b) {
148+
return b[1].pushed_at.localeCompare(a[1].pushed_at);
149+
});
150+
break;
151+
152+
/*
153+
* Ascending sorting of stars from repositories.
154+
*/
155+
case 'stars':
156+
data.sort(function (a, b) {
157+
return b[1].stargazers_count - a[1].stargazers_count;
158+
});
100159
break;
101160

102-
// sort randomly
161+
/*
162+
* Randomly sorting of themes.
163+
*/
103164
case 'random':
104-
if (change) return repeatToggle('oldest');
105-
for (var i = parsedData.length - 1; i > 0; i--) {
165+
for (var i = data.length - 1; i > 0; i--) {
106166
var j = Math.floor(Math.random() * (i + 1));
107-
var _ref = [parsedData[j], parsedData[i]];
108-
parsedData[i] = _ref[0];
109-
parsedData[j] = _ref[1];
167+
var _ref = [data[j], data[i]];
168+
data[i] = _ref[0];
169+
data[j] = _ref[1];
110170
}
111171
break;
112172

113-
// sort from the most recent theme added
173+
/*
174+
* Sort from the least recent theme added (oldest).
175+
* Since it's sorted like this by default from the file, do nothing.
176+
*/
114177
default:
115-
if (change) return repeatToggle('latest');
116178
}
117-
118-
// TODO: make a better way to preview the current sorting
119-
sortTrigger.title = localStorage['sort'];
120-
parsedData.forEach(function (entry, index) {
121-
var card = new Card(entry, index);
122-
card.render(outputContainer);
123-
});
179+
var _iterator = _createForOfIteratorHelper(data),
180+
_step;
181+
try {
182+
for (_iterator.s(); !(_step = _iterator.n()).done;) {
183+
var _step$value = _slicedToArray(_step.value, 2),
184+
index = _step$value[0],
185+
entry = _step$value[1];
186+
var card = new Card(entry, index);
187+
card.render(outputContainer);
188+
}
189+
} catch (err) {
190+
_iterator.e(err);
191+
} finally {
192+
_iterator.f();
193+
}
124194
});
125195
}
126196

127197
// add themes
128198
var outputContainer = document.getElementById('themes_container');
129-
if (outputContainer) toggleSortType(false);
130199

131200
/* Theme Handling
132201
* ==============

0 commit comments

Comments
 (0)