(function() {
	window.addEventListener("tizenhwkey", function(ev) {
		var activePopup = null, page = null, pageId = "";

		if (ev.keyName === "back") {
			activePopup = document.querySelector(".ui-popup-active");
			page = document.getElementsByClassName("ui-page-active")[0];
			pageId = page ? page.id : "";

			if (pageId === "main" && !activePopup) {
				try {
					tizen.application.getCurrentApplication().exit();
				} catch (ignore) {
				}
			} else {
				window.history.back();
			}
		}
	});
}());

function parseSitemap(sitemap) {
	var output = parseWidgets(sitemap.homepage.widgets);
	document.getElementById("main_text").innerHTML = output;
}

function parseWidgets(widgets) {
	var s="";
	widgets.forEach( function(wdg) {
		switch (wdg.type) {
		case "Frame":
			s+='<div><span>'+wdg.label+"</span>";
			if (("widgets" in wdg) && wdg.widgets.length >0){
				s+=parseWidgets(wdg.widgets);
			}
			s+="</div>";
			break;

		case "Switch":
			if (wdg.mappings.length === 0) {
				s+=createElement(wdg.label, 
						wdg.item.name,
						wdg.item.link,
						'<div class="ui-toggleswitch ui-toggleswitch-large">'+
						'<input type="checkbox" class="ui-switch-input" onchange=updateToggle(event) />'+
						'<div class="ui-switch-button"></div>'+
						'</div>'
				);
								
//				<div class="ui-switch">
//				<div class="ui-switch-text">
//				Single Toggle
//				</div>
//				<div class="ui-toggleswitch ui-toggleswitch-large">
//					<input type="checkbox" class="ui-switch-input" id="toggleControl">
//					<div class="ui-switch-button"></div>
//				</div>
//				<div class="ui-switch-sub-text">
//					Toggle state
//				</div>
//			</div>
			} else if (wdg.mappings.length === 1) {
				s+=createElement(wdg.label, 
						wdg.item.name,
						wdg.item.link,
						'<button type="button" value="'+wdg.mappings[0].command+'" onchange=updateSimple(event)>'+
						wdg.mappings[0].label+
						'</button>');
			}
			break;
			
		case "Slider":
			var value=0;
			if (wdg.item.state !== null) {
				value = wdg.item.state;
			}
			s+=createElement(wdg.label, 
					wdg.item.name,
					wdg.item.link,
					'<input data-freq="200" data-state="'+value.toString()+
					'" type="range" min="0" max="100" tabindex="0" value="'+
					value.toString()+'" onchange="updateSimple(event)" />');
			break;

		case "Selection":
//			var items = '';			
//			wdg.mappings.forEach(function(entry) {
//				items += '<div class="ui-item" data-title="'+entry.label+'" data-value="'+entry.command+'" ></div>';
//			});
//			s+= createElement(wdg.label,
//					wdg.item.name,
//					wdg.item.link,
//					'<div class="ui-selector">'+items+'</div>');
			break;

		case "Text":
			s+=createElement(wdg.label,'','','');
			break;
		
		default:
			s+="Other<br/>";
			break;
		}
		
	});
	return s;
}

function createElement(label, id, link, inner){
	var inElement = '';
	if (link != '' && id != '' && inner != ''){
		inElement='<div data-link="'+link+'" data-item="'+id+'" >'+inner+'</div>';
	}
	return '<div><span>'+label+'</span>'+inElement+'</div>';	
}

function updateToggle(event) {
	var item = event.target.parentElement.parentElement.getAttribute('data-link');
	var value = event.target.checked === true ? "ON" : "OFF";
	updateItem(item,value);
}

function updateSelector(event) {
	var s=3;
	return true;
}

function updateSimple(event) {
	var item = event.target.parentElement.getAttribute('data-link');
	var value = event.target.value;
	updateItem(item,value);
}

function updateItem(item,value) {
	var client = new XMLHttpRequest();
	client.open('POST', item, true);
	client.send(value.toString());	
}

function loadgui() {
	var client = new XMLHttpRequest();
	client.onreadystatechange = function() {
		if (this.readyState === 4 && this.status === 200) {
			var myArr = JSON.parse(this.responseText);
			parseSitemap(myArr);
		}
	};
	client.open('GET', 'http://habctrl:8080/rest/sitemaps/default', true);
	client.send();
}