phasmo.js

// noinspection JSUnresolvedReference

for (let key in rolls) {
	if (!rolls.hasOwnProperty(key)) { continue; }

	for (let key2 in rolls[key].items) {
		if (!rolls[key].items.hasOwnProperty(key2)) { continue; }

		let all = rolls[key].groups.all;
		all.items.push(key2);
	}
}

let files = {};
let media = {
	'click':	{'type':'audio','file':'click.mp3'},
	'tick':		{'type':'audio','file':'tick.mp3'},
	'alarm':	{'type':'audio','file':'alarm.mp3'},
};

let prefix		= 'phasmo_';
let fast			= false;
let sound			= true;
let use_map		= '';
let use_diff	= '';
let lang_use	= 'en';

let timings = {
	'main':	{'start': 0,	'end': 0,	'current': 0},
	'step':	null,
};
let clocks = {
	'hunt':		null,
	'smudge':	null,
};

let gameplay		= ['hotkeys','general','evidence','non_evidence','cursed_items','monkey_paw','hunts','nerd_info'];
let all_clues		= {}; // All evidence statuses: -1 = no | 0 = unknown | 1 = yes
let prev_clues	= {}; // List of all clues in their previous state, for comparison
let clue_states	= {
	'-1': 'no',
	'0':	'none',
	'1':	'yes',
};
let state_flag	= false; // Whether a clue state change has been triggered. Use to avoid race conditions

window.onload = load;
function load() {

	// Add event listeners
	if (document.addEventListener) {
		document.addEventListener('click',click,false);
		document.addEventListener('keydown',keydown,false);
		document.addEventListener('keypress',keypress,false);

		let lang_select = document.querySelector('select[name="lang"]');
		lang_select.addEventListener('change',select_lang);
	}

	// Load languages
	let lang_stored = do_storage('get','lang');
	if (lang_stored) { lang_use = lang_stored; }

	let lang_select = Object.assign(document.querySelector('#lang').childNodes[0],{innerHTML:''});
	for (let key in langs) {
		if (!langs.hasOwnProperty(key)) { continue; }

		let opt = Object.assign(document.createElement('OPTION'),{
			value:			key,
			innerHTML:	key,
			selected:		(key === lang_stored),
		});
		lang_select.appendChild(opt);
	}

	// Load clues and ghosts into page
	if (parseInt(do_storage('get','dark')) != in_array('dark',document.body.classList))	{ toggle_dark(); }
	if (parseInt(do_storage('get','compact')))																					{ toggle_compact(); }
	if (parseInt(do_storage('get','fast')))																							{ toggle_fast(); }
	if (parseInt(do_storage('get','mute')))																							{
		let sound = document.querySelector('#sound').childNodes[1].childNodes[0];
		sound.checked = false;
		toggle_sound();
	}

	for (let x = 0; x < clues.length; x++) {
		all_clues[clues[x]]		= 0;
		prev_clues[clues[x]]	= 0;
	}

	setInterval(report_choice,200);

	populate_phrases();
	populate_clues();
	populate_timers();
	set_timers();
	populate_ghosts(ghosts);
	populate_photos();
	populate_roll();

	// Populate maps
	let map_div	= Object.assign(document.querySelector('#maps'),{innerHTML:''});
	let count		= 0;
	for (let key in maps) { if (maps.hasOwnProperty(key)) {
		let map = document.createElement('LI');
		map.setAttribute('data-map',key);

		let link = Object.assign(document.createElement('A'),{
			href:			'inc/' + maps[key].file,
			target:		'_blank',
			title:		langs[lang_use].phrases.open_map,
		});
		let span = Object.assign(document.createElement('DIV'),{
			tabIndex:		0,
			innerHTML:	langs[lang_use].phrases['map_' + key],
		});

		map.appendChild(link);
		map.appendChild(span);
		map_div.appendChild(map);

		if (!count) { setTimeout(() => { map_select(key); },20); }
		count++;
	} }
	// Populate maps

	// Populate difficulties
	populate_difficulties();

	// Populate gameplay
	populate_gameplay(lang_use);

	// Populate media
	for (let key in media) { if (media.hasOwnProperty(key)) {
		files[key] = new Audio('inc/' + media[key].file);
	} }
	// Populate media

}

