Johnny/out/script.js

77 lines
2.1 KiB
JavaScript

// Init Elm
var app = Elm.Main.init({
node: document.getElementById("elm"),
// flags: Date.now()
});
// Dom Objects
let pc = document.getElementsByClassName("pc")[0];
let pc_ram = pc.getElementsByClassName("ram")[0];
let pc_cu = pc.getElementsByClassName("cu")[0];
let pc_alu = pc.getElementsByClassName("alu")[0];
let pc_ram_scroller = pc_ram.getElementsByClassName("scroller")[0];
let pc_cu_scroller = pc_cu.getElementsByClassName("scroller")[0];
let control_autoscroll = document.getElementById("enableScrolling");
// Methods
function scrollToCurrent(){
if( control_autoscroll.checked == false ) return;
let current_ram = pc_ram.getElementsByClassName("current")[0];
if( typeof current_ram != "undefined"){
current_ram.scrollIntoView({behavior: "smooth", block: "center"});
}
let current_uCode = pc_cu.getElementsByClassName("current")[0];
if( typeof current_uCode != "undefined"){
current_uCode.scrollIntoView({behavior: "smooth", block: "center"});
}
}
function shrinkTableHead(scroll){
let scroller = scroll.target;
let pos = scroller.scrollTop;
let thead = scroller.getElementsByClassName("head")[0];
if( pos > 70 ){
thead.classList.add("shrunk");
}else if (pos < 40){
thead.classList.remove("shrunk");
}
}
function loadStorage() {
let content = localStorage.getItem("pc_data");
if( typeof content == "string" ){
app.ports.localStorageRecieve.send( content );
}
}
// Load last state of pc
loadStorage();
// EVENT LISTENERS
pc_ram_scroller.addEventListener("scroll", shrinkTableHead);
pc_cu_scroller.addEventListener("scroll", shrinkTableHead);
// Recieve Elm updates via ports
app.ports.sendUUpdate.subscribe( (message) => {
// console.log("Update: ", message);
scrollToCurrent();
// Make sure that even when the calculation takes longer it will scroll correctly
setTimeout( scrollToCurrent, 100 );
} );
// Recieve LocalSession Updates via Ports
app.ports.localStorageSend.subscribe( (message) => {
console.log("localSessionSend: ", message);
localStorage.setItem("pc_data", message);
} );