sunrize 1.11.0 → 1.11.2

package/src/Editors/BrowserFrame.js

@@ -51,9 +51,10 @@ module .exports = new class BrowserFrame extends Dialog
 
       this .numerator = $("<input></input>")
          .attr ("type", "number")
+         .attr ("min", 1)
          .attr ("step", "1")
          .css ("width", "calc((100% - 20px) / 2)")
-         .on ("change", () => this .onchange ());
+         .on ("change input", () => this .onchange ());
 
       const slash = $("<span></span>")
          .css ({ "display": "inline-block", "width": "20px", "text-align": "center" })
@@ -61,9 +62,10 @@ module .exports = new class BrowserFrame extends Dialog
 
       this .denominator = $("<input></input>")
           .attr ("type", "number")
+         .attr ("min", 1)
           .attr ("step", "1")
           .css ("width", "calc((100% - 20px) / 2)")
-          .on ("change", () => this .onchange ());
+          .on ("change input", () => this .onchange ());
 
       $("<tr></tr>")
          .append ($("<th></th>")
@@ -91,7 +93,7 @@ module .exports = new class BrowserFrame extends Dialog
 
    configure ()
    {
-      super .configure ({ size: [400, 127] });
+      super .configure ({ size: [388, 147] });
 
       this .connect (Editor .getWorldInfo (this .browser .currentScene));
       this .updateInputs ();

package/src/Editors/Console.js

@@ -5,6 +5,7 @@ const
    $         = require ("jquery"),
    electron  = require ("electron"),
    Interface = require ("../Application/Interface"),
+   util      = require ("util"),
    _         = require ("../Application/GetText");
 
 module .exports = class Console extends Interface
@@ -31,34 +32,103 @@ module .exports = class Console extends Interface
       this .history            = [ ];
       this .addMessageCallback = this .addMessage .bind (this);
 
-      this .console   = element;
-      this .left      = $("<div></div>") .addClass ("console-left") .appendTo (this .console);
-      this .toolbar   = $("<div></div>") .addClass (["toolbar", "vertical-toolbar", "console-toolbar"]) .appendTo (this .console);
-      this .output    = $("<div></div>") .addClass (["console-output", "output"]) .attr ("tabindex", 0) .appendTo (this .left);
-      this .input     = $("<div></div>") .addClass ("console-input") .appendTo (this .left);
+      this .console = element;
+      this .left    = $("<div></div>") .addClass ("console-left") .appendTo (this .console);
+      this .toolbar = $("<div></div>") .addClass (["toolbar", "vertical-toolbar", "console-toolbar"]) .appendTo (this .console);
+
+      this .output = $("<div></div>")
+         .addClass (["console-output", "output"])
+         .attr ("tabindex", 0)
+         .on ("keydown", event => this .outputKey (event))
+         .appendTo (this .left);
+
+      this .input = $("<div></div>")
+         .addClass ("console-input")
+         .appendTo (this .left);
+
+      // Search Widget
+
+      this .search = $("<div></div>")
+         .addClass ("console-search")
+         .appendTo (this .left)
+         .hide ();
+
+      this .search .resizable({
+         handles: "w",
+         minWidth: 285,
+         resize: () => this .config .file .searchWidth = this .search .width (),
+      });
+
+      this .searchInputElements = $("<div></div>")
+         .addClass ("console-search-input-elements")
+         .appendTo (this .search);
+
+      this .searchInput = $("<input></input>")
+         .attr ("type", "text")
+         .attr ("placeholder", _("Find"))
+         .addClass ("console-search-input")
+         .on ("input", () => this .searchString ())
+         .on ("keydown", event => this .searchKey (event))
+         .appendTo (this .searchInputElements);
+
+      this .searchCaseSensitiveButton = $("<div></div>")
+         .addClass (["codicon", "codicon-case-sensitive", "console-search-case-sensitive"])
+         .on ("click", () => this .searchCaseSensitive (!this .config .file .searchCaseSensitive))
+         .appendTo (this .searchInputElements);
+
+      this .searchStatus = $("<div></div>")
+         .addClass ("console-search-status")
+         .text ("No results")
+         .appendTo (this .search);
+
+      this .searchPreviousButton = $("<div></div>")
+         .addClass (["search-previous", "codicon", "codicon-arrow-up", "disabled"])
+         .attr ("tabindex", 0)
+         .on ("click", () => this .searchPrevious ())
+         .appendTo (this .search);
+
+      this .searchNextButton = $("<div></div>")
+         .addClass (["search-next", "codicon", "codicon-arrow-down", "disabled"])
+         .attr ("tabindex", 0)
+         .on ("click", () => this .searchNext ())
+         .appendTo (this .search);
+
+      // Toolbar
+
+      this .searchButton = $("<span></span>")
+         .addClass ("material-icons")
+         .css ("transform", "scale(1.2)")
+         .attr ("title", _("Show search widget."))
+         .text ("search")
+         .on ("click", () => this .toggleSearch (!this .config .file .search))
+         .appendTo (this .toolbar);
+
+      $("<span></span>") .addClass ("separator") .appendTo (this .toolbar);
 
       this .suspendButton = $("<span></span>")
          .addClass ("material-icons")
          .attr ("title", _("Suspend console output."))
-         .text ("cancel")
-         .appendTo (this .toolbar)
-         .on ("click", () => this .setSuspendConsole (!this .suspendConsole));
+         .text ("pause_circle")
+         .on ("click", () => this .setSuspendConsole (!this .suspendConsole))
+         .appendTo (this .toolbar);
 
       this .clearButton = $("<span></span>")
          .addClass ("material-icons")
          .attr ("title", _("Clear console."))
          .text ("delete_forever")
-         .appendTo (this .toolbar)
-         .on ("click", () => this .clearConsole ());
+         .on ("click", () => this .clearConsole ())
+         .appendTo (this .toolbar);
 
       $("<span></span>") .addClass ("separator") .appendTo (this .toolbar);
 
+      // Input
+
       this .textarea = $("<textarea></textarea>")
          .attr ("placeholder", _("Evaluate X3D Script code here, e.g. type `Browser.name`."))
          .attr ("tabindex", 0)
-         .appendTo (this .input)
          .on ("keydown", event => this .onkeydown (event))
-         .on ("keyup", event => this .onkeyup (event));
+         .on ("keyup", event => this .onkeyup (event))
+         .appendTo (this .input);
 
       if (this .console .attr ("id") !== "console")
       {
@@ -75,10 +145,21 @@ module .exports = class Console extends Interface
    {
       super .configure ();
 
-      this .config .file .setDefaultValues ({ history: [ ] });
+      this .config .file .setDefaultValues ({
+         history: [ ],
+         search: false,
+         searchWidth: 285,
+         searchCaseSensitive: false,
+      });
 
       this .history      = this .config .file .history .slice (-this .HISTORY_MAX);
       this .historyIndex = this .history .length;
+
+      this .output .scrollTop (this .output .prop ("scrollHeight"));
+
+      this .search .width (this .config .file .searchWidth);
+      this .toggleSearch (this .config .file .search);
+      this .searchCaseSensitive ();
    }
 
    async set_browser_initialized ()
@@ -97,6 +178,9 @@ module .exports = class Console extends Interface
    // Add strings to exclude here:
    excludes = [
       "The vm module of Node.js is unsupported",
+      "Uncaught TypeError: Cannot read properties of null (reading 'removeChild')",
+      "aria-hidden",
+      "<line>",
       // "Invalid asm.js: Invalid member of stdlib",
    ];
 
@@ -107,8 +191,14 @@ module .exports = class Console extends Interface
 
       const
          classes = [this .logLevels [level] ?? "log", this .logClasses [level]],
-         title   = sourceId ? `${sourceId}:${line}`: "",
-         text    = $("<p></p>") .addClass (classes) .attr ("title", title) .text (message);
+         title   = sourceId ? `${sourceId}:${line}`: "";
+
+      const text = $(message .split ("\n")
+         .map (line => $("<p></p>")
+            .addClass (classes)
+            .attr ("title", title)
+            .text (line)
+            .get (0)));
 
       if (this .messageTime && performance .now () - this .messageTime > 1000)
          this .output .append ($("<p></p>") .addClass ("splitter"));
@@ -131,6 +221,8 @@ module .exports = class Console extends Interface
 
       this .output .append (text);
       this .output .scrollTop (this .output .prop ("scrollHeight"));
+
+      this .findElements (text, this .currentElement, false);
    }
 
    setSuspendConsole (value)
@@ -157,6 +249,7 @@ module .exports = class Console extends Interface
 
       this .output .empty ();
       this .addMessage (null, "info", __filename, 0, `Console cleared at ${new Date () .toLocaleTimeString ()}.`);
+      this .searchString ();
    }
 
    onkeydown (event)
@@ -243,13 +336,156 @@ module .exports = class Console extends Interface
 
       try
       {
-         console .debug (String (this .scriptNode .evaluate (text)));
+         console .debug (this .scriptNode .evaluate (text));
       }
       catch (error)
       {
-         console .error (`${error .name}: ${error .message}`);
+         console .error (error);
       }
 
       this .textarea .val ("");
    }