function click(e) {
	let target				= e.target;
	let parent				= target.parentNode;
	let parent_parent	= parent.parentNode;
	switch (e.which) {
		case 1: // Left click

			let parent_div = getitem(target,'DIV');

			switch (target.nodeName) {
				case 'H3':

					// Clicking the "start timer" button
					// Perform play or pause depending on the button caption
					if (target.id === 'play') {
						let timer_act;
						if (target.innerHTML === '&gt;') {
							target.innerHTML	= 'II';
							timer_act					= 'start';
						} else {
							target.innerHTML	= '&gt;';
							timer_act					= 'stop';
						}
						do_timer(timer_act,'main');
					}

				break;
				case 'INPUT':

					// Clicking a timer preset
					if (target.type === 'button' && target.getAttribute('data-hotkey')) {
						let timer = document.querySelector('#timer');
						if (target.nodeName !== 'INPUT' || clocks['main']) { return; }

						for (let x = 0; x < parent.childNodes.length; x++) {
							if (parent.childNodes[x].nodeName !== 'INPUT') { continue; }

							let child = parent.childNodes[x];
							child.classList.remove('current');
						}
						target.classList.add('current');
						timer.innerHTML = target.getAttribute('data-time').toString();
					}

				break;
				case 'DIV':

					// Clicking a ghost's "exclude" button
					if (in_array('exclude',target.classList)) {
						parent.classList.toggle('excluded');
					}

					// Clicking a map name (not icon)
					let map = parent.getAttribute('data-map');
					if (map) { map_select(map); }

				break;
				case 'SPAN':

					// Clicking a difficulty
					let difficulty = parent.getAttribute('data-difficulty');
					if (difficulty) { difficulty_select(difficulty); }

					// Clicking an evidence's tick or cross
					if (parent.nodeName === 'LABEL' && parent_parent.nodeName === 'LI') {
						// Give time for the checkbox to self-toggle
						setTimeout(() => {
							// Set the global clue state
							let checkbox = target.previousSibling;
							if (!checkbox.disabled) {
								all_clues[checkbox.value] = (checkbox.checked ? parseInt(checkbox.getAttribute('data-state')) : 0);
								state_flag = true;
							}

							check_ghosts();
						},10);
					}

					// Clicking the mute icon
					if (parent_parent.id === 'sound') {
						setTimeout(() => { toggle_sound(); },50);
					}

					// Clicking a top link
					let item;
					if (parent_div.id === 'links') {
						switch (target.parentNode.children[1].getAttribute('data-phrase')) {
							case 'dark':
								toggle_dark(true);
							break;
							case 'fullscreen':
								toggle_fullscreen();
							break;
							case 'fast':
								toggle_fast();
							break;
							case 'steps':
								toggle_steps();
							break;
							case 'mute':
								toggle_sound();
								item = document.querySelector('#sound').children[0].children[0];
								item.click();
							break;
							case 'compact':
								toggle_compact(true);
							break;
							case 'reset':
								reset();
							break;
						}
					}

				break;
			}

		break;
	}
}

function keydown(e) {
	let keycode	= e.key;
	let current	= document.activeElement;
	switch (keycode) {
		case 'Enter':
			if (current.id === 'ghostname') { current.blur(); }
		break;
		case 'Escape':
			current.blur();
		break;
	}

	// No other actions will be monitored while user is in a text input
	if (in_array(current.type,['text'])) { return; }

	if (document.querySelector('#photos_check').checked) {

		// If the photos pane is open

		let sliders = document.querySelectorAll('input[type=range]');
		if (in_array(keycode,['ArrowUp','ArrowDown'])) {
			let found = false;
			for (let x = 0; x < sliders.length; x++) { if (sliders[x] === current) {
				e.preventDefault();
				found = true;
				let item = x;
				if (keycode === 'ArrowUp') { // Up arrow
					item = (x ? x  : photo_count) - 1;
				} else { // Down arrow
					item = (x === (photo_count - 1) ? 0  : (x + 1));
				}
				sliders[item].focus();
			} }
			if (!found) { e.preventDefault(); sliders[(keycode === 'ArrowUp' ? photo_count - 1 : 0)].focus(); }
		}

	} else {

		// If the photos pane isn't open

		let maps_div	= document.querySelector('#maps');
		let len				= maps_div.childNodes.length;

		// Using map selection keyboard shortcuts
		if (in_array(keycode,['[',']'])) {
			let found = false;
			for (let x = 0; x < len; x++) {
				if (maps_div.childNodes[x].childNodes[0] !== current) { continue; }

				e.preventDefault();
				found = true;
				let item = x;
				if (keycode === '[') {
					item = (x ? x : len) - 1;
				} else {
					item = (x === (len - 1) ? 0 : (x + 1));
				}
				let map = maps_div.childNodes[item].childNodes[0];
				map.focus();
			}

			// If we've run out of nodes, either next or previous, wrap around
			if (!found) {
				e.preventDefault();
				let node = maps_div.childNodes[(keycode === '[' ? (len - 1) : 0)];
				node.childNodes[0].focus();
			}
		}

	}

}

