Fix some tiny bugs #6012

localDev/lights.json

@@ -0,0 +1,670 @@
+{
+  "tags": null,
+  "id": "dummy node",
+  "uniqueId": 78,
+  "name": "dummy node",
+  "checkReadyOnEveryCall": false,
+  "checkReadyOnlyOnce": false,
+  "state": "",
+  "alpha": 1,
+  "backFaceCulling": true,
+  "sideOrientation": 1,
+  "alphaMode": 2,
+  "_needDepthPrePass": false,
+  "disableDepthWrite": false,
+  "forceDepthWrite": false,
+  "separateCullingPass": false,
+  "fogEnabled": true,
+  "pointSize": 1,
+  "zOffset": 0,
+  "wireframe": false,
+  "pointsCloud": false,
+  "fillMode": 0,
+  "customType": "BABYLON.NodeMaterial",
+  "outputNodes": [
+    84,
+    93,
+    94
+  ],
+  "blocks": [
+    {
+      "customType": "BABYLON.VertexOutputBlock",
+      "id": 84,
+      "name": "vertexOutput",
+      "inputs": [
+        {
+          "name": "vector",
+          "inputName": "vector",
+          "targetBlockId": 83,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.TransformBlock",
+      "id": 83,
+      "name": "worldPos * viewProjectionTransform",
+      "inputs": [
+        {
+          "name": "vector",
+          "inputName": "vector",
+          "targetBlockId": 81,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "transform",
+          "inputName": "transform",
+          "targetBlockId": 82,
+          "targetConnectionName": "output"
+        }
+      ],
+      "complementZ": 0,
+      "complementW": 1
+    },
+    {
+      "customType": "BABYLON.TransformBlock",
+      "id": 81,
+      "name": "worldPos",
+      "inputs": [
+        {
+          "name": "vector",
+          "inputName": "vector",
+          "targetBlockId": 79,
+          "targetConnectionName": "positionOutput"
+        },
+        {
+          "name": "transform",
+          "inputName": "transform",
+          "targetBlockId": 80,
+          "targetConnectionName": "output"
+        }
+      ],
+      "complementZ": 0,
+      "complementW": 1
+    },
+    {
+      "customType": "BABYLON.MorphTargetsBlock",
+      "id": 79,
+      "name": "morphTargets",
+      "inputs": [
+        {
+          "name": "position",
+          "inputName": "position",
+          "targetBlockId": 95,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "normal",
+          "inputName": "normal",
+          "targetBlockId": 96,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "tangent",
+          "inputName": "tangent",
+          "targetBlockId": 97,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "uv",
+          "inputName": "uv",
+          "targetBlockId": 98,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 95,
+      "name": "position",
+      "inputs": [],
+      "type": 8,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 96,
+      "name": "normal",
+      "inputs": [],
+      "type": 8,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 97,
+      "name": "tangent",
+      "inputs": [],
+      "type": 8,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 98,
+      "name": "uv",
+      "inputs": [],
+      "type": 4,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.BonesBlock",
+      "id": 80,
+      "name": "bonesBlock",
+      "inputs": [
+        {
+          "name": "matricesIndices",
+          "inputName": "matricesIndices",
+          "targetBlockId": 99,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "matricesWeights",
+          "inputName": "matricesWeights",
+          "targetBlockId": 100,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "matricesIndicesExtra"
+        },
+        {
+          "name": "matricesWeightsExtra"
+        },
+        {
+          "name": "world",
+          "inputName": "world",
+          "targetBlockId": 101,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 99,
+      "name": "matricesIndices",
+      "inputs": [],
+      "type": 16,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 100,
+      "name": "matricesWeights",
+      "inputs": [],
+      "type": 16,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 101,
+      "name": "world",
+      "inputs": [],
+      "type": 128,
+      "mode": 0,
+      "wellKnownValue": 1,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 82,
+      "name": "viewProjection",
+      "inputs": [],
+      "type": 128,
+      "mode": 0,
+      "wellKnownValue": 4,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.FogBlock",
+      "id": 93,
+      "name": "fog",
+      "inputs": [
+        {
+          "name": "worldPosition",
+          "inputName": "worldPosition",
+          "targetBlockId": 81,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "view",
+          "inputName": "view",
+          "targetBlockId": 102,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "input",
+          "inputName": "input",
+          "targetBlockId": 92,
+          "targetConnectionName": "rgb"
+        },
+        {
+          "name": "fogColor",
+          "inputName": "fogColor",
+          "targetBlockId": 103,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 102,
+      "name": "view",
+      "inputs": [],
+      "type": 128,
+      "mode": 0,
+      "wellKnownValue": 2,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.ColorSplitterBlock",
+      "id": 92,
+      "name": "color4 splitter",
+      "inputs": [
+        {
+          "name": "rgba"
+        },
+        {
+          "name": "rgb ",
+          "inputName": "rgb ",
+          "targetBlockId": 491,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.MultiplyBlock",
+      "id": 491,
+      "name": "Multiply",
+      "inputs": [
+        {
+          "name": "left",
+          "inputName": "left",
+          "targetBlockId": 86,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "right",
+          "inputName": "right",
+          "targetBlockId": 255,
+          "targetConnectionName": "diffuseOutput"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.MultiplyBlock",
+      "id": 86,
+      "name": "color multiplier",
+      "inputs": [
+        {
+          "name": "left",
+          "inputName": "left",
+          "targetBlockId": 87,
+          "targetConnectionName": "rgb"
+        },
+        {
+          "name": "right",
+          "inputName": "right",
+          "targetBlockId": 89,
+          "targetConnectionName": "rgb"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.TextureBlock",
+      "id": 87,
+      "name": "diffuseTexture",
+      "inputs": [
+        {
+          "name": "uv",
+          "inputName": "uv",
+          "targetBlockId": 98,
+          "targetConnectionName": "output"
+        }
+      ],
+      "texture": {
+        "tags": null,
+        "url": "/playground/textures/bloc.jpg",
+        "uOffset": 0,
+        "vOffset": 0,
+        "uScale": 1,
+        "vScale": 1,
+        "uAng": 0,
+        "vAng": 0,
+        "wAng": 0,
+        "uRotationCenter": 0.5,
+        "vRotationCenter": 0.5,
+        "wRotationCenter": 0.5,
+        "isBlocking": true,
+        "uniqueId": 88,
+        "name": "/playground/textures/bloc.jpg",
+        "hasAlpha": false,
+        "getAlphaFromRGB": false,
+        "level": 1,
+        "coordinatesIndex": 0,
+        "coordinatesMode": 0,
+        "wrapU": 1,
+        "wrapV": 1,
+        "wrapR": 1,
+        "anisotropicFilteringLevel": 4,
+        "isCube": false,
+        "is3D": false,
+        "gammaSpace": true,
+        "invertZ": false,
+        "lodLevelInAlpha": false,
+        "lodGenerationOffset": 0,
+        "lodGenerationScale": 0,
+        "linearSpecularLOD": false,
+        "isRenderTarget": false,
+        "animations": [],
+        "invertY": true,
+        "samplingMode": 3
+      }
+    },
+    {
+      "customType": "BABYLON.TextureBlock",
+      "id": 89,
+      "name": "diffuseTexture2",
+      "inputs": [
+        {
+          "name": "uv",
+          "inputName": "uv",
+          "targetBlockId": 98,
+          "targetConnectionName": "output"
+        }
+      ],
+      "texture": {
+        "tags": null,
+        "url": "/playground/textures/crate.png",
+        "uOffset": 0,
+        "vOffset": 0,
+        "uScale": 1,
+        "vScale": 1,
+        "uAng": 0,
+        "vAng": 0,
+        "wAng": 0,
+        "uRotationCenter": 0.5,
+        "vRotationCenter": 0.5,
+        "wRotationCenter": 0.5,
+        "isBlocking": true,
+        "uniqueId": 90,
+        "name": "/playground/textures/crate.png",
+        "hasAlpha": false,
+        "getAlphaFromRGB": false,
+        "level": 1,
+        "coordinatesIndex": 0,
+        "coordinatesMode": 0,
+        "wrapU": 1,
+        "wrapV": 1,
+        "wrapR": 1,
+        "anisotropicFilteringLevel": 4,
+        "isCube": false,
+        "is3D": false,
+        "gammaSpace": true,
+        "invertZ": false,
+        "lodLevelInAlpha": false,
+        "lodGenerationOffset": 0,
+        "lodGenerationScale": 0,
+        "linearSpecularLOD": false,
+        "isRenderTarget": false,
+        "animations": [],
+        "invertY": true,
+        "samplingMode": 3
+      }
+    },
+    {
+      "customType": "BABYLON.LightBlock",
+      "id": 255,
+      "name": "Lights",
+      "inputs": [
+        {
+          "name": "worldPosition",
+          "inputName": "worldPosition",
+          "targetBlockId": 81,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "worldNormal",
+          "inputName": "worldNormal",
+          "targetBlockId": 418,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "cameraPosition",
+          "inputName": "cameraPosition",
+          "targetBlockId": 256,
+          "targetConnectionName": "output"
+        }
+      ]
+    },
+    {
+      "customType": "BABYLON.TransformBlock",
+      "id": 418,
+      "name": "Transform",
+      "inputs": [
+        {
+          "name": "vector",
+          "inputName": "vector",
+          "targetBlockId": 409,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "transform",
+          "inputName": "transform",
+          "targetBlockId": 80,
+          "targetConnectionName": "output"
+        }
+      ],
+      "complementZ": 0,
+      "complementW": 1
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 409,
+      "name": "normal",
+      "inputs": [],
+      "type": 8,
+      "mode": 1,
+      "wellKnownValue": null,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 256,
+      "name": "cameraPosition",
+      "inputs": [],
+      "type": 8,
+      "mode": 0,
+      "wellKnownValue": 7,
+      "animationType": 0,
+      "visibleInInspector": false
+    },
+    {
+      "customType": "BABYLON.InputBlock",
+      "id": 103,
+      "name": "fogColor",
+      "inputs": [],
+      "type": 32,
+      "mode": 0,
+      "wellKnownValue": 8,
+      "animationType": 0,
+      "visibleInInspector": false,
+      "valueType": "BABYLON.Color3",
+      "value": [
+        1,
+        1,
+        1
+      ]
+    },
+    {
+      "customType": "BABYLON.FragmentOutputBlock",
+      "id": 94,
+      "name": "pixelOutput",
+      "inputs": [
+        {
+          "name": "rgba"
+        },
+        {
+          "name": "rgb",
+          "inputName": "rgb",
+          "targetBlockId": 93,
+          "targetConnectionName": "output"
+        },
+        {
+          "name": "a"
+        }
+      ]
+    }
+  ],
+  "locations": [
+    {
+      "blockId": 84,
+      "x": 1500,
+      "y": 399
+    },
+    {
+      "blockId": 83,
+      "x": 1250,
+      "y": 386
+    },
+    {
+      "blockId": 81,
+      "x": 1000,
+      "y": 396
+    },
+    {
+      "blockId": 79,
+      "x": 750,
+      "y": 137.5
+    },
+    {
+      "blockId": 95,
+      "x": 500,
+      "y": 0
+    },
+    {
+      "blockId": 96,
+      "x": 500,
+      "y": 158
+    },
+    {
+      "blockId": 97,
+      "x": 500,
+      "y": 316
+    },
+    {
+      "blockId": 98,
+      "x": 0,
+      "y": 691
+    },
+    {
+      "blockId": 80,
+      "x": 750,
+      "y": 501
+    },
+    {
+      "blockId": 99,
+      "x": 500,
+      "y": 494
+    },
+    {
+      "blockId": 100,
+      "x": 500,
+      "y": 652
+    },
+    {
+      "blockId": 101,
+      "x": 500,
+      "y": 810
+    },
+    {
+      "blockId": 82,
+      "x": 1000,
+      "y": 704
+    },
+    {
+      "blockId": 94,
+      "x": 1500,
+      "y": 973
+    },
+    {
+      "blockId": 93,
+      "x": 1250,
+      "y": 916
+    },
+    {
+      "blockId": 102,
+      "x": 1000,
+      "y": 862
+    },
+    {
+      "blockId": 92,
+      "x": 1000,
+      "y": 1020
+    },
+    {
+      "blockId": 86,
+      "x": 519.7647058823529,
+      "y": 965.1764705882352
+    },
+    {
+      "blockId": 87,
+      "x": 250,
+      "y": 701.5
+    },
+    {
+      "blockId": 89,
+      "x": 250,
+      "y": 1056
+    },
+    {
+      "blockId": 103,
+      "x": 1000,
+      "y": 1322
+    },
+    {
+      "blockId": 255,
+      "x": 452.0588235294116,
+      "y": 1241.0588235294117
+    },
+    {
+      "blockId": 256,
+      "x": 221.05882352941177,
+      "y": 1607.1176470588236
+    },
+    {
+      "blockId": 409,
+      "x": 21.82147288123261,
+      "y": 1389.5119468766763
+    },
+    {
+      "blockId": 418,
+      "x": 333.8214728812328,
+      "y": 1361.2766527590293
+    },
+    {
+      "blockId": 491,
+      "x": 770.0567669988801,
+      "y": 1040.8060645237351
+    }
+  ]
+}

nodeEditor/src/components/diagram/trigonometry/trigonometryNodePropertyComponent.tsx

@@ -36,11 +36,13 @@ export class TrigonometryPropertyTabComponentProps extends React.Component<ITrig
         return (
             <div>
                 <LineContainerComponent title="GENERAL">
-                    <TextInputLineComponent globalState={this.props.globalState} label="Name" propertyName="name" target={trigonometryBlock} onChange={() => this.props.globalState.onUpdateRequiredObservable.notifyObservers()} />
+                    <TextInputLineComponent globalState={this.props.globalState} label="Name" propertyName="name" target={trigonometryBlock} onChange={() => {
+                        this.props.globalState.onUpdateRequiredObservable.notifyObservers();
+                    }} />
                     <TextLineComponent label="Type" value={trigonometryBlock.getClassName()} />
                 </LineContainerComponent>
                 <LineContainerComponent title="PROPERTIES">  
-                    <OptionsLineComponent label="Operation" valuesAreStrings={true} options={operationOptions} target={trigonometryBlock} propertyName="operation" onSelect={(value: any) => {
+                    <OptionsLineComponent label="Operation" options={operationOptions} target={trigonometryBlock} propertyName="operation" onSelect={(value: any) => {
                         this.forceUpdate();
                         this.props.globalState.onRebuildRequiredObservable.notifyObservers();
                     }} />                  

nodeEditor/src/components/nodeList/nodeList.scss

@@ -9,37 +9,11 @@
 
     .panes {
         overflow: hidden;
-
-        .filter {
-            display: flex;
-            align-items: stretch;
-    
-            input {
-                width: 100%;
-                margin: 10px 10px 5px 10px;
-                display: block;
-                border: none;
-                padding: 0;
-                border-bottom: solid 1px rgb(51, 122, 183);
-                background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, rgb(51, 122, 183) 4%);
-                background-position: -1000px 0;
-                background-size: 1000px 100%;
-                background-repeat: no-repeat;  
-                color:white;    
-            }
-    
-            input:focus  {
-                box-shadow: none;
-                outline: none;
-                background-position: 0 0;
-            }
-        }
         
         .pane {
             color: white;
 
-            overflow-x: hidden;
-            overflow-y: auto;
+            overflow: hidden;
             height: 100%;
 
             -webkit-user-select: none; 
@@ -47,99 +21,130 @@
             -ms-user-select: none;    
             user-select: none;     
 
-            .underline {
-                border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);
+            .filter {
+                display: flex;
+                align-items: stretch;
+        
+                input {
+                    width: 100%;
+                    margin: 10px 10px 5px 10px;
+                    display: block;
+                    border: none;
+                    padding: 0;
+                    border-bottom: solid 1px rgb(51, 122, 183);
+                    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, rgb(51, 122, 183) 4%);
+                    background-position: -1000px 0;
+                    background-size: 1000px 100%;
+                    background-repeat: no-repeat;  
+                    color:white;    
+                }
+        
+                input:focus  {
+                    box-shadow: none;
+                    outline: none;
+                    background-position: 0 0;
+                }
             }
 
-            .draggableLine {
-                height: 30px;
-                display: grid;
-                align-items: center;
-                justify-items: stretch;
-                background: #222222;
-                cursor: grab;
-                text-align: center;
-                margin: 0;
-                box-sizing: border-box;
-
-                &:hover {
-                    background: rgb(51, 122, 183);
-                    color: white;
+            .list-container {
+                overflow-x: hidden;
+                overflow-y: auto;
+                height: 100%;
+
+                .underline {
+                    border-bottom: 0.5px solid rgba(255, 255, 255, 0.5);
                 }
-            }
-        
-            .buttonLine {
-                height: 30px;
-                display: grid;
-                align-items: center;
-                justify-items: stretch;
 
-                button {
+                .draggableLine {
+                    height: 30px;
+                    display: grid;
+                    align-items: center;
+                    justify-items: stretch;
                     background: #222222;
-                    margin: 5px 10px 5px 10px;
-                    color:white;
-                    padding: 4px 5px;
-                    opacity: 0.9;
+                    cursor: grab;
+                    text-align: center;
+                    margin: 0;
+                    box-sizing: border-box;
+
+                    &:hover {
+                        background: rgb(51, 122, 183);
+                        color: white;
+                    }
                 }
+            
+                .buttonLine {
+                    height: 30px;
+                    display: grid;
+                    align-items: center;
+                    justify-items: stretch;
+
+                    button {
+                        background: #222222;
+                        margin: 5px 10px 5px 10px;
+                        color:white;
+                        padding: 4px 5px;
+                        opacity: 0.9;
+                    }
+
+                    button:hover {
+                        opacity: 1.0;
+                    }
 
-                button:hover {
-                    opacity: 1.0;
+                    button:active {
+                        background: #282828;
+                    }   
+                    
+                    button:focus {
+                        outline: 0px;
+                    }  
                 }
 
-                button:active {
-                    background: #282828;
-                }   
-                
-                button:focus {
-                    outline: 0px;
-                }  
-            }
+                .paneContainer {
+                    margin-top: 3px;
+                    display:grid;
+                    grid-template-rows: 100%;
+                    grid-template-columns: 100%;
+
+                    .paneContainer-content {
+                        grid-row: 1;
+                        grid-column: 1;
+
+                        .header {
+                            display: grid;
+                            grid-template-columns: 1fr auto;
+                            background: #555555;    
+                            height: 30px;   
+                            padding-right: 5px;                        
+                            cursor: pointer;
+                            
+                            .title {                                
+                                border-left: 3px solid transparent;
+                                padding-left: 5px;
+                                grid-column: 1;
+                                display: flex;
+                                align-items: center;
+                            }
 
-            .paneContainer {
-                margin-top: 3px;
-                display:grid;
-                grid-template-rows: 100%;
-                grid-template-columns: 100%;
-
-                .paneContainer-content {
-                    grid-row: 1;
-                    grid-column: 1;
-
-                    .header {
-                        display: grid;
-                        grid-template-columns: 1fr auto;
-                        background: #555555;    
-                        height: 30px;   
-                        padding-right: 5px;                        
-                        cursor: pointer;
-                        
-                        .title {                                
-                            border-left: 3px solid transparent;
-                            padding-left: 5px;
-                            grid-column: 1;
-                            display: flex;
-                            align-items: center;
+                            .collapse {
+                                grid-column: 2;
+                                display: flex;
+                                align-items: center;  
+                                justify-items: center;
+                                transform-origin: center;
+
+                                &.closed {
+                                    transform: rotate(180deg);
+                                }
+                            }                        
                         }
 
-                        .collapse {
-                            grid-column: 2;
-                            display: flex;
-                            align-items: center;  
-                            justify-items: center;
-                            transform-origin: center;
-
-                            &.closed {
-                                transform: rotate(180deg);
-                            }
-                        }                        
-                    }
-
-                    .paneList > div:not(:last-child) {
-                        border-bottom: 1px solid rgba(255, 255, 255, 0.3);
+                        .paneList > div:not(:last-child) {
+                            border-bottom: 1px solid rgba(255, 255, 255, 0.3);
+                        }
                     }
                 }
-            }
-        }    
+            }    
+        }
     }
 }
 

nodeEditor/src/components/nodeList/nodeListComponent.tsx

@@ -65,7 +65,9 @@ export class NodeListComponent extends React.Component<INodeListComponentProps,
                         <div className="filter">
                             <input type="text" placeholder="Filter" onChange={(evt) => this.filterContent(evt.target.value)} />
                         </div>
-                        {blockMenu}
+                        <div className="list-container">
+                            {blockMenu}
+                        </div>
                     </div>
                 </div>
             </div>

nodeEditor/src/components/propertyTab/propertyTab.scss

@@ -11,7 +11,7 @@
         grid-row: 1;
         text-align: center;
         display: grid;
-        grid-template-columns: 30px 1fr 20px;        
+        grid-template-columns: 30px 1fr;        
         -webkit-user-select: none; 
         -moz-user-select: none;   
         -ms-user-select: none;    

nodeEditor/src/main.scss

@@ -43,6 +43,8 @@
     display: grid;
     grid-template-rows: 1fr 30px auto;
     grid-template-columns: 100%;
+    height: 100%;
+    overflow-y: auto;
 
     #propertyTab {
         grid-row: 1;

src/Materials/Node/Blocks/trigonometryBlock.ts

@@ -85,7 +85,7 @@ export class TrigonometryBlock extends NodeMaterialBlock {
                 operation = "sin";
                 break;
             }
-            case TrigonometryBlockOperations.Cos: {
+            case TrigonometryBlockOperations.Abs: {
                 operation = "abs";
                 break;
             }

src/Materials/Node/nodeMaterialBlockConnectionPoint.ts

@@ -41,7 +41,7 @@ export class NodeMaterialConnectionPoint {
             return (this._ownerBlock as InputBlock).associatedVariableName;
         }
 
-        if (!this._enforceAssociatedVariableName && this._connectedPoint) {
+        if ((!this._enforceAssociatedVariableName || !this._associatedVariableName) && this._connectedPoint) {
             return this._connectedPoint.associatedVariableName;
         }