/**
 * @Author hsc
 */

function testIt() {
	alert('JavaScript wordt ondersteund!');
}

/**
 * Bepaal de browserlocatie en laat deze op de map zien
 * 
 * @param position
 */

function success(position) {
	var s = document.querySelector('#status');

	if (s.className == 'success') {
		// not sure why we're hitting this twice in FF, I think it's to do with
		// a cached result coming back
		return;
	}

	s.innerHTML = "Gevonden!";
	s.className = 'success';

	var mapcanvas = document.createElement('div');
	mapcanvas.id = 'mapcanvas';
	mapcanvas.style.height = '400px';
	mapcanvas.style.width = '560px';

	document.querySelector('#map').appendChild(mapcanvas);

	var latlng = new google.maps.LatLng(position.coords.latitude,
			position.coords.longitude);
	var myOptions = {
		zoom : 15,
		center : latlng,
		mapTypeControl : false,
		navigationControlOptions : {
			style : google.maps.NavigationControlStyle.SMALL
		},
		mapTypeId : google.maps.MapTypeId.ROADMAP
	};
	var map = new google.maps.Map(document.getElementById("mapcanvas"),
			myOptions);

	var marker = new google.maps.Marker({
		position : latlng,
		map : map,
		title : "Hier ben je!"
	});
}

function error(msg) {
	var s = document.querySelector('#status');
	s.innerHTML = typeof msg == 'string' ? msg : "failed";
	s.className = 'fail';

	// console.log(arguments);
}

if (navigator.geolocation) {
	navigator.geolocation.getCurrentPosition(success, error);
} else {
	error('not supported');
}

/**
 * Test of localstorage wordt ondersteund.
 * 
 * @returns {Boolean}
 */
function supports_local_storage() {
	try {
		return 'localStorage' in window && window['localStorage'] !== null;
	} catch (e) {
		return false;
	}
}

/**
 * Hulpfunctie om in de browser een test te doen met display alerts.
 */
function testLocalStorage() {
	if (supports_local_storage() == 'localStorage' in window
			&& window['localStorage'] !== null) {
		alert('Local storage wordt ondersteund')
	} else
		alert('Helaas, geen local storage, toch een nieuwe browser!');
}

function verstuurForm() {
	alert('Gegevens verstuurd');
}

/**
 * Maak een canvas element
 */
function insertCanvas() {
	var canvasExists = document.getElementById('a');
	if (canvasExists == null) {
		var canvas = document.createElement('canvas');
		var aCanvas = document.getElementById('canvas');
		var text = document.getElementById('canvastext');

		canvas.setAttribute('id', 'a');
		canvas.style.height = '300px';
		canvas.style.width = '300px';
		canvas.style.border = '2px solid black';
		aCanvas.appendChild(canvas);
		aCanvas.appendChild(text);
		text.style.display = 'block';
	}
}

function colorCanvas() {
	var aCanvas = document.getElementById('a');
	var aContext = aCanvas.getContext("2d");
	aContext.fillRect(50, 25, 150, 100);
}

function getColorValue(){
	var color = document.getElementById("colorpicker").value;
	var box = document.getElementById('colorbox');
	box.style.background = color;
}

function setRangeValue() {
	var rangevalue = document.getElementById("rangeslider").value;
	var text = 'De gekozen waarde is: ';
	document.getElementById('rangevalue').innerHTML = text + rangevalue;
}