Use document.documentElement.clientWidth instead of window.innerWidth

[plack-app-gruntmaster.git] / js / 10-modal.js

let modal, backdrop, hiding;

function show_modal () {
	modal.classList.remove('hidden');
	backdrop.classList.remove('hidden');
	setTimeout(function (){
		document.body.classList.add('modal-open');
	}, 20);
}

function hide_modal () {
	document.body.classList.remove('modal-open');
}

$(function() {
	if(document.documentElement.clientWidth)
		return;
	modal = $('.modal')[0];
	backdrop = $('.backdrop')[0];
	$(modal).on('transitionend', el => {
		if(!document.body.classList.contains('modal-open'))
			modal.classList.add('hidden');
	});
	$('.backdrop,.modal').each(el => document.body.appendChild(el) );
	$('#solution').on('click', e => {
		show_modal();
		e.preventDefault();
	});
	$('.backdrop').on('click', hide_modal);
	window.onkeyup = event => {
		if (event.keyCode === 27)
			hide_modal();
	}
});