+
+   toggleSearch (visible)
+   {
+      this .config .file .search = visible;
+
+      if (visible)
+      {
+         this .searchButton .addClass ("active");
+         this .search .show ();
+         this .searchInput .trigger ("focus");
+
+         this .searchString ();
+      }
+      else
+      {
+         this .searchButton .removeClass ("active");
+         this .search .hide ();
+         this .output .find (".selected") .removeClass ("selected");
+      }
+   }
+
+   searchString ()
+   {
+      this .foundElements = [ ];
+
+      this .findElements (this .output .children (), 0, true);
+   }
+
+   findElements (elements, currentElement, scroll)
+   {
+      if (this .search .is (":hidden"))
+         return;
+
+      const
+         toString = this .searchCaseSensitiveButton .hasClass ("active") ? "toString" : "toLowerCase",
+         string   = this .searchInput .val () [toString] ();
+
+      if (!string)
+         return;
+
+      this .foundElements = this .foundElements .concat (Array .from (elements, element => $(element))
+         .filter (element => element .text () [toString] () .includes (string)));
+
+      this .updateCurrentElement (currentElement, scroll);
+   }
+
+   searchKey (event)
+   {
+      switch (event .key)
+      {
+         case "Enter":
+         {
+            if (!this .foundElements .length)
+               break;
+
+            if (event .shiftKey)
+               this .searchPrevious ();
+            else
+               this .searchNext ();
+
+            break;
+         }
+      }
+   }
+
+   searchCaseSensitive (value = this .config .file .searchCaseSensitive)
+   {
+      this .config .file .searchCaseSensitive = value;
+
+      if (this .config .file .searchCaseSensitive)
+         this .searchCaseSensitiveButton .addClass ("active");
+      else
+         this .searchCaseSensitiveButton .removeClass ("active");
+
+      this .searchInput .trigger ("focus");
+
+      this .searchString ();
+   }
+
+   searchPrevious ()
+   {
+      this .updateCurrentElement (this .currentElement - 1);
+   }
+
+   searchNext ()
+   {
+      this .updateCurrentElement (this .currentElement + 1);
+   }
+
+   updateCurrentElement (value, scroll = true)
+   {
+      if (value < 0)
+         value = this .foundElements .length - 1;
+
+      if (value >= this .foundElements .length)
+         value = 0;
+
+      this .currentElement = value;
+
+      this .output .find (".selected") .removeClass ("selected");
+
+      if (this .foundElements .length)
+      {
+         const element = this .foundElements [this .currentElement];
+
+         element .addClass ("selected");
+
+         if (scroll)
+         {
+            element .get (0) .scrollIntoView ({ block: "center", inline: "start", behavior: "smooth" });
+            $(window) .scrollTop (0);
+         }
+
+         this .searchStatus .text (util .format (_("%d of %d"), this .currentElement + 1, this .foundElements .length));
+         this .searchPreviousButton .removeClass ("disabled");
+         this .searchNextButton     .removeClass ("disabled");
+      }
+      else
+      {
+         this .searchStatus .text (`No results`);
+         this .searchPreviousButton .addClass ("disabled");
+         this .searchNextButton     .addClass ("disabled");
+      }
+   }
+
+   outputKey (event)
+   {
+      switch (event .key)
+      {
+         case "f":
+         {
+            if (event .ctrlKey || event .metaKey)
+            {
+               this .searchInput .val (window .getSelection () .toString ());
+               this .searchInput .trigger ("select");
+
+               this .toggleSearch (true);
+            }
+
+            break;
+         }
+      }
+   }
 };