function keypress(e) {
	let keycode	= e.key;
	let current	= document.activeElement;
	let parent	= current.parentNode;

	// Do nothing while the user is in a text input
	if (document.activeElement.getAttribute('type') === 'text') { return; }

	let item;
	switch (keycode.toLowerCase()) {
		case '+': case '=':
			difficulty_select_key(1);
		break;
		case '-':
			difficulty_select_key(-1);
		break;
		case '#':
			document.querySelector('#play').click();
		break;
		case ',':
			toggle_fast();
		break;
		case '.':
			toggle_steps();
		break;
		case 'a':
			toggle_alone();
		break;
		case 'c':
			toggle_compact(true);
		break;
		case 'd':
			toggle_dark(true);
			break;
		case 'f':
			toggle_fullscreen();
		break;
		case 'g':
			item = document.querySelector('#gameplay').childNodes[0];
			item.click();
			current.blur();
		break;
		case 'm':
			toggle_sound();
			item = document.querySelector('#sound').childNodes[1].childNodes[0];
			item.click();
		break;
		case 'n':
			document.querySelector('#ghostname').focus();
			e.preventDefault();
		break;
		case 's':
			item = document.querySelector('#photos').childNodes[0];
			item.click();
			current.blur();
		break;
		case 'l':
			item = document.querySelector('#roll').childNodes[0];
			item.click();
			current.blur();
		break;
		case 'x':
			reset();
		break;
		case ' ':
			let map = parent.getAttribute('data-map');
			if (map) { map_select(map); e.preventDefault(); }
		break;
	}

	if (document.querySelector('#photos_check').checked) {

		// If the photos pane is open

		if (in_array(keycode,['1','2','3','4','5','6','7','8','9','0'])) {
			let select = (parseInt(keycode) ? (keycode - 1) : 9);
			select = document.getElementsByName('photo_' + select)[0];
			let value = parseInt(select.value);
			select.value = (value < (photos.length - 1) ? (value + 1) : '0');
			select.onchange(null);
		}

	} else {

		// If the photos pane isn't open

		// Toggle clues based on number key presses
		let ul_clues = document.querySelector('#clues');
		for (let x = 0; x < ul_clues.childNodes.length; x++) {
			// Node structure: [text,number,image,tick,cross]
			let clue	= ul_clues.childNodes[x].childNodes[1];
			if (clue.innerHTML !== keycode) { continue; }

			let tick	= ul_clues.childNodes[x].childNodes[3].childNodes[0]; // Tick
			let cross	= ul_clues.childNodes[x].childNodes[4].childNodes[0]; // Cross

			if (!tick.checked && !cross.checked) {
				// If neither tick or cross are checked, uncheck the tick
				tick.nextSibling.click();
			} else if (tick.checked && !cross.checked) {
				// If tick is checked and cross is not, uncheck the tick and check the cross
				tick.nextSibling.click();
				setTimeout(() => { cross.nextSibling.click(); },20);
			} else if (!tick.checked && cross.checked) {
				// If tick is not checked and cross is, uncheck the cross
				cross.nextSibling.click();
			}
		}

	}

	// Select timer based on hotkey presses
	let timers = document.querySelector('#timers').childNodes[5].childNodes;
	let hotkey;
	for (let x = 0; x < timers.length; x++) {
		if (timers[x].nodeName !== 'INPUT') { continue; }

		let timer = timers[x];
		hotkey = timer.getAttribute('data-hotkey');
		if (hotkey && keycode.toLowerCase() === hotkey.toLowerCase()) {
			timer.click();
		}
	}

}

function select_lang(e) {
	lang_use = e.target.value;
	do_storage('set','lang',lang_use);

	populate_phrases();
	populate_clues();
	populate_timers();
	set_timers();
	populate_ghosts(ghosts);
	populate_photos();
	populate_roll();
	populate_difficulties();
	populate_gameplay();
}

function map_select(map) {
	use_map = map;
	let maps_ul = document.querySelector('#maps');
	for (let x = 0; x < maps_ul.childNodes.length; x++) {
		let map_li = maps_ul.childNodes[x];
		let span = map_li.childNodes[0];
		span.classList.remove('selected');
		if (map_li.getAttribute('data-map') === map) { span.classList.add('selected'); }
	}
	set_timers();
}

function difficulty_select(difficulty) {
	use_diff = difficulty;
	let difficulties_ul = document.querySelector('#difficulties');
	for (let x = 0; x < difficulties_ul.childNodes.length; x++) {
		let difficulty_li = difficulties_ul.childNodes[x];
		let span = difficulty_li.childNodes[0];
		span.classList.remove('selected');
		if (difficulty_li.getAttribute('data-difficulty') === difficulty) { span.classList.add('selected'); }
	}
	set_timers();
	check_ghosts();
}

function difficulty_select_key(val) {
	let difficulties_ul = document.querySelector('#difficulties');
	for (let x = 0; x < difficulties_ul.childNodes.length; x++) {
		let difficulty_li = difficulties_ul.childNodes[x];
		let span = difficulty_li.childNodes[0];
		let target;
		if (in_array('selected',span.classList)) {
			target = difficulties_ul.childNodes[x + val]
			if (target) { target.childNodes[1].click(); }
			break;
		}
	}
	set_timers();
	check_ghosts();
}

function set_timers() {
	let map		= maps[use_map];
	let diff	= difficulties[use_diff];

	if (diff) {
		let timers_div = document.querySelector('#timer_list');
		for (let x = 0; x < timers_div.childNodes.length; x++) {
			let timer = timers_div.childNodes[x];
			let index = timer.getAttribute('data-index');
			switch (index) {
				case 'start':
					timer.setAttribute('data-time',diff.timers['start']);
					timer.disabled = false;
				break;
				case 'hunt':
					if (map) {
						timer.setAttribute('data-time',diff.timers['hunt_' + map.size] + diff.timers['grace']);
						timer.disabled = false;
					}
				break;
				case 'cursed':
					if (map) {
						timer.setAttribute('data-time',diff.timers['hunt_' + map.size] + diff.timers['cursed']);
						timer.disabled = false;
					}
				break;
			}
			if (in_array('current',timer.classList)) { timer.click(); }
		}
	}
}

