sunrize 1.11.2 → 1.11.4

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "sunrize",
   "productName": "Sunrize X3D Editor",
-  "version": "1.11.2",
+  "version": "1.11.4",
   "description": "A Multi-Platform X3D Editor",
   "main": "src/main.js",
   "bin": {
@@ -91,7 +91,7 @@
     "@vscode/codicons": "^0.0.41",
     "capitalize": "^2.0.4",
     "console": "^0.7.2",
-    "electron": "^38.3.0",
+    "electron": "^39.0.0",
     "electron-prompt": "^1.7.0",
     "electron-squirrel-startup": "^1.0.1",
     "electron-tabs": "^1.0.4",
@@ -100,7 +100,7 @@
     "jquery-ui-dist": "^1.13.3",
     "jstree": "^3.3.17",
     "material-icons": "^1.13.14",
-    "material-symbols": "^0.37.0",
+    "material-symbols": "^0.38.0",
     "md5": "^2.3.0",
     "mime-types": "^3.0.1",
     "monaco-editor": "^0.54.0",
@@ -110,7 +110,7 @@
     "string-similarity": "^4.0.4",
     "tweakpane": "^3.1.10",
     "update-electron-app": "^3.1.1",
-    "x_ite": "^12.1.2",
+    "x_ite": "^12.1.4",
     "x3d-traverse": "^1.0.22"
   }
 }

package/src/Editors/Console.js

@@ -124,7 +124,7 @@ module .exports = class Console extends Interface
       // Input
 
       this .textarea = $("<textarea></textarea>")
-         .attr ("placeholder", _("Evaluate X3D Script code here, e.g. type `Browser.name`."))
+         .attr ("placeholder", _("Evaluate Script node code here, e.g. type `Browser.name`."))
          .attr ("tabindex", 0)
          .on ("keydown", event => this .onkeydown (event))
          .on ("keyup", event => this .onkeyup (event))

package/src/Editors/OutlineView.js

