{ function label(perm) { const el = html`${tex`${permlabel(perm)}`}`; el.className = 'controlLabel'; return el; }; const sx_box = (perm,ix) => html`${label(perm)}
`; const hf_box = (perm,ix) => html`${label([perm[0],perm[1]])}
`; const sx_form = bind(form(html``),viewof cube_vis); cubeform.style.margin = '15px 0px 15px 0px'; const cam_slider = html``; // cam_slider.style.position='absolute'; // cam_slider.style.transform=`translate(20px) rotate(90deg)`; // cam_slider.style.transformOrigin=`0% 0%`; cam_slider.style.width='200px'; cam_slider.style.display='block'; bind(cam_slider,viewof camrot); const inf_slider = html``; // inf_slider.style.position='absolute'; // inf_slider.style.transform=`translate(60px) rotate(90deg)`; // inf_slider.style.transformOrigin=`0% 0%`; inf_slider.style.width='200px'; inf_slider.style.display='block'; bind(inf_slider,viewof inflation); const controls = html`

${[sx_form,hf_form,cubeform,cam_slider,inf_slider]}

`; controls.style.position='absolute'; controls.style.textAlign='right'; controls.style.fontSize='11pt'; controls.style.top='100px'; controls.style.left=width+'px'; controls.style.transform='translate(-100%)'; controls.style.zIndex = 100; controls.style.whiteSpace='nowrap'; return controls; }