vzlogger/htdocs/frontend/index.html

172 lines
7.7 KiB
HTML
Raw Normal View History

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>volkszaehler.org - web frontend</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
2011-01-16 09:44:58 +01:00
<link rel="shortcut icon" type="image/x-icon" href="../favicon.ico">
<link rel="apple-touch-icon" href="../favicon.ico">
2010-10-28 01:29:56 +02:00
<!-- jQuery -->
<script type="text/javascript" src="javascripts/jquery/jquery-1.5.1.js"></script>
<script type="text/javascript" src="javascripts/jquery/jquery-ui-1.8.10.min.js"></script>
<script type="text/javascript" src="javascripts/jquery/jquery-treeTable.js"></script>
2010-10-22 13:59:14 +02:00
<script type="text/javascript" src="javascripts/jquery/jquery-extensions.js"></script>
2010-09-28 16:25:09 +02:00
2011-03-01 23:16:32 +01:00
<!--[if IE]><script language="javascript" type="text/javascript" src="javascripts/flot/excanvas.min.js"></script><![endif]-->
2010-10-04 02:22:32 +02:00
<script type="text/javascript" src="javascripts/flot/jquery.flot.js"></script>
<script type="text/javascript" src="javascripts/flot/jquery.flot.crosshair.js"></script>
2010-12-10 22:13:19 +01:00
<script type="text/javascript" src="javascripts/flot/jquery.flot.selection.js"></script>
2010-10-22 13:59:14 +02:00
<script type="text/javascript" src="javascripts/helper.js"></script>
<script type="text/javascript" src="javascripts/init.js"></script>
<script type="text/javascript" src="javascripts/options.js"></script>
<script type="text/javascript" src="javascripts/functions.js"></script>
<script type="text/javascript" src="javascripts/entities.js"></script>
<script type="text/javascript" src="javascripts/wui.js"></script>
<script type="text/javascript" src="javascripts/entity.js"></script>
<link rel="stylesheet" type="text/css" href="stylesheets/ui-lightness/jquery-ui-1.8.10.css" />
<link rel="stylesheet" type="text/css" href="stylesheets/jquery.treeTable.css">
2010-11-07 19:52:30 +01:00
<link rel="stylesheet" type="text/css" href="stylesheets/jquery.ui.custom.css">
<link rel="stylesheet" type="text/css" href="stylesheets/style.css">
</head>
<body>
2010-12-10 22:13:19 +01:00
<div id="header"></div>
<div id="content">
2010-12-10 22:13:19 +01:00
<div id="headline">
<h2 id="title"></h2>
<div id="links">
<button id="snapshot"><img src="images/image.png" alt="snaptshot" /> Snapshot</button>
<button id="permalink"><img src="images/link.png" alt="permalink" /> Permalink</button>
</div>
2010-12-10 22:13:19 +01:00
<br style="clear: both" />
</div>
<div id="plot">
<div id="flot"></div>
2010-11-07 23:08:08 +01:00
<div id="overlay"></div>
</div>
2010-11-01 17:43:57 +01:00
<div id="accordion">
2010-11-01 13:10:20 +01:00
<div id="controls">
2011-06-25 23:41:44 +02:00
<button value="move-back" title="scroll backward"><img src="images/control_rewind_blue.png"/></button>
<button value="move-forward" title="scroll forward"><img src="images/control_fastforward_blue.png"/></button>
<button value="move-last" title="scroll to presence">Jetzt&nbsp;<img src="images/control_end_blue.png"/></button>
<button value="zoom-in" title="zoom in"><img src="images/zoom_in.png"/></button>
<button value="zoom-out" title="zoom out"><img src="images/zoom_out.png"/></button>
<button value="zoom-hour">Stunde</button>
<button value="zoom-day">Tag</button>
<button value="zoom-week">Woche</button>
<button value="zoom-month">Monat</button>
<button value="zoom-year">Jahr</button>
2010-11-01 13:10:20 +01:00
</div>
2010-09-28 16:25:09 +02:00
<h3><img src="images/table.png" alt="" /> Kanäle</h3>
<div id="entity-list">
<table>
<thead>
<tr>
2010-10-22 13:59:14 +02:00
<th><img src="images/eye.png" alt="Anzeige" title="Anzeige" /></th>
<th></th>
<th>Titel</th>
<th>Typ</th>
<th>Min.</th>
<th>Max.</th>
<th>&empty;</th>
2011-03-16 17:51:54 +01:00
<th>aktuell</th>
<th>Verbrauch</th>
2011-03-16 17:51:54 +01:00
<th>Kosten</th>
2011-02-25 17:52:32 +01:00
<th>Aktion</th>
</tr>
</thead>
<tbody></tbody>
</table>
<div><button name="entity-add"><img src="images/add.png" alt="add" /> Kanal hinzuf&uuml;gen</button></div>
</div>
<h3><img src="images/wrench.png" alt="" /> Optionen</h3>
2010-09-28 18:17:45 +02:00
<div id="options">
2010-09-28 16:25:09 +02:00
<table>
<thead>
<tr>
<th>Option</th>
<th>Wert</th>
</tr>
</thead>
<tbody>
<tr>
2010-11-07 23:08:08 +01:00
<td><label for="refresh"><img src="images/arrow_refresh.png" alt="" /> Automatisch aktualisieren</label></td>
<td><input type="checkbox" id="refresh" /> <span id="refresh-time"><span></td>
</tr>
<tr>
<td><img src="images/eye.png" alt="" /> Darstellung</td>
2010-12-10 22:13:19 +01:00
<td>
<label for="render-points"><input type="radio" id="render-points" name="render" value="points" /> Punkte</label>&nbsp;
<label for="render-lines"><input type="radio" id="render-lines" name="render" value="lines" /> Linien</label>
</td>
2010-10-06 06:34:36 +02:00
</tr>
</tbody>
2010-09-28 16:25:09 +02:00
</table>
2010-12-10 22:13:19 +01:00
<div><button name="options-save"><img src="images/save.png" alt="save" /> Einstellungen speichern</button></div>
2010-09-28 16:25:09 +02:00
</div>
</div>
</div>
<div id="footer">
2011-04-07 00:01:41 +02:00
&copy; 2011 - <a href="http://volkszaehler.org/">volkszaehler.org</a> - the open smartmeter platform
</div>
<!-- dialogs -->
<div id="entity-move" class="dialog">
<p>
<span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>
Sie sind im Begriff einen Kanal oder eine Gruppe zu Verschieben!
</p>
</div>
<div id="entity-add" class="dialog">
<div class="tabs">
<ul>
<li><a href="#entity-subscribe">Kanal abonnieren</a></li>
2011-06-30 22:04:33 +02:00
<li><a href="#entity-public">&ouml;ffentliche Kan&auml;le</a></li>
<li><a href="#entity-create">Kanal erstellen</a></li>
</ul>
<div id="entity-subscribe">
<p>Hier k&ouml;nnen Sie einen existierenden Kanal über seine UUID hinzuf&uuml;gen</p>
<table>
2011-06-30 22:04:33 +02:00
<tr><td><label for="entity-subscribe-middleware">Middleware:</label></td><td><input id="entity-subscribe-middleware" type="text" size="36" /></td></tr>
<tr><td><label for="entity-subscribe-uuid">UUID:</label></td><td><input id="entity-subscribe-uuid" type="text" size="36" maxlength="36" /></td></tr>
</table>
2011-06-30 22:04:33 +02:00
<p><input type="button" value="Abonnieren" /> <label for="entity-subscribe-cookie">Cookie:</label> <input id="entity-subscribe-cookie" type="checkbox" /></p>
</div>
2011-06-30 22:04:33 +02:00
<div id="entity-public">
<p>Hier k&ouml;nnen Sie &ouml;ffentliche Kan&auml;le abonnieren.</p>
<table>
2011-06-30 22:04:33 +02:00
<tr><td><label for="entity-public-middleware">Middleware:</label></td><td><select id="entity-public-middleware"></select></td></tr>
<tr><td><label for="entity-public-entity">Kanal:</label></td><td><select id="entity-public-entity" size="1"></select></td></tr>
</table>
2011-06-30 22:04:33 +02:00
<p><input type="button" value="Abonnieren" /> <label for="entity-public-cookie">Cookie:</label> <input id="entity-public-cookie" type="checkbox" /></p>
</div>
<div id="entity-create">
<form method="get" target="_blank">
<table>
<tr class="property"><th>Eigenschaft</th><th>Wert</th></tr>
2011-06-30 22:04:33 +02:00
<tr class="property"><td>Middleware:></td><td><input type="text" id="entity-create-middleware" /></td></tr>
<tr class="property"><td>Typ:</td><td><select id="enti"name="type" size="1"></select></td></tr>
<tr class="property"><td>&Ouml;ffentlich:</td><td><input type="radio" name="public" value="1"> ja&nbsp;&nbsp;<input type="radio" name="public" value="0"> nein</td></tr>
<tr class="property"><td>Titel:</td><td><input type="text" name="title" value="K&uuml;hlschrank" /></td></tr>
<tr class="property"><td>Aufl&ouml;sung:</td><td><input type="text" name="resolution" value="1000" /></td></tr>
<tr class="property"><td>Kosten:<br /><p style="font-size: small">pro Wh</p></td><td><input type="text" name="cost" value="0.00025" /></td></tr>
<tr class="property"><td>Beschreibung:</td><td><input type="text" name="description" value="Swissnox 1-phasig" /></td></tr>
</table>
<input type="hidden" name="operation" value="add" />
<p><input type="submit" value="Erstellen" /></p>
<p>Es wird ein neuer Kanal erstellt. Die Antwort der Middleware enthält dann die UUID.<br />
Diese muss dann im Controller angegeben werden (z.B. AVR Net-IO).</p>
</form>
</div>
</div>
</div>
</body>
2010-09-11 05:09:00 +02:00
</html>