@@ -368,6 +368,7 @@ module .exports = class OutlineView extends Interface
    expandSceneSubtreeComplete (specialElements, elements)
    {
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
 
       // Reopen externprotos, protos, imported, exported nodes.
 
@@ -846,7 +847,8 @@ module .exports = class OutlineView extends Interface
 
    expandNodeComplete (protos, scenes, elements)
    {
-      this .requestUpdateRouteGraph ()
+      this .requestUpdateRouteGraph ();
+      this .updateQtips ();
 
       // Auto expand SFNodes
 
@@ -854,12 +856,12 @@ module .exports = class OutlineView extends Interface
       {
          const
             element = $(e),
-            field   = this .getField (element)
+            field   = this .getField (element);
 
          if (field .getValue ())
          {
-            element .data ("auto-expand", true)
-            element .jstree ("open_node", element)
+            element .data ("auto-expand", true);
+            element .jstree ("open_node", element);
          }
       }
 
@@ -869,12 +871,12 @@ module .exports = class OutlineView extends Interface
       {
          const
             element = $(e),
-            field   = this .getField (element)
+            field   = this .getField (element);
 
          if (field .length && field .length <= this .autoExpandMaxChildren)
          {
-            element .data ("auto-expand", true)
-            element .jstree ("open_node", element)
+            element .data ("auto-expand", true);
+            element .jstree ("open_node", element);
          }
       }
 
@@ -884,11 +886,11 @@ module .exports = class OutlineView extends Interface
       {
          const
             element = $(e),
-            node    = this .getNode (element)
+            node    = this .getNode (element);
 
          if (node .getUserData (_expanded) && element .jstree ("is_closed", element))
          {
-            element .jstree ("open_node", element)
+            element .jstree ("open_node", element);
          }
       }
 
@@ -898,12 +900,12 @@ module .exports = class OutlineView extends Interface
       {
          const
             element = $(e),
-            scene   = this .getNode (element)
+            scene   = this .getNode (element);
 
          if (scene .getUserData (_expanded) && element .jstree ("is_closed", element))
          {
-            element .data ("auto-expand", true)
-            element .jstree ("open_node", element)
+            element .data ("auto-expand", true);
+            element .jstree ("open_node", element);
          }
       }
 
@@ -913,12 +915,12 @@ module .exports = class OutlineView extends Interface
       {
          const
             element = $(e),
-            field   = this .getField (element)
+            field   = this .getField (element);
 
          if (field .getUserData (_expanded) && element .jstree ("is_closed", element))
          {
-            element .data ("auto-expand", true)
-            element .jstree ("open_node", element)
+            element .data ("auto-expand", true);
+            element .jstree ("open_node", element);
          }
       }
    }
@@ -1862,7 +1864,7 @@ module .exports = class OutlineView extends Interface
    {
       const
          name    = $(event .currentTarget),
-         element = $(event .currentTarget) .closest (".externproto, .proto, .node, .special", this .sceneGraph),
+         element = name .closest (".externproto, .proto, .node, .imported-node, .exported-node", this .sceneGraph),
          node    = this .objects .get (parseInt (element .attr ("node-id")));
 
       // Handle NULL node element.
@@ -1878,7 +1880,7 @@ module .exports = class OutlineView extends Interface
    {
       const
          name         = $(event .currentTarget),
-         element      = $(event .currentTarget) .closest (".field, .special", this .sceneGraph),
+         element      = name .closest (".field, .special", this .sceneGraph),
          node         = this .objects .get (parseInt (element .attr ("node-id"))),
          field        = this .objects .get (parseInt (element .attr ("field-id"))),
          fieldElement = X3DUOM .find (`ConcreteNode[name="${node .getTypeName ()}"] field[name="${field .getName ()}"]`);
@@ -2218,6 +2220,7 @@ module .exports = class OutlineView extends Interface
       }
 
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    expandSFNode (parent, node, field, type, full)
@@ -2299,6 +2302,7 @@ module .exports = class OutlineView extends Interface
       }
 
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    nodeIcons = new Map ([
@@ -2390,7 +2394,9 @@ module .exports = class OutlineView extends Interface
       // Expand children.
 
       child .show ();
+
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    onkeydownField (input, event)
@@ -2495,8 +2501,10 @@ module .exports = class OutlineView extends Interface
 
       // Expand children.
 
-      child .show ()
-      this .requestUpdateRouteGraph ()
+      child .show ();
+
+      this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    onkeydownArrayField (textarea, event)
@@ -2905,6 +2913,7 @@ module .exports = class OutlineView extends Interface
          element .jstree ("open_node", element);
 
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    removeSubtree (element)
@@ -3716,6 +3725,7 @@ module .exports = class OutlineView extends Interface
    onresize ()
    {
       this .requestUpdateRouteGraph ();
+      this .updateQtips ();
    }
 
    addFieldButtons (parent, child, node)
@@ -3819,6 +3829,11 @@ module .exports = class OutlineView extends Interface
       // Update route graph.
    }
 
+   updateQtips ()
+   {
+      this .sceneGraph .find ("[data-hasqtip]") .qtip ?.("reposition");
+   }
+
    onDragStartExternProto () { }
 
    onDragStartProto () { }

package/src/Editors/ScriptEditor.js

@@ -139,6 +139,7 @@ module .exports = class ScriptEditor extends Interface
 
       // Setup.
 
+      this .addLanguages ();
       this .setup ();
    }
 
@@ -157,6 +158,178 @@ module .exports = class ScriptEditor extends Interface
       monaco .editor .setTheme (shouldUseDarkColors ? "vs-dark" : "vs-light");
    }
 
