Compare commits

...

2 Commits

Author SHA1 Message Date
d3e7e3152f use objects in states
instead of id strings
2022-04-26 10:47:45 -04:00
034067f796 misc 2022-04-26 10:39:25 -04:00
3 changed files with 25 additions and 31 deletions

31
app.js
View File

@ -7,7 +7,8 @@ import { useReducer, useState, useEffect, useLayoutEffect, useMemo, useRef } fro
import State01 from "./testdata-01.json" assert { type: "json" };
import State02 from "./testdata-02.json" assert { type: "json" };
const Styles = {
const Styles =
{
Broadcast:
{
position: "relative",
@ -50,11 +51,11 @@ const App = props =>
/** @type {Boxcast.StateBinding<Array<Boxcast.Broadcast>>} */
const [ListGet, ListSet] = useState([]);
/** @type {Boxcast.StateBinding<string>} */
const [SelectedGet, SelectedSet] = useState("");
/** @type {Boxcast.StateBinding<Boxcast.Broadcast|null>} */
const [SelectedGet, SelectedSet] = useState(null);
/** @type {Boxcast.StateBinding<string>} */
const [LiveGet, LiveSet] = useState("");
/** @type {Boxcast.StateBinding<Boxcast.Broadcast|null>} */
const [LiveGet, LiveSet] = useState(null);
/** @type {(inList:Array<Boxcast.Broadcast>)=>Array<Boxcast.Broadcast>} */
const SortStart = (inList) => {
@ -104,20 +105,20 @@ const App = props =>
// on new list
useEffect(()=>
{
let live = "";
let live;
for(let i=0; i<ListGet.length; i++)
{
if(ListGet[i].timeframe != "past")
{
live = ListGet[i].id;
live = ListGet[i];
break;
}
}
if(LiveGet != live)
if(LiveGet?.id != live?.id)
{
console.log("new video starting")
}
if(SelectedGet != live)
if(SelectedGet?.id != live?.id)
{
console.log("would you like to switch?");
}
@ -138,7 +139,7 @@ const App = props =>
{
Player.current.loadChannel(props.channel,
{
selectedBroadcastId: SelectedGet,
selectedBroadcastId: SelectedGet?.id,
showTitle: true,
showDescription: true,
showCountdown: true,
@ -163,9 +164,9 @@ const App = props =>
{
item: item,
previous: ListGet[index-1],
priority: item.id == LiveGet,
selected: item.id == SelectedGet,
select: ()=>SelectedSet(item.id)
priority: item.id == LiveGet?.id,
selected: item.id == SelectedGet?.id,
select: ()=>SelectedSet(item)
}
))
}
@ -245,6 +246,7 @@ const DateParse = (inDateString) =>
Date: date.getDate(),
Hours: date.getHours(),
Minutes: date.getMinutes(),
Epoch: date.valueOf()
};
obj.Zone = obj.Zone ? obj.Zone[1] : "local time";
@ -255,4 +257,5 @@ const DateParse = (inDateString) =>
return obj;
};
export default App;
/** @type {(inChannel:string, inSelector:string)=>void} */
export default (inChannel, inSelector) => render(h(App, {channel:inChannel, interval:50000}), document.querySelector(inSelector));

View File

@ -2,25 +2,15 @@
<html>
<head></head>
<body>
<div style="max-width:500px; margin: 0 auto;">
<div id="boxcast"></div>
<script type="module">
import Init from "./app.js";
const Channel = { Basics: "sfz7ja3rlpoous6usu8a", Sunday: "gzahmhugrzogttfdtbjj", Dev: "r3os2zfdnhlquhuypgtp" };
Init(Channel.Basics, "#boxcast");
</script>
</div>
<script type="module">
const Channel = {
Basics: "sfz7ja3rlpoous6usu8a",
Sunday: "gzahmhugrzogttfdtbjj",
Dev: "r3os2zfdnhlquhuypgtp"
};
import { h, render } from "https://esm.sh/preact";
import App from "./app.js";
render(
h(App, {channel:Channel.Basics, interval:50000}),
document.querySelector("#boxcast")
);
</script>
</body>
</html>

3
types.d.ts vendored
View File

@ -25,7 +25,8 @@ namespace Boxcast
Date: number
Hours: number
Minutes: string | number
M?: "AM" | "PM"
M?: "AM" | "PM",
Epoch: number
}
type StateBinding<T> = [T, (item:T)=>void];