Merge branch 'develop'

CHANGELOG.MD

@@ -1,5 +1,15 @@
 # Change Log
 
+## v3.35.1 - Nov 3, 2022
+
+* Removes extra collideWorldBounds parameter in Inspector section.
+* Shows prefab properties as independent elements in the Outline view.
+* User Components Editor: shows & edits properties as independent entities.
+* Bug fix: doesn't keep user comonents in object when convert it to prefab.
+* Fixes background for the "New update available" notification. If you click the notification panel, it opens the `https://phasereditor2d.com/downloads` page.
+* Shows User Components as children nodes of the objects in the Outline view.
+* A new Export parameter in the user components of prefab objects.
+
 ## v3.35.0 - Oct 14, 2022
 
 * Allows append objects to a prefab instance.

source/editor/plugins/colibri.inspector/src/ui/views/InspectorView.ts

@@ -6,7 +6,7 @@ namespace colibri.inspector.ui.views {
 
     export class InspectorView extends ide.ViewPart {
 
-        static VIEW_ID = "colibri.inspector.ui.views.InspectorView";
+        static VIEW_ID = "InspectorView";
 
         private _propertyPage: controls.properties.PropertyPage;
         private _currentPart: ide.Part;

source/editor/plugins/colibri/src/ui/controls/properties/FormBuilder.ts

@@ -333,7 +333,7 @@ namespace colibri.ui.controls.properties {
             return check;
         }
 
-        createMenuIcon(parent: HTMLElement, menuProvider: () => Menu, alignRight = true) {
+        createMenuIcon(parent: HTMLElement, menuProvider: () => Menu) {
 
             const icon = new controls.IconControl(colibri.ColibriPlugin.getInstance().getIcon(colibri.ICON_SMALL_MENU));
 
@@ -348,10 +348,14 @@ namespace colibri.ui.controls.properties {
                 menu.createWithEvent(e);
             });
 
-            if (alignRight) {
+            return icon;
+        }
 
-                icon.getCanvas().style.float = "right";
-            }
+        createIcon(parent: HTMLElement, iconImage: IImage) {
+
+            const icon = new controls.IconControl(iconImage);
+
+            parent.appendChild(icon.getCanvas());
 
             return icon;
         }

source/editor/plugins/colibri/src/ui/controls/properties/PropertyPage.ts

@@ -273,6 +273,11 @@ namespace colibri.ui.controls.properties {
                             break;
                         }
                     }
+
+                    if (show && !section.canEditAll(selection)) {
+
+                        show = false;
+                    }
                 }
 
                 show = show && sectionIdSet.has(section.getId());

source/editor/plugins/colibri/src/ui/controls/properties/PropertySection.ts

@@ -29,6 +29,11 @@ namespace colibri.ui.controls.properties {
 
         abstract canEdit(obj: any, n: number): boolean;
 
+        canEditAll(selection: any[]) {
+
+            return true;
+        }
+
         private localStorageKey(prop: string) {
 
             return "PropertySection[" + this._id + "]." + prop;
@@ -187,7 +192,7 @@ namespace colibri.ui.controls.properties {
             }
 
             if (simpleProps) {
-                
+
                 div.classList.add("formSimpleProps");
             }
 
@@ -196,6 +201,6 @@ namespace colibri.ui.controls.properties {
             return div;
         }
 
-        
+
     }
 }

source/editor/plugins/colibri/src/ui/ide/ViewPart.ts

@@ -7,5 +7,4 @@ namespace colibri.ui.ide {
             this.addClass("View");
         }
     }
-
 }

source/editor/plugins/colibri/src/ui/ide/Workbench.ts

@@ -79,7 +79,7 @@ namespace colibri.ui.ide {
             return this._projectPreferences;
         }
 
-        showNotification(text: string) {
+        showNotification(text: string, clickCallback?: () => void) {
 
             const element = document.createElement("div");
             element.classList.add("Notification");
@@ -91,13 +91,20 @@ namespace colibri.ui.ide {
 
             element.addEventListener("click", () => element.remove());
 
+            const duration = 4000;
+
             setTimeout(() => {
 
                 element.classList.add("FadeOutEffect");
 
-                setTimeout(() => element.remove(), 4000);
+                setTimeout(() => element.remove(), duration);
+
+            }, duration);
 
-            }, 4000);
+            if (clickCallback) {
+
+                element.addEventListener("click", clickCallback);
+            }
         }
 
         async launch() {

source/editor/plugins/colibri/styles/controls.css

@@ -29,7 +29,7 @@
     }
 
     label {
-        min-width: 0px;
+        /* min-width: 0px; */
     }
 
     * {
@@ -445,6 +445,7 @@
         right: 30px;
         padding: 20px;
         border-radius: 3px;
+        background: inherit;
     }
 
     .Dialog,

