$(function() {

	function sort(by, reverse) {
		// by year, name, hours (see portfoliolite-block)
		let articles = [...document.querySelectorAll('.gamegrid article')]
		const grid = document.querySelector('.gamegrid')
		const toI = (el, prop) => {
			const propEl = el.querySelector(`.${prop}`)
			return propEl ? parseInt(propEl.innerHTML) : 0
		}
		var sorts = {
			"year": (a, b) => {
				return toI(a, 'year') > toI(b, 'year')
			},
			"name": (a, b) => {
				return a.innerHTML.localeCompare(b.innerHTML)
			},
			"hours": (a, b) => {
				return toI(a, 'hours') > toI(b, 'hours')
			},
			"date": (a, b) => {
				return a.querySelector('.date').dateTime.localeCompare(b.querySelector('.date').dateTime)
			}
		}

		articles.sort(sorts[by])
		if(reverse) articles.reverse()
		grid.innerHTML = ""
		grid.append(...articles)
	}
	function toggleSort() {
		$('.sortbtn').click(function() {
			const me = $(this)
			$('button.sorted').removeClass('sorted')
			$('button.sorted-asc').removeClass('sorted-asc')
			$('button.sorted-desc').removeClass('sorted-desc')
			me.addClass('sorted')
			const rev = me.data('sorted') === 'asc' ? 'desc' : 'asc'
			me.data('sorted', rev)

			sort(me.data('sort'), rev === 'desc')
			me.addClass(`sorted-${rev}`)
		})		
	}
	toggleSort();

	var disableResponsiveImagesForInlineLis = function() {
		$('li img.img-responsive').each(function() {
			$(this).removeClass('img-responsive');
			$(this).css('border', 'none');
		});
	};
	disableResponsiveImagesForInlineLis();

	const box = new SimpleLightbox('.lbox', { /* options */ });

	function enableSidebarMenuForMobile() {
        $('[data-toggle="offcanvas"]').click(function () {
            $('.row-offcanvas').toggleClass('active')
        });
	}
	enableSidebarMenuForMobile();

	function scrollThenFixSidebar() {
		const mainHeight = $('main div').height()
		const sidebarHeight = $('.sidebar-content').height()
		const maxHeight =  sidebarHeight - $(window).height()
		if(mainHeight < sidebarHeight) return

		$(document).on('scroll', function(e) {
		    const s = document.scrollingElement.scrollTop || $('html').scrollTop() || $('body').scrollTop();
			if(s > maxHeight) {
				$('.sidebar-content').addClass('sidebar-fixed').removeClass('sidebar-scrolling');
			} else {
				$('.sidebar-content').addClass('sidebar-scrolling').removeClass('sidebar-fixed');
			}
		})
	}
	scrollThenFixSidebar();

	var addTargetBlankToExternalLinks = function() {
		var host = (new URL(window.location.href)).hostname;
		$('article a').each(function() {
			var me = $(this);
			var url = me.attr('href');
			if(url && url.startsWith('http') && url.indexOf(host) === -1) {
				me.attr('target', '_blank').addClass('external');
				me.attr('rel', 'noopener');
			}
		})
	};
	addTargetBlankToExternalLinks();

	var enableScrollToTopOnInternalLinks = function() {
		$('#totop').click(function() {
		    $("html, body").animate({ scrollTop: 0 }, "slow");
		});

		$('a.internal').click(function() {
			$($(this).data('to')).animate({ scrollTop: 0 }, "slow");
		});
	};

	var addRandomImageToSideBarMenus = function() {
		var rand = Math.floor(Math.random() * 10) + 1;
		$('.sidebar-menu li').mouseenter(function() {
			$(this).css('background', '#f1f4dd url(/img/random/' + rand + '.gif) no-repeat right');
		}).mouseleave(function() {
			$(this).css('background', 'none');
		}).click(function() {
			location.href = $(this).find('a').attr('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();
	enableScrollToTopOnInternalLinks();
	obfuscateMail();
	makeTootClickable();
});