aboutsummaryrefslogtreecommitdiff
path: root/templates/weather.html
diff options
context:
space:
mode:
Diffstat (limited to 'templates/weather.html')
-rw-r--r--templates/weather.html77
1 files changed, 77 insertions, 0 deletions
diff --git a/templates/weather.html b/templates/weather.html
new file mode 100644
index 0000000..24819dc
--- /dev/null
+++ b/templates/weather.html
@@ -0,0 +1,77 @@
1{% extends 'base.html' %}
2{% block content %}
3{% set is_day = data["current_weather"]["is_day"] %}
4<div class=content>
5 <div class=searchbar>
6 <form method="post">
7 {{ form.csrf_token }}
8 {{ form.location }}
9 {{ form.submit() }}
10 </form>
11 </div>
12 <div class=current>
13 {% set weather_code = data["current_weather"]["weathercode"] %}
14 <div class=current-info>
15 <div class=current-weather>{{ weather_codes[weather_code] }}</div>
16 <div class=current-temp> {{ data["current_weather"]["temperature"]}}°F </div>
17 <div class=current-wind>Wind: {{ data["current_weather"]["windspeed"] }} MPH {{ data["current_weather"]["winddirection"] }}</div>
18 <div class=current-sunrise>Sunrise: {{ data["daily"]["sunrise"][0] }} </div>
19 <div class=current-sunset>Sunset: {{ data["daily"]["sunset"][0] }} </div>
20 </div>
21 <div class=current-icon>
22 <img class=weather-icon src="/static/icons/svg/{{ weather_icons[weather_code][is_day]}}.svg" width=100px height=100px>
23 </div>
24 </div>
25 <div class=forecast-header> <h2 class=forecast-header>Hourly Forecast</h2> </div>
26 <div class=hourly>
27 {% for i in range(hour, hour + 24) %}
28 <div class=hourly-box>
29 <div class=hourly-info>
30 <div class=hourly-time><strong>{{ data["hourly"]["time"][i] }}</strong></div>
31 <div class=hourly-weather>
32 {{ weather_codes[data["hourly"]["weathercode"][i]] }}
33 {% if data["hourly"]["weathercode"][i] > 50 %}
34 ({{ data["hourly"]["precipitation"][i] }}in, {{ data["hourly"]["precipitation_probability"][i] }}%)
35 {% endif %}
36 </div>
37 <div class=hourly-temp>{{ data["hourly"]["temperature_2m"][i]}}°F</div>
38 <div class=hourly-humidity>Humidity: {{ data["hourly"]["relativehumidity_2m"][i] }}%</div>
39 <div class=hourly-wind>Wind: {{ data["hourly"]["windspeed_10m"][i] }}MPH {{ data["hourly"]["winddirection_10m"][i] }}</div>
40 </div>
41 <div class=hourly-icon>
42 {% set weather_code = data["hourly"]["weathercode"][i] %}
43 <img class=weather-icon src="/static/icons/svg/{{ weather_icons[weather_code][is_day]}}.svg" width=100px height=100px>
44 </div>
45 </div>
46 {% endfor %}
47 </div>
48 <div class=forecast-header>
49 <h2 class=forecast-header>Daily Forecast</h2>
50 </div>
51 <div class=daily>
52 {% for i in range(7) %}
53 <div class=daily-box>
54 <div class=daily-info>
55 <div class=daily-time><strong>{{ data["daily"]["time"][i] }}</strong></div>
56 <div class=daily-weather>
57 {{ weather_codes[data["daily"]["weathercode"][i]] }}
58 {% if data["daily"]["weathercode"][i] > 50 %}
59 ({{ data["daily"]["precipitation_sum"][i] }}in, {{ data["daily"]["precipitation_probability_max"][i] }}%)
60 {% endif %}
61 </div>
62 <div class=daily-high>High: {{ data["daily"]["temperature_2m_max"][i] }}°F</div>
63 <div class=daily-low>Low: {{ data["daily"]["temperature_2m_min"][i] }}°F</div>
64 <div class=daily-sunrise>Sunrise: {{ data["daily"]["sunrise"][i] }}</div>
65 <div class=daily-sunset>Sunset: {{ data["daily"]["sunset"][i] }}</div>
66 </div>
67 <div class=daily-icon>
68 {% set weather_code = data["daily"]["weathercode"][i] %}
69 <img class=weather-icon src="/static/icons/svg/{{ weather_icons[weather_code][is_day]}}.svg" width=100px height=100px>
70 </div>
71 </div>
72 {% endfor %}
73 </div>
74
75</div>
76{% endblock %}
77