125 lines
4.4 KiB
JavaScript
125 lines
4.4 KiB
JavaScript
document.addEventListener("DOMContentLoaded",function() {
|
|
function sort(grid, by, reverse) {
|
|
// by year, name, hours (see portfoliolite-block)
|
|
let articles = [...document.querySelectorAll('.gamegrid article')]
|
|
const toI = (el, prop) => {
|
|
const propEl = el.querySelector(`.${prop}`)
|
|
return propEl ? parseInt(propEl.innerHTML) : 0
|
|
}
|
|
var sorts = {
|
|
"year": (a, b) => toI(a, 'year') > toI(b, 'year'),
|
|
"name": (a, b) => a.innerHTML.localeCompare(b.innerHTML),
|
|
"hours": (a, b) =>toI(a, 'hours') > toI(b, 'hours'),
|
|
"date": (a, b) => a.querySelector('.date').dateTime.localeCompare(b.querySelector('.date').dateTime),
|
|
"rating": (a, b) => toI(a, 'rating') < toI(b, 'rating')
|
|
}
|
|
|
|
articles.sort(sorts[by])
|
|
if(reverse) articles.reverse()
|
|
grid.innerHTML = ""
|
|
grid.append(...articles)
|
|
}
|
|
function toggleSort() {
|
|
const grid = document.querySelector('.gamegrid')
|
|
const sortbtns = [...document.querySelectorAll('.sortbtn')]
|
|
|
|
sortbtns.forEach(sortbtn => {
|
|
sortbtn.addEventListener('click', function() {
|
|
sortbtns.forEach(btn => btn.className = 'sortbtn')
|
|
sortbtn.classList.add('sorted')
|
|
|
|
const rev = sortbtn.dataset.sorted === 'asc' ? 'desc' : 'asc'
|
|
sortbtn.dataset.sorted = rev
|
|
|
|
sort(grid, sortbtn.dataset.sort, rev === 'desc')
|
|
sortbtn.classList.add(`sorted-${rev}`)
|
|
})
|
|
})
|
|
}
|
|
toggleSort();
|
|
|
|
const box = new SimpleLightbox('.lbox', { /* options */ });
|
|
|
|
function enableSidebarMenuForMobile() {
|
|
document.querySelector('[data-toggle="offcanvas"]').addEventListener('click', function () {
|
|
document.querySelector('.row-offcanvas').classList.toggle('active')
|
|
});
|
|
}
|
|
enableSidebarMenuForMobile();
|
|
|
|
function scrollThenFixSidebar() {
|
|
const mainHeight = document.querySelector('main div').clientHeight
|
|
const sidebarHeight = document.querySelector('.sidebar-content').clientHeight
|
|
const maxHeight = sidebarHeight - window.innerHeight
|
|
if(mainHeight < sidebarHeight) return
|
|
|
|
document.addEventListener('scroll', function(e) {
|
|
const s = document.scrollingElement.scrollTop || document.querySelector('html').scrollTop || document.querySelector('body').scrollTop;
|
|
const content = document.querySelector('.sidebar-content')
|
|
if(s > maxHeight) {
|
|
content.classList.add('sidebar-fixed')
|
|
content.classList.remove('sidebar-scrolling')
|
|
} else {
|
|
content.classList.add('sidebar-scrolling')
|
|
content.classList.remove('sidebar-fixed')
|
|
}
|
|
})
|
|
}
|
|
scrollThenFixSidebar();
|
|
|
|
var addTargetBlankToExternalLinks = function() {
|
|
var host = (new URL(window.location.href)).hostname;
|
|
[...document.querySelectorAll('article a')].forEach(function(a) {
|
|
var url = a.getAttribute('href')
|
|
if(url && url.startsWith('http') && url.indexOf(host) === -1) {
|
|
a.setAttribute('target', '_blank')
|
|
a.setAttribute('rel', 'noopener')
|
|
a.classList.add('external')
|
|
}
|
|
})
|
|
};
|
|
addTargetBlankToExternalLinks();
|
|
|
|
var addRandomImageToSideBarMenus = function() {
|
|
var rand = Math.floor(Math.random() * 10) + 1;
|
|
[...document.querySelectorAll('.sidebar-menu li')].forEach(function(el) {
|
|
el.addEventListener('mouseenter', function() {
|
|
el.style.background = `#f1f4dd url(/img/random/${rand}.gif) no-repeat right`
|
|
})
|
|
el.addEventListener('mouseleave', function() {
|
|
el.style.background = 'none'
|
|
})
|
|
el.addEventListener('click', function() {
|
|
location.href = el.querySelector('a').href
|
|
})
|
|
})
|
|
};
|
|
|
|
var obfuscateMail = function() {
|
|
var meel = document.querySelector('.meel');
|
|
var enc = "<o ofwo-zopsz='aowz orrfsgg' vfst='aowzhc:xst@xstyzoygqcrsl.qca'>xst@xstyzoygqcrsl.qca</o> <o ofwo-zopsz='sbqfmdhwcb DUD ysm' vfst='vhhdg://ysmg.cdsbdud.cfu/jyg/j1/pm-twbusfdfwbh/24O319TO8708OP6961997205S66Q99941091O46R' hwhzs='Sbqfmdh aowzg kwhv am UDU ysm'><gju qzogg='wqcb wqcb-hslh' kwrhv='24' vswuvh='24'><igs lzwby:vfst='#zcqy'></igs></gju></o>"
|
|
|
|
if(meel) {
|
|
meel.addEventListener('click', function() {
|
|
meel.setAttribute('class', '')
|
|
meel.innerHTML = enc.replace(/[a-zA-Z]/g,function(c){return String.fromCharCode((c<="Z"?90:122)>=(c=c.charCodeAt(0)+12)?c:c-26);});
|
|
})
|
|
}
|
|
}
|
|
|
|
function makeTootClickable() {
|
|
[...document.querySelectorAll('.toot')].forEach(toot => {
|
|
toot.addEventListener('click', function() {
|
|
const permalink = this.querySelector('.permalink')?.href
|
|
if(permalink) {
|
|
window.location.href = permalink
|
|
}
|
|
})
|
|
})
|
|
}
|
|
|
|
addRandomImageToSideBarMenus();
|
|
obfuscateMail();
|
|
makeTootClickable();
|
|
});
|