Name

3dspread

Global

#import getscript

function createnewsheet(x,y,z) {
 x=x||10;
 y=y||10;
 z=z||1;
 var retr=new Array(x);
 for(var xi=0;xi<x;++xi) {
  retr[xi]=new Array(y);
  for(var yi=0;yi<y;++yi) {
   retr[xi][yi]=new Array(z);
   for(var zi=0;zi<z;++zi) {
    retr[xi][yi][zi]={uc:"",oc:null,up:new Set(),down:new Set(),location:{x:xi,y:yi,z:zi,a:`${xi}:${yi}:${zi}`}};
   }
  }
 }
 return retr;
}

function assigntocellhelper(sheet,cell,uc,lockset) {
 if(lockset.has(cell)) return lockset;
 lockset.add(cell);
 cell.uc=uc;
 cell.up.forEach(u=>u.down.delete(cell));
 cell.up=new Set();
 var oc=null;
 if(uc[0]=="=") {
  //This is a formula
  var regexp = /c\$?([0-9]+):\$?([0-9]+):\$?([0-9]+)/g;
  var suc=uc.slice(1);
  var cmd=suc.replace(/c\$?([0-9]+):\$?([0-9]+):\$?([0-9]+)/g,"sheet[$1][$2][$3].oc")
  cell.oc = eval(cmd);
  (suc.match(regexp)||[]).forEach(link=>{
   var [lx,ly,lz]=link.slice(1).split(':').map(i=>parseInt(i));
   link = sheet[lx][ly][lz];
   cell.up.add(link);
   link.down.add(cell);
  });
 }
 else {
  try {
   cell.oc=JSON.parse(uc);
  } 
  catch(e) {
   if(uc[0]=="'") {
    cell.oc=uc.slice(1);
   }
   else {
    cell.oc=uc;
   }
  }
 }
 cell.down.forEach(out=>assigntocellhelper(sheet,out,out.uc,lockset));
 return lockset; //Returns what updated
}

function assigntocell(sheet,x,y,z,uc) {
 var cell = sheet[x][y][z];
 if(cell.uc==uc) return new Set();
 var changed = assigntocellhelper(sheet,cell,uc,new Set());
 return changed;
}

function stringify(v) {
 var dv=JSON.stringify(v);
 if(dv=='null') dv="";
 if(dv[0]=='"') dv=dv.slice(1,-1);
 return dv;
}

function basicdriver() {
 var sheet = createnewsheet(20,10,1);
 window.sheet=sheet;
 var table=document.createElement('table');
 var tbody=document.createElement('tbody');
 table.appendChild(tbody);
 for(var x=0;x<sheet.length;++x) {
  var tr=document.createElement('tr');
  tbody.appendChild(tr);
  for(var y=0;y<sheet[x].length;++y) {
   var td=document.createElement('td');
   var input=document.createElement('input');
   sheet[x][y][0].input=input;
   td.appendChild(input);
   tr.appendChild(td);
   input.x=x;
   input.y=y;
   input.value=sheet[x][y][0].oc;
   input.onfocus=(e)=>{
    console.log('onfocus');
    var targ = e.target;
    targ.value=sheet[targ.x][targ.y][0].uc;
   };
   input.onblur=(e)=>{
    console.log('onblur')
    var targ= e.target
    var modified = assigntocell(sheet,targ.x,targ.y,0,targ.value);
    modified.forEach(cell=>cell.input.value=stringify(cell.oc));
    targ.value=stringify(sheet[targ.x][targ.y][0].oc);
    console.log(sheet[targ.x][targ.y][0].oc);
   };
  }
 }
 return table;
}

function get3dspreadCSS() {
 return `
  td, input {
   margin:0;
   padding:0;
  }
  input {
   width:128px;
   display:block;
  }
 `
}

function convertarrastringto3dspread(data) {
 data = JSON.parse(data);
 var [x,y,z]=data;
 data = data.slice(3);
 var sheet = createnewsheet(x,y,z);
 for(var xi=0;xi<x;++xi) {
  for(var yi=0;yi<y;++yi) {
   for(var zi=0;zi<z;++zi) {
    var uc=data.shift();
    console.log('uc',uc);
    if(uc) {
     assigntocell(sheet,xi,yi,zi,uc);
    }
   }
  }
 }
 return sheet;
}

function convert3dspreadtoucarraystring(sheet) {
 var retr=[];
 retr.push(sheet.length);
 retr.push(sheet[0].length);
 retr.push(sheet[0][0].length);
 sheet.forEach(r1=>r1.forEach(r2=>r2.forEach(c=>retr.push(c.uc))));
 return stringify(retr);
}

function reinitializewithdata(data) {
 document.body.childNodes.forEach((i,e)=>i.remove());
 document.body.appendChild(basicdriver(convertarrastringto3dspread(data)));
}

function main() {
 add_style(get3dspreadCSS());
 window.addEventListener('load',()=>{
  document.body.childNodes.forEach((i,e)=>i.remove());
  document.body.appendChild(basicdriver());
 });
}

Init

main();

Build

3dspread