function do_timer(act,which) {
	let timer = timings[which];
	let modifier = (timer.start < timer.end ? 1 : -1); // Determine up or down counter
	let element = document.querySelector('#timer');

	switch (act) {
		case 'start':

			if (!clocks[which]) {
				timer.start = timer.current = parseInt(element.innerHTML);
				clocks[which] = setInterval(function() {
					timer.current += modifier;
					element.innerHTML = timer.current;

					if (sound) {
						if (timer.current === 30) {
							for (let x = 0; x < (timer.current / 10); x++) { setTimeout(() => { files['click'].play(); },200 * x); }
						}

						if (timer.current === 20) {
							for (let x = 0; x < (timer.current / 10); x++) { setTimeout(() => { files['click'].play(); },200 * x); }
						}

						if (timer.current === 10) {
							for (let x = 0; x < (timer.current / 10); x++) { setTimeout(() => { files['click'].play(); },200 * x); }
						}

						if (timer.current >= 1 && timer.current <= 5) { files['click'].play(); }
					}

					if (timer.current === timer.end) {
						if (sound) { files['alarm'].play(); }
						clearInterval(clocks[which]);
						flicker('timers');
						let timers_div = document.querySelector('#timer_list');
						for (let x = 0; x < timers_div.childNodes.length; x++) {
							let timer = timers_div.childNodes[x];
							if (in_array('current',timer.classList)) {
								element.innerHTML = timer.getAttribute('data-time');
							}
						}
						document.querySelector('#play').click();
						setTimeout(() => { do_timer('stop',which); },2000);
					}
				},1000);
			}

		break;
		case 'stop':

			clearInterval(clocks[which]);
			clocks[which] = null;

		break;
	}
}

function flicker(elem) {
	let timer = null;
	let count = 0;
	let limit = 6;
	elem = document.getElementById(elem);
	if (elem) {
		timer = setInterval(() => {
			elem.classList.toggle('flicker');
			count++;
			if (count === limit) { clearInterval(timer); }
		},200);
	}
}

function toggle_dark(persistent = false) {
	if (!in_array('dark',document.body.classList)) {
		document.body.classList.add('dark');
		if (persistent) { do_storage('set','dark','1'); }
	} else {
		document.body.classList.remove('dark');
		if (persistent) { do_storage('set','dark','0'); }
	}
}

function toggle_compact(persistent = false) {
	if (!in_array('compact',document.body.classList)) {
		document.body.classList.add('compact');
		if (persistent) { do_storage('set','compact','1'); }
	} else {
		document.body.classList.remove('compact');
		if (persistent) { do_storage('set','compact','0'); }
	}
}

function toggle_fullscreen() {
	if (!document['fullscreenElement']) { // Done in bracket notation to prevent validation errors
		document.documentElement.requestFullscreen().then();
	} else {
		document.exitFullscreen().then();
	}
}

function toggle_fast() {
	fast = !fast;
	do_storage('set','fast',(fast ? '1' : '0'));
	let link = document.querySelector('[data-phrase="fast"]').parentNode;
	link.classList.toggle('on');
}

function toggle_steps() {
	let elem = document.querySelector('[data-phrase="steps"]').parentNode;
	elem.classList.toggle('on');
	if (timings.step) {
		clearInterval(timings.step); timings.step = null;
	} else {
		if (sound) { files.tick.play(); }
		elem.classList.toggle('highlight');
		setTimeout(() => { elem.classList.toggle('highlight'); },100);
		timings.step = setInterval(() => {
			if (sound) { files.tick.play(); }
			elem.classList.toggle('highlight');
			setTimeout(() => { elem.classList.toggle('highlight'); },100);
			},(fast ? 345 : 520));
	}
}

function toggle_alone() {
	let alone_0 = document.querySelector('#ghost').childNodes[1].childNodes[0];
	let alone_1 = document.querySelector('#ghost').childNodes[2].childNodes[0];
	let alone_2 = document.querySelector('#ghost').childNodes[3].childNodes[0];
	if (alone_0.checked) {
		alone_1.click();
	} else if (alone_1.checked) {
		alone_2.click();
	} else {
		alone_0.click();
	}
}

function toggle_sound() {
	sound = !sound;
	do_storage('set','mute',(sound ? '0' : '1'));
	let link = document.querySelector('[data-phrase="mute"]').parentNode;
	link.classList.toggle('on');
}

function count_points(slider) {
	if (typeof slider !== 'undefined') { slider.parentNode.nextSibling.innerHTML = slider.value; }

	let money = 0;

	let counts = {};
	for (let x = 0; x < photo_count; x++) {
		let type = parseInt(document.getElementsByName('photo_' + x)[0].value);
		let slider = parseInt(document.getElementsByName('slider_' + x)[0].value);
		if (type && slider) {
			counts[type] = (counts[type] ? counts[type] : 0) + 1;
			if (!photos[type][5] || (photos[type][5] && photos[type][5] >= counts[type])) {
				money += photos[type][slider];
			}
		}
	}
	document.querySelector('div#photos > div > h2').innerHTML = '$' + money;
}