package/src/Editors/Library.js

@@ -27,7 +27,7 @@ module .exports = new class Library extends Dialog
 
    configure ()
    {
-      super .configure ({ size: [600, 400] });
+      super .configure ({ size: [600, 400], minSize: [400, 300] });
 
       // Set default config values.
 

package/src/Editors/MaterialsLibrary.js

@@ -26,7 +26,7 @@ module .exports = class Materials extends LibraryPane
 
       this .#list = $("<ul></ul>")
          .appendTo (this .output)
-         .addClass ("library-list");
+         .addClass (["library-list", "materials"]);
 
       const
          canvas  = $("<x3d-canvas preserveDrawingBuffer='true' xrSessionMode='NONE'></x3d-canvas>"),
@@ -51,9 +51,11 @@ module .exports = class Materials extends LibraryPane
 
             nodes .push ($("<li></li>")
                .addClass (["node", "icon"])
-               .text (`${group .getNodeName ()} ${c + 1}`)
                .attr ("group", g)
                .attr ("child", c)
+               .append ($("<span></span>")
+                  .addClass ("text")
+                  .text (`${group .getNodeName ()} ${c + 1}`))
                .appendTo (this .#list)
                .on ("dblclick", () => this .importX3D (material .getNodeName (), material .toXMLString ())));
          }
@@ -65,7 +67,7 @@ module .exports = class Materials extends LibraryPane
          .css ({ "position": "absolute", "visibility": "hidden" })
          .prependTo ($("body"));
 
-      await browser .resize (25, 25);
+      await browser .resize (256, 256);
       await browser .replaceWorld (scene);
 
       for (const element of Array .from (this .output .find (".node"), e => $(e)))