smallsolar
/
libkiwix
mirror of https://github.com/kiwix/libkiwix.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

added minor features

This commit is contained in:
Manan Jethwani 2021-05-28 20:08:43 +05:30 committed by Emmanuel Engelhart
parent bb92f26b60
commit 179f0faeb1
6 changed files with 202 additions and 38 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
static/resources_list.txt
View File

@ -19,8 +19,9 @@ skin/jquery-ui/jquery-ui.theme.min.css
skin/jquery-ui/jquery-ui.min.css
skin/caret.png
skin/taskbar.js
skin/langList.json
skin/categoryList.json
skin/langList.js
skin/categoryList.js
skin/iso6391To3.js
skin/isotope.pkgd.min.js
skin/index.js
skin/taskbar.css

3
static/skin/categoryList.json → static/skin/categoryList.js
View File

@ -1,4 +1,5 @@
{
/* exported categoryList */
const categoryList = {
"other": "Other",
"gutenberg": "Gutenberg",
"mooc": "Mooc",

96
static/skin/index.js
View File

@ -1,14 +1,15 @@
(function() {
const root = $(`link[type='root']`).attr('href');
let isFetching = false;
let iso;
let bookMap = {};
const incrementalLoadingParams = {
start: 0,
count: viewPortToCount()
};
let params = new URLSearchParams(window.location.search);
const filterTypes = ['lang', 'category', 'q'];
let iso;
let isFetching = false;
let noResultInjected = false;
let params = new URLSearchParams(window.location.search);
let bookMap = {};
function queryUrlBuilder() {
let url = `${root}/catalog/search?`;
@ -58,26 +59,50 @@
incrementalLoadingParams.start += books.length;
if (books.length < incrementalLoadingParams.count) {
incrementalLoadingParams.count = 0;
}
}
return books;
});
}
async function loadAndDisplayOptions(nodeQuery, query) {
// currently taking an array in place of query, will replace it with query while fetching data from backend later on.
await fetch(query)
.then(async (resp) => {
const data = await resp.json();
Object.keys(data).forEach((option) => {
document.querySelector(nodeQuery).innerHTML += `<option value='${option}'>${data[option]}</option>`;
});
});
// currently taking an object in place of query, will replace it with query while fetching data from backend later on.
document.querySelector(nodeQuery).innerHTML += Object.keys(query)
.map((option) => {return `<option value='${option}'>${query[option]}</option>`})
.join('');
}
function checkAndInjectEmptyMessage() {
const kiwixBodyDiv = document.getElementsByClassName('kiwixHomeBody')[0];
if (!Object.keys(bookMap).length) {
noResultInjected = true;
iso.remove(document.getElementsByClassName('book__list')[0].getElementsByTagName('a'));
iso.layout();
const spanTag = document.createElement('span');
spanTag.setAttribute('class', 'noResults');
spanTag.innerHTML = `No result. Would you like to <a href="">reset filter?</a>`;
kiwixBodyDiv.append(spanTag);
spanTag.getElementsByTagName('a')[0].onclick = (event) => {
event.preventDefault();
window.history.pushState({}, null, `${window.location.href.split('?')[0]}`);
resetAndFilter();
filterTypes.forEach(key => {document.getElementsByName(key)[0].value = params.get(key) || ''});
};
return true;
} else if (noResultInjected) {
noResultInjected = false;
kiwixBodyDiv.getElementsByClassName('noResults')[0].remove();
}
return false;
}
async function loadAndDisplayBooks(sort = false) {
if (isFetching) return;
isFetching = true;
let books = await loadBooks();
if (checkAndInjectEmptyMessage()) {
isFetching = false;
return;
}
const booksToFilter = new Set();
const booksToDelete = new Set();
iso.arrange({
@ -102,29 +127,26 @@
isFetching = false;
}
async function filterBooks(filterType, filterValue) {
async function resetAndFilter(filterType = '', filterValue = '') {
isFetching = false;
incrementalLoadingParams.start = 0;
incrementalLoadingParams.count = viewPortToCount();
bookMap = {};
params = new URLSearchParams(window.location.search);
if (!filterValue) {
params.delete(filterType);
} else {
params.set(filterType, filterValue);
if (filterType) {
if (!filterValue) {
params.delete(filterType);
} else {
params.set(filterType, filterValue);
}
window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`);
}
window.history.pushState({}, null, `${window.location.href.split('?')[0]}?${params.toString()}`);
await loadAndDisplayBooks(true);
}
window.addEventListener('popstate', async () => {
bookMap = {};
isFetching = false;
incrementalLoadingParams.start = 0;
incrementalLoadingParams.count = viewPortToCount();
params = new URLSearchParams(window.location.search);
await resetAndFilter();
filterTypes.forEach(key => {document.getElementsByName(key)[0].value = params.get(key) || ''});
loadAndDisplayBooks(true);
});
async function loadSubset() {
@ -154,16 +176,24 @@
},
sortBy: 'weight'
});
loadAndDisplayBooks();
loadAndDisplayOptions('#languageFilter', `${root}/skin/langList.json`);
loadAndDisplayOptions('#categoryFilter', `${root}/skin/categoryList.json`);
for (const key of params.keys()) {
document.getElementsByName(key)[0].value = params.get(key);
}
await loadAndDisplayBooks();
await loadAndDisplayOptions('#languageFilter', langList);
await loadAndDisplayOptions('#categoryFilter', categoryList);
filterTypes.forEach((filter) => {
const filterTag = document.getElementsByName(filter)[0];
filterTag.addEventListener('change', () => {filterBooks(filterTag.name, filterTag.value)});
filterTag.addEventListener('change', () => {resetAndFilter(filterTag.name, filterTag.value)});
});
document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()}
params.forEach((value, key) => {document.getElementsByName(key)[0].value = value});
document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()};
if (!window.location.search) {
const browserLang = navigator.language.split('-')[0];
if (browserLang.length === 3) {
document.getElementById('languageFilter').value = browserLang;
} else {
const langFilter = document.getElementById('languageFilter');
langFilter.value = iso6391To3[browserLang];
langFilter.dispatchEvent(new Event('change'));
}
}
}
})();

124
static/skin/iso6391To3.js Normal file
View File

@ -0,0 +1,124 @@
/* exported iso6391To3 */
const iso6391To3 = {
"aa": "aar",
"af": "afr",
"ak": "aka",
"am": "amh",
"ar": "ara",
"as": "asm",
"az": "aze",
"ba": "bak",
"be": "bel",
"bg": "bul",
"bm": "bam",
"bn": "ben",
"bo": "bod",
"br": "bre",
"bs": "bos",
"ca": "cat",
"ce": "che",
"co": "cos",
"cs": "ces",
"cv": "chv",
"cy": "cym",
"da": "dan",
"de": "deu",
"dz": "dzo",
"ee": "ewe",
"en": "eng",
"es": "spa",
"et": "est",
"eu": "eus",
"fa": "fas",
"ff": "ful",
"fi": "fin",
"fo": "fao",
"fr": "fra",
"ga": "gle",
"gl": "glg",
"gn": "grn",
"gu": "guj",
"gv": "glv",
"ha": "hau",
"he": "heb",
"hi": "hin",
"hr": "hrv",
"hu": "hun",
"hy": "hye",
"id": "ind",
"ig": "ibo",
"is": "isl",
"it": "ita",
"iu": "iku",
"ja": "jpn",
"jv": "jav",
"ka": "kat",
"ki": "kik",
"kk": "kaz",
"km": "khm",
"kn": "kan",
"ko": "kor",
"ks": "kas",
"ku": "kur",
"kw": "cor",
"ky": "kir",
"lb": "ltz",
"lg": "lug",
"ln": "lin",
"lo": "lao",
"lt": "lit",
"lv": "lav",
"mg": "mlg",
"mi": "mri",
"mk": "mkd",
"ml": "mal",
"mn": "mon",
"mr": "mar",
"mt": "mlt",
"my": "mya",
"nl": "nld",
"ny": "nya",
"om": "orm",
"pl": "pol",
"pt": "por",
"qu": "que",
"rm": "roh",
"rn": "run",
"ro": "ron",
"ru": "rus",
"rw": "kin",
"sa": "san",
"sd": "snd",
"sg": "sag",
"si": "sin",
"sk": "slk",
"sl": "slv",
"sn": "sna",
"so": "som",
"sq": "sqi",
"sr": "srp",
"ss": "ssw",
"sv": "swe",
"ta": "tam",
"te": "tel",
"tg": "tgk",
"th": "tha",
"ti": "tir",
"tk": "tuk",
"tn": "tsn",
"tr": "tur",
"ts": "tso",
"tt": "tat",
"ug": "uig",
"uk": "ukr",
"ur": "urd",
"uz": "uzb",
"ve": "ven",
"vi": "vie",
"wa": "wln",
"wo": "wol",
"xh": "xho",
"yo": "yor",
"zh": "zho",
"zu": "zul"
}

3
static/skin/langList.json → static/skin/langList.js
View File

@ -1,4 +1,5 @@
{
/* exported langList */
const langList = {
"aar": "Afar",
"afr": "Afrikaans",
"aka": "Akan",

9
static/templates/index.html
View File

@ -36,6 +36,10 @@
.book__list {
text-align: center;
}
.kiwixHomeBody {
padding: 30px 0;
text-align: center;
}
.book {
display: inline-block;
vertical-align: bottom;
@ -111,6 +115,9 @@
}
</style>
<script src="{{root}}/skin/isotope.pkgd.min.js" defer></script>
<script src="{{root}}/skin/categoryList.js"></script>
<script src="{{root}}/skin/langList.js"></script>
<script src="{{root}}/skin/iso6391To3.js"></script>
<script type="text/javascript" src="{{root}}/skin/index.js" defer></script>
</head>
<body class="kiwix">
@ -119,7 +126,7 @@
<option value="" selected>All languages</option>
</select>
<select name="category" id="categoryFilter" class='kiwixFilter'>
<option value="" selected>ALl categories</option>
<option value="" selected>All categories</option>
</select>
<form id='kiwixSearchForm' class='kiwixSearchForm'>
<input type="text" name="q" id="searchFilter" class='kiwixSearch'>