-
Notifications
You must be signed in to change notification settings - Fork 4
/
MMM-Powerwall.njk
120 lines (120 loc) · 6.78 KB
/
MMM-Powerwall.njk
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<div class="MMM-Powerwall rflexbox">
{% for graph in graphs %}
<div class="module MMM-Powerwall module-content flexitem">
{% if graph == "SolarProduction" -%}
<div class="MMM-Powerwall" style="height: 100%">
<div class="MMM-Powerwall" id="{{id}}-SolarDay">
<div class="MMM-Powerwall grid-left">
<div class="MMM-Powerwall col1 vflexbox">
<div class="small bright spaced">{{translations.solar_current}}</div>
<div id="{{id}}-SolarProduction" class="big solar text spaced"></div>
<div class="small bright spaced" style="display:none" id="{{id}}-SolarTotalTextA"></div>
<div class="xsmall text" style="display:none" id="{{id}}-SolarYesterdayTotal"></div>
</div>
<div class="MMM-Powerwall col2 graph-container">
<canvas id="{{id}}-SolarDestinations"></canvas>
</div>
</div>
</div>
<div style="display:none; height: 100%" id="{{id}}-SolarNight">
<div class="MMM-Powerwall vflexbox">
<div id="{{id}}-SolarHeader" class="small bright"></div>
<div id="{{id}}-SolarTotalB" class="big solar text"></div>
<div class="small bright text" id="{{id}}-SolarTodayYesterday"></div>
</div>
</div>
</div>
{%- elif graph == "HouseConsumption" -%}
<div class="MMM-Powerwall grid-right">
<div class="MMM-Powerwall col1 graph-container">
<canvas id="{{id}}-HouseSources"></canvas>
</div>
<div class="MMM-Powerwall col2 vflexbox">
<div class="small bright spaced">{{translations.house_consuming}}</div>
<div id="{{id}}-HouseConsumption" class="big house text spaced"></div>
<div class="small bright text spaced" id="{{id}}-UsageTotal" style="display:none"></div>
<div class="xsmall text" style="display:none" id="{{id}}-UsageTotalYesterday"></div>
</div>
</div>
{%- elif graph == "Grid" -%}
<div class="MMM-Powerwall grid-grid">
<img src="modules/MMM-Powerwall/images/tower.png" style="grid-area:icon; max-height: 100px">
<div class="MMM-Powerwall overlay fa-lg" style="grid-area: icon;transform: translate(79%, 61%);font-size: 2.25rem">
<i class="fas" id="{{id}}-GridIcon"></i>
</div>
<div class="MMM-Powerwall small bright text grid-direction" id="{{id}}-GridDirection"></div>
<div class="MMM-Powerwall vflexbox grid-number">
<div class="big grid text spaced" id="{{id}}-GridInOut"></div>
<div class="medium bright storm-watch" style="display:none" id="{{id}}-StormWatch">{{translations.stormwatch}}</div>
</div>
<div class="MMM-Powerwall vflexbox grid-import">
<div class="small bright spaced text" id="{{id}}-GridInToday"></div>
<div class="xsmall text" id="{{id}}-GridInYesterday"></div>
</div>
<div class="MMM-Powerwall vflexbox grid-export">
<div class="small bright spaced text" id="{{id}}-GridOutToday"></div>
<div class="xsmall text" id="{{id}}-GridOutYesterday"></div>
</div>
</div>
{%- elif graph == "PowerwallSelfPowered" -%}
<div class="MMM-Powerwall grid-left">
<div class="scene MMM-Powerwall col1">
<div class="small bright text" id="{{id}}-PowerwallStatus"></div>
<div class="MMM-Powerwall cube">
<div class="cube__face cube__face--front"
id="{{id}}-PowerwallSOE"></div>
<div class="cube__face cube__face--right">
<div class="battery meter-vertical" id="{{id}}-battery-meter"></div>
<div class="meter-level" id="{{id}}-reserve"></div>
</div>
</div>
</div>
<div class="MMM-Powerwall col2 graph-container">
<canvas id="{{id}}-SelfPoweredDetails"></canvas>
<div class="MMM-Powerwall overlay small">
<span class="bright"><span class="MMM-Powerwall bright big text" id="{{id}}-SelfPoweredTotal"></span><br>
{{translations.selfpowered}}</span><br>
<span class="MMM-Powerwall text xsmall" id="{{id}}-SelfPoweredYesterday"></span>
</div>
</div>
</div>
{%- elif graph == "CarCharging" -%}
<div class="MMM-Powerwall grid-right text" id="{{id}}-CarTile" style="opacity: 0">
<div class="MMM-Powerwall col1">
<div class="MMM-Powerwall cbattery">
<div class="battery meter-horizontal" id="{{id}}-car-meter" style="margin-right: 0"></div>
<div class="battery-cold meter-horizontal" id="{{id}}-car-meter-unavailable" style="margin-left: 0"></div>
<div class="MMM-Powerwall overlay medium bright text" id="{{id}}-car-meter-text"></div>
</div>
<div class="MMM-Powerwall no-overflow">
<div class="MMM-Powerwall car-image">
<canvas id="{{id}}-Picture">
</div>
</div>
</div>
<div class="MMM-Powerwall col2 vflexbox">
<div class="MMM-Powerwall small bright spaced"><span id="{{id}}-CarStatus"></span></div>
<div class="MMM-Powerwall big car text spaced" id="{{id}}-CarConsumption"></div>
<div class="MMM-Powerwall small" id="{{id}}-CarCompletion" style="display:none"></div>
</div>
</div>
{%- elif graph == "EnergyBar" -%}
<div class="MMM-Powerwall big-graph-container">
<canvas id="{{id}}-EnergyBar"></canvas>
</div>
{%- elif graph == "PowerLine" -%}
<div class="MMM-Powerwall big-graph-container">
<canvas id="{{id}}-PowerLine"></canvas>
</div>
{%- elif graph == "AuthNeeded" -%}
<h4><a href="/MMM-Powerwall/auth">{{translations.authNeeded}}</a></h4>
{% for account in accountsNeedAuth %}
<p class="small">{{account}}</p>
{% endfor %}
{%- else -%}
{{translations.unknown}}
{%- endif -%}
</div>
{%- endfor %}
</div>
</div>