let my={} function init(){my.shapeName=getJSQueryVar('mode','cylinder') console.log('shapeName',my.shapeName) let version='0.853' w=450 h=w my.clrType='Rainbow' my.clrTypes=['Rainbow','Confetti','Multi','Pattern','TwoTone'] let clrSels=Object.entries(my.clrTypes).map(([k,v])=>({name:v,descr:v})) my.holeType='Whole' my.holeTypes=['Whole','Holes'] let holeSels=Object.entries(my.holeTypes).map(([k,v])=>({name:v,descr:v})) let s='' s+='
' s+='' s+=' Style:' s+=wrap({id:'clrType',tag:'sel',opts:clrSels,fn:'clrTypeChg()'}) if(my.shapeName=='cone'||my.shapeName=='cylinder'){}else{s+=wrap({id:'holeType',tag:'sel',opts:holeSels,fn:'holeTypeChg()'})} s+='' s+=wrap({cls:'copyrt',pos:'abs',style:'left:5px; bottom:3px'},`© 2022 Rod Pierce v${version}`) s+='
' docInsert(s) my.el=document.getElementById('canvasgl') my.ratio=1 my.gl=my.el.getContext('webgl') polySetup() my.modMat=[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1] my.proj_matrix=getProjection(17,my.el.width/my.el.height,1,100) my.view_matrix=[1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1] my.view_matrix[14]=my.view_matrix[14]-5 AMORTIZATION=0.99 draggingQ=false my.dragQ=false dx=0.02 dy=-0.01 prevmouseX=0 prevmouseY=0 let el=my.el el.addEventListener('touchstart',ontouchstart,false) el.addEventListener('touchmove',ontouchmove,false) el.addEventListener('mousedown',onmouseDown,false) el.addEventListener('mousemove',onmouseMove,false) el.addEventListener('mouseup',onmouseUp,false) animate(0)} function clrTypeChg(){console.log('sdf') let div=document.getElementById('clrType') my.clrType=div.options[div.selectedIndex].value console.log('clrTypeChg',my.clrType) polySetup()} function holeTypeChg(){console.log('sdf') let div=document.getElementById('holeType') my.holeType=div.options[div.selectedIndex].value console.log('holeTypeChg',my.holeType) polySetup()} function polySetup(){let poly=new Poly() poly.shapeType=my.shapeName poly.clrType='Mesh' let C=poly.getCalcSolid() if(my.holeType=='Holes'){let c1=[] for(let i=0;i0.3){c1.push(tri)}} C=c1.slice()} let triClrs=[] let rgb=[0.1,0.1,0] let inc=1/(C.length+1) let dirs=[1,1,1] for(let i=0;i1)dirs[j]=-1 if(rgb[j]<0)dirs[j]=1}} if(my.clrType=='TwoTone'){rgb[2]+=inc if(rgb[2]>1){rgb[2]=0}} if(my.clrType=='Pattern'){rgb[2]+=0.01 if(rgb[2]>1){rgb[2]=0}} triClrs.push([rgb[0],rgb[1],rgb[2]])} vertices=[] normals=[] colors=[] indices=[] let ind=0 for(let i=0;i0.0001){x/=vectorLength y/=vectorLength z/=vectorLength let Theta=vectorLength/500 let cosT=Math.cos(Theta) let sinT=Math.sin(Theta) let tanT=1-cosT let T=[[],[],[]] T[0][0]=tanT*x*x+cosT T[0][1]=tanT*x*y-sinT*z T[0][2]=tanT*x*z+sinT*y T[1][0]=tanT*x*y+sinT*z T[1][1]=tanT*y*y+cosT T[1][2]=tanT*y*z-sinT*x T[2][0]=tanT*x*z-sinT*y T[2][1]=tanT*y*z+sinT*x T[2][2]=tanT*z*z+cosT transMat=matMatMult(T,M)}} function clrPtNorm(pts){let alpha=0.8 let angle=getNormalAngle(pts,0) let dark=1-angle/Math.PI let red=((dark*255)>>0)+1 let grn=((dark*255)>>0)+1 angle=getNormalAngle(pts,1) dark=1-angle/Math.PI let blu=((dark*255)>>0)+1 return[red/256,grn/256,blu/256]} function getNormal(pts){let a=[pts[1].x-pts[0].x,pts[1].y-pts[0].y,pts[1].z-pts[0].z] let b=[pts[2].x-pts[1].x,pts[2].y-pts[1].y,pts[2].z-pts[1].z] let cross=[a[1]*b[2]-a[2]*b[1],a[2]*b[0]-a[0]*b[2],a[0]*b[1]-a[1]*b[0]] return cross} function getNormalAngle(pts,dimN){let a=[pts[1].x-pts[0].x,pts[1].y-pts[0].y,pts[1].z-pts[0].z] let b=[pts[2].x-pts[1].x,pts[2].y-pts[1].y,pts[2].z-pts[1].z] let cross=[a[1]*b[2]-a[2]*b[1],a[2]*b[0]-a[0]*b[2],a[0]*b[1]-a[1]*b[0]] let mag=Math.sqrt(cross[0]*cross[0]+cross[1]*cross[1]+cross[2]*cross[2]) let theta=Math.acos(cross[dimN]/mag) return theta} class Poly{constructor(){this.shapeType='cube' this.shapeSource='calc' this.scale=90} getSolid(){let C=[] switch(this.shapeSource){case 'file':case 'data':C=[] for(let i=0;i{if(cls.length==0)cls='btn' return '