function reset() {
	let check			= [];
	let clues_ul	= document.querySelector('#clues');
	let ghosts_ul	= document.querySelector('#ghosts');

	document.body.classList.toggle('hidden');
	setTimeout(function() { document.body.classList.toggle('hidden'); },200);

	for (let x = 0; x < ghosts_ul.childNodes.length; x++) {
		let ghost = ghosts_ul.childNodes[x];
		ghost.classList = [];
	}

	document.querySelector('#ghostname').value = '';
	let ghost = document.querySelector('#ghost').childNodes[1].childNodes[0];
	ghost.click();

	for (let x = 0; x < clues_ul.childNodes.length; x++) {
		check[0] = clues_ul.childNodes[x].childNodes[3].childNodes[0];
		check[1] = clues_ul.childNodes[x].childNodes[4].childNodes[0];
		if (check[0].checked) { check[0].nextSibling.click(); }
		if (check[1].checked) { check[1].nextSibling.click(); }
	}

	if (clocks['main']) { document.querySelector('#play').click(); }
	let timers = document.querySelector('#timers').childNodes[5];
	for (let x = 0; x < timers.childNodes.length; x++) { if (timers.childNodes[x].nodeName === 'INPUT') {
		let timer = timers.childNodes[x];
		if (in_array('current',timer.classList)) { timer.click(); break; }
	} }

	for (let x = 0; x <= photos.length; x++) {
		let photo		= document.getElementsByName('photo_' + x);
		let slider	= document.getElementsByName('slider_' + x);

		if (photo.length) {
			photo[0].value = 0;
		}

		if (slider.length) {
			slider[0].value = 0;
			slider[0].parentNode.nextSibling.innerHTML = 0;
		}
		count_points();
	}

	roll_select('clear');
}

// Modify this to check based on supplied evidence, difficulty and such, and return array of possible ghosts
// This will let us determine whether a given combination can be ruled out

function check_ghosts() {
	let diff			= difficulties[use_diff];
	let checked_y	= [];
	let checked_n	= [];

	// Determine current state
	for (let clue in all_clues) {
		if (all_clues === 0) { continue; }

		if (all_clues[clue] === -1)	{ checked_n.push(clue); }
		if (all_clues[clue] === 1)	{ checked_y.push(clue); }
	}

	// Take a copy of the ghost object for us to eliminate ghosts
	let possible = Object.assign({},ghosts);

	// Eliminate ghosts based on positive selection
	for (let key in possible) {
		if (!possible.hasOwnProperty(key)) { continue; }

		for (let x = 0; x < checked_y.length; x++) {
			if (!in_array(checked_y[x],possible[key]['clues'])) { delete possible[key]; break; }
		}
	}

	if (diff.hidden_clues === 0) {
		// Eliminate ghosts based on negative selection
		for (let key in possible) {
			if (!possible.hasOwnProperty(key)) { continue; }

			for (let x = 0; x < checked_n.length; x++) {
				if (in_array(checked_n[x],possible[key]['clues'])) { delete possible[key]; break; }
			}
		}
	} else if (diff.hidden_clues > 0) {
		// Eliminate ghosts based on number of hidden clues and always clues
		for (let key in possible) {
			if (!possible.hasOwnProperty(key)) { continue; }

			// Get the number of clues matched per ghost
			let matched = 0;
			for (let x = 0; x < checked_y.length; x++) {
				if (in_array(checked_y[x],possible[key]['clues']) && !in_array(checked_y[x],possible[key]['clues_fake'])) {
					matched++;
				}
			}

			// Get the number of negative clues matched per ghost
			let matched_n = 0;
			for (let x = 0; x < checked_n.length; x++) {
				if (in_array(checked_n[x],possible[key]['clues']) && !in_array(checked_n[x],possible[key]['clues_fake'])) {
					matched_n++;
				}
			}

			let to_delete = false;

			// If the ghost is not hiding enough or too many clues, eliminate it
			let real_clues_count = possible[key]['clues'].length - possible[key]['clues_fake'].length;
			if (real_clues_count < (matched + diff.hidden_clues)
			 || real_clues_count <= (matched_n + diff.hidden_clues)) {
				to_delete = true;
			}

			// If ghost has some always present clues
			if (!to_delete && possible[key]['clues_always'].length > 0) {
				// If any of the negatively selected clues is always present for the ghost, eliminate it
				for (let x = 0; x < possible[key]['clues_always'].length; x++) {
					if (in_array(possible[key]['clues_always'][x],checked_n)) {
						to_delete = true;
						break;
					}
				}

				// If the maximum amount of clues has been found for the ghost but not all of its always clues, eliminate it
				if (!to_delete && (real_clues_count === matched + diff.hidden_clues)) {
					for (let x = 0; x < possible[key]['clues_always'].length; x++) {
						if (!in_array(possible[key]['clues_always'][x],checked_y)) {
							to_delete = true;
							break;
						}
					}
				}
			}

			if (to_delete) {
				delete possible[key];
			}
		}
	}

	show_ghosts(possible);
}

