2021-12-24 02:16:26 +01:00
"use strict" ;
( ( ) => {
2021-12-24 23:18:02 +01:00
// ns-hugo:/home/raoul-web/rc3_2021/html-infobeamer-content/assets/js/dom.js
2021-12-24 02:16:26 +01:00
var html = htm . bind ( preact . h ) ;
2021-12-25 07:28:56 +01:00
var speaker _names = ( talk ) => {
const nameSeparator = ", " ;
let speakerNames = talk . persons . map ( ( p ) => p . public _name ) . join ( nameSeparator ) ;
return speakerNames ;
} ;
2021-12-24 02:16:26 +01:00
var schedule _meta _here _dom = ( schedule ) => {
let inner = html ` ${ schedule . map ( ( talk ) => html `
< div class = "talk-here-meta-box" >
2021-12-25 07:28:56 +01:00
< div class = "speaker" > $ { speaker _names ( talk ) } : < / d i v >
2021-12-24 02:16:26 +01:00
< div class = "title" > $ { talk . title } < / d i v >
< div class = "start-duration" >
< span class = "start" > Starting at $ { talk . start } < / s p a n >
< span class = "duration" > Duration : $ { talk . duration } minutes < / s p a n >
< / d i v >
< / d i v >
` )} ` ;
return inner ;
} ;
var schedule _abstract _here _dom = ( schedule ) => {
let inner = html ` ` ;
let placeHolder = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec ut urna. Curabitur lorem risus, sagittis vitae, accumsan a, iaculis id, metus. Suspendisse potenti. Fusce nonummy commodo dui. Fusce venenatis ligula in pede. Aliquam velit dui, commodo quis, porttitor eget, convallis et, nisi. Nam sed nisl nec elit suscipit ullamcorper. Cras ac enim vel dui vestibulum suscipit. Suspendisse venenatis. Nam pharetra. Pellentesque et arcu. Nam sed nisl nec elit suscipit ullamcorper. Aenean turpis ipsum, rhoncus vitae, posuere vitae, euismod sed, ligula. Integer risus velit, facilisis eget, viverra et, venenatis id, leo. Aenean ligula. Mauris sed nulla quis nisi interdum tempor. Nullam libero nunc, tristique eget, laoreet eu, sagittis id, ante. Aliquam sed erat. Vestibulum viverra varius enim. Donec at diam a tellus dignissim vestibulum. Nullam sapien mauris, venenatis at, fermentum at, tempus eu, urna." ;
schedule . forEach ( ( talk ) => {
let abstract = talk . abstract !== void 0 ? talk . abstract : placeHolder ;
2021-12-25 07:28:56 +01:00
let track = talk . track !== void 0 ? talk . track : "-" ;
let lang = talk . language !== void 0 ? talk . language : "en" ;
inner = html `
< div class = "text" lang = "${lang}" > $ { abstract } < / d i v >
< div class = "track" > Track : $ { track } < / d i v > ` ;
2021-12-24 02:16:26 +01:00
} ) ;
return inner ;
} ;
var schedule _all _list _dom = ( schedule ) => {
let inner = html `
$ { schedule . map ( ( talk ) => html `
< div class = "item" >
< div >
< div class = "title" > $ { talk . title } < / d i v >
< / d i v >
< div class = "details" >
< span class = "start" > $ { talk . start } < / s p a n >
< span class = "day" > Day $ { talk . day } < / s p a n >
< span class = "stage" > $ { talk . room } < / s p a n >
< / d i v >
< / d i v > ` ) } ` ;
return inner ;
} ;
var update _schedule _dom = ( schedule ) => {
const here _room = "Chaos-West TV" ;
const here _number _events = 1 ;
const all _number _events = 10 ;
let allData = schedule . slice ( 0 , all _number _events ) ;
let hereData = schedule . filter ( ( i ) => i . room === here _room ) . slice ( 0 , 1 ) ;
let nextHereMetaDom = schedule _meta _here _dom ( hereData ) ;
let nextHereAbstractDom = schedule _abstract _here _dom ( hereData ) ;
let nextAllMetaDom = schedule _all _list _dom ( allData ) ;
let inner = html `
< div class = "slide" >
< div class = "schedule" >
< div class = "left" >
< div class = "panel meta" >
< div class = "header" > Next Up Here < / d i v >
< div class = "content" > $ { nextHereMetaDom } < / d i v >
< / d i v >
< div class = "panel abstract" >
< div class = "header" > Abstract < / d i v >
< div class = "content" > $ { nextHereAbstractDom } < / d i v >
< / d i v >
< / d i v >
< div class = "right" >
< div class = "panel list" >
< div class = "header" > Next Up at rC3 < / d i v >
< div class = "content" > $ { nextAllMetaDom } < / d i v >
< / d i v >
< / d i v >
< / d i v >
< / d i v > ` ;
return inner ;
} ;
var music _playing _now _dom = ( music ) => {
let inner = html `
2021-12-25 07:28:56 +01:00
< div class = "music-box" >
< div class = "music" >
2021-12-24 02:16:26 +01:00
$ { music . map ( ( current ) => html `
< div class = "line1" >
< span class = "header" > Now playing : < / s p a n >
< span class = "license" > ( $ { current . license } ) < / s p a n >
< / d i v >
< div class = "line2" >
2021-12-24 23:18:02 +01:00
< span class = "title" > « $ { current . title } » < / s p a n >
< span class = "by" > by < / s p a n >
2021-12-24 02:16:26 +01:00
< span class = "artist" > $ { current . artist } < / s p a n >
< / d i v > ` ) }
2021-12-25 07:28:56 +01:00
< / d i v >
2021-12-24 02:16:26 +01:00
< / d i v > ` ;
return inner ;
} ;
2021-12-25 07:28:56 +01:00
var single _tweet _dom = ( tweet ) => {
let date = new Date ( tweet . time ) ;
2021-12-24 23:18:02 +01:00
let inner = html `
< div class = "tweet slider" >
< div class = "container" >
2021-12-25 07:28:56 +01:00
< img class = "profile-image" src = "${tweet.image}" / >
2021-12-24 23:18:02 +01:00
< div class = "content" >
2021-12-25 07:28:56 +01:00
< div >
< span class = "username" > @ $ { tweet . author } < / s p a n >
< span class = "time" > at $ { date . getHours ( ) } : $ { date . getMinutes ( ) } < / s p a n >
< / d i v >
< div class = "text" > $ { tweet . text } < / d i v >
2021-12-24 23:18:02 +01:00
< / d i v >
< / d i v >
< / d i v > ` ;
return inner ;
} ;
2021-12-25 07:28:56 +01:00
var social _container _dom = ( tweets ) => {
let inner = html `
2021-12-24 23:18:02 +01:00
< div id = "bottom-bar" class = "visible bottom-bar" >
< div id = "ticker-wrap" class = "ticker-wrap" >
< div class = "ticker switcher" >
2021-12-25 07:28:56 +01:00
$ { tweets . map ( ( t ) => single _tweet _dom ( t ) ) }
2021-12-24 23:18:02 +01:00
< / d i v >
< / d i v >
< / d i v > ` ;
return inner ;
} ;
2021-12-24 02:16:26 +01:00
function update _main _slide ( data ) {
let schedule = data . schedule ;
let music = data . music ;
let twitter = data . twitter ;
let scheduleDom = update _schedule _dom ( schedule ) ;
let musicDom = music _playing _now _dom ( music ) ;
2021-12-24 23:18:02 +01:00
let twitterDom = social _container _dom ( twitter ) ;
2021-12-24 02:16:26 +01:00
let inner = html `
$ { scheduleDom }
$ { musicDom }
$ { twitterDom }
` ;
const anchorElId = "main" ;
const el = document . getElementById ( anchorElId ) ;
preact . render ( inner , el ) ;
}
// <stdin>
2021-12-24 23:18:02 +01:00
var scheduleData = [ ] ;
var musicData = [ ] ;
var twitterData = [ ] ;
2021-12-25 07:28:56 +01:00
var mastodonData = [ ] ;
var social _limiter = ( tweets , toots ) => {
2021-12-24 23:18:02 +01:00
const numberTweets = 20 ;
2021-12-25 07:28:56 +01:00
let posts = tweets . concat ( toots ) ;
let byDate = ( fst , snd ) => Date . parse ( fst . time ) - Date . parse ( snd . time ) ;
let postsSorted = posts . sort ( byDate ) ;
if ( postsSorted . length > 0 ) {
while ( postsSorted . length < numberTweets ) {
postsSorted = postsSorted . concat ( postsSorted ) ;
2021-12-24 23:18:02 +01:00
}
2021-12-25 07:28:56 +01:00
}
postsSorted = postsSorted . slice ( 0 , numberTweets ) ;
return postsSorted ;
} ;
var get _tweet _author = ( data , tweet ) => {
let authorId = tweet . author _id ;
let users = data . includes . users ;
let author = users . find ( ( item ) => item . id === authorId ) ;
let userName = author !== void 0 ? author . username : "NoOne" ;
return userName ;
} ;
var get _tweet _text = ( data , tweet ) => tweet . text ;
var get _tweet _profile _image = ( data , tweet ) => {
const defaultProfileImageUrl = "https://abs.twimg.com/sticky/default_profile_images/default_profile_normal.png" ;
let authorId = tweet . author _id ;
let users = data . includes . users ;
let author = users . find ( ( item ) => item . id === authorId ) ;
let profileImageUrl = author !== void 0 ? author . profile _image _url : defaultProfileImageUrl ;
return profileImageUrl ;
} ;
var get _tweet _time = ( data , tweet ) => tweet . created _at ;
var twitter _filter = ( idata ) => {
let tweets ;
idata . forEach ( ( d ) => tweets = d . data . map ( ( t ) => {
return {
author : get _tweet _author ( d , t ) ,
image : get _tweet _profile _image ( d , t ) ,
text : get _tweet _text ( d , t ) ,
time : get _tweet _time ( d , t )
} ;
} ) ) ;
return tweets ;
} ;
var mastodon _filter = ( idata ) => {
let toots ;
idata . forEach ( ( d ) => {
toots = d . map ( ( t ) => {
return {
author : t . account . username ,
image : t . account . avatar _static ,
text : extractContent ( t . content , true ) ,
time : t . created _at
} ;
} ) ;
2021-12-24 23:18:02 +01:00
} ) ;
2021-12-25 07:28:56 +01:00
return toots ;
} ;
function extractContent ( string ) {
let span = document . createElement ( "span" ) ;
span . innerHTML = string ;
let children = span . querySelectorAll ( "*" ) ;
children . forEach ( ( child ) => {
child . textContent += " " ;
} ) ;
return span . textContent . toString ( ) . replace ( / +/g , " " ) ;
}
var schedule _processor = ( data ) => {
let dataDays = data . schedule . conference . days ;
let talksData = dataDays . map ( ( d ) => {
return Object . values ( d . rooms ) ;
} ) . flat ( 2 ) ;
let byDate = ( fst , snd ) => Date . parse ( fst . date ) - Date . parse ( snd . date ) ;
let talksDataSorted = talksData . sort ( byDate ) ;
return talksDataSorted ;
2021-12-24 23:18:02 +01:00
} ;
2021-12-24 02:16:26 +01:00
if ( window . Worker ) {
const workerBaseURL = window . infoBeamerConfig . get ( "workerBaseURL" ) ;
const scheduleWorkerCode = workerBaseURL + "js/schedule_worker.js" ;
console . log ( "Loading schedule worker JS from: " + scheduleWorkerCode ) ;
const scheduleWorker = new Worker ( scheduleWorkerCode ) ;
const scheduleURL = window . infoBeamerConfig . get ( "scheduleURL" ) ;
const scheduleFetchInterval = window . infoBeamerConfig . get ( "scheduleFetchInterval" ) ;
scheduleWorker . postMessage ( {
msgType : "ScheduleFetchConfig" ,
scheduleURL ,
scheduleFetchInterval
} ) ;
scheduleWorker . onmessage = function ( e ) {
let msgType = e . data . msgType ;
if ( msgType === "ScheduleUpdate" ) {
2021-12-25 07:28:56 +01:00
scheduleData = schedule _processor ( e . data . schedule ) ;
2021-12-24 02:16:26 +01:00
let time = e . data . timestamp ;
console . log ( "Message: " + msgType + " at " + time ) ;
console . log ( scheduleData ) ;
update _screen ( ) ;
}
} ;
const musicWorkerCode = workerBaseURL + "js/generic_fetch_worker.js" ;
console . log ( "Loading worker JS from: " + musicWorkerCode ) ;
const musicWorker = new Worker ( musicWorkerCode ) ;
const musicType = "Music" ;
const musicURL = window . infoBeamerConfig . get ( "musicURL" ) ;
const musicFetchInterval = window . infoBeamerConfig . get ( "musicFetchInterval" ) ;
musicWorker . postMessage ( {
fetchType : musicType ,
fetchURL : musicURL ,
fetchInterval : musicFetchInterval
} ) ;
musicWorker . onmessage = function ( e ) {
let msgType = e . data . msgType ;
if ( msgType === musicType ) {
2021-12-24 23:18:02 +01:00
musicData = [ e . data . json ] ;
2021-12-24 02:16:26 +01:00
let time = e . data . timestamp ;
console . log ( "Message: " + msgType + " at " + time ) ;
console . log ( musicData ) ;
update _screen ( ) ;
}
} ;
const twitterWorkerCode = workerBaseURL + "js/generic_fetch_worker.js" ;
console . log ( "Loading worker JS from: " + twitterWorkerCode ) ;
const twitterWorker = new Worker ( twitterWorkerCode ) ;
const twitterType = "Twitter" ;
const twitterURL = window . infoBeamerConfig . get ( "twitterURL" ) ;
const twitterFetchInterval = window . infoBeamerConfig . get ( "twitterFetchInterval" ) ;
twitterWorker . postMessage ( {
fetchType : twitterType ,
fetchURL : twitterURL ,
fetchInterval : twitterFetchInterval
} ) ;
twitterWorker . onmessage = function ( e ) {
let msgType = e . data . msgType ;
if ( msgType === twitterType ) {
2021-12-24 23:18:02 +01:00
twitterData = [ e . data . json ] ;
2021-12-25 07:28:56 +01:00
twitterData = twitter _filter ( twitterData ) ;
2021-12-24 02:16:26 +01:00
let time = e . data . timestamp ;
console . log ( "Message: " + msgType + " at " + time ) ;
console . log ( twitterData ) ;
update _screen ( ) ;
}
} ;
2021-12-25 07:28:56 +01:00
const mastodonWorkerCode = workerBaseURL + "js/generic_fetch_worker.js" ;
console . log ( "Loading worker JS from: " + mastodonWorkerCode ) ;
const mastodonWorker = new Worker ( mastodonWorkerCode ) ;
const mastodonType = "Mastodon" ;
const mastodonURL = window . infoBeamerConfig . get ( "mastodonURL" ) ;
const mastodonFetchInterval = window . infoBeamerConfig . get ( "mastodonFetchInterval" ) ;
mastodonWorker . postMessage ( {
fetchType : mastodonType ,
fetchURL : mastodonURL ,
fetchInterval : mastodonFetchInterval
} ) ;
mastodonWorker . onmessage = function ( e ) {
let msgType = e . data . msgType ;
if ( msgType === mastodonType ) {
mastodonData = [ e . data . json ] ;
mastodonData = mastodon _filter ( mastodonData ) ;
let time = e . data . timestamp ;
console . log ( "Message: " + msgType + " at " + time ) ;
console . log ( mastodonData ) ;
update _screen ( ) ;
}
} ;
2021-12-24 02:16:26 +01:00
} else {
console . log ( "Your browser doesn't support web workers." ) ;
}
function update _screen ( ) {
let time = new Date ( ) ;
console . log ( "Updating screen at at: " + time ) ;
2021-12-25 07:28:56 +01:00
update _main _slide ( {
schedule : scheduleData ,
music : musicData ,
twitter : social _limiter ( twitterData , mastodonData )
} ) ;
2021-12-24 02:16:26 +01:00
}
function main _loop ( ) {
update _screen ( ) ;
setTimeout ( main _loop , 10 * 1e3 ) ;
}
main _loop ( ) ;
} ) ( ) ;