Add buttons to edit animations for Sprite, Spine, tilemap

4ian · Sep 17, 2024 · f742b39 · f742b39
1 parent 4a7ab83
commit f742b39
Show file tree

Hide file tree

Showing 11 changed files with 113 additions and 37 deletions.
diff --git a/Core/GDCore/Extensions/Builtin/SpriteExtension/SpriteExtension.cpp b/Core/GDCore/Extensions/Builtin/SpriteExtension/SpriteExtension.cpp
@@ -33,6 +33,7 @@ void GD_CORE_API BuiltinExtensionsImplementer::ImplementsSpriteExtension(
                                      "most elements of a game."),
                                    "CppPlatform/Extensions/spriteicon.png")
           .SetCategoryFullName(_("General"))
+          .SetOpenFullEditorLabel(_("Edit animations"))
           .AddDefaultBehavior("EffectCapability::EffectBehavior")
           .AddDefaultBehavior("ResizableCapability::ResizableBehavior")
           .AddDefaultBehavior("ScalableCapability::ScalableBehavior")

diff --git a/Core/GDCore/Extensions/Builtin/SpriteExtension/SpriteObject.cpp b/Core/GDCore/Extensions/Builtin/SpriteExtension/SpriteObject.cpp
@@ -47,19 +47,11 @@ void SpriteObject::DoSerializeTo(gd::SerializerElement& element) const {
 std::map<gd::String, gd::PropertyDescriptor> SpriteObject::GetProperties()
     const {
   std::map<gd::String, gd::PropertyDescriptor> properties;
-  properties[_("Animate even if hidden or far from the screen")]
-      .SetValue(updateIfNotVisible ? "true" : "false")
-      .SetType("Boolean");
-  properties["PLEASE_ALSO_SHOW_EDIT_BUTTON_THANKS"].SetValue("");
-
   return properties;
 }
 
 bool SpriteObject::UpdateProperty(const gd::String& name,
                                   const gd::String& value) {
-  if (name == _("Animate even if hidden or far from the screen"))
-    updateIfNotVisible = value == "1";
-
   return true;
 }
 

diff --git a/Core/GDCore/Extensions/Metadata/ObjectMetadata.h b/Core/GDCore/Extensions/Metadata/ObjectMetadata.h
@@ -323,6 +323,15 @@ class GD_CORE_API ObjectMetadata : public InstructionOrExpressionContainerMetada
    */
   bool IsRenderedIn3D() const { return isRenderedIn3D; }
 
+  ObjectMetadata &SetOpenFullEditorLabel(const gd::String& label) {
+    openFullEditorLabel = label;
+    return *this;
+  }
+
+  const gd::String& GetOpenFullEditorLabel() const {
+    return openFullEditorLabel;
+  }
+
   std::map<gd::String, gd::InstructionMetadata> conditionsInfos;
   std::map<gd::String, gd::InstructionMetadata> actionsInfos;
   std::map<gd::String, gd::ExpressionMetadata> expressionsInfos;
@@ -344,6 +353,7 @@ class GD_CORE_API ObjectMetadata : public InstructionOrExpressionContainerMetada
   std::set<gd::String> defaultBehaviorTypes;
   bool hidden = false;
   bool isRenderedIn3D = false;
+  gd::String openFullEditorLabel;
 
   std::shared_ptr<gd::ObjectConfiguration>
       blueprintObject;  ///< The "blueprint" object to be copied when a new

diff --git a/Extensions/Spine/JsExtension.js b/Extensions/Spine/JsExtension.js
@@ -54,7 +54,8 @@ module.exports = {
       .addIncludeFile('Extensions/Spine/pixi-spine/pixi-spine.js')
       .addIncludeFile('Extensions/Spine/managers/pixi-spine-atlas-manager.js')
       .addIncludeFile('Extensions/Spine/managers/pixi-spine-manager.js')
-      .setCategoryFullName(_('Advanced'));
+      .setCategoryFullName(_('Advanced'))
+      .setOpenFullEditorLabel(_('Edit animations'));
 
     object
       .addExpressionAndConditionAndAction(
@@ -208,7 +209,7 @@ module.exports = {
 
         this.setAnimation(this._instance.getRawDoubleProperty('animation'));
 
-        const scale = Number(properties.get('scale').getValue()) || 1
+        const scale = Number(properties.get('scale').getValue()) || 1;
 
         const spine = this._spine;
         if (spine) {
@@ -265,7 +266,9 @@ module.exports = {
        */
       setAnimation(index) {
         const { _spine: spine } = this;
-        const configuration = gd.asSpineConfiguration(this._associatedObjectConfiguration);
+        const configuration = gd.asSpineConfiguration(
+          this._associatedObjectConfiguration
+        );
 
         if (
           !spine ||
@@ -318,7 +321,7 @@ module.exports = {
         this._pixiResourcesLoader
           .getSpineData(this._project, this._spineResourceName)
           .then((spineDataOrLoadingError) => {
-            if (this._spine) this._pixiObject.removeChild(this._spine)
+            if (this._spine) this._pixiObject.removeChild(this._spine);
 
             if (!spineDataOrLoadingError.skeleton) {
               console.error(

diff --git a/Extensions/TileMap/JsExtension.js b/Extensions/TileMap/JsExtension.js
@@ -720,6 +720,7 @@ const defineSimpleTileMap = function (extension, _, gd) {
       objectSimpleTileMap
     )
     .setCategoryFullName(_('General'))
+    .setOpenFullEditorLabel(_('Edit tileset and collisions'))
     .addDefaultBehavior('ResizableCapability::ResizableBehavior')
     .addDefaultBehavior('ScalableCapability::ScalableBehavior')
     .addDefaultBehavior('OpacityCapability::OpacityBehavior')

diff --git a/GDevelop.js/Bindings/Bindings.idl b/GDevelop.js/Bindings/Bindings.idl
@@ -1893,6 +1893,9 @@ interface ObjectMetadata {
 
     [Ref] ObjectMetadata MarkAsRenderedIn3D();
     boolean IsRenderedIn3D();
+
+    [Ref] ObjectMetadata SetOpenFullEditorLabel([Const] DOMString label);
+    [Const, Ref] DOMString GetOpenFullEditorLabel();
 };
 
 enum QuickCustomization_Visibility {

diff --git a/GDevelop.js/types.d.ts b/GDevelop.js/types.d.ts
@@ -1514,6 +1514,8 @@ export class ObjectMetadata extends EmscriptenObject {
   isHidden(): boolean;
   markAsRenderedIn3D(): ObjectMetadata;
   isRenderedIn3D(): boolean;
+  setOpenFullEditorLabel(label: string): ObjectMetadata;
+  getOpenFullEditorLabel(): string;
 }
 
 export class QuickCustomization extends EmscriptenObject {static Default = 0;

diff --git a/GDevelop.js/types/gdobjectmetadata.js b/GDevelop.js/types/gdobjectmetadata.js
@@ -28,6 +28,8 @@ declare class gdObjectMetadata {
   isHidden(): boolean;
   markAsRenderedIn3D(): gdObjectMetadata;
   isRenderedIn3D(): boolean;
+  setOpenFullEditorLabel(label: string): gdObjectMetadata;
+  getOpenFullEditorLabel(): string;
   delete(): void;
   ptr: number;
 };
diff --git a/newIDE/app/src/CompactPropertiesEditor/index.js b/newIDE/app/src/CompactPropertiesEditor/index.js
@@ -151,6 +151,7 @@ export type ActionButton = {|
   getValue: Instance => string,
   nonFieldType: 'button',
   getIcon?: ({| fontSize: string |}) => React.Node,
+  showRightIcon?: boolean,
   onClick: (instance: Instance) => void,
 |};
 
@@ -687,26 +688,31 @@ const CompactPropertiesEditor = ({
           }) === DIFFERENT_VALUES;
       }
       return (
-        <React.Fragment key={`button-${field.label}`}>
-          <FlatButton
-            fullWidth
-            primary
-            leftIcon={
-              field.getIcon ? (
-                field.getIcon({ fontSize: 'small' })
-              ) : (
-                <Edit fontSize="small" />
-              )
-            }
-            disabled={disabled}
-            label={field.label}
-            onClick={() => {
-              if (!instances[0]) return;
-              field.onClick(instances[0]);
-            }}
-          />
-          <Spacer />
-        </React.Fragment>
+        <FlatButton
+          key={`button-${field.label}`}
+          fullWidth
+          primary
+          leftIcon={
+            field.showRightIcon ? null : field.getIcon ? (
+              field.getIcon({ fontSize: 'small' })
+            ) : (
+              <Edit fontSize="small" />
+            )
+          }
+          rightIcon={
+            !field.showRightIcon ? null : field.getIcon ? (
+              field.getIcon({ fontSize: 'small' })
+            ) : (
+              <Edit fontSize="small" />
+            )
+          }
+          disabled={disabled}
+          label={field.label}
+          onClick={() => {
+            if (!instances[0]) return;
+            field.onClick(instances[0]);
+          }}
+        />
       );
     },
     [instances]

diff --git a/newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/CompactObjectPropertiesSchema.js b/newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/CompactObjectPropertiesSchema.js
@@ -0,0 +1,40 @@
+// @flow
+import * as React from 'react';
+import { type Schema, type ActionButton } from '../../CompactPropertiesEditor';
+import ShareExternal from '../../UI/CustomSvgIcons/ShareExternal';
+
+export const getSchemaWithOpenFullEditorButton = ({
+  schema,
+  fullEditorLabel,
+  object,
+  onEditObject,
+}: {|
+  schema: Schema,
+  fullEditorLabel: ?string,
+  object: gdObject,
+  onEditObject: (object: gdObject) => void,
+|}): Schema => {
+  if (!fullEditorLabel) return schema;
+
+  const actionButton: ActionButton = {
+    label: fullEditorLabel,
+    disabled: 'onValuesDifferent',
+    nonFieldType: 'button',
+    showRightIcon: true,
+    getIcon: style => <ShareExternal style={style} />,
+    getValue: ({ object }) => object.getName(),
+    onClick: ({ object }) => onEditObject(object),
+  };
+
+  let added = false;
+  schema.forEach(field => {
+    if (field.children && field.name === '') {
+      field.children.push(actionButton);
+      added = true;
+    }
+  });
+
+  if (!added) schema.push(actionButton);
+
+  return schema;
+};
diff --git a/newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/index.js b/newIDE/app/src/ObjectEditor/CompactObjectPropertiesEditor/index.js
@@ -42,6 +42,7 @@ import {
 import CompactSelectField from '../../UI/CompactSelectField';
 import SelectOption from '../../UI/SelectOption';
 import { ChildObjectPropertiesEditor } from './ChildObjectPropertiesEditor';
+import { getSchemaWithOpenFullEditorButton } from './CompactObjectPropertiesSchema';
 
 const gd: libGDevelop = global.gd;
 
@@ -145,6 +146,9 @@ export const CompactObjectPropertiesEditor = ({
     object.getType()
   );
   const is3DObject = !!objectMetadata && objectMetadata.isRenderedIn3D();
+  const fullEditorLabel = objectMetadata
+    ? objectMetadata.getOpenFullEditorLabel()
+    : null;
 
   // TODO: Workaround a bad design of ObjectJsImplementation. When getProperties
   // and associated methods are redefined in JS, they have different arguments (
@@ -159,6 +163,10 @@ export const CompactObjectPropertiesEditor = ({
   // Properties:
   const schema = React.useMemo(
     () => {
+      if (schemaRecomputeTrigger) {
+        // schemaRecomputeTrigger allows to invalidate the schema when required.
+      }
+
       const properties = objectConfigurationAsGd.getProperties();
       const schema = propertiesMapToSchema(
         properties,
@@ -168,11 +176,20 @@ export const CompactObjectPropertiesEditor = ({
           objectConfiguration.updateProperty(name, value)
       );
 
-      return schema;
+      return getSchemaWithOpenFullEditorButton({
+        schema,
+        fullEditorLabel,
+        object,
+        onEditObject,
+      });
     },
-    // schemaRecomputeTrigger allows to invalidate the schema when required.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [objectConfigurationAsGd, schemaRecomputeTrigger]
+    [
+      objectConfigurationAsGd,
+      schemaRecomputeTrigger,
+      fullEditorLabel,
+      object,
+      onEditObject,
+    ]
   );
 
   // Behaviors:
@@ -307,7 +324,6 @@ export const CompactObjectPropertiesEditor = ({
                   />
                 );
               })}
-            <Spacer />
           </ColumnStackLayout>
           <Column>
             <Separator />