function populate_phrases() {
	let phrases = document.querySelectorAll('*[data-phrase]');
	for (let x = 0; x < phrases.length; x++) {
		let attr = phrases[x].getAttribute('data-phrase');
		let string = langs[lang_use].phrases[attr];
		if (string) {
			if (phrases[x].nodeName === 'INPUT') {
				phrases[x].value = html_ents(string);
			} else {
				phrases[x].innerHTML = html_ents(string);
			}
		}
	}
}

function populate_clues() {
	let clues_ul = Object.assign(document.querySelector('#clues'),{innerHTML:''});
	let count = 0;
	for (let x = 0; x < clues.length; x++) {
		count++;
		let li					= document.createElement('LI');
		let span_number	= document.createElement('SPAN');
		let span_image	= document.createElement('SPAN');
		let span_y			= document.createElement('SPAN');
		let span_n			= document.createElement('SPAN');
		let label_y			= document.createElement('LABEL');
		let label_n			= document.createElement('LABEL');
		let check_y			= document.createElement('INPUT');
		let check_n			= document.createElement('INPUT');

		li.setAttribute('data-clue',clues[x]);
		li.innerHTML = langs[lang_use].phrases['clue_' + clues[x]];
		check_y.name = 'clue_y[]'; check_y.type = 'checkbox'; check_y.value = clues[x]; check_y.setAttribute('data-state','1');
		check_n.name = 'clue_n[]'; check_n.type = 'checkbox'; check_n.value = clues[x]; check_n.setAttribute('data-state','-1');

		span_number.innerHTML = count.toString();

		label_y.appendChild(check_y); label_y.appendChild(span_y);
		label_n.appendChild(check_n); label_n.appendChild(span_n);
		li.appendChild(span_number);
		li.appendChild(span_image);
		li.appendChild(label_y); li.appendChild(label_n);

		// Structure: 'text','number','image','tick','cross'

		clues_ul.appendChild(li);
	}
}

function populate_timers() {
	let timers_div = Object.assign(document.querySelector('#timer_list'),{innerHTML:''});
	let hotkeys = ['Q','W','E','R','T','Y','U','I','O','P'];
	let count = 0;
	for (let key in timers) { if (timers.hasOwnProperty(key)) {
		let timer = Object.assign(document.createElement('INPUT'),{
			type:				'button',
			name:				'timer[]',
			disabled:		timers[key].disabled,
		});
		timer.setAttribute('data-index',key);
		timer.setAttribute('data-time',timers[key].time);
		timer.setAttribute('data-hotkey',hotkeys[count]);
		timer.setAttribute('data-phrase','timer_' + key);
		timer.setAttribute('value','[' + hotkeys[count] + '] ' + langs[lang_use].phrases['timer_' + key]);
		if (timers[key].default) {
			timer.classList.add('current');
			document.querySelector('#timer').innerHTML = timers[key].time.toString();
		}
		timers_div.appendChild(timer);
		count++;
	} }
}

function populate_ghosts(ghosts) {
	// Structure: 'text','number','image','tick','cross'

	// Display descriptions of all applicable ghosts
	let ghosts_ul = document.querySelector('#ghosts');

	// Remove any entries for re-population
	while (ghosts_ul.firstChild) { ghosts_ul.removeChild(ghosts_ul.lastChild); }

	for (let key in ghosts) { if (ghosts.hasOwnProperty(key)) {
		let content = document.createElement('LI');
		content.setAttribute('data-type',key);
		let exclude = Object.assign(document.createElement('DIV'),{classList:['exclude'],title:'Exclude ghost'});
		let heading = Object.assign(document.createElement('h3'),{innerHTML:langs[lang_use].phrases['ghost_' + key]});

		let icons = document.createElement('SPAN');
		for (let x = 0; x < ghosts[key]['clues'].length; x++) {
			let clue = ghosts[key]['clues'][x];

			let icon = document.createElement('SPAN');
			icon.setAttribute('data-type',clue);

			if (all_clues[clue] === 1) { icon.classList.add('checked'); }

			icon.title = langs[lang_use].phrases['clue_' + clue];
			icons.appendChild(icon);
		}
		heading.appendChild(icons);
		content.appendChild(exclude);
		content.appendChild(heading);

		let desc = document.createElement('P');
		desc.innerHTML = ghosts[key]['description'];

		let useful_container = document.createElement('UL');
		let useful = langs[lang_use].phrases['ghost_' + key + '_useful'];
		if (!useful.length) {
			useful_container.appendChild(Object.assign(document.createElement('LI'),{innerHTML: langs[lang_use].phrases.no_info}));
		} else {
			for (let x = 0; x < useful.length; x++) {
				useful_container.appendChild(Object.assign(document.createElement('LI'),{innerHTML: useful[x]}));
			}
		}
		content.appendChild(useful_container);

		ghosts_ul.appendChild(content);
	} }

}

