Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New Weather App with Brand Fetching Features #208

Open
wants to merge 32 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
32 commits
Select commit Hold shift + click to select a range
424c057
udpated UI
salmanfarisvp Dec 20, 2024
6222cff
added new icon update option
salmanfarisvp Jan 8, 2025
e9d04f3
fix js lint
salmanfarisvp Jan 9, 2025
c9e045d
fix icon.js lint
salmanfarisvp Jan 9, 2025
48cfe60
removed unwated css filed from previous app
salmanfarisvp Jan 9, 2025
d3a32be
fix css lint'
salmanfarisvp Jan 9, 2025
2ebdd2c
fix css lint with rule
salmanfarisvp Jan 9, 2025
b9d365f
update yml openweather ap api helper text
salmanfarisvp Jan 9, 2025
a87aa7d
update yml openweather ap api helper text
salmanfarisvp Jan 9, 2025
7fea028
fix js lint on main.js
salmanfarisvp Jan 9, 2025
86b480d
fix js lint on main.js
salmanfarisvp Jan 9, 2025
f432363
added no-unused var in icon.js for lint
salmanfarisvp Jan 9, 2025
dc7bda8
Merge branch 'master' into feat/new-weather-app
nicomiguelino Jan 22, 2025
132f23a
fix: time display not updating
nicomiguelino Jan 22, 2025
ed6d531
chore: re-write datetime-fetching logic the reactive way
nicomiguelino Jan 22, 2025
e47ad18
chore: remove unused HTML ID attributes
nicomiguelino Jan 22, 2025
2d6425f
chore: update HTML title of weather app
nicomiguelino Jan 22, 2025
9fb3c76
chore: update code placement
nicomiguelino Jan 22, 2025
dc937f1
chore: move image-fetching code to Alpine
nicomiguelino Jan 22, 2025
723c88b
chore(ci): fix linter errors
nicomiguelino Jan 22, 2025
98efd72
added helper function to display the icons in night mode
salmanfarisvp Jan 23, 2025
4894fa3
removed index2.html
salmanfarisvp Jan 23, 2025
777bb95
removed ;
salmanfarisvp Jan 23, 2025
31d99e0
lint
salmanfarisvp Jan 23, 2025
b921829
added helper function for icon render
salmanfarisvp Jan 23, 2025
d1aa3ed
fix: first forcasted item is still in 12-hour format even if it should
nicomiguelino Jan 23, 2025
c61e831
Merge branch 'feat/new-weather-app' into nicomiguelino/feat/new-weath…
nicomiguelino Jan 23, 2025
931c1b2
Merge branch 'master' into feat/new-weather-app
nicomiguelino Feb 4, 2025
00c9881
Merge branch 'feat/new-weather-app' into nicomiguelino/feat/new-weath…
nicomiguelino Feb 4, 2025
a20a0f7
fix: have the time display use `formatTime` as well
nicomiguelino Feb 4, 2025
2f74abc
fix: handling of locales and formatting of time
nicomiguelino Feb 5, 2025
171be3a
Merge pull request #213 from Screenly/nicomiguelino/feat/new-weather-app
salmanfarisvp Feb 12, 2025
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion edge-apps/weather/.ignore

This file was deleted.

121 changes: 0 additions & 121 deletions edge-apps/weather/index copy.html

This file was deleted.

186 changes: 75 additions & 111 deletions edge-apps/weather/index.html
Original file line number Diff line number Diff line change
@@ -1,121 +1,85 @@
<!DOCTYPE html>
<html>
<head>
<title>Screenly Weather App - Weather Forecast</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="static/styles/main.css" />
<link rel="stylesheet" href="static/styles/background.css" />
</head>
<body x-data="weather" :class="bgClass">
<script src="screenly.js?version=1"></script>
<script src="static/js/alpinejs-3.13.0.min.js" defer></script>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Weather App</title>
<link rel="stylesheet" href="./static/styles/common.css">
<link rel="stylesheet" href="./static/styles/styles.css">
</head>
<body x-data="weather">

