WebSVN – HomeAutomation – Blame – /trunk/PcSoftware/scripts/Atom1.5-webgui/index.php

Rev	Author	Line No.	Line
2051	linlun	1	<?php
2068	runge	2	require_once("backend.php");
		3	require_once("config.php");
		4	?>
		5	<!DOCTYPE HTML>
		6	<html>
		7	<head>
		8	<meta charset="utf-8">
		9	<meta name="viewport" content="width=device-width, initial-scale=1">
		10	<title>Home Automation Control Center</title>
		11	<link rel="stylesheet" href="jquery.mobile-1.1.1.min.css" />
		12	<script src="jquery-1.7.2.min.js"></script>
		13	<script src="jquery.mobile-1.1.1.min.js"></script>
		14	<script src="jquery.tmpl.min.js"></script>
1872	runge	15
2068	runge	16	<style>
		17	<?php
		18	foreach ($pages as $page)
		19	{
		20	include("pages/" . $page . "/style.css");
		21	}
		22	?>
2096	runge	23
		24	.ui-li-heading {
		25	white-space: normal;
		26	}
2068	runge	27	</style>
2060	linlun	28
2068	runge	29	<?php
		30	foreach ($pages as $page)
		31	{
		32	include("pages/" . $page . "/template.html");
		33	}
		34	?>
1872	runge	35
2068	runge	36	<script id="page-template" type="text/x-jquery-tmpl" data-enhance="false">
2102	runge	37	<div id="page-${name}" data-role="page" data-theme="a" id="page-{name}">
2070	runge	38	<div data-role="header">
2102	runge	39	<a href="#home" data-icon="home" data-direction="reverse">Home</a>
		40	<h1>${title} - Home Automation Control Center</h1>
2070	runge	41	</div>
2068	runge	42	<div data-role="content"></div>
		43	</div>
		44	</script>
1872	runge	45
2068	runge	46	<script id="pagelink-template" type="text/x-jquery-tmpl" data-enhance="false">
		47	<span>
2070	runge	48	<a href="#" data-role="button">${title}</a>
2068	runge	49	</span>
		50	</script>
2054	linlun	51
2068	runge	52	<script>
		53	$.mobile.ignoreContentEnabled = true;
2102	runge	54	$.mobile.transitionFallbacks.pop = "none";
		55	$.mobile.transitionFallbacks.flip = "none";
		56	$.mobile.transitionFallbacks.turn = "none";
		57	$.mobile.transitionFallbacks.flow = "none";
		58	$.mobile.transitionFallbacks.slidefade = "none";
		59	$.mobile.transitionFallbacks.slide = "none";
		60	$.mobile.transitionFallbacks.slideup = "none";
		61	$.mobile.transitionFallbacks.slidedown = "none";
		62	$.mobile.defaultPageTransition = "none";
		63	$.mobile.ajaxEnabled = false;
1872	runge	64
2102	runge	65	var commandActive = false;
		66	var commandQueue = [];
		67
2068	runge	68	function sendCommand(command, callback)
		69	{
2102	runge	70	if (commandActive)
		71	{
		72	commandQueue.push({ command: command, callback: callback });
		73	}
		74	else
		75	{
		76	commandActive = true;
		77
		78	jQuery.getJSON("backend.php?ajax", { command: command }, function(jsonData)
		79	{
		80	commandActive = false;
		81
		82	if (commandQueue.length > 0)
		83	{
		84	var commandItem = commandQueue.shift();
		85
		86	sendCommand(commandItem.command, commandItem.callback);
		87	}
		88
		89	callback(jsonData);
		90	});
		91	}
2068	runge	92	}
		93	</script>
1872	runge	94
2068	runge	95	<script>
		96	var pages = {};
1872	runge	97
2068	runge	98	<?php
		99	foreach ($pages as $page)
1872	runge	100	{
2068	runge	101	include("pages/" . $page . "/script.js");
1872	runge	102	}
		103	?>
2068	runge	104	</script>
1872	runge	105
2068	runge	106	<script>
		107
2080	runge	108	var aliasNames = <?php echo json_encode($aliasNames); ?>;
2068	runge	109	var pageConfigurations = <?php echo json_encode($pageConfiguration); ?>;
		110	var pageInstances = {};
2102	runge	111	var serverTimeOffset = 0;
2068	runge	112
2102	runge	113	function getServerTimestamp()
		114	{
		115	return ((new Date()).getTime()) - serverTimeOffset
		116	}
		117