function populate_photos() {
	let tbody = Object.assign(document.querySelector('div#photos tbody'),{innerHTML:''});
	for (let x = 0; x < photo_count; x++) {
		let tr = document.createElement('TR');

		let td = document.createElement('TD');
		td.innerHTML = '[' + (x < photos.length ? (x + 1) : 0 ) + ']';
		tr.appendChild(td);

		td = document.createElement('TD');
		let select = document.createElement('SELECT');
		select.name = 'photo_' + x;
		select.onchange = function() { count_points() };

		for (let y = 0; y < photos.length; y++) {
			let opt = document.createElement('OPTION');
			opt.innerHTML = langs[lang_use].phrases['photo_' + photos[y][0]];
			opt.value = y;
			select.appendChild(opt);
		}
		td.appendChild(select);
		tr.appendChild(td);

		td = document.createElement('TD');
		let slider = document.createElement('INPUT');
		slider.type = 'range';
		slider.min = 0; slider.max = star_count;
		slider.value = 0;
		slider.name = 'slider_' + x;
		slider.oninput = function() { count_points(slider); };

		td.appendChild(slider);
		tr.appendChild(td);

		td = document.createElement('TD');
		td.innerHTML = '0';
		tr.appendChild(td);

		tbody.appendChild(tr);
	}
}

function populate_roll() {
	let roll_container = document.querySelector('div#roll > div');
	let count = 1; // Child element to start with
	for (let roll in rolls) { if (rolls.hasOwnProperty(roll)) {

		let div = Object.assign(roll_container.childNodes[count],{innerHTML:'',className:'roll_group'});

		let div_groups = document.createElement('DIV');
		for (let group in rolls[roll].groups) { if (rolls[roll].groups.hasOwnProperty(group)) {
			let item = document.createElement('SPAN');
			item.setAttribute('data-name',roll + '_' + group);
			item.innerHTML = langs[lang_use].phrases['roll_cat_' + group];
			div_groups.appendChild(item);
			item.addEventListener('click',() => { roll_select(item); });
		} }
		div.appendChild(div_groups);

		let div_items = document.createElement('DIV');
		for (let x = 0; x < rolls[roll].items.length; x++) {
			let item = rolls[roll].items[x];

			let item_prefix = 'item_' + roll + '_';
			let check		= document.createElement('INPUT');
			check.type	= 'checkbox';
			check.id		= item_prefix + item;
			check.name	= 'item[]';
			check.setAttribute('data-name',item);

			let label = document.createElement('LABEL');
			label.setAttribute('for',item_prefix + item);
			label.setAttribute('data-name',item);

			let span				= document.createElement('SPAN');
			span.innerHTML	= langs[lang_use].phrases['roll_' + item];

			label.appendChild(span);
			div_items.appendChild(check);
			div_items.appendChild(label);

		}
		div.appendChild(div_items);

		let input = Object.assign(document.createElement('INPUT'),{
			type:		'button',
			value:	'Roll ' + langs[lang_use].phrases['roll_cat_' + roll],
		});
		div.appendChild(input);
		input.addEventListener('click',() => { roll_submit(div); });

		count++; // Move to next child element

	} }
}

function populate_difficulties() {
	let difficulties_div = Object.assign(document.querySelector('#difficulties'),{innerHTML:''});
	let count = 0;
	for (let key in difficulties) { if (difficulties.hasOwnProperty(key)) {
		let difficulty = document.createElement('LI');
		difficulty.setAttribute('data-difficulty',key);

		let span = document.createElement('SPAN');
		let name = Object.assign(document.createElement('SPAN'),{
			innerHTML:	langs[lang_use].phrases['diff_' + key],
		});

		difficulty.appendChild(span);
		difficulty.appendChild(name);
		difficulties_div.appendChild(difficulty);

		if (!count) { setTimeout(() => { difficulty_select(key); },20); }
		count++;
	} }
}

function populate_gameplay() {
	let gameplay_div = Object.assign(document.querySelector('#gameplay'),{innerHTML:''});
	for (let x = 0; x < gameplay.length; x++) {
		if (langs[lang_use].phrases['gameplay_' + gameplay[x]]) {
			let div = Object.assign(document.createElement('DIV'),{classList: ['body']});
			let list = document.createElement('OL');

			let phrases = langs[lang_use].phrases['gameplay_' + gameplay[x] + '_items'];
			for (let x = 0 ; x < phrases.length; x++) {
				let li = document.createElement('LI');

				let split = phrases[x].split("\t");
				if (split.length > 1) {
					li.appendChild(Object.assign(document.createElement('SPAN'),{innerHTML: split[0]}));
					li.innerHTML += split[1];
				} else {
					li.innerHTML += split[0];
				}
				list.appendChild(li);
			}

			div.appendChild(Object.assign(document.createElement('H3'),{innerHTML: langs[lang_use].phrases['gameplay_' + gameplay[x]] + ':'}));
			div.appendChild(list);
			gameplay_div.appendChild(div);
		}
	}
}