<!-- Google Tag Manager -->
<script>
window.onload = function() {
const {
enable_analytics: enableAnalytics,
tag_manager_id: tagManagerId,
} = screenly.settings;
<div class="main-container main-container-grid">
<div class="primary-card main-weather-card">
<div class="temperature-card">
<div class="temperature-text">
<span class="temperature-text-number" x-text="currentTemp"></span>
</div>
<div class="temperature-unit">
<span class="temperature-unit-text" x-text="currentFormattedTempScale"></span>
</div>
</div>
</div>

if (enableAnalytics === 'true') {
(function(w, d, s, l, i) {
w[l] = w[l] || [];
w[l].push({
'gtm.start': new Date().getTime(),
event: 'gtm.js'
});
var f = d.getElementsByTagName(s)[0],
j = d.createElement(s),
dl = l != 'dataLayer' ? '&l=' + l : '';
j.async = true;
j.src = 'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
f.parentNode.insertBefore(j, f);
})(window, document, 'script', 'dataLayer', tagManagerId);
}
};
</script>
<!-- End Google Tag Manager -->
<div class= "time-date-card">
<div class="secondary-card time-card">
<div class="time-card">
<div class="time-text-container">
<span class="time-text-hour" x-text="timeHour"></span>
<span class="time-text-separator">:</span>
<span class="time-text-minutes" x-text="timeMinutes"></span>
</div>
<div class="time-ampm-container">
<span class="time-ampm"
x-text="timeAmPm"
x-show="showAmPm"
></span>
</div>
</div>
</div>
<div class="date-card">
<span class="date-text" x-text="dateText"></span>
<span class="date-number" x-text="dateNumber"></span>
</div>
</div>

<template x-if="isLoading && !error">
<div class="error">
<div class="group">
<h2>Loading...</h2>
<div class="loader"></div>
</div>
</div>
</template>

<template x-if="error">
<div class="error">
<div class="group">
<h2 x-text="errorMessage"></h2>
<div class="loader"></div>
</div>
</div>
</template>
<div class="secondary-card weather-card">
<div class="weather-card-content">
<template x-for="item in forecastedItems" :key="item.id">
<div class="weather-card-content-item">
<div class="weather-card-content-item-temperature-text">
<span class="weather-card-temperature-text" x-text="item.temp"></span>
<span class="weather-card-temperature-degree-sign">&deg;</span>
</div>
<div class="weather-card-content-item-temperature-icon">
<img alt="Weather Icon" class="weather-card-weather-icon" :src="item.icon" >
</div>
<div class="weather-card-content-item-temperature-time">
<span class="weather-card-content-item-temperature-time" x-text="item.time"></span>
</div>
</div>
</template>
</div>
</div>

<template x-if="!error">
<div class="content">
<section class="header">
<div class="location">
<span class="location-item">
<img src="static/images/icons/map-pin.svg" alt="map pin icon">
<span id="city" x-text="city"></span>
</span>

<span class="location-item">
<img src="static/images/icons/clock.svg" alt="clock icon">
<span id="time" x-text="currentTime"></span>
</span>
<div class="secondary-card info-card">
<img id="brand-logo" :src="brandLogo" class="brand-logo" alt="Brand Logo" />
<span class="info-text">Powered by Screenly</span>
</div>

<span class="location-item">
<img src="static/images/icons/calendar.svg" alt="calendar icon">
<span id="date" x-text="currentDate"></span>
</span>
</div>
</section>
<section class="footer">
<div class="current-weather">
<div class="weather-condition">
<img
id="current-weather-icon"
alt="weather icon"
:src="currentWeatherIcon"
>
<span
id="current-weather-status"
x-text="currentWeatherStatus"
></span>
</div>
<div class="temperature">
<span
id="current-temp"
x-text="currentTemp"
></span>
<span
id="current-temp-scale"
x-text="currentFormattedTempScale"
></span>
</div>
</div>
</div>

