(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 === "page_main") && !activePopup) {
				try {
					tizen.application.getCurrentApplication().exit();
				} catch (ignore) {
				}
			} else {
				window.history.back();
			}
		}
	});
}());

__page_count = 0;

function parseSitemap(sitemap, status) {
	var list_main = $('<ul/>').addClass('ui-listview');

	parseWidgets(sitemap.homepage.widgets, list_main);
	addSettings(list_main);
	$('#frame_main ul').remove();
	$('#frame_main').append(list_main);
	
	if(tau.activePage.id != 'page_main'){
		tau.changePage('#page_main');
	}
}

function createSubFrame(wdg, parent) {
	var page_name = 'dpage_' + __page_count.toString();
	var newlist = $('<ul/>').addClass('ui-listview');
	var newframe = $('<div/>').addClass('ui-content').prop('id',
			'frame_' + __page_count.toString()).append(newlist);

	if (parent.parent('.ui-page') && parent.parent('.ui-page').length > 0) {
		var parent_name = parent.parent('.ui-page').prop('id');
	} else {
		var parent_name = 'page_main';
	}

	var sub_name = ('label' in wdg) ? wdg.label : wdg.title;

	var newpage = $('<div/>').addClass('ui-page').prop('id', page_name).append(
			$('<header/>').append(
					$('<h2/>').append(
							$('<a/>').addClass('ui-title').text(sub_name).attr(
									'href', '#' + parent_name)))).append(
			newframe);

	parent.append($('<li/>').append(
			$('<div/>').append(
					$('<a/>').text(sub_name).attr('href', '#' + page_name))));

	$("body").append(newpage);

	__page_count += 1;
	return newlist;
}

function createSwitch(wdg, page) {
	if (wdg.mappings.length === 0) {
		page.append($('<li/>').addClass('li-has-toggle').append(
				$('<label/>').text(wdg.label)).append(
				$('<div/>').addClass('ui-toggleswitch').append(
						$('<input/>').prop('type', 'checkbox').prop(
								'data-link', wdg.item.link).prop('data-item',
								wdg.item.name).addClass('ui-switch-input')
								.change(
										function() {
											updateItem($(this)
													.prop('data-link'), $(this)
													.is(':checked') ? "ON"
													: "OFF");
										})).append(
						$('<div/>').addClass('ui-switch-button'))));
	} else if (wdg.mappings.length > 0) {
		var btnframe = $('<div/>').append($('<span/>').text(wdg.label));
				
		wdg.mappings.forEach(function(map_item){
			btnframe.append($('<button/>')
				.addClass('ui-btn ui-inline')
				.prop('data-link', wdg.item.link)
				.prop('data-item',wdg.item.name)
				.prop('type', 'button')
				.prop('value', map_item.command)
				.text(map_item.label)
				.click(function() {updateItem($(this).prop('data-link'), $(this).val());}));
		})
				
		page.append($('<li/>').append(btnframe));
	}
}

function createSelection(wdg, page) {
	var name = btoa(wdg.label).replace(/[\/+=]/g, '');

	var ul = $('<div/>').prop('data-link', wdg.item.link).change(function() {
		var checked = $("input[name='" + name + "']:checked");
		if (checked !== undefined) {
			updateItem($(this).prop('data-link'), checked.val());
		}
	});

	wdg.mappings.forEach(function(entry) {
		var item = $('<input/>').attr('type', 'radio').attr('name', name).attr(
				'value', entry.command);
		if (wdg.item.state === entry.command) {
			item.attr('checked', 'checked');
		}

		ul.append($('<label/>').text(entry.label).append(item)).append(
				$('<br/>'));
	});

	page.append($('<div/>').prop('id', 'pop_' + name).addClass('ui-popup')
			.append($('<div/>').addClass('ui-popup-header').text(wdg.label))
			.append($('<div/>').addClass('ui-popup-content').append(ul)));

	page.append($('<li/>').append(
			$('<a/>').attr('href', '#pop_' + name).addClass('ui-btn').attr(
					'data-rel', 'popup').text(wdg.label)));
}

function createSlider(wdg, page) {
	var value = 0;
	if (wdg.item.state !== null) {
		value = wdg.item.state;
	}
	page.append($('<li/>').append(
			$('<div/>').append($('<span/>').text(wdg.label)).append($('<br/>'))
					.append(
							$('<input/>').prop('data-link', wdg.item.link)
									.prop('data-item', wdg.item.name).prop(
											'type', 'range').prop('data-freq',
											'200').prop('data-state', value)
									.prop('min', '0').prop('max', '100').prop(
											'value', value).change(
											function() {
												updateItem($(this).prop(
														'data-link'), $(this)
														.val());
											}))));
}

