Comments (5)
similar bug posted here suggests swcMinify:false and I think that does fix it for me. they should probably fix it upstream in swc vercel/next.js#52373
from molstar.
just wanted to say i think i can confirm the same build error under nextjs. the built artifact is attached. interestingly, running "prettier" fails on it at what looks to be the same location that the nextjs is complaining about the Invalid destructuring, and that is these multi-line template strings, but those should be fine to have, so not sure why it is breaking
built file from next.js from .next/server/app/page.js when I had app/page.tsx as the molstar component
from molstar.
example of prettier error
npx prettier --write built_artifact.js
Need to install the following packages:
[email protected]
Ok to proceed? (y)
built_artifact.js
[error] built_artifact.js: SyntaxError: Invalid left-hand side in array destructuring pattern. (4962:12323)
[error] 4960 | gl_FragColor = texture2D(tColor, coords) * uWeight;
[error] 4961 | }
[error] > 4962 | `,XP={...ky,tColor:MW("texture","rgba","ubyte","nearest"),uTexSize:Mq("v2"),uWeight:Mq("f")},XE=E4("compose",M7,XT),XD={mode:ec.Select("temporal",[["off","Off"],["on","On"],["temporal","Temporal"]]),sampleLevel:ec.Numeric(2,{min:0,max:5,step:1},{description:"Take level^2 samples."}),reduceFlicker:ec.Boolean(!0,{description:'Reduce flicker in "temporal" mode.'})};class XI{static isEnabled(e){return"off"!==e.mode}constructor(e,t){this.webgl=e,this.drawPass=t;let{colorBufferFloat:r,textureFloat:n,colorBufferHalfFloat:i,textureHalfFloat:a}=e.extensions,o=t.colorTarget.getWidth(),s=t.colorTarget.getHeight();this.colorTarget=e.createRenderTarget(o,s,!1),this.composeTarget=e.createRenderTarget(o,s,!1,i&&a?"fp16":r&&n?"float32":"uint8"),this.holdTarget=e.createRenderTarget(o,s,!1),this.compose=function(e,t){let r={...kv,tColor:k.create(t),uTexSize:k.create(iH.create(t.getWidth(),t.getHeight())),uWeight:k.create(1)};return km(ka(e,"triangles",XE,{...XP},r),r)}(e,t.colorTarget.texture)}syncSize(){let e=this.drawPass.colorTarget.getWidth(),t=this.drawPass.colorTarget.getHeight(),[r,n]=this.compose.values.uTexSize.ref.value;(e!==r||t!==n)&&(this.colorTarget.setSize(e,t),this.composeTarget.setSize(e,t),this.holdTarget.setSize(e,t),k.update(this.compose.values.uTexSize,iH.set(this.compose.values.uTexSize.ref.value,e,t)))}render(e,t,r,n,i){return"temporal"!==r.multiSample.mode||i?(this.renderMultiSample(t,n,r),-2):this.renderTemporalMultiSample(e,t,r,n)}bindOutputTarget(e){e?this.webgl.unbindFramebuffer():this.colorTarget.bind()}renderMultiSample(e,t,r){let{camera:n}=e,{compose:i,composeTarget:a,drawPass:o,webgl:s}=this,{gl:l,state:u}=s,c=XM[Math.max(0,Math.min(r.multiSample.sampleLevel,5))],{x:d,y:p,width:h,height:f}=n.viewport,m=1/c.length,g=1/32;n.viewOffset.enabled=!0,k.update(i.values.tColor,o.getColorTarget(r.postprocessing).texture),i.update();for(let t=0;t<c.length;++t){let s=c[t];WS.setViewOffset(n.viewOffset,h,f,s[0],s[1],h,f),n.update();let y=m+g*(-.5+(t+.5)/c.length);k.update(i.values.uWeight,y),0===t?o.postprocessing.setOcclusionOffset(0,0):o.postprocessing.setOcclusionOffset(s[0]/h,s[1]/f),o.render(e,r,!1),a.bind(),u.enable(l.BLEND),u.blendEquationSeparate(l.FUNC_ADD,l.FUNC_ADD),u.blendFuncSeparate(l.ONE,l.ONE,l.ONE,l.ONE),u.disable(l.DEPTH_TEST),u.depthMask(!1),u.viewport(d,p,h,f),u.scissor(d,p,h,f),0===t&&(u.clearColor(0,0,0,0),l.clear(l.COLOR_BUFFER_BIT)),i.render()}o.postprocessing.setOcclusionOffset(0,0),k.update(i.values.uWeight,1),k.update(i.values.tColor,a.texture),i.update(),this.bindOutputTarget(t),u.viewport(d,p,h,f),u.scissor(d,p,h,f),u.disable(l.BLEND),i.render(),n.viewOffset.enabled=!1,n.update()}renderTemporalMultiSample(e,t,r,n){let{camera:i}=t,{compose:a,composeTarget:o,holdTarget:s,drawPass:l,webgl:u}=this,{gl:c,state:d}=u,p=XM[Math.max(0,Math.min(r.multiSample.sampleLevel,5))];if(-2===e||e>=p.length)return -2;let{x:h,y:f,width:m,height:g}=i.viewport,y=1/p.length;if(-1===e)l.render(t,r,!1),k.update(a.values.uWeight,1),k.update(a.values.tColor,l.getColorTarget(r.postprocessing).texture),a.update(),s.bind(),d.disable(c.BLEND),d.disable(c.DEPTH_TEST),d.depthMask(!1),d.viewport(h,f,m,g),d.scissor(h,f,m,g),a.render(),e+=1;else{i.viewOffset.enabled=!0,k.update(a.values.tColor,l.getColorTarget(r.postprocessing).texture),k.update(a.values.uWeight,y),a.update();let n=Math.pow(2,Math.max(0,r.multiSample.sampleLevel-2));for(let s=0;s<n;++s){let n=p[e];if(WS.setViewOffset(i.viewOffset,m,g,n[0],n[1],m,g),i.update(),0===e?l.postprocessing.setOcclusionOffset(0,0):l.postprocessing.setOcclusionOffset(n[0]/m,n[1]/g),l.render(t,r,!1),o.bind(),d.enable(c.BLEND),d.blendEquationSeparate(c.FUNC_ADD,c.FUNC_ADD),d.blendFuncSeparate(c.ONE,c.ONE,c.ONE,c.ONE),d.disable(c.DEPTH_TEST),d.depthMask(!1),d.viewport(h,f,m,g),d.scissor(h,f,m,g),0===e&&(d.clearColor(0,0,0,0),c.clear(c.COLOR_BUFFER_BIT)),a.render(),(e+=1)>=p.length)break}}l.postprocessing.setOcclusionOffset(0,0),this.bindOutputTarget(n),d.viewport(h,f,m,g),d.scissor(h,f,m,g);let b=e*y;return b>0&&(k.update(a.values.uWeight,1),k.update(a.values.tColor,o.texture),a.update(),d.disable(c.BLEND),a.render()),b<1&&(k.update(a.values.uWeight,1-b),k.update(a.values.tColor,s.texture),a.update(),0===b?d.disable(c.BLEND):d.enable(c.BLEND),a.render()),i.viewOffset.enabled=!1,i.update(),e>=p.length?-2:e}}let XM=[[[0,0]],[[0,0],[-4,-4]],[[0,0],[6,-2],[-6,2],[2,6]],[[0,0],[-1,3],[5,1],[-3,-5],[-5,5],[-7,-1],[3,7],[7,-7]],[[0,0],[-1,-3],[-3,2],[4,-1],[-5,-2],[2,5],[5,3],[3,-5],[-2,6],[0,-7],[-4,-6],[-6,4],[-8,0],[7,-4],[6,7],[-7,-8]],[[0,0],[-7,-5],[-3,-5],[-5,-4],[-1,-4],[-2,-2],[-6,-1],[-4,0],[-7,1],[-1,2],[-6,3],[-3,3],[-7,6],[-3,6],[-5,7],[-1,7],[5,-7],[1,-6],[6,-5],[4,-4],[2,-3],[7,-2],[1,-1],[4,-1],[2,1],[6,2],[0,4],[4,4],[2,5],[7,5],[5,6],[3,7]]];XM.forEach(e=>{e.forEach(e=>{e[0]*=.0625,e[1]*=.0625})});class Xk{update(e,t){return e&&(this.sampleIndex=-1),"temporal"===t.mode&&-2!==this.sampleIndex}render(e,t,r,n){return this.sampleIndex=this.multiSamplePass.render(this.sampleIndex,e,t,r,!!n),this.sampleIndex<0}constructor(e){this.multiSamplePass=e,this.sampleIndex=-2}}let XB={eyeSeparation:ec.Numeric(.062,{min:.02,max:.1,step:.001},{description:"Distance between left and right camera."}),focus:ec.Numeric(10,{min:1,max:20,step:.1},{description:"Apparent object distance."})},XO=ec.getDefaultValues(XB);class XR{get viewport(){return this.parent.viewport}get viewOffset(){return this.parent.viewOffset}constructor(e,t={}){this.parent=e,this.left=new XL,this.right=new XL,this.props={...XO,...t}}setProps(e){Object.assign(this.props,e)}update(){this.parent.update(),function(e,t,r,n){let i,a;q1.copy(r.viewport,e.viewport),iG.copy(r.view,e.view),iG.copy(r.projection,e.projection),WS.copySnapshot(r.state,e.state),WS.copyViewOffset(r.viewOffset,e.viewOffset),r.far=e.far,r.near=e.near,r.fogFar=e.fogFar,r.fogNear=e.fogNear,q1.copy(n.viewport,e.viewport),iG.copy(n.view,e.view),iG.copy(n.projection,e.projection),WS.copySnapshot(n.state,e.state),WS.copyViewOffset(n.viewOffset,e.viewOffset),n.far=e.far,n.near=e.near,n.fogFar=e.fogFar,n.fogNear=e.fogNear;let o=Math.floor(e.viewport.width/2),s=o/e.viewport.height;r.viewport.width=o,n.viewport.x+=o,n.viewport.width-=o;let l=t.eyeSeparation/2,u=l*e.near/t.focus,c=e.near*Math.tan(.5*e.state.fov);XN[12]=-l,XF[12]=l,i=-c*s+u,a=c*s+u,r.projection[0]=2*e.near/(a-i),r.projection[8]=(a+i)/(a-i),iG.mul(r.view,r.view,XN),iG.mul(r.projectionView,r.projection,r.view),iG.invert(r.inverseProjectionView,r.projectionView),i=-c*s-u,a=c*s-u,n.projection[0]=2*e.near/(a-i),n.projection[8]=(a+i)/(a-i),iG.mul(n.view,n.view,XF),iG.mul(n.projectionView,n.projection,n.view),iG.invert(n.inverseProjectionView,n.projectionView)}(this.parent,this.props,this.left,this.right)}}(XR||(XR={})).is=function(e){return"left"in e&&"right"in e};class XL{constructor(){this.viewport=q1.create(0,0,0,0),this.view=iG(),this.projection=iG(),this.projectionView=iG(),this.inverseProjectionView=iG(),this.state=WS.createDefaultSnapshot(),this.viewOffset=WS.ViewOffset(),this.far=0,this.near=0,this.fogFar=0,this.fogNear=0}}let XN=iG.identity(),XF=iG.identity();class Xj{constructor(e,t,r){this.webgl=e,this.drawPass=t,this.pickScale=r;let n=r/e.pixelRatio;this.pickWidth=Math.ceil(t.colorTarget.getWidth()*n),this.pickHeight=Math.ceil(t.colorTarget.getHeight()*n);let{resources:i,extensions:{drawBuffers:a},gl:o}=e;a?(this.objectPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.objectPickTexture.define(this.pickWidth,this.pickHeight),this.instancePickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.instancePickTexture.define(this.pickWidth,this.pickHeight),this.groupPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.groupPickTexture.define(this.pickWidth,this.pickHeight),this.depthPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.depthPickTexture.define(this.pickWidth,this.pickHeight),this.framebuffer=i.framebuffer(),this.objectPickFramebuffer=i.framebuffer(),this.instancePickFramebuffer=i.framebuffer(),this.groupPickFramebuffer=i.framebuffer(),this.depthPickFramebuffer=i.framebuffer(),this.framebuffer.bind(),a.drawBuffers([a.COLOR_ATTACHMENT0,a.COLOR_ATTACHMENT1,a.COLOR_ATTACHMENT2,a.COLOR_ATTACHMENT3]),this.objectPickTexture.attachFramebuffer(this.framebuffer,"color0"),this.instancePickTexture.attachFramebuffer(this.framebuffer,"color1"),this.groupPickTexture.attachFramebuffer(this.framebuffer,"color2"),this.depthPickTexture.attachFramebuffer(this.framebuffer,"color3"),this.depthTexture=DH(o)?i.texture("image-depth","depth","float","nearest"):i.texture("image-depth","depth","ushort","nearest"),this.depthTexture.define(this.pickWidth,this.pickHeight),this.depthTexture.attachFramebuffer(this.framebuffer,"depth"),this.objectPickTexture.attachFramebuffer(this.objectPickFramebuffer,"color0"),this.instancePickTexture.attachFramebuffer(this.instancePickFramebuffer,"color0"),this.groupPickTexture.attachFramebuffer(this.groupPickFramebuffer,"color0"),this.depthPickTexture.attachFramebuffer(this.depthPickFramebuffer,"color0")):(this.objectPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.instancePickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.groupPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.depthPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight))}get pickRatio(){return this.pickScale/this.webgl.pixelRatio}setPickScale(e){this.pickScale=e,this.syncSize()}bindObject(){this.webgl.extensions.drawBuffers?this.objectPickFramebuffer.bind():this.objectPickTarget.bind()}bindInstance(){this.webgl.extensions.drawBuffers?this.instancePickFramebuffer.bind():this.instancePickTarget.bind()}bindGroup(){this.webgl.extensions.drawBuffers?this.groupPickFramebuffer.bind():this.groupPickTarget.bind()}bindDepth(){this.webgl.extensions.drawBuffers?this.depthPickFramebuffer.bind():this.depthPickTarget.bind()}get drawingBufferHeight(){return this.drawPass.colorTarget.getHeight()}syncSize(){let e=this.pickScale/this.webgl.pixelRatio,t=Math.ceil(this.drawPass.colorTarget.getWidth()*e),r=Math.ceil(this.drawPass.colorTarget.getHeight()*e);(t!==this.pickWidth||r!==this.pickHeight)&&(this.pickWidth=t,this.pickHeight=r,this.webgl.extensions.drawBuffers?(this.objectPickTexture.define(this.pickWidth,this.pickHeight),this.instancePickTexture.define(this.pickWidth,this.pickHeight),this.groupPickTexture.define(this.pickWidth,this.pickHeight),this.depthPickTexture.define(this.pickWidth,this.pickHeight),this.depthTexture.define(this.pickWidth,this.pickHeight)):(this.objectPickTarget.setSize(this.pickWidth,this.pickHeight),this.instancePickTarget.setSize(this.pickWidth,this.pickHeight),this.groupPickTarget.setSize(this.pickWidth,this.pickHeight),this.depthPickTarget.setSize(this.pickWidth,this.pickHeight)))}renderVariant(e,t,r,n,i,a){e.clear(!1),e.update(t,r),e.renderPick(r.primitives,t,i,null,a),n.handle.isEnabled&&e.renderPick(n.handle.scene,t,i,null,a),n.camera.isEnabled&&(n.camera.update(t),e.update(n.camera.camera,n.camera.scene),e.renderPick(n.camera.scene,n.camera.camera,i,null,a))}render(e,t,r,n){this.webgl.extensions.drawBuffers?(this.framebuffer.bind(),this.renderVariant(e,t,r,n,"pick",rW.None)):(this.objectPickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Object),this.instancePickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Instance),this.groupPickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Group),this.depthPickTarget.bind(),this.renderVariant(e,t,r,n,"depth",rW.None))}}class XU{setupBuffers(){let e=this.pickWidth*this.pickHeight*4;this.objectBuffer&&this.objectBuffer.length===e||(this.objectBuffer=new Uint8Array(e),this.instanceBuffer=new Uint8Array(e),this.groupBuffer=new Uint8Array(e),this.depthBuffer=new Uint8Array(e))}setViewport(e,t,r,n){q1.set(this.viewport,e,t,r,n),this.pickRatio=this.pickPass.pickRatio,this.pickX=Math.ceil(e*this.pickRatio),this.pickY=Math.ceil(t*this.pickRatio);let i=Math.floor(r*this.pickRatio),a=Math.floor(n*this.pickRatio);(i!==this.pickWidth||a!==this.pickHeight)&&(this.pickWidth=i,this.pickHeight=a,this.halfPickWidth=Math.floor(this.pickWidth/2),this.setupBuffers()),this.spiral=function(e){let t=0,r=0,n=2*e+1,i=n/2,a=[];for(let e=Math.pow(n,2);e>0;--e)-i<t&&t<=i&&-i<r&&r<=i&&a.push([t,r]),(t===r||t<0&&t===-r||t>0&&t===1-r)&&([0,-1]=[1,0]),t+=0,r+=-1;return a}(Math.round(this.pickRatio*this.pickPadding))}syncBuffers(){let{pickX:e,pickY:t,pickWidth:r,pickHeight:n}=this;this.pickPass.bindObject(),this.webgl.readPixels(e,t,r,n,this.objectBuffer),this.pickPass.bindInstance(),this.webgl.readPixels(e,t,r,n,this.instanceBuffer),this.pickPass.bindGroup(),this.webgl.readPixels(e,t,r,n,this.groupBuffer),this.pickPass.bindDepth(),this.webgl.readPixels(e,t,r,n,this.depthBuffer)}getBufferIdx(e,t){return(t*this.pickWidth+e)*4}getDepth(e,t){var r,n,i,a;let o=this.getBufferIdx(e,t),s=this.depthBuffer;return r=s[o],n=s[o+1],i=s[o+2],a=s[o+3],iq.set(Mm,r/255,n/255,i/255,a/255),iq.dot(Mm,Mf)}getId(e,t,r){let n=this.getBufferIdx(e,t);return Md(r[n],r[n+1],r[n+2])}render(e){let{pickX:t,pickY:r,pickWidth:n,pickHeight:i,halfPickWidth:a}=this,{renderer:o,scene:s,helper:l}=this;o.setTransparentBackground(!1),o.setDrawingBufferSize(n,i),o.setPixelRatio(this.pickRatio),XR.is(e)?(o.setViewport(t,r,a,i),this.pickPass.render(o,e.left,s,l),o.setViewport(t+a,r,n-a,i),this.pickPass.render(o,e.right,s,l)):(o.setViewport(t,r,n,i),this.pickPass.render(o,e,s,l)),this.dirty=!1}identifyInternal(e,t,r){let{webgl:n,pickRatio:i}=this;if(n.isContextLost)return;e*=n.pixelRatio,t*=n.pixelRatio,t=this.pickPass.drawingBufferHeight-t;let{viewport:a}=this;if(e<a.x||t<a.y||e>a.x+a.width||t>a.y+a.height)return;this.dirty&&(this.render(r),this.syncBuffers());let o=e-a.x,s=t-a.y,l=Math.floor(o*i),u=Math.floor(s*i),c=this.getId(l,u,this.objectBuffer);if(-1===c||16777214===c)return;let d=this.getId(l,u,this.instanceBuffer);if(-1===d||16777214===d)return;let p=this.getId(l,u,this.groupBuffer);if(-1===p||16777214===p)return;let h=this.getDepth(l,u),f=iz.create(e,t,h);if(XR.is(r)){let t=Math.floor(a.width/2);e>a.x+t?(f[0]=a.x+(o-t)*2,q3(f,f,a,r.right.inverseProjectionView)):(f[0]=a.x+2*o,q3(f,f,a,r.left.inverseProjectionView))}else q3(f,f,a,r.inverseProjectionView);return{id:{objectId:c,instanceId:d,groupId:p},position:f}}identify(e,t,r){for(let n of this.spiral){let i=this.identifyInternal(e+n[0],t+n[1],r);if(i)return i}}constructor(e,t,r,n,i,a,o=1){this.webgl=e,this.renderer=t,this.scene=r,this.helper=n,this.pickPass=i,this.pickPadding=o,this.dirty=!0,this.viewport=q1(),this.setViewport(a.x,a.y,a.width,a.height)}}let Xz=`
[error] | ^
[error] 4963 | precision highp float;
[error] 4964 |
[error] 4965 | uniform sampler2D tWboitA;
example of the same nextjs error
y build
yarn run v1.22.21
$ next build
▲ Next.js 14.1.0
Creating an optimized production build ...
✓ Compiled successfully
✓ Linting and checking validity of types
Collecting page data .../home/cdiesh/my-app/.next/server/app/page.js:4962
`,XP={...ky,tColor:MW("texture","rgba","ubyte","nearest"),uTexSize:Mq("v2"),uWeight:Mq("f")},XE=E4("compose",M7,XT),XD={mode:ec.Select("temporal",[["off","Off"],["on","On"],["temporal","Temporal"]]),sampleLevel:ec.Numeric(2,{min:0,max:5,step:1},{description:"Take level^2 samples."}),reduceFlicker:ec.Boolean(!0,{description:'Reduce flicker in "temporal" mode.'})};class XI{static isEnabled(e){return"off"!==e.mode}constructor(e,t){this.webgl=e,this.drawPass=t;let{colorBufferFloat:r,textureFloat:n,colorBufferHalfFloat:i,textureHalfFloat:a}=e.extensions,o=t.colorTarget.getWidth(),s=t.colorTarget.getHeight();this.colorTarget=e.createRenderTarget(o,s,!1),this.composeTarget=e.createRenderTarget(o,s,!1,i&&a?"fp16":r&&n?"float32":"uint8"),this.holdTarget=e.createRenderTarget(o,s,!1),this.compose=function(e,t){let r={...kv,tColor:k.create(t),uTexSize:k.create(iH.create(t.getWidth(),t.getHeight())),uWeight:k.create(1)};return km(ka(e,"triangles",XE,{...XP},r),r)}(e,t.colorTarget.texture)}syncSize(){let e=this.drawPass.colorTarget.getWidth(),t=this.drawPass.colorTarget.getHeight(),[r,n]=this.compose.values.uTexSize.ref.value;(e!==r||t!==n)&&(this.colorTarget.setSize(e,t),this.composeTarget.setSize(e,t),this.holdTarget.setSize(e,t),k.update(this.compose.values.uTexSize,iH.set(this.compose.values.uTexSize.ref.value,e,t)))}render(e,t,r,n,i){return"temporal"!==r.multiSample.mode||i?(this.renderMultiSample(t,n,r),-2):this.renderTemporalMultiSample(e,t,r,n)}bindOutputTarget(e){e?this.webgl.unbindFramebuffer():this.colorTarget.bind()}renderMultiSample(e,t,r){let{camera:n}=e,{compose:i,composeTarget:a,drawPass:o,webgl:s}=this,{gl:l,state:u}=s,c=XM[Math.max(0,Math.min(r.multiSample.sampleLevel,5))],{x:d,y:p,width:h,height:f}=n.viewport,m=1/c.length,g=1/32;n.viewOffset.enabled=!0,k.update(i.values.tColor,o.getColorTarget(r.postprocessing).texture),i.update();for(let t=0;t<c.length;++t){let s=c[t];WS.setViewOffset(n.viewOffset,h,f,s[0],s[1],h,f),n.update();let y=m+g*(-.5+(t+.5)/c.length);k.update(i.values.uWeight,y),0===t?o.postprocessing.setOcclusionOffset(0,0):o.postprocessing.setOcclusionOffset(s[0]/h,s[1]/f),o.render(e,r,!1),a.bind(),u.enable(l.BLEND),u.blendEquationSeparate(l.FUNC_ADD,l.FUNC_ADD),u.blendFuncSeparate(l.ONE,l.ONE,l.ONE,l.ONE),u.disable(l.DEPTH_TEST),u.depthMask(!1),u.viewport(d,p,h,f),u.scissor(d,p,h,f),0===t&&(u.clearColor(0,0,0,0),l.clear(l.COLOR_BUFFER_BIT)),i.render()}o.postprocessing.setOcclusionOffset(0,0),k.update(i.values.uWeight,1),k.update(i.values.tColor,a.texture),i.update(),this.bindOutputTarget(t),u.viewport(d,p,h,f),u.scissor(d,p,h,f),u.disable(l.BLEND),i.render(),n.viewOffset.enabled=!1,n.update()}renderTemporalMultiSample(e,t,r,n){let{camera:i}=t,{compose:a,composeTarget:o,holdTarget:s,drawPass:l,webgl:u}=this,{gl:c,state:d}=u,p=XM[Math.max(0,Math.min(r.multiSample.sampleLevel,5))];if(-2===e||e>=p.length)return -2;let{x:h,y:f,width:m,height:g}=i.viewport,y=1/p.length;if(-1===e)l.render(t,r,!1),k.update(a.values.uWeight,1),k.update(a.values.tColor,l.getColorTarget(r.postprocessing).texture),a.update(),s.bind(),d.disable(c.BLEND),d.disable(c.DEPTH_TEST),d.depthMask(!1),d.viewport(h,f,m,g),d.scissor(h,f,m,g),a.render(),e+=1;else{i.viewOffset.enabled=!0,k.update(a.values.tColor,l.getColorTarget(r.postprocessing).texture),k.update(a.values.uWeight,y),a.update();let n=Math.pow(2,Math.max(0,r.multiSample.sampleLevel-2));for(let s=0;s<n;++s){let n=p[e];if(WS.setViewOffset(i.viewOffset,m,g,n[0],n[1],m,g),i.update(),0===e?l.postprocessing.setOcclusionOffset(0,0):l.postprocessing.setOcclusionOffset(n[0]/m,n[1]/g),l.render(t,r,!1),o.bind(),d.enable(c.BLEND),d.blendEquationSeparate(c.FUNC_ADD,c.FUNC_ADD),d.blendFuncSeparate(c.ONE,c.ONE,c.ONE,c.ONE),d.disable(c.DEPTH_TEST),d.depthMask(!1),d.viewport(h,f,m,g),d.scissor(h,f,m,g),0===e&&(d.clearColor(0,0,0,0),c.clear(c.COLOR_BUFFER_BIT)),a.render(),(e+=1)>=p.length)break}}l.postprocessing.setOcclusionOffset(0,0),this.bindOutputTarget(n),d.viewport(h,f,m,g),d.scissor(h,f,m,g);let b=e*y;return b>0&&(k.update(a.values.uWeight,1),k.update(a.values.tColor,o.texture),a.update(),d.disable(c.BLEND),a.render()),b<1&&(k.update(a.values.uWeight,1-b),k.update(a.values.tColor,s.texture),a.update(),0===b?d.disable(c.BLEND):d.enable(c.BLEND),a.render()),i.viewOffset.enabled=!1,i.update(),e>=p.length?-2:e}}let XM=[[[0,0]],[[0,0],[-4,-4]],[[0,0],[6,-2],[-6,2],[2,6]],[[0,0],[-1,3],[5,1],[-3,-5],[-5,5],[-7,-1],[3,7],[7,-7]],[[0,0],[-1,-3],[-3,2],[4,-1],[-5,-2],[2,5],[5,3],[3,-5],[-2,6],[0,-7],[-4,-6],[-6,4],[-8,0],[7,-4],[6,7],[-7,-8]],[[0,0],[-7,-5],[-3,-5],[-5,-4],[-1,-4],[-2,-2],[-6,-1],[-4,0],[-7,1],[-1,2],[-6,3],[-3,3],[-7,6],[-3,6],[-5,7],[-1,7],[5,-7],[1,-6],[6,-5],[4,-4],[2,-3],[7,-2],[1,-1],[4,-1],[2,1],[6,2],[0,4],[4,4],[2,5],[7,5],[5,6],[3,7]]];XM.forEach(e=>{e.forEach(e=>{e[0]*=.0625,e[1]*=.0625})});class Xk{update(e,t){return e&&(this.sampleIndex=-1),"temporal"===t.mode&&-2!==this.sampleIndex}render(e,t,r,n){return this.sampleIndex=this.multiSamplePass.render(this.sampleIndex,e,t,r,!!n),this.sampleIndex<0}constructor(e){this.multiSamplePass=e,this.sampleIndex=-2}}let XB={eyeSeparation:ec.Numeric(.062,{min:.02,max:.1,step:.001},{description:"Distance between left and right camera."}),focus:ec.Numeric(10,{min:1,max:20,step:.1},{description:"Apparent object distance."})},XO=ec.getDefaultValues(XB);class XR{get viewport(){return this.parent.viewport}get viewOffset(){return this.parent.viewOffset}constructor(e,t={}){this.parent=e,this.left=new XL,this.right=new XL,this.props={...XO,...t}}setProps(e){Object.assign(this.props,e)}update(){this.parent.update(),function(e,t,r,n){let i,a;q1.copy(r.viewport,e.viewport),iG.copy(r.view,e.view),iG.copy(r.projection,e.projection),WS.copySnapshot(r.state,e.state),WS.copyViewOffset(r.viewOffset,e.viewOffset),r.far=e.far,r.near=e.near,r.fogFar=e.fogFar,r.fogNear=e.fogNear,q1.copy(n.viewport,e.viewport),iG.copy(n.view,e.view),iG.copy(n.projection,e.projection),WS.copySnapshot(n.state,e.state),WS.copyViewOffset(n.viewOffset,e.viewOffset),n.far=e.far,n.near=e.near,n.fogFar=e.fogFar,n.fogNear=e.fogNear;let o=Math.floor(e.viewport.width/2),s=o/e.viewport.height;r.viewport.width=o,n.viewport.x+=o,n.viewport.width-=o;let l=t.eyeSeparation/2,u=l*e.near/t.focus,c=e.near*Math.tan(.5*e.state.fov);XN[12]=-l,XF[12]=l,i=-c*s+u,a=c*s+u,r.projection[0]=2*e.near/(a-i),r.projection[8]=(a+i)/(a-i),iG.mul(r.view,r.view,XN),iG.mul(r.projectionView,r.projection,r.view),iG.invert(r.inverseProjectionView,r.projectionView),i=-c*s-u,a=c*s-u,n.projection[0]=2*e.near/(a-i),n.projection[8]=(a+i)/(a-i),iG.mul(n.view,n.view,XF),iG.mul(n.projectionView,n.projection,n.view),iG.invert(n.inverseProjectionView,n.projectionView)}(this.parent,this.props,this.left,this.right)}}(XR||(XR={})).is=function(e){return"left"in e&&"right"in e};class XL{constructor(){this.viewport=q1.create(0,0,0,0),this.view=iG(),this.projection=iG(),this.projectionView=iG(),this.inverseProjectionView=iG(),this.state=WS.createDefaultSnapshot(),this.viewOffset=WS.ViewOffset(),this.far=0,this.near=0,this.fogFar=0,this.fogNear=0}}let XN=iG.identity(),XF=iG.identity();class Xj{constructor(e,t,r){this.webgl=e,this.drawPass=t,this.pickScale=r;let n=r/e.pixelRatio;this.pickWidth=Math.ceil(t.colorTarget.getWidth()*n),this.pickHeight=Math.ceil(t.colorTarget.getHeight()*n);let{resources:i,extensions:{drawBuffers:a},gl:o}=e;a?(this.objectPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.objectPickTexture.define(this.pickWidth,this.pickHeight),this.instancePickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.instancePickTexture.define(this.pickWidth,this.pickHeight),this.groupPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.groupPickTexture.define(this.pickWidth,this.pickHeight),this.depthPickTexture=i.texture("image-uint8","rgba","ubyte","nearest"),this.depthPickTexture.define(this.pickWidth,this.pickHeight),this.framebuffer=i.framebuffer(),this.objectPickFramebuffer=i.framebuffer(),this.instancePickFramebuffer=i.framebuffer(),this.groupPickFramebuffer=i.framebuffer(),this.depthPickFramebuffer=i.framebuffer(),this.framebuffer.bind(),a.drawBuffers([a.COLOR_ATTACHMENT0,a.COLOR_ATTACHMENT1,a.COLOR_ATTACHMENT2,a.COLOR_ATTACHMENT3]),this.objectPickTexture.attachFramebuffer(this.framebuffer,"color0"),this.instancePickTexture.attachFramebuffer(this.framebuffer,"color1"),this.groupPickTexture.attachFramebuffer(this.framebuffer,"color2"),this.depthPickTexture.attachFramebuffer(this.framebuffer,"color3"),this.depthTexture=DH(o)?i.texture("image-depth","depth","float","nearest"):i.texture("image-depth","depth","ushort","nearest"),this.depthTexture.define(this.pickWidth,this.pickHeight),this.depthTexture.attachFramebuffer(this.framebuffer,"depth"),this.objectPickTexture.attachFramebuffer(this.objectPickFramebuffer,"color0"),this.instancePickTexture.attachFramebuffer(this.instancePickFramebuffer,"color0"),this.groupPickTexture.attachFramebuffer(this.groupPickFramebuffer,"color0"),this.depthPickTexture.attachFramebuffer(this.depthPickFramebuffer,"color0")):(this.objectPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.instancePickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.groupPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight),this.depthPickTarget=e.createRenderTarget(this.pickWidth,this.pickHeight))}get pickRatio(){return this.pickScale/this.webgl.pixelRatio}setPickScale(e){this.pickScale=e,this.syncSize()}bindObject(){this.webgl.extensions.drawBuffers?this.objectPickFramebuffer.bind():this.objectPickTarget.bind()}bindInstance(){this.webgl.extensions.drawBuffers?this.instancePickFramebuffer.bind():this.instancePickTarget.bind()}bindGroup(){this.webgl.extensions.drawBuffers?this.groupPickFramebuffer.bind():this.groupPickTarget.bind()}bindDepth(){this.webgl.extensions.drawBuffers?this.depthPickFramebuffer.bind():this.depthPickTarget.bind()}get drawingBufferHeight(){return this.drawPass.colorTarget.getHeight()}syncSize(){let e=this.pickScale/this.webgl.pixelRatio,t=Math.ceil(this.drawPass.colorTarget.getWidth()*e),r=Math.ceil(this.drawPass.colorTarget.getHeight()*e);(t!==this.pickWidth||r!==this.pickHeight)&&(this.pickWidth=t,this.pickHeight=r,this.webgl.extensions.drawBuffers?(this.objectPickTexture.define(this.pickWidth,this.pickHeight),this.instancePickTexture.define(this.pickWidth,this.pickHeight),this.groupPickTexture.define(this.pickWidth,this.pickHeight),this.depthPickTexture.define(this.pickWidth,this.pickHeight),this.depthTexture.define(this.pickWidth,this.pickHeight)):(this.objectPickTarget.setSize(this.pickWidth,this.pickHeight),this.instancePickTarget.setSize(this.pickWidth,this.pickHeight),this.groupPickTarget.setSize(this.pickWidth,this.pickHeight),this.depthPickTarget.setSize(this.pickWidth,this.pickHeight)))}renderVariant(e,t,r,n,i,a){e.clear(!1),e.update(t,r),e.renderPick(r.primitives,t,i,null,a),n.handle.isEnabled&&e.renderPick(n.handle.scene,t,i,null,a),n.camera.isEnabled&&(n.camera.update(t),e.update(n.camera.camera,n.camera.scene),e.renderPick(n.camera.scene,n.camera.camera,i,null,a))}render(e,t,r,n){this.webgl.extensions.drawBuffers?(this.framebuffer.bind(),this.renderVariant(e,t,r,n,"pick",rW.None)):(this.objectPickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Object),this.instancePickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Instance),this.groupPickTarget.bind(),this.renderVariant(e,t,r,n,"pick",rW.Group),this.depthPickTarget.bind(),this.renderVariant(e,t,r,n,"depth",rW.None))}}class XU{setupBuffers(){let e=this.pickWidth*this.pickHeight*4;this.objectBuffer&&this.objectBuffer.length===e||(this.objectBuffer=new Uint8Array(e),this.instanceBuffer=new Uint8Array(e),this.groupBuffer=new Uint8Array(e),this.depthBuffer=new Uint8Array(e))}setViewport(e,t,r,n){q1.set(this.viewport,e,t,r,n),this.pickRatio=this.pickPass.pickRatio,this.pickX=Math.ceil(e*this.pickRatio),this.pickY=Math.ceil(t*this.pickRatio);let i=Math.floor(r*this.pickRatio),a=Math.floor(n*this.pickRatio);(i!==this.pickWidth||a!==this.pickHeight)&&(this.pickWidth=i,this.pickHeight=a,this.halfPickWidth=Math.floor(this.pickWidth/2),this.setupBuffers()),this.spiral=function(e){let t=0,r=0,n=2*e+1,i=n/2,a=[];for(let e=Math.pow(n,2);e>0;--e)-i<t&&t<=i&&-i<r&&r<=i&&a.push([t,r]),(t===r||t<0&&t===-r||t>0&&t===1-r)&&([0,-1]=[1,0]),t+=0,r+=-1;return a}(Math.round(this.pickRatio*this.pickPadding))}syncBuffers(){let{pickX:e,pickY:t,pickWidth:r,pickHeight:n}=this;this.pickPass.bindObject(),this.webgl.readPixels(e,t,r,n,this.objectBuffer),this.pickPass.bindInstance(),this.webgl.readPixels(e,t,r,n,this.instanceBuffer),this.pickPass.bindGroup(),this.webgl.readPixels(e,t,r,n,this.groupBuffer),this.pickPass.bindDepth(),this.webgl.readPixels(e,t,r,n,this.depthBuffer)}getBufferIdx(e,t){return(t*this.pickWidth+e)*4}getDepth(e,t){var r,n,i,a;let o=this.getBufferIdx(e,t),s=this.depthBuffer;return r=s[o],n=s[o+1],i=s[o+2],a=s[o+3],iq.set(Mm,r/255,n/255,i/255,a/255),iq.dot(Mm,Mf)}getId(e,t,r){let n=this.getBufferIdx(e,t);return Md(r[n],r[n+1],r[n+2])}render(e){let{pickX:t,pickY:r,pickWidth:n,pickHeight:i,halfPickWidth:a}=this,{renderer:o,scene:s,helper:l}=this;o.setTransparentBackground(!1),o.setDrawingBufferSize(n,i),o.setPixelRatio(this.pickRatio),XR.is(e)?(o.setViewport(t,r,a,i),this.pickPass.render(o,e.left,s,l),o.setViewport(t+a,r,n-a,i),this.pickPass.render(o,e.right,s,l)):(o.setViewport(t,r,n,i),this.pickPass.render(o,e,s,l)),this.dirty=!1}identifyInternal(e,t,r){let{webgl:n,pickRatio:i}=this;if(n.isContextLost)return;e*=n.pixelRatio,t*=n.pixelRatio,t=this.pickPass.drawingBufferHeight-t;let{viewport:a}=this;if(e<a.x||t<a.y||e>a.x+a.width||t>a.y+a.height)return;this.dirty&&(this.render(r),this.syncBuffers());let o=e-a.x,s=t-a.y,l=Math.floor(o*i),u=Math.floor(s*i),c=this.getId(l,u,this.objectBuffer);if(-1===c||16777214===c)return;let d=this.getId(l,u,this.instanceBuffer);if(-1===d||16777214===d)return;let p=this.getId(l,u,this.groupBuffer);if(-1===p||16777214===p)return;let h=this.getDepth(l,u),f=iz.create(e,t,h);if(XR.is(r)){let t=Math.floor(a.width/2);e>a.x+t?(f[0]=a.x+(o-t)*2,q3(f,f,a,r.right.inverseProjectionView)):(f[0]=a.x+2*o,q3(f,f,a,r.left.inverseProjectionView))}else q3(f,f,a,r.inverseProjectionView);return{id:{objectId:c,instanceId:d,groupId:p},position:f}}identify(e,t,r){for(let n of this.spiral){let i=this.identifyInternal(e+n[0],t+n[1],r);if(i)return i}}constructor(e,t,r,n,i,a,o=1){this.webgl=e,this.renderer=t,this.scene=r,this.helper=n,this.pickPass=i,this.pickPadding=o,this.dirty=!0,this.viewport=q1(),this.setViewport(a.x,a.y,a.width,a.height)}}let Xz=`
SyntaxError: Invalid destructuring assignment target
at internalCompileFunction (node:internal/vm:77:18)
at wrapSafe (node:internal/modules/cjs/loader:1288:20)
at Module._compile (node:internal/modules/cjs/loader:1340:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1435:10)
at Module.load (node:internal/modules/cjs/loader:1207:32)
at Module._load (node:internal/modules/cjs/loader:1023:12)
at Module.require (node:internal/modules/cjs/loader:1235:19)
at mod.require (/home/cdiesh/my-app/node_modules/next/dist/server/require-hook.js:65:28)
at require (node:internal/modules/helpers:176:18)
at requirePage (/home/cdiesh/my-app/node_modules/next/dist/server/require.js:109:84)
> Build error occurred
Error: Failed to collect page data for /
at /home/cdiesh/my-app/node_modules/next/dist/build/utils.js:1258:15
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
type: 'Error'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
from molstar.
now that I look at it, maybe the code actually has a syntax error with that "let Xz" directly following the }
curly...could report to nextjs
from molstar.
similar bug posted here suggests swcMinify:false and I think that does fix it for me. they should probably fix it upstream in swc vercel/next.js#52373
Wow that helps. Thanks for sharing this!!!
from molstar.
Related Issues (20)
- vol*: rendering oblique plane through volumes
- vol*: multiple volume viewer (non simultaneous)
- vol*: linked orthoviews
- vol*: overlays of volumes and segmentations HOT 2
- vol*: interactive 3D label painting
- Display the "msp-sequence-missing" CSS class residues HOT 2
- Question: How to visualize docking outputs in embedded HTML? HOT 6
- How do you set up the entity sequence displayed in the sequence panel? HOT 1
- does tests/browser/render_spheres work? HOT 3
- vol*: 3D slicer
- Issue using Global Bumpiness !== 0 and Layer level Bumpiness === 0
- How can I choose the entity sequence shown in the sequence panel? HOT 1
- custom focus behavior - hide ribbon representation HOT 7
- Blooming is applied to the axis helper HOT 1
- Bloom effect discussion HOT 2
- Split-up large draw calls
- Q: how can you get the volume outline? HOT 6
- Apply TransformStructureConformation on StructureSelection (subset) HOT 13
- Occlusion issue on edges HOT 8
- molstar-render issue - no `gl` HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from molstar.