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" />
2318	arune	12	<link rel="manifest" href="manifest.json" />
2068	runge	13	<script src="jquery-1.7.2.min.js"></script>
2154	arune	14	<script src="jquery.timeago.js"></script>
2068	runge	15	<script src="jquery.mobile-1.1.1.min.js"></script>
		16	<script src="jquery.tmpl.min.js"></script>
1872	runge	17
2068	runge	18	<style>
		19	<?php
		20	foreach ($pages as $page)
		21	{
2314	arune	22	if (file_exists("pages/" . $page . "/style.css"))
		23	{
		24	include("pages/" . $page . "/style.css");
		25	}
2068	runge	26	}
		27	?>
2096	runge	28
		29	.ui-li-heading {
		30	white-space: normal;
		31	}
2068	runge	32	</style>
2060	linlun	33
2068	runge	34	<?php
		35	foreach ($pages as $page)
		36	{
2314	arune	37	if (file_exists("pages/" . $page . "/template.html"))
		38	{
		39	include("pages/" . $page . "/template.html");
		40	}
2068	runge	41	}
		42	?>
1872	runge	43
2068	runge	44	<script id="page-template" type="text/x-jquery-tmpl" data-enhance="false">
2102	runge	45	<div id="page-${name}" data-role="page" data-theme="a" id="page-{name}">
2147	arune	46	<div data-id="PersistentFooter" data-role="header" data-position="fixed" data-tap-toggle="false">
2145	runge	47	<div data-role="navbar">
		48	<ul class="navbar-container"></ul>
		49	</div>
2070	runge	50	</div>
2068	runge	51	<div data-role="content"></div>
		52	</div>
		53	</script>
1872	runge	54
2068	runge	55	<script id="pagelink-template" type="text/x-jquery-tmpl" data-enhance="false">
		56	<span>
2070	runge	57	<a href="#" data-role="button">${title}</a>
2068	runge	58	</span>
		59	</script>
2054	linlun	60
2068	runge	61	<script>
		62	$.mobile.ignoreContentEnabled = true;
2102	runge	63	$.mobile.transitionFallbacks.pop = "none";
		64	$.mobile.transitionFallbacks.flip = "none";
		65	$.mobile.transitionFallbacks.turn = "none";
		66	$.mobile.transitionFallbacks.flow = "none";
		67	$.mobile.transitionFallbacks.slidefade = "none";
		68	$.mobile.transitionFallbacks.slide = "none";
		69	$.mobile.transitionFallbacks.slideup = "none";
		70	$.mobile.transitionFallbacks.slidedown = "none";
		71	$.mobile.defaultPageTransition = "none";
		72	$.mobile.ajaxEnabled = false;
1872	runge	73
2102	runge	74	var commandActive = false;
		75	var commandQueue = [];
		76
2068	runge	77	function sendCommand(command, callback)
		78	{
2102	runge	79	if (commandActive)
		80	{
		81	commandQueue.push({ command: command, callback: callback });
		82	}
		83	else
		84	{
		85	commandActive = true;
		86
		87	jQuery.getJSON("backend.php?ajax", { command: command }, function(jsonData)
		88	{
2105	runge	89	handleCommandResponse(true, jsonData, callback);
		90	}).error(function()
		91	{
		92	handleCommandResponse(false, {}, callback);
		93	});
		94	}
		95	}
2102	runge	96
2105	runge	97	function handleCommandResponse(success, jsonData, callback)
		98	{
		99	commandActive = false;
2102	runge	100
2105	runge	101	if (commandQueue.length > 0)
		102	{
		103	var commandItem = commandQueue.shift();
2102	runge	104
2105	runge	105	sendCommand(commandItem.command, commandItem.callback);
		106	}
		107
		108	if (success)
		109	{
		110	if (callback)
		111	{
2102	runge	112	callback(jsonData);
2105	runge	113	}
2102	runge	114	}
2105	runge	115	else
		116	{
		117	console.log("command failed!");
		118	}
2068	runge	119	}
		120	</script>