2068	runge	118	$(document).ready(function(event)
1872	runge	119	{
2102	runge	120	document.location.hash = "";
		121
		122	sendCommand("timestampRaw", function(jsonData)
		123	{
		124	serverTimeOffset = ((new Date()).getTime()) - jsonData.timestamp;
		125	});
		126
2068	runge	127	jQuery.each(pageConfigurations, function(n, configuration)
1872	runge	128	{
2068	runge	129	var pageName = configuration.page + "_" + n;
2054	linlun	130
2068	runge	131	pageInstances[pageName] = configuration;
2054	linlun	132
2068	runge	133	pageInstances[pageName].name = pageName;
2054	linlun	134
2068	runge	135	pageInstances[pageName].pageElement = $("#page-template").tmpl(pageInstances[pageName]).appendTo($("body")).page();
		136	pageInstances[pageName].pageContentElement = pageInstances[pageName].pageElement.find(":jqmData(role=content)");
2054	linlun	137
2070	runge	138	pageInstances[pageName].pageElement.find(":jqmData(rel=back)").on("click", function(event)
		139	{
2102	runge	140	$.mobile.changePage("#home", { transition: "slide", reverse: true });
2070	runge	141	event.preventDefault();
		142	});
		143
		144	pageInstances[pageName].pageLinkElement = $("#pagelink-template").tmpl(pageInstances[pageName]).appendTo($("#home").find(":jqmData(role=content)")).trigger("create").on("click", function(event)
		145	{
2102	runge	146	$.mobile.changePage("#" + pageInstances[pageName].pageElement.attr("id"), "slide");
2070	runge	147	event.preventDefault();
		148	});
		149
		150
2068	runge	151	if (pages[configuration.page] && pages[configuration.page].init)
		152	{
		153	pages[configuration.page].init(pageInstances[pageName]);
		154	}
		155	});
2054	linlun	156
2070	runge	157	$(".ui-page").on("swipeleft", function()
2068	runge	158	{
2070	runge	159	var nextpage = $(this).nextAll(":jqmData(role=page)");
2054	linlun	160
2070	runge	161	if (nextpage.length > 0)
2068	runge	162	{
2102	runge	163	$.mobile.changePage("#" + nextpage[0].id, { transition: "slide", changeHash: true });
2070	runge	164	}
		165	});
		166
		167	$(".ui-page").on("swiperight", function()
		168	{
		169	var prevpage = $(this).prevAll(":jqmData(role=page)");
2054	linlun	170
2070	runge	171	if (prevpage.length > 0)
		172	{
2102	runge	173	$.mobile.changePage("#" + prevpage[0].id, { transition: "slide", reverse: true, changeHash: true });
2068	runge	174	}
2070	runge	175	});
1872	runge	176	});
		177
2102	runge	178	var dialogCloseTimer = null;
		179	var dialogCloseCallback = null;
		180
		181	function openDialog(titleText, contentsHtml, autoCloseTimeout, closeCallback)
		182	{
		183	closeDialog();
		184
		185	$("#dialog .dialog-title").text(titleText);
		186	$("#dialog .dialog-contents").html(contentsHtml);
		187	$("#dialog a").on("click", function(event)
		188	{
		189	closeDialog();
		190	event.preventDefault();
		191	return false;
		192	});
		193
		194	dialogCloseCallback = closeCallback;
		195
		196	$.mobile.changePage($("#dialog"), { role: "dialog"});
		197
		198	$("#dialog").dialog({ close: function(event)
		199	{
		200	var callback = dialogCloseCallback;
		201
		202	closeDialog();
		203
		204	if (callback)
		205	{
		206	callback();
		207	}
		208	}});
		209
		210
		211	if (autoCloseTimeout)
		212	{
		213	dialogCloseTimer = setTimeout(closeDialog, autoCloseTimeout);
		214	}
		215	}
		216
		217	function closeDialog()
		218	{
		219	if (dialogCloseTimer)
		220	{
		221	clearTimeout(dialogCloseTimer);
		222	dialogCloseTimer = null;
		223	}
		224
		225	if ($("#dialog").is(":visible"))
		226	{
		227	$("#dialog").dialog("close");
		228
		229	if (dialogCloseCallback)
		230	{
		231	dialogCloseCallback();
		232	}
		233	}
		234
		235	dialogCloseCallback = null;
		236	}
		237
		238
2068	runge	239	</script>
		240	</head>
		241
		242	<body>
		243	<div id="home" data-role="page" data-theme="a">
		244	<div data-role="header"><h1>Home Automation Control Center</h1></div>
		245	<div data-role="content"></div>
2051	linlun	246	</div>
2102	runge	247
		248	<div data-role="dialog" id="dialog">
		249	<div data-role="content">
		250	<h3 class="dialog-title"></h3>
		251	<p class="dialog-contents"></p>
		252	<a href="#" data-role="button" data-theme="c">Close</a>
		253	</div>
		254	</div>
		255
2068	runge	256	</body>
		257	</html>

Subversion Repositories HomeAutomation

(root)/trunk/PcSoftware/scripts/Atom1.5-webgui/index.php – Rev 2102