<div id="weather-item-list">
<template x-for="item in forecastedItems" :key="item.id">
<div class="weather-item">
<span class="item-temp-degree">
<span class="item-temp" x-text="item.temp"></span>&deg;
</span>
<img class="item-icon" alt="clock icon" :src="item.icon">
<span class="item-time" x-text="item.time"></span>
</div>
</template>
</div>
</section>
</div>
</template>
<script src="static/js/moment-with-locales.min.js"></script>
<script src="static/js/icons.js"></script>
<script src="static/js/main.js"></script>
</body>
<script src="static/js/alpinejs-3.13.0.min.js" defer></script>

<script src="screenly.js?version=1"></script>
<script src="static/js/country-locale-map.1.18.5.min.js"></script>
<script src="static/js/moment-with-locales.min.js"></script>
<script src="static/js/moment-timezone-with-data.min.js"></script>
<script src="static/js/offline-geocode-city-1.0.2.min.js"></script>
<script src="static/js/tz.min.js"></script>
<script src="static/js/icons.js"></script>
<script src="static/js/main.js"></script>
</body>
</html>
13 changes: 12 additions & 1 deletion edge-apps/weather/screenly.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ settings:
optional: false
is_global: true
help_text: |
Specify an API key so that you'll have access to all the necessary weather data.
Specify OpenWeatherMap API key.
tag_manager_id:
type: string
default_value: GTM-P98SPZ9Z
Expand All @@ -34,3 +34,14 @@ settings:
help_text: |
Specify a comma-separated pair of coordinates (e.g., 37.8267,-122.4233).
If not specified, the app will attempt to use the device's coordinates.
override_locale:
type: string
default_value: ''
title: Override Locale
optional: true
help_text: Specify a supported locale value (e.g., en_US).
sentry_dsn:
type: secret
title: Sentry DSN
optional: true
help_text: Specify a Sentry DSN to enable error tracking.
13 changes: 12 additions & 1 deletion edge-apps/weather/screenly_qc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ settings:
optional: false
is_global: true
help_text: |
Specify an API key so that you'll have access to all the necessary weather data.
Specify OpenWeatherMap API key.
tag_manager_id:
type: string
default_value: GTM-P98SPZ9Z
Expand All @@ -34,3 +34,14 @@ settings:
help_text: |
Specify a comma-separated pair of coordinates (e.g., 37.8267,-122.4233).
If not specified, the app will attempt to use the device's coordinates.
override_locale:
type: string
default_value: ''
title: Override Locale
optional: true
help_text: Specify a supported locale value (e.g., en_US).
sentry_dsn:
type: secret
title: Sentry DSN
optional: true
help_text: Specify a Sentry DSN to enable error tracking.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/clear-min.jpg
Binary file not shown.
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/clear-night.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/clear.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/cloudy-min.jpg
Binary file not shown.
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/cloudy-night.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/cloudy.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/default-min.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/default.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/drizzle-min.jpg
Binary file not shown.
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/drizzle-night.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/drizzle.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/haze-min.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/haze.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/rain-min.jpg
Binary file not shown.
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/rain-night.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/rain.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/sand-min.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/sand.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/smoke-min.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/smoke.jpg
Binary file not shown.
Binary file removed edge-apps/weather/static/images/bg/snow-min.jpg
Binary file not shown.
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/snow-night.jpg
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/snow.jpg
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/squall-min.jpg
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/squall.jpg
Diff not rendered.
Diff not rendered.
Diff not rendered.
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/thunderstorm.jpg
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/tornado-min.jpg
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/tornado.jpg
Diff not rendered.
Diff not rendered.
Binary file removed edge-apps/weather/static/images/bg/volcanic-ash.jpg
Diff not rendered.
6 changes: 0 additions & 6 deletions edge-apps/weather/static/images/icons/calendar.svg
Diff not rendered.
9 changes: 3 additions & 6 deletions edge-apps/weather/static/images/icons/chancesleet.svg
100755 → 100644
Loading