1872	runge	121
2068	runge	122	<script>
		123	var pages = {};
1872	runge	124
2068	runge	125	<?php
		126	foreach ($pages as $page)
1872	runge	127	{
2068	runge	128	include("pages/" . $page . "/script.js");
1872	runge	129	}
		130	?>
2068	runge	131	</script>
1872	runge	132
2068	runge	133	<script>
		134
2080	runge	135	var aliasNames = <?php echo json_encode($aliasNames); ?>;
2068	runge	136	var pageConfigurations = <?php echo json_encode($pageConfiguration); ?>;
2146	runge	137	var pageInstances = { };
2102	runge	138	var serverTimeOffset = 0;
2068	runge	139
2102	runge	140	function getServerTimestamp()
		141	{
		142	return ((new Date()).getTime()) - serverTimeOffset
		143	}
		144
2068	runge	145	$(document).ready(function(event)
1872	runge	146	{
2111	runge	147	sendCommand("(new Date()).getTime();", function(timestamp)
2102	runge	148	{
2111	runge	149	serverTimeOffset = ((new Date()).getTime()) - parseInt(timestamp, 10);
2102	runge	150	});
		151
2068	runge	152	jQuery.each(pageConfigurations, function(n, configuration)
1872	runge	153	{
2068	runge	154	var pageName = configuration.page + "_" + n;
2054	linlun	155
2068	runge	156	pageInstances[pageName] = configuration;
2054	linlun	157
2068	runge	158	pageInstances[pageName].name = pageName;
2054	linlun	159
2068	runge	160	pageInstances[pageName].pageElement = $("#page-template").tmpl(pageInstances[pageName]).appendTo($("body")).page();
		161	pageInstances[pageName].pageContentElement = pageInstances[pageName].pageElement.find(":jqmData(role=content)");
2054	linlun	162
2068	runge	163	if (pages[configuration.page] && pages[configuration.page].init)
		164	{
		165	pages[configuration.page].init(pageInstances[pageName]);
		166	}
		167	});
2054	linlun	168
2145	runge	169
		170	jQuery.each(pageInstances, function(pageName, pageInstance)
2068	runge	171	{
2145	runge	172	var navbarContainerElement = pageInstances[pageName].pageElement.find("ul.navbar-container");
		173
		174	jQuery.each(pageInstances, function(pageName2, pageInstance2)
		175	{
		176	if (pageInstance === pageInstance2)
		177	{
		178	$("<li class=''><a href='#page-" + pageName2 + "' class='ui-btn-active ui-state-persist'>" + pageInstance2.title + "</a></li>").appendTo(navbarContainerElement);
		179	}
		180	else
		181	{
		182	$("<li class=''><a href='#page-" + pageName2 + "'>" + pageInstance2.title + "</a></li>").appendTo(navbarContainerElement);
		183	}
		184	});
		185	});
		186
		187	$(":jqmData(role=header)").navbar();
		188
		189
		190	/*$(".ui-page").on("swipeleft", function()
		191	{
2070	runge	192	var nextpage = $(this).nextAll(":jqmData(role=page)");
2054	linlun	193
2070	runge	194	if (nextpage.length > 0)
2068	runge	195	{
2133	runge	196	$.mobile.changePage("#" + nextpage[0].id, { transition: "none", changeHash: true });
2070	runge	197	}
2133	runge	198	else
		199	{
		200	nextpage = $(":jqmData(role=page)");
		201
		202	$.mobile.changePage("#" + nextpage[0].id, { transition: "none", changeHash: true });
		203	}
2070	runge	204	});
		205
		206	$(".ui-page").on("swiperight", function()
		207	{
		208	var prevpage = $(this).prevAll(":jqmData(role=page)");
2054	linlun	209
2070	runge	210	if (prevpage.length > 0)
		211	{
2133	runge	212	$.mobile.changePage("#" + prevpage[0].id, { transition: "none", reverse: true, changeHash: true });
2068	runge	213	}
2133	runge	214	else
		215	{
		216	prevpage = $(":jqmData(role=page)");
		217
		218	$.mobile.changePage("#" + prevpage[prevpage.length - 1].id, { transition: "none", reverse: true, changeHash: true });
		219	}
2145	runge	220	});*/
		221
2192	linlun	222	$(".ui-page").on("pagebeforeshow", function(arg1, arg2)
		223	{
		224	var res=arg1.currentTarget.id.split("-");
		225	if (res[1] != null) {
		226	res=res[1].split("_");
		227	if (pages[res[0]].pageshow) {
		228	pages[res[0]].pageshow();
		229	}
		230	}
		231	});
		232
		233	$(".ui-page").on("pagehide", function(arg1, arg2)
		234	{
		235
		236	var res=arg1.currentTarget.id.split("-");
		237	if (res[1] != null) {
		238	res=res[1].split("_");
		239	if (pages[res[0]].pagehide) {
		240	pages[res[0]].pagehide();
		241	}
		242	}
		243	});
		244
2145	runge	245	$(":jqmData(role=navbar)").delegate("a", "vclick", function(event)
		246	{
		247	if(!$(event.target).hasClass("ui-disabled"))
		248	{
		249	$(":jqmData(role=navbar)").find("a").not(".ui-state-persist").removeClass($.mobile.activeBtnClass);
		250	$(this).addClass($.mobile.activeBtnClass);
		251	}
2070	runge	252	});
2146	runge	253
		254	if (document.location.hash === "" \|\| document.location.hash === "#")
		255	{
		256	document.location.hash = "#" + $(":jqmData(role=page)").attr("id");
		257	}
		258
		259	$.mobile.changePage($(document.location.hash));
		260
1872	runge	261	});
		262