function show_ghosts(ghosts) {
	let available_clues = [];

	// Compile all clues from current ghosts, to prepare for disabling unmentioned clues
	for (let key in ghosts) {
		if (!ghosts.hasOwnProperty(key)) { continue; }

		for (let x = 0; x < ghosts[key]['clues'].length; x++) {
			let clue = ghosts[key]['clues'][x];
			if (!in_array(clue,available_clues)) { available_clues.push(clue); }
		}
	}

	// Disable impossible clues
	let clues_ul = document.querySelector('#clues');
	for (let x = 0; x < clues_ul.childNodes.length; x++) {
		let clue = clues_ul.childNodes[x];
		let choice_opt_y = clue.childNodes[3].childNodes[0];
		let choice_opt_n = clue.childNodes[4].childNodes[0];
		if (!in_array(clue.getAttribute('data-clue'),available_clues)) { // If this clue isn't applicable, disable it

			clue.classList.add('disabled');

			// Disable this clue's unchecked choices

			if (!choice_opt_y.checked) { choice_opt_y.disabled = true; }
			if (!choice_opt_n.checked) { choice_opt_n.disabled = true; }

		} else { // If this clue is applicable, enable its selection

			clue.classList.remove('disabled');

			// Re-enable this clue's positive and negative choices
			choice_opt_y.disabled = false;
			choice_opt_n.disabled = false;

			// When this clue is marked positive, disable its negative option
			if (choice_opt_y.checked) {
				choice_opt_n.disabled = true;
			}

		}
	}

	let ghosts_ul = document.querySelector('#ghosts');

	for (let x = 0; x < ghosts_ul.childNodes.length; x++) {
		let ghost	= ghosts_ul.childNodes[x];
		let icons	= ghost.childNodes[1].childNodes[1].childNodes;

		for (let y = 0; y < icons.length; y++) {
			let ghost_child = icons[y];
			ghost_child.classList.remove('checked');
		}

		// Hide all ghosts and unhide all valid choices
		ghost.classList.add('hidden');
		if (ghosts.hasOwnProperty(ghost.getAttribute('data-type'))) {
			for (let y = 0; y < icons.length; y++) {
				let clue			= icons[y];
				let clue_name	= ghosts[ghost.getAttribute('data-type')]['clues'][y];
				clue.classList.remove('checked');
				if (all_clues[clue_name] === 1) {
					if (ghosts[ghost.getAttribute('data-type')]['clues'][y] === clue.getAttribute('data-type')) {
						clue.classList.add('checked');
					}
				}
			}
			ghost.classList.remove('hidden');
		}
	}

}

function roll_select(item) {
	if (item === 'clear') {

		let roll_groups = document.getElementsByClassName('roll_group');
		for (let x = 0; x < roll_groups.length; x++) {
			for (let y = 0; y < roll_groups[x].childNodes[1].childNodes.length; y++) {
				let item = roll_groups[x].childNodes[1].childNodes[y];
				if (item.nodeName === 'INPUT') { item.checked = false; }
			}
		}

	} else {

		let roll = item.getAttribute('data-name').split('_');
		let roll_items = item.parentNode.nextSibling;
		for (let x = 0; x < roll_items.childNodes.length; x++) {
			if (roll_items.childNodes[x].nodeName === 'INPUT') {
				let roll_item = roll_items.childNodes[x];
				roll_item.checked = false;
				roll_item.className = '';

				let check_name = roll_item.getAttribute('data-name');
				if (roll[1] === 'all' || in_array(check_name,rolls[roll[0]].groups[roll[1]].items)) {
					roll_item.checked = true;
				}
			}
		}

	}
}

function roll_submit(div) {
	let roll_items = div.childNodes[1];

	let choices = [];
	for (let x = 0; x < roll_items.childNodes.length; x++) {
		if (roll_items.childNodes[x].nodeName === 'INPUT' && roll_items.childNodes[x].checked) {
			choices.push(roll_items.childNodes[x]);
		}
	}

	if (choices.length) {
		let choice = choices[Math.floor(Math.random() * choices.length)];
		choice.checked = false;
		choice.classList.add('selected');
	}

}

function in_array(needle,haystack,separator = ' ') {
	// Important: Leave separator default as space; allows for use checking classes
	let output = false;
	if (!Array.isArray(haystack)) {
		haystack = haystack.toString().split(separator);
	}
	for (let x = 0; x < haystack.length; x++) {
		if (haystack[x] === needle) { output = true; break; }
	}
	return output;
}

/**
 * Use a dummy text area to convert text to HTML entities
 */
let dummy_textarea = document.createElement('TEXTAREA');
function html_ents(text) {
	dummy_textarea.innerText = text;
	return dummy_textarea.innerHTML;
}

function getitem(e,item_type = 'TR') {
	// Go back up the DOM tree until we find a parent with a tag matching item_type
	item_type = item_type.toUpperCase();
	if (e.nodeName !== 'HTML') {
		while (e && e.nodeName !== item_type && e.nodeName !== 'HTML') { e = e.parentNode; }
	}
	return (e && e.nodeName === item_type ? e : false);
}

function do_storage(act,name,value = '') {
	name = prefix + name;
	let result = '';
	switch (act) {
		case 'set': localStorage.setItem(name,value); break;
		case 'get': result = localStorage.getItem(name); if (result === null) { result = ''; } break;
		case 'del': localStorage.removeItem(name); break;
	}
	return result;
}

function report_choice() {
	if (!state_flag) { return ; }
	state_flag = false;

	for (let clue in all_clues) {
		let value = all_clues[clue];
		if (value === prev_clues[clue]) { continue; }

		prev_clues[clue] = value;
		//console.log(clue + '_' + clue_states[value]);
	}
}