added nofilter attribute and iframe conditions

This commit is contained in:
Manan Jethwani 2021-07-15 13:40:33 +05:30
parent 03a929e88e
commit f4ba474576
2 changed files with 16 additions and 6 deletions

View File

@ -16,6 +16,8 @@
let noResultInjected = false; let noResultInjected = false;
let filters = getCookie(filterCookieName); let filters = getCookie(filterCookieName);
let params = new URLSearchParams(window.location.search || filters || ''); let params = new URLSearchParams(window.location.search || filters || '');
let noFilter = params.has('nofilter') && params.get('nofilter');
let inIframe = false;
let timer; let timer;
function queryUrlBuilder() { function queryUrlBuilder() {
@ -101,7 +103,7 @@
<div class='book__description' title='${description}'>${description}</div> <div class='book__description' title='${description}'>${description}</div>
<div class='book__languageTag'>${language.substr(0, 2).toUpperCase()}</div> <div class='book__languageTag'>${language.substr(0, 2).toUpperCase()}</div>
<div class='book__tags'><div class="book__tags--wrapper">${tagHtml}</div></div> <div class='book__tags'><div class="book__tags--wrapper">${tagHtml}</div></div>
<div class='book__links'> <a href="${link}" data-hover="Preview">Preview</a>${downloadLink ? `&nbsp;|&nbsp;<span class="download" data-link=${downloadLink} class="modal-button">Download</span>` : ''} </div></div>`; <div class='book__links'> ${!inIframe ? `<a href="${link}" data-hover="Preview">Preview</a>` : ''}${downloadLink ? `${!inIframe ? '&nbsp;|&nbsp;' : ''}<span class="download" data-link=${downloadLink} class="modal-button">Download</span>` : ''} </div></div>`;
return divTag; return divTag;
} }
@ -336,6 +338,14 @@
window.addEventListener('scroll', loadSubset); window.addEventListener('scroll', loadSubset);
window.onload = async () => { window.onload = async () => {
if (noFilter) {
document.getElementById('kiwixNav').remove();
}
if (window.location !== window.parent.location) {
document.getElementById('kiwixFooter').innerHTML = '';
document.getElementById('kiwixHomeBody').style.padding = '20px';
inIframe = true;
}
iso = new Isotope( '.book__list', { iso = new Isotope( '.book__list', {
itemSelector: '.book', itemSelector: '.book',
getSortData:{ getSortData:{
@ -351,7 +361,7 @@
rowHeight: '.book' rowHeight: '.book'
} }
}); });
footer = document.getElementById('kiwixfooter'); footer = document.getElementById('kiwixFooter');
fadeOutDiv = document.getElementById('fadeOut'); fadeOutDiv = document.getElementById('fadeOut');
loader = document.querySelector('.loader'); loader = document.querySelector('.loader');
await loadAndDisplayBooks(); await loadAndDisplayBooks();
@ -365,7 +375,7 @@
} }
params.forEach((value, key) => {document.getElementsByName(key)[0].value = value}); params.forEach((value, key) => {document.getElementsByName(key)[0].value = value});
document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()}; document.getElementById('kiwixSearchForm').onsubmit = (event) => {event.preventDefault()};
if (!window.location.search) { if (!window.location.search && !inIframe) {
const browserLang = navigator.language.split('-')[0]; const browserLang = navigator.language.split('-')[0];
const langFilter = document.getElementById('languageFilter'); const langFilter = document.getElementById('languageFilter');
langFilter.value = browserLang.length === 3 ? browserLang : iso6391To3[browserLang]; langFilter.value = browserLang.length === 3 ? browserLang : iso6391To3[browserLang];

View File

@ -45,7 +45,7 @@
<script type="text/javascript" src="{{root}}/skin/index.js" defer></script> <script type="text/javascript" src="{{root}}/skin/index.js" defer></script>
</head> </head>
<body> <body>
<div class='kiwixNav'> <div id='kiwixNav' class='kiwixNav'>
<div class="kiwixNav__filters"> <div class="kiwixNav__filters">
<div class="kiwixNav__select"> <div class="kiwixNav__select">
<select name="lang" id="languageFilter" class='kiwixNav__kiwixFilter filter'> <select name="lang" id="languageFilter" class='kiwixNav__kiwixFilter filter'>
@ -63,13 +63,13 @@
<input type="submit" class="searchButton" value="Search"/> <input type="submit" class="searchButton" value="Search"/>
</form> </form>
</div> </div>
<div class="kiwixHomeBody"> <div id="kiwixHomeBody" class="kiwixHomeBody">
<h3 class="kiwixHomeBody__results"></h3> <h3 class="kiwixHomeBody__results"></h3>
<div class="book__list"></div> <div class="book__list"></div>
<div id="fadeOut" class="fadeOut"></div> <div id="fadeOut" class="fadeOut"></div>
</div> </div>
<div class="loader" style="position: absolute; top: 50%"><div class="loader-spinner"></div></div> <div class="loader" style="position: absolute; top: 50%"><div class="loader-spinner"></div></div>
<div id="kiwixfooter" class="kiwixfooter">Powered by&nbsp;<a href="https://kiwix.org">Kiwix</a></div> <div id="kiwixFooter" class="kiwixfooter">Powered by&nbsp;<a href="https://kiwix.org">Kiwix</a></div>
</body> </body>
<script> <script>
function closeModal() { function closeModal() {