update to ts and cloudflare pages

2025-12-16 02:01:08 -08:00
parent b5779bfd70
commit 9c07d2345d
10 changed files with 1775 additions and 157 deletions
@@ -0,0 +1,63 @@
+const status_div = document.querySelector('div#status')!
+onerror = function (error) {
+    status_div.innerHTML = error.toString()
+    throw error
+}
+onunhandledrejection = (event) => onerror!(event.reason)
+
+import { SugoiAuthProvider, WebStorage } from 'twitch-cloud-ebs'
+const origin = 'https://ebs.sugoidogo.com'
+
+const client_id = 'ib2n7v7mur7ab2mcxv7rjju2ctsyoi'
+const scope = 'moderator:read:followers channel:read:subscriptions bits:read channel:read:charity chat:read chat:edit moderation:read channel:manage:moderators user:read:chat'
+
+const authProvider = new SugoiAuthProvider(client_id, origin)
+const tokens=await authProvider.addUser(...scope.split(' '))
+
+const webStorage = new WebStorage(authProvider, undefined, origin)
+
+document.querySelector<HTMLAnchorElement>('#timer-link').href += '?refresh_token=' + tokens.refresh_token
+status_div.innerHTML = 'Loading settings...'
+const config = await webStorage.fetch('config.json')
+    .then(async response => {
+        if (response.ok) {
+            try {
+                return await response.json()
+            } catch {
+                return {}
+            }
+        }
+        console.warn(response.status, await response.text())
+        return {}
+    }
+    ).then(config => {
+        for (const checkbox of document.querySelectorAll<HTMLInputElement>('input[type=checkbox]')) {
+            checkbox.checked = false
+        }
+        for (const key in config) {
+            const input = document.querySelector<HTMLInputElement>('[name=' + key + ']')
+            if (!input) {
+                continue
+            }
+            if (input.type == 'checkbox') {
+                input.checked = true
+            } else {
+                input.value = config[key]
+            }
+        }
+    })
+status_div.innerHTML = 'Ready!'
+document.querySelector<HTMLFormElement>('form#config').onsubmit = async function (event) {
+    event.preventDefault()
+    status_div.innerHTML = 'Saving settings...'
+    const config = Object.fromEntries(new FormData(event.target as HTMLFormElement))
+    await webStorage.fetch('config.json', {
+        method: 'POST',
+        body: JSON.stringify(config)
+    }).then(response=>{
+        if(!response.ok){
+            throw new Error(response.statusText,{cause:response})
+        }
+    })
+    status_div.innerHTML = 'Settings saved'
+}
@@ -0,0 +1,229 @@
+import { SugoiAuthProvider, WebStorage } from 'twitch-cloud-ebs'
+import { ApiClient } from '@twurple/api'
+import { EventSubWsListener } from '@twurple/eventsub-ws'
+
+const client_id = 'ib2n7v7mur7ab2mcxv7rjju2ctsyoi'
+
+const authProvider = new SugoiAuthProvider(client_id)
+const webStorage = new WebStorage(authProvider)
+const apiClient = new ApiClient({ authProvider })
+const eventSub = new EventSubWsListener({ apiClient })
+
+const timer=document.querySelector('#timeText')
+let tokens,time_started,time_passed,time_total,config,streamelements
+
+window.onanimationend=function(event){
+	event.target.remove()
+}
+
+function handle_event(event_name, event_amount = 1) {
+	console.debug(event_name,event_amount)
+	if (!config[event_name + '-time-enabled']) {
+		return false
+	}
+	add_time(parseReadableTimeIntoMilliseconds(config[event_name+'-time'])*event_amount)
+	return true
+}
+
+function reset(){
+	localforage.removeItem('time_started')
+	time_started=null
+	time_passed=null
+	time_total=parseReadableTimeIntoMilliseconds(config['start-time'])
+	localforage.setItem('time_total',time_total)
+	localforage.setItem('time_passed',0)
+}
+
+function add_time(time){
+	if(isNaN(time)){
+		throw time+" is not a number"
+	}
+	if(config['max-time-enabled']){
+		const new_time=time_total+time
+		const max_time=parseReadableTimeIntoMilliseconds(config['max-time'])
+		if(new_time>max_time){
+			time=max_time-time_total
+		}
+	}
+	let addedTime=document.createElement('p')
+	let timeString=parseMillisecondsIntoReadableTime(time)
+	if(time>0){
+		timeString='+'+timeString
+	}
+	if(time==0){
+		timeString='Timer Maxed!'
+	}
+	addedTime.innerHTML=timeString
+	addedTime.className='addedTime'
+	document.body.appendChild(addedTime);
+	time_total+=time
+	localforage.setItem('time_total',time_total)
+}
+
+function start(){
+	if(time_started){
+		return
+	}
+	time_started=Date.now()
+	localforage.setItem('time_started',time_started)
+}
+
+function pause(){
+	if(!time_started){
+		return
+	}
+	time_passed+=Date.now()-time_started
+	time_started=null
+	localforage.removeItem('time_started')
+	localforage.setItem('time_passed',time_passed)
+}
+
+// https://stackoverflow.com/a/33909506
+function parseMillisecondsIntoReadableTime(milliseconds){
+	let negative=false
+	if(milliseconds<0){
+		milliseconds=Math.abs(milliseconds)
+		negative=true
+	}
+
+	//Get hours from milliseconds
+	var hours = milliseconds / (1000*60*60);
+	var absoluteHours = Math.floor(hours);
+	var h = absoluteHours > 9 ? absoluteHours : '0' + absoluteHours;
+
+	//Get remainder from hours and convert to minutes
+	var minutes = (hours - absoluteHours) * 60;
+	var absoluteMinutes = Math.floor(minutes);
+	var m = absoluteMinutes > 9 ? absoluteMinutes : '0' +  absoluteMinutes;
+
+	//Get remainder from minutes and convert to seconds
+	var seconds = (minutes - absoluteMinutes) * 60;
+	var absoluteSeconds = Math.floor(seconds);
+	var s = absoluteSeconds > 9 ? absoluteSeconds : '0' + absoluteSeconds;
+
+	let time = h + ':' + m + ':' + s;
+
+	if(negative){
+		time='-'+time
+	}
+
+	return time
+}
+
+function parseReadableTimeIntoMilliseconds(readableTime){
+	let negative=false
+	if(readableTime.startsWith('-')){
+		negative=true
+		readableTime=readableTime.substring(1)
+	}
+	const [seconds,minutes,hours]=readableTime.split(':').reverse()
+	let time=((hours||0)*1000*60*60)+((minutes||0)*1000*60)+((seconds||0)*1000)
+	if(negative){
+		time=0-time
+	}
+	return time
+}
+
+function updateTime(){
+	let time_remaining=time_total
+	if(time_passed){
+		time_remaining-=time_passed
+	}
+	if(time_started){
+		time_remaining-=Date.now()-time_started
+	}
+	timer.innerHTML=parseMillisecondsIntoReadableTime(time_remaining)
+	requestAnimationFrame(updateTime)
+}
+
+import { io } from 'socket.io-client'
+
+function init_streamelements(){
+	streamelements=io('https://realtime.streamelements.com',{transports: ['websocket']})
+	streamelements.on('disconnect',init_streamelements)
+	streamelements.on('connect',()=>streamelements.emit('authenticate', {method: 'apikey', token: config['streamelements-token']}))
+	streamelements.on('authenticated', console.debug);
+    streamelements.on('unauthorized', console.error);
+	
+	function onEvent(event){
+		console.debug(event)
+		if(event['name'] !== "tip-latest"){
+			return false
+		}
+		handle_event('tip',event['data']['amount']*100)
+	}
+
+	streamelements.on('event:test', onEvent);
+	streamelements.on('event', onEvent);
+	streamelements.on('event:update', onEvent);
+	streamelements.on('event:reset', onEvent);
+}
+
+// init localforage
+import * as localForage from 'localforage'
+const localforage = localForage.createInstance({ name: 'sugoi-subathon-countdown' })
+// init timer display
+time_started = await localforage.getItem('time_started')
+time_passed = await localforage.getItem('time_passed')
+time_total = await localforage.getItem('time_total')
+updateTime()
+// init twitch api tokens
+tokens = await authProvider.getAccessTokenForUser(null)
+await apiClient.getTokenInfo().then(info => tokens.user_id = info.userId)
+// load user config
+await webStorage.fetch('config.json',{headers:tokens.auth_headers})
+.then(response=>response.json())
+.then(json=>{
+	config=json
+	if(!time_started && !time_passed){
+		reset()
+	}
+})
+// create real time mod list
+const mods = await apiClient.moderation.getModeratorsPaginated(tokens.user_id).getAll().then(helix_mods=>{
+	const local_mods=[]
+	for (const helix_mod of helix_mods) {
+		local_mods.push(helix_mod.userId)
+	}
+	return local_mods
+})
+eventSub.onChannelModeratorAdd(tokens.user_id, event => mods.push(event.userId))
+eventSub.onChannelModeratorRemove(tokens.user_id, event => mods.slice(mods.indexOf(event.userId), 1))
+// init event sources
+eventSub.onChannelSubscription(tokens.user_id, event => handle_event('sub' + event.tier))
+eventSub.onChannelCheer(tokens.user_id, event => handle_event('bit', event.bits))
+eventSub.onChannelFollow(tokens.user_id, tokens.user_id, event => handle_event('follow'))
+eventSub.onChannelRaidFrom(tokens.user_id, event => handle_event('raid'))
+eventSub.onChannelCharityDonation(tokens.user_id, event => handle_event('charity', event.amount.value))
+eventSub.onChannelChatMessage(tokens.user_id, tokens.user_id, event => {
+	console.debug('> ' + event.messageText)
+	const command = event.messageText.split(' ')
+	if ((command.shift()!='!subathon') || (event.chatterId !== tokens.user_id && (!mods.includes(event.chatterId)))) {
+		return
+	}
+	switch(command.shift()){
+		case 'start':{
+			start()
+			break
+		}
+		case 'pause':{
+			pause()
+			break
+		}
+		case 'reset':{
+			reset()
+			break
+		}
+		case 'add':{
+			add_time(parseReadableTimeIntoMilliseconds(command.shift()))
+			break
+		}
+	}
+})
+eventSub.start()
+
+if ('streamelements-token' in config && config['streamelements-token']) {
+	init_streamelements()
+}
+
+console.debug('load complete')