guest_worker/www/worker_specs/script.js.old

115 lines
2.9 KiB
JavaScript
Raw Normal View History

2019-11-01 18:30:50 +01:00
let spec = {
worker_id: '-',
ip_address: '-',
country: '-',
start_time: '-',
time: '-',
assign_status: '-',
approval_status: '-'
}
let worker_specs = Object.create(spec),
prev_specs = Object.create(spec)
let divs = {
worker_id: document.getElementById('worker_id'),
ip_address: document.getElementById('ip_address'),
country: document.getElementById('country'),
time: document.getElementById('time'),
assign_status: document.getElementById('assign_status'),
approval_status: document.getElementById('approval_status')
}
let socket = io.connect('/')
socket.on('connection', function(){
console.log('connected to node server')
})
let opacity = 0.1
socket.on('workerSpecs', function(data){
Object.assign(prev_specs, worker_specs)
worker_specs = data
opacity = 0
})
let display_specs = function(){
Object.keys(worker_specs).forEach(function(key){
if(divs[key]){
divs[key].innerText = worker_specs[key]
divs[key].style = `opacity: ${opacity}`
}
})
opacity == 1 ? opacity = 0 : opacity += 0.1
}
// ANIMATION ///////////////////////////////////////////////////////////////////
let frames,
frames_per_sec = 10,
current_frame = 0
function makeAnimation(){
let now,
delta = 0,
last = timeStamp(),
step = 1/frames_per_sec
function frame() {
now = timeStamp()
delta += Math.min(1, (now - last) / 1000)
while(delta > step){
delta -= step
update(step)
}
// render(delta)
last = now
requestAnimationFrame(frame)
}
requestAnimationFrame(frame)
}
//// update state according to framerate
function update(step){
display_specs()
}
//// render as fast as possible
// function render(delta){
// }
//
// let time = (new Date().getTime() - worker_specs.start_time) / 1000
// worker_specs.time = time.toString()
// Object.keys(worker_specs).forEach( function(key){
// if(divs[key]) while(divs[key].firstChild){divs[key].removeChild(divs[key].firstChild)}
// for(let i = 0; i < worker_specs[key].length; i++){
// let span = document.createElement('span')
// worker_specs[key][i] == prev_specs[key][i] ? span.className = 'char_normal' : span.className = 'char_big'
// span.innerText = worker_specs[key][i]
// if(divs[key]) divs[key].append(span)
// }
// })
// Object.assign(prev_specs, worker_specs)
makeAnimation()
function timeStamp(){return window.performance && window.performance.now ? window.performance.now() : new Date().getTime()}