+   async addLanguages ()
+   {
+      const monaco = await this .getMonaco ();
+
+      const conf = {
+         comments: {
+            lineComment: '//',
+            blockComment: ['/*', '*/']
+         },
+         brackets: [
+            ['{', '}'],
+            ['[', ']'],
+            ['(', ')']
+         ],
+         autoClosingPairs: [
+            { open: '[', close: ']' },
+            { open: '{', close: '}' },
+            { open: '(', close: ')' },
+            { open: "'", close: "'", notIn: ['string', 'comment'] },
+            { open: '"', close: '"', notIn: ['string'] }
+         ],
+         surroundingPairs: [
+            { open: '{', close: '}' },
+            { open: '[', close: ']' },
+            { open: '(', close: ')' },
+            { open: '"', close: '"' },
+            { open: "'", close: "'" }
+         ]
+      };
+
+      const keywords = [
+         'const', 'uniform', 'break', 'continue',
+         'do', 'for', 'while', 'if', 'else', 'switch', 'case', 'in', 'out', 'inout', 'true', 'false',
+         'invariant', 'discard', 'return', 'sampler2D', 'samplerCube', 'sampler3D', 'struct',
+         'radians', 'degrees', 'sin', 'cos', 'tan', 'asin', 'acos', 'atan', 'pow', 'sinh', 'cosh', 'tanh', 'asinh', 'acosh', 'atanh',
+         'exp', 'log', 'exp2', 'log2', 'sqrt', 'inversesqrt', 'abs', 'sign', 'floor', 'ceil', 'round', 'roundEven', 'trunc', 'fract', 'mod', 'modf',
+         'min', 'max', 'clamp', 'mix', 'step', 'smoothstep', 'length', 'distance', 'dot', 'cross ',
+         'determinant', 'inverse', 'normalize', 'faceforward', 'reflect', 'refract', 'matrixCompMult', 'outerProduct', 'transpose', 'lessThan ',
+         'lessThanEqual', 'greaterThan', 'greaterThanEqual', 'equal', 'notEqual', 'any', 'all', 'not', 'packUnorm2x16', 'unpackUnorm2x16', 'packSnorm2x16', 'unpackSnorm2x16', 'packHalf2x16', 'unpackHalf2x16',
+         'dFdx', 'dFdy', 'fwidth', 'textureSize', 'texture', 'textureProj', 'textureLod', 'textureGrad', 'texelFetch', 'texelFetchOffset',
+         'textureProjLod', 'textureLodOffset', 'textureGradOffset', 'textureProjLodOffset', 'textureProjGrad', 'intBitsToFloat', 'uintBitsToFloat', 'floatBitsToInt', 'floatBitsToUint', 'isnan', 'isinf',
+         'vec2', 'vec3', 'vec4', 'ivec2', 'ivec3', 'ivec4', 'uvec2', 'uvec3', 'uvec4', 'bvec2', 'bvec3', 'bvec4',
+         'mat2', 'mat3', 'mat2x2', 'mat2x3', 'mat2x4', 'mat3x2', 'mat3x3', 'mat3x4', 'mat4x2', 'mat4x3', 'mat4x4', 'mat4',
+         'float', 'int', 'uint', 'void', 'bool',
+      ];
+
+      const language = {
+         tokenPostfix: '.glsl',
+         // Set defaultToken to invalid to see what you do not tokenize yet
+         defaultToken: 'invalid',
+         keywords,
+         operators: [
+            '=',
+            '>',
+            '<',
+            '!',
+            '~',
+            '?',
+            ':',
+            '==',
+            '<=',
+            '>=',
+            '!=',
+            '&&',
+            '||',
+            '++',
+            '--',
+            '+',
+            '-',
+            '*',
+            '/',
+            '&',
+            '|',
+            '^',
+            '%',
+            '<<',
+            '>>',
+            '>>>',
+            '+=',
+            '-=',
+            '*=',
+            '/=',
+            '&=',
+            '|=',
+            '^=',
+            '%=',
+            '<<=',
+            '>>=',
+            '>>>='
+         ],
+         symbols: /[=><!~?:&|+\-*\/\^%]+/,
+         escapes: /\\(?:[abfnrtv\\"']|x[0-9A-Fa-f]{1,4}|u[0-9A-Fa-f]{4}|U[0-9A-Fa-f]{8})/,
+         integersuffix: /([uU](ll|LL|l|L)|(ll|LL|l|L)?[uU]?)/,
+         floatsuffix: /[fFlL]?/,
+         encoding: /u|u8|U|L/,
+
+         tokenizer: {
+            root: [
+               // identifiers and keywords
+               [
+               /[a-zA-Z_]\w*/,
+               {
+                  cases: {
+                     '@keywords': { token: 'keyword.$0' },
+                     '@default': 'identifier'
+                  }
+               }
+               ],
+
+               // Preprocessor directive (#define)
+               [/^\s*#\s*\w+/, 'keyword.directive'],
+
+               // Version
+               [/#version\s+\d+\s+es/, 'keyword.directive'],
+
+               // whitespace
+               { include: '@whitespace' },
+
+               // delimiters and operators
+               [/[{}()\[\]]/, '@brackets'],
+               [/@symbols/, {
+               cases: {
+                  '@operators': 'operator',
+                  '@default': ''
+               }
+               }],
+
+               // numbers
+               [/\d*\d+[eE]([\-+]?\d+)?(@floatsuffix)/, 'number.float'],
+               [/\d*\.\d+([eE][\-+]?\d+)?(@floatsuffix)/, 'number.float'],
+               [/0[xX][0-9a-fA-F']*[0-9a-fA-F](@integersuffix)/, 'number.hex'],
+               [/0[0-7']*[0-7](@integersuffix)/, 'number.octal'],
+               [/0[bB][0-1']*[0-1](@integersuffix)/, 'number.binary'],
+               [/\d[\d']*\d(@integersuffix)/, 'number'],
+               [/\d(@integersuffix)/, 'number'],
+
+               // delimiter: after number because of .\d floats
+               [/[;,.]/, 'delimiter']
+            ],
+
+            comment: [
+               [/[^\/*]+/, 'comment'],
+               [/\/\*/, 'comment', '@push'],
+               ['\\*/', 'comment', '@pop'],
+               [/[\/*]/, 'comment']
+            ],
+
+            // Does it have strings?
+            string: [
+               [/[^\\"]+/, 'string'],
+               [/@escapes/, 'string.escape'],
+               [/\\./, 'string.escape.invalid'],
+               [/"/, {
+               token: 'string.quote',
+               bracket: '@close',
+               next: '@pop'
+               }]
+            ],
+
+            whitespace: [
+               [/[ \t\r\n]+/, 'white'],
+               [/\/\*/, 'comment', '@comment'],
+               [/\/\/.*$/, 'comment']
+            ]
+         }
+      };
+
+      monaco .languages .register ({ id: "glsl" });
+      monaco .languages .setMonarchTokensProvider ("glsl", language);
+      monaco .languages .setLanguageConfiguration ("glsl", conf);
+   }
+
    async setNode (node)
    {
       this .directOutputButton .hide ();
@@ -169,7 +342,7 @@ module .exports = class ScriptEditor extends Interface
          this .node ._loadState .removeFieldCallback (this);
 
          for (const field of this .node .getUserDefinedFields ())
-            field .removeInterest ("setDeclarations", this);
+            field .removeInterest ("updateDeclarations", this);
 
          switch (this .node .getTypeName ())
          {
@@ -258,7 +431,7 @@ module .exports = class ScriptEditor extends Interface
 
    #declarations;
 
-   setDeclarations (monaco)
+   updateDeclarations (monaco)
    {
       if (!this .node .getType () .includes (X3D .X3DConstants .Script))
          return;
@@ -362,6 +535,7 @@ module .exports = class ScriptEditor extends Interface
             declare const X3DField: typeof X3D. X3DField;
             declare const X3DArrayField: typeof X3D. X3DArrayField;
             ${Array .from (this .browser .fieldTypes)
+               .filter (type => !this .#internalTypes .has (type .type))
                .map (type => `declare const ${type .typeName}: typeof X3D .${type .typeName};`)
                .join ("\n")}
             declare const TRUE: true;
@@ -369,15 +543,15 @@ module .exports = class ScriptEditor extends Interface
             declare const NULL: null;
             declare function print (... args: any []): void;
             ${fields .join ("\n")};
-         `},
-      ]);
+         `,
+      }]);
    }
 
    editors = new Map ();
 
    languages = {
       "Script": "javascript",
-      "ShaderPart": "c",
+      "ShaderPart": "glsl",
    };
 
    async getEditor (node)
@@ -407,11 +581,11 @@ module .exports = class ScriptEditor extends Interface
 
       editor .viewState = editor .saveViewState ();
 
-      editor .onDidFocusEditorWidget (() => this .setDeclarations (monaco));
+      editor .onDidFocusEditorWidget (() => this .updateDeclarations (monaco));
       editor .onDidBlurEditorWidget (() => this .apply ());
       editor .onKeyDown (event => this .onKeyDown (event));
 
-      element .on ("mouseenter", () => this .setDeclarations (monaco));
+      element .on ("mouseenter", () => this .updateDeclarations (monaco));
       element .on ("contextmenu", () => this .showContextMenu ());
 
       // this .debugFindActions (editor)
@@ -795,13 +969,13 @@ main ()
             case X3D .X3DConstants .SFNode:
             case X3D .X3DConstants .MFNode:
             {
-               field .addInterest ("setDeclarations", this, monaco);
+               field .addInterest ("updateDeclarations", this, monaco);
                break;
             }
          }
       }
 
-      this .setDeclarations (monaco);
+      this .updateDeclarations (monaco);
    }
 
    toggleDirectOutput ()

package/src/assets/themes/default.css

@@ -345,7 +345,7 @@ tr.disabled ~ tr > td > div {
   height: var(--tabs-height);
   width: 100%;
   background: inherit;
-  z-index: 2000;
+  z-index: 200;
 }
 
 .ui-tabs.top > .ui-tabs-nav {
@@ -748,7 +748,7 @@ body.dark .dialog ::placeholder {
 }
 
 .dialog.ui-dialog {
-  z-index: 3000 !important;
+  z-index: 2000 !important;
 }
 
 .dialog.ui-dialog .ui-dialog-content {