function createText(wdg, page) {
	if ('linkedPage' in wdg) {
		var newframe = createSubFrame(wdg.linkedPage, page);
		if (("widgets" in wdg.linkedPage) && wdg.linkedPage.widgets.length > 0) {
			parseWidgets(wdg.linkedPage.widgets, newframe);
		}
	} else {
		page.append($('<li/>').append($('<div/>').text(wdg.label)));
	}
}

function createSetpoint(wdg, page){
	page.append($('<li/>').append(
			$('<div/>')
			.append($('<span/>').text(wdg.label))
			.append($('<br/>'))
			.append($('<button/>')
					.addClass('ui-inline-btn ui-inline')
					.prop('data-link', wdg.item.link)
					.prop('data-item',wdg.item.name)
					.prop('type', 'button')
					.prop('value',Math.max(Number(wdg.item.state) - Number(wdg.step),Number(wdg.minValue)))
					.text('-')
					.click(function() {
						var link=$(this).prop('data-link');
						var target = $(this).nextAll('.setpoint_value');
						updateItem(link, 
								$(this).val(), 
								function(){
									reloadItem(link,
											function(data){
												target.text(data);
											});
								});
					}))
			.append($('<span/>')
					.addClass('setpoint_value')
					.text(wdg.item.state)
					.prop('data-link', wdg.item.link)
					.click(function() {
						reloadItem($(this).prop('data-link'), function(data){$(this).next().text(data);});
					}))
			.append($('<button/>')
					.addClass('ui-inline-btn ui-inline')
					.prop('data-link', wdg.item.link)
					.prop('data-item',wdg.item.name)
					.prop('type', 'button')
					.prop('value',Math.min(Number(wdg.item.state) + Number(wdg.step),Number(wdg.maxValue)))
					.text('+')
					.click(function() {
						var link=$(this).prop('data-link');
						var target = $(this).prevAll('.setpoint_value');
						updateItem(link, 
								$(this).val(), 
								function(){
									reloadItem(link,
											function(data){
												target.text(data);
											});
								});
					}))
	));
}

function parseWidgets(widgets, parent) {
	widgets.forEach(function(wdg) {
		switch (wdg.type) {
		case "Frame":
			var newframe = createSubFrame(wdg, parent);
			if (("widgets" in wdg) && wdg.widgets.length > 0) {
				parseWidgets(wdg.widgets, newframe);
			}
			break;

		case "Switch":
			createSwitch(wdg, parent);
			break;

		case "Slider":
			createSlider(wdg, parent);
			break;

		case "Selection":
			createSelection(wdg, parent);
			break;

		case "Text":
			createText(wdg, parent);
			break;

		case "Setpoint":
			createSetpoint(wdg, parent);
			break;

		default:
			parent.append($('<li/>').append(
					$('<div/>').text("other[" + wdg.type + "]")));
			break;
		}

	});
}

function changePage(to, transition, back, change) {
	console.log(document.location.href);
	console.log(to);
	console.log(transition);
	console.log(back);
	console.log(change);
	tau.changePage(to, transition, back, change);
	console.log(document.location.href);
}

function updateItem(item, value, success) {
	$.post({
		url : item,
		data : value.toString(),
		contentType : 'text/plain',
		success: success
	});
}

function reloadItem(item, val_setter) {
	$.get(item+'/state', function(data, status){val_setter(data);});
}

function storeSettings() {
	var local_url=$('#oh_url').val();
	var remote_url=$('#oh_remote_url').val();
	
	tizen.preference.setValue('oh_url', local_url);
	tizen.preference.setValue('oh_remote_url', remote_url);
}

function resetSitemap() {
	tizen.preference.remove('oh_stored_sitemap');
}

function reloadSitemap() {
	if(__page_count === 0){
	$.get(tizen.preference.getValue('oh_url') + "/rest/sitemaps/default",
			parseSitemap).fail(
			function() {
				$.get(tizen.preference.getValue('oh_remote_url') + "/rest/sitemaps/default",
						parseSitemap).fail(function() {
				});
			});
	}
}

function addSettings(list){
	list.append($('<li/>')
			.append($('<div/>')
					.append($('<a/>')
							.text('Settings').attr('href', '#page_settings'))));
	list.append($('<li/>')
			.append($('<div/>')
					.append($('<a/>')
							.text('Reload').click(reloadSitemap))));
}

function loadgui() {
	if(tizen.preference.exists('oh_url')) {
		reloadSitemap();
	} else {
		var list_main = $('<ul/>').addClass('ui-listview');
		addSettings(list_main);
		$('#frame_main').append(list_main);
	}
}

$(document).ready(loadgui);