narrowcasting: improve examples - jscancer - Javascript crap (relatively small) | |
git clone git://git.codemadness.org/jscancer | |
Log | |
Files | |
Refs | |
README | |
LICENSE | |
--- | |
commit 6b4f9b33e88f605dbbe9a643a97f5a9cef4fbb4b | |
parent ba166782d82d92a2dcf4ee22b96da2285874a4b3 | |
Author: Hiltjo Posthuma <[email protected]> | |
Date: Mon, 19 Feb 2024 19:14:38 +0100 | |
narrowcasting: improve examples | |
Diffstat: | |
M narrowcasting/README | 5 +++-- | |
A narrowcasting/data/1.html | 2 ++ | |
A narrowcasting/data/2.html | 2 ++ | |
A narrowcasting/data/3.html | 2 ++ | |
A narrowcasting/data/nos.json | 109 +++++++++++++++++++++++++++++… | |
A narrowcasting/data/tweakers.json | 32 +++++++++++++++++++++++++++++… | |
A narrowcasting/data/updated.txt | 2 ++ | |
M narrowcasting/index.html | 18 ++++++++++-------- | |
M narrowcasting/script.js | 3 ++- | |
A narrowcasting/sfeed/sfeedrc | 11 +++++++++++ | |
A narrowcasting/sfeed/update.sh | 45 +++++++++++++++++++++++++++++… | |
M narrowcasting/style.css | 17 +++++++++-------- | |
12 files changed, 229 insertions(+), 19 deletions(-) | |
--- | |
diff --git a/narrowcasting/README b/narrowcasting/README | |
@@ -2,8 +2,9 @@ Narrowcasting | |
------------- | |
This is a simple script for some "narrowcasting" screen. | |
-It allows to defined HTML elements with data attributes for their configuratio… | |
-The script will then handle the widgets and slides logic. | |
+ | |
+Certain configuration options can be defined by setting data attributes on HTML | |
+elements. The script will then handle the widgets and slides logic. | |
Some features: | |
diff --git a/narrowcasting/data/1.html b/narrowcasting/data/1.html | |
@@ -0,0 +1 @@ | |
+one | |
+\ No newline at end of file | |
diff --git a/narrowcasting/data/2.html b/narrowcasting/data/2.html | |
@@ -0,0 +1 @@ | |
+two | |
+\ No newline at end of file | |
diff --git a/narrowcasting/data/3.html b/narrowcasting/data/3.html | |
@@ -0,0 +1 @@ | |
+three | |
+\ No newline at end of file | |
diff --git a/narrowcasting/data/nos.json b/narrowcasting/data/nos.json | |
@@ -0,0 +1,109 @@ | |
+{ | |
+"version": "https://jsonfeed.org/version/1.1", | |
+"title": "Newsfeed", | |
+"items": [ | |
+{ | |
+ "id": "https://nos.nl/l/2509529", | |
+ "date_published": "2024-02-19T09:22:30Z", | |
+ "title": "'Britse speciale eenheden blokkeerden verhuisaanvragen Afgha… | |
+ "url": "https://nos.nl/l/2509529", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054606/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509527", | |
+ "date_published": "2024-02-19T08:44:14Z", | |
+ "title": "Woordvoerder Navalny: moeder en advocaten geweigerd bij mort… | |
+ "url": "https://nos.nl/l/2509527", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054603/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509522", | |
+ "date_published": "2024-02-19T08:25:52Z", | |
+ "title": "Freek Vonk ontdekt nieuwe slangensoort in Amazonegebied", | |
+ "url": "https://nos.nl/l/2509522", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054595/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509522", | |
+ "date_published": "2024-02-19T08:25:52Z", | |
+ "title": "Freek Vonk ontdekt nieuwe slangensoort: noordelijke groene a… | |
+ "url": "https://nos.nl/l/2509522", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054595/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509514", | |
+ "date_published": "2024-02-19T06:20:44Z", | |
+ "title": "Voortaan online code nodig voor samenreiskorting NS", | |
+ "url": "https://nos.nl/l/2509514", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054573/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509511", | |
+ "date_published": "2024-02-19T06:04:45Z", | |
+ "title": "Wekdienst 19/2: Informateur praat met wetenschappers • Act… | |
+ "url": "https://nos.nl/l/2509511", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054570/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509507", | |
+ "date_published": "2024-02-19T04:15:59Z", | |
+ "title": "Ombudsman bezorgd over hoe overheid burgers met terrorismere… | |
+ "url": "https://nos.nl/l/2509507", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054566/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509506", | |
+ "date_published": "2024-02-19T03:36:59Z", | |
+ "title": "Dode en gewonden door ongeluk met camper bij Deil", | |
+ "url": "https://nos.nl/l/2509506", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054565/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509504", | |
+ "date_published": "2024-02-19T02:12:28Z", | |
+ "title": "Stammenstrijd Papoea-Nieuw-Guinea escaleert: 26 doden", | |
+ "url": "https://nos.nl/l/2509504", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054563/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509504", | |
+ "date_published": "2024-02-19T02:12:28Z", | |
+ "title": "Tientallen doden bij stammenstrijd Papoea-Nieuw-Guinea", | |
+ "url": "https://nos.nl/l/2509504", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054563/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509503", | |
+ "date_published": "2024-02-19T00:41:06Z", | |
+ "title": "Celstraffen voor Russen die Navalny publiekelijk herdachten", | |
+ "url": "https://nos.nl/l/2509503", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054559/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509498", | |
+ "date_published": "2024-02-18T23:45:38Z", | |
+ "title": "Grote protesten in Mexico tegen hervormingsplannen president… | |
+ "url": "https://nos.nl/l/2509498", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054547/1… | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://nos.nl/l/2509494", | |
+ "date_published": "2024-02-18T23:00:01Z", | |
+ "title": "Industrie blijft krimpen, vooral chemische industrie", | |
+ "url": "https://nos.nl/l/2509494", | |
+ "attachments": [{"url": "https://cdn.nos.nl/image/2024/02/19/1054532/1… | |
+ "content_text": "" | |
+}] | |
+} | |
diff --git a/narrowcasting/data/tweakers.json b/narrowcasting/data/tweakers.json | |
@@ -0,0 +1,32 @@ | |
+{ | |
+"version": "https://jsonfeed.org/version/1.1", | |
+"title": "Newsfeed", | |
+"items": [ | |
+{ | |
+ "id": "https://tweakers.net/nieuws/218770", | |
+ "date_published": "2024-02-19T09:11:02Z", | |
+ "title": "Xiaomi deelt renders en cameraspecs van 14 Ultra", | |
+ "url": "https://tweakers.net/nieuws/218770/xiaomi-deelt-renders-en-cam… | |
+ "authors": [{"name": "Hayte Hugo"}], | |
+ "tags": ["Nieuws / Tablets en telefoons / Smartphones"], | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://tweakers.net/nieuws/218756", | |
+ "date_published": "2024-02-19T07:02:24Z", | |
+ "title": "'Apple krijgt EU-boete omdat Spotify niet mocht verwijzen na… | |
+ "url": "https://tweakers.net/nieuws/218756/apple-krijgt-eu-boete-omdat… | |
+ "authors": [{"name": "Hayte Hugo"}], | |
+ "tags": ["Nieuws / Tablets en telefoons / Smartphones"], | |
+ "content_text": "" | |
+}, | |
+{ | |
+ "id": "https://tweakers.net/nieuws/218756", | |
+ "date_published": "2024-02-19T07:02:24Z", | |
+ "title": "'EU gaat Apple beboeten omdat Spotify met abo's niet buiten … | |
+ "url": "https://tweakers.net/nieuws/218756/eu-gaat-apple-beboeten-omda… | |
+ "authors": [{"name": "Hayte Hugo"}], | |
+ "tags": ["Nieuws / Tablets en telefoons / Smartphones"], | |
+ "content_text": "" | |
+}] | |
+} | |
diff --git a/narrowcasting/data/updated.txt b/narrowcasting/data/updated.txt | |
@@ -0,0 +1 @@ | |
+2024-02-19 | |
+\ No newline at end of file | |
diff --git a/narrowcasting/index.html b/narrowcasting/index.html | |
@@ -9,8 +9,7 @@ | |
<meta http-equiv="X-UA-Compatible" content="IE=edge" /> | |
</head> | |
<body> | |
- | |
-<div class="screen check-updates" data-update="120000" data-url="data/check_up… | |
+<div class="screen check-updates" data-update="120000" data-url="data/updated.… | |
<div class="logo"></div> | |
<div class="topbar-right"> | |
<span class="datetime time" data-format="%H:%M" data-update="6… | |
@@ -24,19 +23,22 @@ | |
<div class="slides"> | |
<div class="slide slide-1" id="slide-1" data-displaynext="3000… | |
<!-- widgets slide 1 --> | |
- <div class="widget xhr-content" data-url="data/1" data… | |
- <div class="widget xhr-content" data-url="data/2" data… | |
- <div class="widget xhr-content" data-url="data/3" data… | |
+ <div class="widget xhr-content" data-url="data/1.html"… | |
+ <div class="widget xhr-content" data-url="data/2.html"… | |
<div class="widget widget-lichess embed-content" data-… | |
<iframe src="https://lichess.org/training/fram… | |
</div> | |
- <div class="news-ticker ticker1" data-url="data/news1.… | |
- <div class="news-ticker ticker2" data-url="data/news2.… | |
+ <div class="news-ticker ticker1" data-url="data/tweake… | |
+ <div class="news-ticker ticker2" data-url="data/nos.js… | |
+ </div> | |
+ | |
+ <div class="slide slide-2" id="slide-2" data-displaynext="3000… | |
</div> | |
- <div class="slide slide-2" id="slide-2" data-displaynext="3000… | |
+ <div class="slide slide-3" id="slide-3" data-displaynext="3000… | |
+ <video loop data-reset-on-play="1" style="width: 100%;… | |
</div> | |
<div class="progressbar"></div> | |
diff --git a/narrowcasting/script.js b/narrowcasting/script.js | |
@@ -25,7 +25,8 @@ function padspace(n) { | |
// subset of strftime() | |
function strftime(fmt, d) { | |
//var locale = locale || navigator.language || "en"; | |
- var locale = "nl-NL"; // dutch | |
+ //var locale = "nl-NL"; // dutch | |
+ var locale = "en-US"; // english US | |
d = d || new Date(); | |
var mon = d.getMonth(); // starts at 0 | |
diff --git a/narrowcasting/sfeed/sfeedrc b/narrowcasting/sfeed/sfeedrc | |
@@ -0,0 +1,11 @@ | |
+# for more details see the sfeedrc(5) and sfeed_update(1) man pages | |
+# and the README file. | |
+ | |
+sfeedpath="$HOME/.sfeed/narrowcasting/feeds" | |
+ | |
+# list of feeds to fetch: | |
+feeds() { | |
+ # feed <name> <feedurl> [basesiteurl] [encoding] | |
+ feed "nos" "https://feeds.nos.nl/nosnieuwsalgemeen" | |
+ feed "tweakers" "https://feeds.feedburner.com/tweakers/nieuws" | |
+} | |
diff --git a/narrowcasting/sfeed/update.sh b/narrowcasting/sfeed/update.sh | |
@@ -0,0 +1,45 @@ | |
+#!/bin/sh | |
+# tested on OpenBSD | |
+ | |
+rc="$HOME/.sfeed/narrowcasting/sfeedrc" | |
+test -f "$rc" || exit 1 | |
+ | |
+sfeed_update "$rc" | |
+ | |
+cd ~/.sfeed/narrowcasting/feeds/ || exit 1 | |
+ | |
+d="/var/www/htdocs/narrowcasting/data" | |
+test -d "$d" || exit 1 | |
+ | |
+# timestamp of today | |
+todaydate="$(date +'%Y-%m-%d')" | |
+today="$(date -j -f '%Y-%m-%d %H:%M:%S' "$todaydate 00:00:00" +'%s')" | |
+ | |
+# remove some unused fields and reduce filesize of output. | |
+reduce() { | |
+ LC_ALL=C awk -v "today=$today" ' | |
+BEGIN { | |
+ FS = OFS = "\t"; | |
+} | |
+# filter items of today after 00:00. | |
+$1 > today { | |
+ # remove content and content-type | |
+ $4 = ""; | |
+ $5 = ""; | |
+ print $0; | |
+}' | |
+} | |
+ | |
+# create JSON files. | |
+tmp=$(mktemp) | |
+for f in *; do | |
+ test -f "$f" || continue | |
+ | |
+ reduce < "$f" | sfeed_json > "$tmp" | |
+ | |
+ o="$d/$f.json" | |
+ cp -f "$tmp" "$o" | |
+ chmod 666 "$o" | |
+done | |
+ | |
+rm -f "$tmp" | |
diff --git a/narrowcasting/style.css b/narrowcasting/style.css | |
@@ -67,7 +67,6 @@ iframe { | |
height: 90px; | |
animation: ease-out news-slide-in 1s; | |
} | |
- | |
.news-ticker div.out { | |
animation: ease-out news-slide-out 2s; | |
} | |
@@ -132,7 +131,6 @@ iframe { | |
background-repeat: no-repeat; | |
text-align: left; | |
} | |
- | |
.topbar-info-dashboard { | |
z-index: 999; | |
position: absolute; | |
@@ -144,7 +142,6 @@ iframe { | |
background-repeat: no-repeat; | |
text-align: left; | |
} | |
- | |
.date { | |
float: right; | |
color: #fff; | |
@@ -169,7 +166,6 @@ iframe { | |
/* default background color, must be set for overlapping slides for tr… | |
/*background-color: #fff;*/ | |
} | |
- | |
body > .screen > .slides > .slide { | |
position: absolute; | |
top: 0; | |
@@ -182,7 +178,6 @@ body > .screen > .slides > .slide { | |
body > .screen > .slides > .slide-2 { | |
background-color: #333; | |
} | |
- | |
.visible { | |
z-index: 995; /* visible has more preference over paused */ | |
display: block; | |
@@ -190,7 +185,6 @@ body > .screen > .slides > .slide-2 { | |
animation: ease-in fade-in 1s; | |
animation-play-state: running; | |
} | |
- | |
.pause { | |
z-index: 990; | |
display: block; | |
@@ -199,7 +193,6 @@ body > .screen > .slides > .slide-2 { | |
animation: ease-out fade-out 1s; | |
animation-play-state: running; | |
} | |
- | |
.animate-once { | |
animation-iteration-count: 1; | |
} | |
@@ -213,7 +206,6 @@ body > .screen > .slides > .slide-2 { | |
background-color: #fff; | |
opacity: 1.0 !important; | |
} | |
- | |
.widget { | |
padding: 0; | |
margin: 0; | |
@@ -235,3 +227,12 @@ body > .screen > .slides > .slide-2 { | |
.widget-body ul { | |
padding: 0 20px; | |
} | |
+.widget-lichess { | |
+ z-index: 1001; | |
+ position: absolute; | |
+ left: 7px; | |
+ width: 628px; | |
+ top: 160px; | |
+ height: 365px; | |
+ font-weight: bold; | |
+} |