sunrize 1.5.13 → 1.6.0

package/src/Application/Document.js

@@ -37,6 +37,10 @@ module .exports = class Document extends Interface
     */
    async initialize ()
    {
+      this .browser ._activeLayer .addInterest ("toggleGrids", this);
+
+      // Restore
+
       await this .restoreFile ();
 
       // Actions
@@ -86,7 +90,7 @@ module .exports = class Document extends Interface
 
       // Layout Menu
 
-      electron .ipcRenderer .on ("browser-size", () => this .browserSize .open ());
+      electron .ipcRenderer .on ("browser-frame", () => this .browserFrame .open ());
       electron .ipcRenderer .on ("grid-tool", (event, typeName, visible) => this .activateGridTool (typeName, visible));
       electron .ipcRenderer .on ("grid-options", () => this .showGridOptions ());
 
@@ -98,16 +102,17 @@ module .exports = class Document extends Interface
 
       // Browser Size
 
-      this .fullname       = await electron .ipcRenderer .invoke ("fullname");
-      this .browserSize    = require ("../Editors/BrowserSize");
-      this .resizeObserver = new ResizeObserver (() => this .onresize ());
-
-      this .resizeObserver .observe ($("#browser-frame") [0]);
+      this .fullname     = await electron .ipcRenderer .invoke ("fullname");
+      this .browserFrame = require ("../Editors/BrowserFrame");
 
       // Change undo menu items.
 
       UndoManager .shared .addInterest (this, () => this .undoManager ());
 
+      // Configure browser options.
+
+      this .browser .setBrowserOption ("MetadataReference", require ("../../package.json") .homepage);
+
       // Connect browser options.
 
       this .browser .getBrowserOptions () .getField ("PrimitiveQuality") .addInterest ("set_primitiveQuality", this);
@@ -122,12 +127,6 @@ module .exports = class Document extends Interface
          .on ("mouseup",   event => this .onmouseup   (event));
    }
 