2102	runge	263	var dialogCloseTimer = null;
		264	var dialogCloseCallback = null;
		265
		266	function openDialog(titleText, contentsHtml, autoCloseTimeout, closeCallback)
		267	{
		268	closeDialog();
		269
		270	$("#dialog .dialog-title").text(titleText);
		271	$("#dialog .dialog-contents").html(contentsHtml);
		272	$("#dialog a").on("click", function(event)
		273	{
		274	closeDialog();
		275	event.preventDefault();
		276	return false;
		277	});
		278
		279	dialogCloseCallback = closeCallback;
		280
		281	$.mobile.changePage($("#dialog"), { role: "dialog"});
		282
		283	$("#dialog").dialog({ close: function(event)
		284	{
		285	var callback = dialogCloseCallback;
		286
		287	closeDialog();
		288
		289	if (callback)
		290	{
		291	callback();
		292	}
		293	}});
		294
		295
		296	if (autoCloseTimeout)
		297	{
		298	dialogCloseTimer = setTimeout(closeDialog, autoCloseTimeout);
		299	}
		300	}
		301
		302	function closeDialog()
		303	{
		304	if (dialogCloseTimer)
		305	{
		306	clearTimeout(dialogCloseTimer);
		307	dialogCloseTimer = null;
		308	}
		309
		310	if ($("#dialog").is(":visible"))
		311	{
		312	$("#dialog").dialog("close");
		313
		314	if (dialogCloseCallback)
		315	{
		316	dialogCloseCallback();
		317	}
		318	}
		319
		320	dialogCloseCallback = null;
		321	}
		322
		323
2068	runge	324	</script>
		325	</head>
		326
		327	<body>
2102	runge	328	<div data-role="dialog" id="dialog">
		329	<div data-role="content">
		330	<h3 class="dialog-title"></h3>
		331	<p class="dialog-contents"></p>
		332	<a href="#" data-role="button" data-theme="c">Close</a>
		333	</div>
		334	</div>
		335
2068	runge	336	</body>
		337	</html>

Subversion Repositories HomeAutomation

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