158 lines
8.5 KiB
HTML
158 lines
8.5 KiB
HTML
|
<!DOCTYPE html>
|
|||
|
|
<html lang="fr" dir="ltr">
|
|||
|
|
<head>
|
|||
|
|
<meta charset="utf-8">
|
|||
|
|
<title>Domotique</title>
|
|||
|
|
<link rel="stylesheet" type="text/css" href="index.css" media="screen"/>
|
|||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|||
|
|
</head>
|
|||
|
|
<body>
|
|||
|
|
<div id="logged-in-content" style="display: none;">
|
|||
|
|
<div id="left-widget-container">
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Puissances</header>
|
|||
|
|
<main>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Courante</span>
|
|||
|
|
<span class="int-value" id="live-data-papp"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">VA</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Coupure</span>
|
|||
|
|
<span class="int-value" id="live-data-pcoup"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">VA</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Référence (souscrite)</span>
|
|||
|
|
<span class="int-value" id="live-data-pref"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">VA</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Max aujourd’hui</span>
|
|||
|
|
<span class="meta" id="live-data-pj-time">--:--</span>
|
|||
|
|
<span class="int-value" id="live-data-pj"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">VA</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Max hier</span>
|
|||
|
|
<span class="meta" id="live-data-pj-1-time">--:--</span>
|
|||
|
|
<span class="int-value" id="live-data-pj-1"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">VA</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Voltage</header>
|
|||
|
|
<main>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">U<sub>eff</sub></span>
|
|||
|
|
<span class="int-value" id="live-data-urms"></span><span style="visibility: hidden;">.<span class="dec-value"> </span></span>
|
|||
|
|
<span class="unit">V</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Indexes cumulés</header>
|
|||
|
|
<main id="live-data-indexes">
|
|||
|
|
<div id="live-data-indexes-template" class="big-value live-data-index" style="display: none;">
|
|||
|
|
<span class="name"></span>
|
|||
|
|
<span class="int-value"></span>.<span class="dec-value"> </span>
|
|||
|
|
<span class="unit">kWh</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Indexes jour</header>
|
|||
|
|
<main id="live-data-indexes-day">
|
|||
|
|
<div id="live-data-indexes-day-template" class="big-value" style="display: none;">
|
|||
|
|
<span class="name"></span>
|
|||
|
|
<span class="meta"></span>
|
|||
|
|
<span class="int-value"></span>.<span class="dec-value"></span>
|
|||
|
|
<span class="unit">kWh</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Couts depuis minuit</header>
|
|||
|
|
<main id="live-data-price-day">
|
|||
|
|
<div id="live-data-price-day-template" class="big-value" style="display: none;">
|
|||
|
|
<span class="name"></span>
|
|||
|
|
<span class="meta"><span class="live-data-price-per-kwh"></span> € / kWh</span>
|
|||
|
|
<span class="int-value"></span>.<span class="dec-value"></span>
|
|||
|
|
<span class="unit">€</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Total</span>
|
|||
|
|
<span class="int-value" id="live-data-price-total-int"></span>.<span class="dec-value" id="live-data-price-total-dec"></span>
|
|||
|
|
<span class="unit">€</span>
|
|||
|
|
</div>
|
|||
|
|
<div class="big-value">
|
|||
|
|
<span class="name">Abonnement</span>
|
|||
|
|
<span class="meta"><span id="live-data-price-sub-per-month"></span> € / mois</span>
|
|||
|
|
<span class="int-value" id="live-data-price-sub-int"></span>.<span class="dec-value" id="live-data-price-sub-dec"></span>
|
|||
|
|
<span class="unit">€</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Infos compteur</header>
|
|||
|
|
<main>
|
|||
|
|
Num série : <span class="raw-value" id="live-data-serial"></span><br>
|
|||
|
|
PRM/<span title="Référence Point De Livraison">PDL</span> : <span class="raw-value" id="live-data-prm"></span><br>
|
|||
|
|
Tarif : <span class="raw-value" id="live-data-OPTARIF"></span><br>
|
|||
|
|
<span class="raw-value" id="live-data-status"></span>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Air</header>
|
|||
|
|
<main id="live-data-sensors">
|
|||
|
|
<div id="live-data-sensors-template" class="big-value" style="display: none;">
|
|||
|
|
<span class="name"></span>
|
|||
|
|
<span class="meta"><span class="live-data-sensor-hum"></span> % Hum.</span>
|
|||
|
|
<span class="int-value"></span>.<span class="dec-value"></span>
|
|||
|
|
<span class="unit">°C</span>
|
|||
|
|
</div>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Connexion</header>
|
|||
|
|
<main>
|
|||
|
|
<form method="get" action="/_logout" target="login_frame">
|
|||
|
|
<input type="submit" value="Se déconnecter"/>
|
|||
|
|
</form>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<!-- <div id="right-widget-container">
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Widget 1</header>
|
|||
|
|
<main>Du contenu</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Widget 2</header>
|
|||
|
|
<main>Encore<br>du<br>contenu</main>
|
|||
|
|
</div>
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Widget 3</header>
|
|||
|
|
<main>Encore<br>du contenu</main>
|
|||
|
|
</div>
|
|||
|
|
</div> -->
|
|||
|
|
</div>
|
|||
|
|
<div id="login-form" style="display: none;">
|
|||
|
|
<div class="widget">
|
|||
|
|
<header>Connexion</header>
|
|||
|
|
<main>
|
|||
|
|
<form method="post" action="/_login" onsubmit="setHTML('live-login-status', 'Connexion...');" target="login_frame">
|
|||
|
|
<input type="text" name="username" placeholder="Pseudo"/>
|
|||
|
|
<input type="password" name="password" placeholder="Mot de passe"/>
|
|||
|
|
<input type="submit" value="Connexion"/>
|
|||
|
|
<span class="raw-value" id="live-login-status"></span>
|
|||
|
|
</form>
|
|||
|
|
<iframe id="login_frame" name="login_frame" style="display: none;"></iframe>
|
|||
|
|
</main>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</body>
|
|||
|
|
</html>
|
|||
|
|
<script src="index.js"></script>
|