source/editor/plugins/phasereditor2d.ide/src/IDEPlugin.ts

@@ -129,13 +129,26 @@ namespace phasereditor2d.ide {
             return this._externalEditorName;
         }
 
+        openBrowser(url: string) {
+
+            colibri.Platform.onElectron(electron => {
+
+                colibri.core.io.apiRequest("OpenBrowser", { url });
+
+            }, () => {
+
+                controls.Controls.openUrlInNewPage(url);
+            });
+        }
+
         async requestUpdateAvailable() {
 
             if (this.isDesktopMode()) {
 
                 if (await this.isNewUpdateAvailable()) {
 
-                    colibri.Platform.getWorkbench().showNotification("A new version is available!");
+                    colibri.Platform.getWorkbench().showNotification("A new version is available!",
+                        () => this.openBrowser("https://phasereditor2d.com/downloads"));
                 }
             }
         }
@@ -248,7 +261,7 @@ namespace phasereditor2d.ide {
 
     /* program entry point */
 
-    export const VER = "3.36.0-alpha.1";
+    export const VER = "3.35.1";
 
     async function main() {
 

source/editor/plugins/phasereditor2d.scene/src/ScenePlugin.ts

@@ -14,6 +14,7 @@ namespace phasereditor2d.scene {
     export const ICON_UNLOCKED = "unlocked";
     export const ICON_LIST = "list";
     export const ICON_USER_COMPONENT = "user-component";
+    export const ICON_USER_PROPERTY = "dot";
     export const ICON_IMAGE_TYPE = "image-type";
     export const ICON_SPRITE_TYPE = "sprite-type";
     export const ICON_TILESPRITE_TYPE = "tilesprite";
@@ -165,6 +166,7 @@ namespace phasereditor2d.scene {
             reg.addExtension(
                 ide.IconLoaderExtension.withPluginFiles(this, [
                     ICON_USER_COMPONENT,
+                    ICON_USER_PROPERTY,
                     ICON_SELECT_REGION,
                     ICON_TRANSLATE,
                     ICON_SCALE,
@@ -309,7 +311,8 @@ namespace phasereditor2d.scene {
             reg.addExtension(new ui.editor.properties.SceneEditorPropertySectionExtension(
                 page => new ui.sceneobjects.GameObjectVariableSection(page),
                 page => new ui.sceneobjects.PrefabInstanceSection(page),
-                page => new ui.sceneobjects.UserComponentInstancePropertySection(page),
+                page => new ui.sceneobjects.ObjectUserComponentsSection(page),
+                page => new ui.sceneobjects.ObjectSingleUserComponentSection(page),
                 page => new ui.sceneobjects.ListVariableSection(page),
                 page => new ui.sceneobjects.GameObjectListSection(page),
                 page => new ui.sceneobjects.ParentSection(page),

source/editor/plugins/phasereditor2d.scene/src/core/code/SceneCodeDOMBuilder.ts

@@ -259,8 +259,6 @@ namespace phasereditor2d.scene.core.code {
                         ? objES.getPrefabName()
                         : (explicitType ? explicitType : objES.getPhaserType());
 
-                    console.log(type);
-
                     const isPublic = objES.isPublic();
 
                     const field = new FieldDeclCodeDOM(varName, type, isPublic);

source/editor/plugins/phasereditor2d.scene/src/core/json/SceneFinder.ts

@@ -28,7 +28,6 @@ namespace phasereditor2d.scene.core.json {
         }
     }
 
-
     export interface IUserComponentsModelInfo {
         file: io.FilePath;
         model: usercomponent.UserComponentsModel;

source/editor/plugins/phasereditor2d.scene/src/ui/Scene.ts

@@ -412,6 +412,21 @@ namespace phasereditor2d.scene.ui {
             return map;
         }
 
+        buildUserComponentIdMap() {
+
+            const map = new Map<string, sceneobjects.UserComponentNode>();
+
+            this.visitAll(obj => {
+
+                for(const node of obj.getEditorSupport().getUserComponentsComponent().getUserComponentNodes()) {
+
+                    map.set(node.getId(), node);
+                }
+            });
+
+            return map;
+        }
+
         snapPoint(x: number, y: number): { x: number, y: number } {
 
             if (this._settings.snapEnabled) {

source/editor/plugins/phasereditor2d.scene/src/ui/editor/OverlayLayer.ts

@@ -60,22 +60,39 @@ namespace phasereditor2d.scene.ui.editor {
 
             const ctx = this.getContext();
 
-            ctx.save();
-
             const camera = this._editor.getScene().getCamera();
 
-            for (const obj of this._editor.getSelection()) {
+            const selection = this._editor.getSelection();
+
+            const gameObjectsSet = new Set(selection.filter(obj => sceneobjects.isGameObject(obj)));
+
+            for (const obj of selection) {
+
+                ctx.save();
+
+                const isGameObject = sceneobjects.isGameObject(obj);
+                const isUserCompNode = obj instanceof sceneobjects.UserComponentNode
+                    && !gameObjectsSet.has(obj.getObject());
+
+                if (isGameObject || isUserCompNode) {
+
+                    let sprite: sceneobjects.ISceneGameObject;
+
+                    if (isUserCompNode) {
 
-                if (sceneobjects.isGameObject(obj)) {
+                        sprite = obj.getObject();
 
-                    const sprite = obj as sceneobjects.ISceneGameObject;
+                    } else {
+
+                        sprite = obj as sceneobjects.ISceneGameObject;
+                    }
 
                     const points = sprite.getEditorSupport().getScreenBounds(camera);
 
                     if (points.length === 4) {
 
                         ctx.strokeStyle = "black";
-                        ctx.lineWidth = 4;
+                        ctx.lineWidth = isUserCompNode ? 1 : 4;
 
                         ctx.beginPath();
                         ctx.moveTo(points[0].x, points[0].y);
@@ -88,7 +105,15 @@ namespace phasereditor2d.scene.ui.editor {
                         ctx.strokeStyle = "#00ff00";
                         // ctx.strokeStyle = controls.Controls.getTheme().viewerSelectionBackground;
 
-                        ctx.lineWidth = 2;
+                        if (isUserCompNode) {
+
+                            ctx.lineWidth = 1;
+                            ctx.setLineDash([1, 2]);
+
+                        } else {
+
+                            ctx.lineWidth = 2;
+                        }
 
                         ctx.beginPath();
                         ctx.moveTo(points[0].x, points[0].y);
@@ -99,9 +124,9 @@ namespace phasereditor2d.scene.ui.editor {
                         ctx.stroke();
                     }
                 }
-            }
 
-            ctx.restore();
+                ctx.restore();
+            }
         }
 
         private renderGrid() {

source/editor/plugins/phasereditor2d.scene/src/ui/editor/SceneEditor.ts

@@ -578,6 +578,16 @@ namespace phasereditor2d.scene.ui.editor {
             return this.getSelection().filter(obj => sceneobjects.ScenePlainObjectEditorSupport.hasEditorSupport(obj));
         }
 
+        getSelectedUserComponentNodes(): sceneobjects.UserComponentNode[] {
+
+            return this.getSelection().filter(obj => obj instanceof sceneobjects.UserComponentNode);
+        }
+
+        getSelectedPrefabProperties(): sceneobjects.UserProperty[] {
+
+            return this.getSelection().filter(obj => obj instanceof sceneobjects.UserProperty);
+        }
+
         getCameraManager() {
 
             return this._cameraManager;

source/editor/plugins/phasereditor2d.scene/src/ui/editor/SceneEditorMenuCreator.ts

@@ -180,6 +180,7 @@ namespace phasereditor2d.scene.ui.editor {
             menu.addCommand(colibri.ui.ide.actions.CMD_COPY);
             menu.addCommand(colibri.ui.ide.actions.CMD_PASTE);
             menu.addCommand(commands.CMD_PASTE_IN_PLACE);
+            menu.addCommand(colibri.ui.ide.actions.CMD_DELETE);
 
             return menu;
         }