-   static #Grids = [
-      "GridTool",
-      "AngleGridTool",
-      "AxonometricGridTool",
-   ];
-
    configure ()
    {
       this .config .file .setDefaultValues ({
@@ -154,17 +153,6 @@ module .exports = class Document extends Interface
       this .#grids      .clear ();
       this .#gridFields .clear ();
 
-      if (this .browser .currentScene !== this .initialScene)
-      {
-         for (const typeName of Document .#Grids)
-         {
-            const config = this .config .file .addNameSpace (`${typeName}.`);
-
-            if (config .visible)
-               this .activateGridTool (typeName, true);
-         }
-      }
-
       // Remove Snap Target and Snap Source.
 
       this .#snapTarget ?.dispose ();
@@ -340,14 +328,19 @@ Viewpoint {
 
       // Add default meta data.
 
-      const pkg = require ("../../package.json");
+      const
+         pkg       = require ("../../package.json"),
+         generator = scene .getMetaData ("generator") ?.filter (value => !value .startsWith (pkg .productName)) ?? [ ];
+
+      generator .push (`${pkg .productName} V${pkg .version}, ${pkg .homepage}`);
 
       if (!scene .getMetaData ("created"))
          scene .setMetaData ("created", new Date () .toUTCString ());
 
-      scene .setMetaData ("comment", `Rise and Shine`);
-      scene .setMetaData ("creator", this .fullname);
-      scene .setMetaData ("generator", `${pkg .productName} V${pkg .version}, ${pkg .homepage}`);
+      if (!scene .getMetaData ("creator") ?.some (value => value .includes (this .fullname)))
+         scene .addMetaData ("creator", this .fullname);
+
+      scene .setMetaData ("generator", generator);
       scene .setMetaData ("modified", new Date () .toUTCString ());
 
       // Save source code.
@@ -452,7 +445,7 @@ Viewpoint {
 
       clearTimeout (this .#saveTimeoutId);
 
-      this .#saveTimeoutId = setTimeout (() => this .saveFile (), 1000);
+      this .#saveTimeoutId = setTimeout (() => this .saveFile (false), 1000);
    }
 
    exportAs (filePath)
@@ -462,7 +455,7 @@ Viewpoint {
 
    close ()
    {
-      this .saveFile ();
+      this .saveFile (false);
 
       electron .ipcRenderer .sendToHost ("closed");
    }
@@ -649,67 +642,64 @@ Viewpoint {
     * Layout Menu
     */
 
-   /**
-    * Change browser size according to aspect-ratio.
-    */
-   onresize ()
+   static #Grids = [
+      "GridTool",
+      "AngleGridTool",
+      "AxonometricGridTool",
+   ];
+
+   #grids      = new Map ();
+   #gridFields = new Map ();
+
+   toggleGrids ()
    {
-      const
-         enabled          = this .browserSize .config .file .enabled,
-         numerator        = this .browserSize .config .file .numerator,
-         denominator      = this .browserSize .config .file .denominator,
-         aspectRatio      = numerator / denominator,
-         frameAspectRatio = $("#browser-frame") .width () / $("#browser-frame") .height (),
-         element          = $(this .browser .element);
-
-      if (enabled && aspectRatio)
-      {
-         element .css ({ "aspect-ratio": `${numerator} / ${denominator}` });
+      const configNode = Editor .getConfigNode (this .browser);
 
-         if (aspectRatio > frameAspectRatio)
-            element .css ({ "width": "100%", "height": "auto" });
-         else
-            element .css ({ "width": "auto", "height": "100%" });
-      }
-      else
+      for (const typeName of Document .#Grids)
       {
-         element .css ({ "aspect-ratio": "unset", "width": "100%", "height": "100%" });
+         const [visible = false] = configNode ?.getMetaData (`Sunrize/${typeName}/visible`) ?? [ ];
+
+         if (!this .#grids .has (typeName) && !visible)
+            continue;
+
+         this .activateGridTool (typeName, visible, false);
       }
    }
 
-   #grids      = new Map ();
-   #gridFields = new Map ();
-
-   async activateGridTool (typeName, visible)
+   async activateGridTool (typeName, visible, undo = true)
    {
       const
-         Tool   = require (`../Tools/Grids/${typeName}`),
-         grid   = this .#grids .get (typeName) ?? new Tool (this .browser .currentScene),
-         config = this .config .file .addNameSpace (`${typeName}.`),
-         tool   = await grid .getToolInstance ();
+         Tool = require (`../Tools/Grids/${typeName}`),
+         grid = this .#grids .get (typeName) ?? new Tool (this .browser .currentScene),
+         tool = await grid .getToolInstance ();
+
+      grid ._visible .addInterest ("updateMenu", this);
+      tool .getField ("isActive") .addInterest ("handleUndoForGrid", this, typeName);
+
+      UndoManager .shared .beginUndo (_ ("Change Visibility of %s"), typeName);
 
-      for (const [typeName, grid] of this .#grids)
+      if (visible)
       {
-         grid ._visible = false;
-         this .config .file .addNameSpace (`${typeName}.`) .visible = false;
+         for (const [typeName, grid] of this .#grids)
+         {
+            if (undo)
+               Editor .setFieldValue (this .browser .currentScene, grid .tool .getValue (), grid ._visible, false);
+            else
+               grid ._visible = false;
+         }
       }
 
       this .#grids .set (typeName, grid);
-      grid ._visible   = visible;
-      config .visible = visible;
 
-      this .restoreGridTool (typeName);
-      this .updateMenu ();
-
-      // if (this .secondaryToolbar .config .file .panel)
-      //    this .showGridOptions ();
+      if (undo)
+         Editor .setFieldValue (this .browser .currentScene, grid .tool .getValue (), grid ._visible, visible);
+      else
+         grid ._visible = visible;
 
-      tool .getValue ()           .addInterest ("set_gridTool",        this, typeName);
-      tool .getField ("isActive") .addInterest ("set_gridTool",        this, typeName);
-      tool .getField ("isActive") .addInterest ("set_gridTool_active", this, typeName);
+      UndoManager .shared .endUndo ();
    }
 
-   async set_gridTool_active (typeName)
+   async handleUndoForGrid (typeName)
    {
       const
          grid = this .#grids .get (typeName),
@@ -725,7 +715,7 @@ Viewpoint {
       {
          const
             executionContext = tool .getValue () .getExecutionContext (),
-            saved            = this .#gridFields .get (typeName);
+            initialValues    = this .#gridFields .get (typeName);
 
          UndoManager .shared .beginUndo (_("Change Properties of %s"), typeName);
 
@@ -734,9 +724,14 @@ Viewpoint {
             if (!field .isInitializable ())
                continue;
 
+            const initialValue = initialValues .get (field .getName ());
+
+            if (field .equals (initialValue))
+               continue;
+
             const value = field .copy ();
 
-            field .assign (saved .get (field .getName ()));
+            field .assign (initialValue);
 
             Editor .setFieldValue (executionContext, tool .getValue (), field, value);
          }
@@ -745,53 +740,6 @@ Viewpoint {
       }
    }
 
-   async set_gridTool (typeName)
-   {
-      const
-         grid = this .#grids .get (typeName),
-         tool = await grid .getToolInstance ();
-
-      if (tool .isActive)
-         return;
-
-      this .saveGridTool (typeName);
-   }
-
-   async restoreGridTool (typeName)
-   {
-      const
-         grid   = this .#grids .get (typeName),
-         config = this .config .file .addNameSpace (`${typeName}.`),
-         tool   = await grid .getToolInstance ();
-
-      for (const field of tool .getValue () .getFields ())
-      {
-         if (!field .isInitializable ())
-            continue;
-
-         const value = config [field .getName ()];
-
-         if (value !== undefined)
-            field .fromString (value);
-      }
-   }
-
-   async saveGridTool (typeName)
-   {
-      const
-         grid   = this .#grids .get (typeName),
-         config = this .config .file .addNameSpace (`${typeName}.`),
-         tool   = await grid .getToolInstance ();
-
-      for (const field of tool .getValue () .getFields ())
-      {
-         if (!field .isInitializable ())
-            continue;
-
-         config [field .getName ()] = field .toString ();
-      }
-   }
-
    updateGridMenus (menu)
    {
       Document .#Grids .forEach (typeName => menu [typeName] = false);
@@ -818,9 +766,6 @@ Viewpoint {
 
    async onmousedown (event)
    {
-      if (process .env .SUNRISE_ENVIRONMENT !== "DEVELOPMENT")
-         return;
-
       if (event .button !== 2)
          return;
 
@@ -870,7 +815,7 @@ Viewpoint {
 
    activateSnapTarget (visible)
    {
-      const SnapTarget = require ("../Tools/SnapTool/SnapTargetTool");
+      const SnapTarget = require ("../Tools/SnapTool/SnapTarget");
 
       this .#snapTarget ??= new SnapTarget (this .browser .currentScene);
 
@@ -881,7 +826,7 @@ Viewpoint {
 
    activateSnapSource (visible)
    {
-      const SnapSource = require ("../Tools/SnapTool/SnapSourceTool");
+      const SnapSource = require ("../Tools/SnapTool/SnapSource");
 
       this .#snapSource ??= new SnapSource (this .browser .currentScene);
 

package/src/Application/Interface.js

@@ -14,6 +14,10 @@ require ("../Bits/Beep");
 
 Object .assign ($,
 {
+   sleep (ms)
+   {
+      return new Promise (resolve => setTimeout (resolve, ms));
+   },
    try (callback, logError = false)
    {
       try

package/src/Application/Tabs.js

@@ -91,7 +91,7 @@ module .exports = new class Tabs
       this .forwardToActiveTab ("display-timings");
       this .forwardToActiveTab ("show-library");
 
-      this .forwardToActiveTab ("browser-size");
+      this .forwardToActiveTab ("browser-frame");
       this .forwardToActiveTab ("grid-tool");
       this .forwardToActiveTab ("grid-options");
       this .forwardToActiveTab ("activate-snap-target");
@@ -365,11 +365,11 @@ module .exports = new class Tabs
 
    forwardToActiveTab (channel)
    {
-      electron .ipcRenderer .on (channel, (event, ...args) => this .tabs .getActiveTab () .webview .send (channel, ...args));
+      electron .ipcRenderer .on (channel, (event, ... args) => this .tabs .getActiveTab () .webview .send (channel, ... args));
    }
 
    forwardToAllTabs (channel)
    {
-      electron .ipcRenderer .on (channel, (event, ...args) => this .tabs .getTabs () .forEach (tab => tab .webview .send (channel, ...args)));
+      electron .ipcRenderer .on (channel, (event, ... args) => this .tabs .getTabs () .forEach (tab => tab .webview .send (channel, ... args)));
    }
 };

package/src/Controls/Dialog.js

@@ -57,7 +57,9 @@ module .exports = class Dialog extends Interface
    open ()
    {
       this .element .dialog ({
-         position: { ...this .config .file .position, of: $("body") },
+         position: { ... this .config .file .position, of: $("body") },
+         minWidth: this .config .file .getDefaultValue ("size") [0],
+         minHeight: this .config .file .getDefaultValue ("size") [1],
          width: this .config .file .size [0],
          height: this .config .file .size [1],
       })

package/src/Editors/BrowserFrame.js

@@ -0,0 +1,171 @@
+"use strict";
+
+const
+   $           = require ("jquery"),
+   X3D         = require ("../X3D"),
+   Dialog      = require ("../Controls/Dialog"),
+   Editor      = require ("../Undo/Editor"),
+   UndoManager = require ("../Undo/UndoManager"),
+   _           = require ("../Application/GetText");
+
+module .exports = new class BrowserFrame extends Dialog
+{
+   constructor ()
+   {
+      super ("Sunrize.BrowserFrame.");
+
+      this .setup ();
+   }
+
+   initialize ()
+   {
+      super .initialize ();
+
+      // Add class.
+
+      this .element .addClass ("browser-frame");
+
+      this .table         = $("<table></table>") .appendTo (this .element);
+      this .table .header = $("<thead></thead>") .appendTo (this .table);
+      this .table .body   = $("<tbody></tbody>") .appendTo (this .table);
+
+      $("<tr></tr>")
+         .append ($("<th></th>")
+            .attr ("colspan", "2")
+            .text (_("Browser Frame")))
+         .appendTo (this .table .header);
+
+      this .fixedSize = $("<input></input>")
+         .attr ("id", "browser-frame-fixed-size")
+         .attr ("type", "checkbox")
+         .on ("change", () => this .onchange ());
+
+      $("<tr></tr>")
+         .append ($("<th></th>"))
+         .append ($("<td></td>")
+            .append (this .fixedSize)
+            .append ($("<label></label>")
+               .attr ("for", "browser-frame-fixed-size")
+               .text (_("Fixed Size"))))
+         .appendTo (this .table .body);
+
+      this .numerator = $("<input></input>")
+         .attr ("type", "number")
+         .attr ("step", "1")
+         .css ("width", "calc((100% - 20px) / 2)")
+         .on ("change", () => this .onchange ());
+
+      const slash = $("<span></span>")
+         .css ({ "display": "inline-block", "width": "20px", "text-align": "center" })
+         .text ("/");
+
+      this .denominator = $("<input></input>")
+          .attr ("type", "number")
+          .attr ("step", "1")
+          .css ("width", "calc((100% - 20px) / 2)")
+          .on ("change", () => this .onchange ());
+
+      $("<tr></tr>")
+         .append ($("<th></th>")
+            .text (_("Aspect Ratio")))
+         .append ($("<td></td>")
+            .append (this .numerator)
+            .append (slash)
+            .append (this .denominator))
+         .appendTo (this .table .body);
+
+      this .backgroundColor = $("<input></input>")
+         .attr ("title", _("A background color which is applied to the <x3d-canvas> element."))
+         .attr ("placeholder", "Enter any CSS color here.")
+         .on ("change", () => this .onchange ());
+
+      $("<tr></tr>")
+         .append ($("<th></th>") .text (_("Background Color")))
+         .append ($("<td></td>") .append (this .backgroundColor))
+         .appendTo (this .table .body);
+
+      this .resizeObserver = new ResizeObserver (() => this .onresize ());
+
+      this .resizeObserver .observe ($("#browser-frame") [0]);
+   }
+
+   configure ()
+   {
+      super .configure ({ size: [400, 127] });
+
+      this .connect (Editor .getWorldInfo (this .browser .currentScene));
+      this .updateInputs ();
+   }
+
+   connect (worldInfoNode)
+   {
+      worldInfoNode ?.addMetaDataCallback (this, "Sunrize/BrowserFrame/fixedSize",       () => this .updateInputs ());
+      worldInfoNode ?.addMetaDataCallback (this, "Sunrize/BrowserFrame/aspectRatio",     () => this .updateInputs ());
+      worldInfoNode ?.addMetaDataCallback (this, "Sunrize/BrowserFrame/backgroundColor", () => this .updateInputs ());
+   }
+
+   updateInputs ()
+   {
+      const
+         worldInfoNode                    = Editor .getWorldInfo (this .browser .currentScene),
+         [fixedSize = false]              = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/fixedSize") ?? [ ],
+         [numerator = 1, denominator = 1] = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/aspectRatio") ?? [ ],
+         [backgroundColor = ""]           = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/backgroundColor") ?? [ ];
+
+      this .fixedSize .prop ("checked", fixedSize);
+      this .numerator .val (numerator);
+      this .denominator .val (denominator);
+      this .backgroundColor .val (backgroundColor);
+   }
+
+   onchange ()
+   {
+      const
+         worldInfoNode   = Editor .getWorldInfo (this .browser .currentScene, true),
+         fixedSize       = new X3D .SFBool (this .fixedSize .prop ("checked")),
+         aspectRatio     = new X3D .MFDouble (this .numerator .val (), this .denominator .val ()),
+         backgroundColor = new X3D .SFString (this .backgroundColor .val ());
+
+      this .connect (worldInfoNode);
+
+      UndoManager .shared .beginUndo (_("Change Browser Frame"));
+
+      Editor .setNodeMetaData (worldInfoNode, "Sunrize/BrowserFrame/fixedSize",       fixedSize);
+      Editor .setNodeMetaData (worldInfoNode, "Sunrize/BrowserFrame/aspectRatio",     aspectRatio);
+      Editor .setNodeMetaData (worldInfoNode, "Sunrize/BrowserFrame/backgroundColor", backgroundColor);
+      Editor .deferFunction (() => this .onresize ());
+
+      UndoManager .shared .endUndo ();
+   }
+
+   /**
+    * Change browser size according to aspect-ratio.
+    */
+   onresize ()
+   {
+      const
+         worldInfoNode                    = Editor .getWorldInfo (this .browser .currentScene),
+         [fixedSize = false]              = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/fixedSize") ?? [ ],
+         [numerator = 1, denominator = 1] = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/aspectRatio") ?? [ ],
+         [backgroundColor = ""]           = worldInfoNode ?.getMetaData ("Sunrize/BrowserFrame/backgroundColor") ?? [ ],
+         aspectRatio                      = numerator / denominator,
+         frameAspectRatio                 = $("#browser-frame") .width () / $("#browser-frame") .height (),
+         element                          = $(this .browser .element);
+
+      if (fixedSize && aspectRatio)
+      {
+         element .css ({ "aspect-ratio": `${numerator} / ${denominator}` });
+
+         if (aspectRatio > frameAspectRatio)
+            element .css ({ "width": "100%", "height": "auto" });
+         else
+            element .css ({ "width": "auto", "height": "100%" });
+      }
+      else
+      {
+         element .css ({ "aspect-ratio": "unset", "width": "100%", "height": "100%" });
+      }
+
+      element .css ("background-color", `${backgroundColor}` .replace (/\b(?:transparent|unset|initial)\b/g, ""));
+   }
+};