Add focusOn to/from json (#480)

Author: Nir Maoz

__TESTS_BUNDLE_SIZE__/bundleSizeTestCases.ts

@@ -34,7 +34,7 @@ const bundleSizeTestCases:ITestCase[] = [
   },
   {
     name: 'Tests CloudinaryImage with Resize, Adjust and Border',
-    sizeLimitInKB: 25,
+    sizeLimitInKB: 26,
     importsArray: [
       importFromDist('assets/CloudinaryImage', 'CloudinaryImage'),
       importFromDist('instance/Cloudinary', 'Cloudinary'),
@@ -45,7 +45,7 @@ const bundleSizeTestCases:ITestCase[] = [
   },
   {
     name: 'Tests CloudinaryImage image with Resize, adjust and delivery',
-    sizeLimitInKB: 26,
+    sizeLimitInKB: 27,
     importsArray: [
       importFromDist('assets/CloudinaryImage', 'CloudinaryImage'),
       importFromDist('instance/Cloudinary', 'Cloudinary'),
@@ -88,7 +88,7 @@ const bundleSizeTestCases:ITestCase[] = [
   },
   {
     name: 'Import All Actions',
-    sizeLimitInKB: 37,
+    sizeLimitInKB: 38,
     importsArray: [
       importFromPackage('Actions')
     ]

__TESTS__/unit/fromJson/resize.fromJson.test.ts

@@ -28,6 +28,21 @@ describe('resize.fromJson', () => {
             {object: 'cat', avoid: true}
           ]
         }
+      },
+      {
+        actionType: 'crop',
+        dimensions: {width: 200},
+        gravity: {
+          gravityType: 'object',
+          focusOnObjects: ['dog'],
+          fallbackGravity: {
+            gravityType: 'auto',
+            autoFocus: [
+              {object: 'bird', weight: 30},
+              {object: 'cat', avoid: true}
+            ]
+          }
+        }
       }
     ]);
 
@@ -44,6 +59,7 @@ describe('resize.fromJson', () => {
       'b_white,c_lpad,fl_relative,g_south,w_100,x_3,y_4',
       'b_white,c_mpad,fl_relative,g_south,w_100,x_3,y_4',
       'c_crop,g_auto:person_100:cat_avoid,w_200',
+      'c_crop,g_dog:auto:bird_30:cat_avoid,w_200',
     ].join('/'));
   });
 

__TESTS__/unit/toJson/resize.toJson.test.ts

@@ -160,26 +160,58 @@ describe('resize.toJson()', () => {
     ]);
   });
 
-  it('should generate auto gravity model', ()=>{
-    const gravity = Gravity.autoGravity().autoFocus(
-      AutoFocus.focusOn(FocusOn.person()).weight(100),
-      AutoFocus.focusOn(FocusOn.cat()).weight(50).avoid()
-    );
-
+  it('should generate auto gravity model', () => {
     const transformation = new Transformation()
-      .addAction(Resize.crop(200).gravity(gravity));
+      .addAction(Resize.crop(200).gravity(Gravity.autoGravity().autoFocus(
+        AutoFocus.focusOn(FocusOn.person()).weight(100),
+        AutoFocus.focusOn(FocusOn.cat()).weight(50).avoid()
+      )));
 
     const model = transformation.toJson();
 
     expect(model).toStrictEqual([
       {
-        "actionType": "crop", "dimensions": {"width": 200}, "gravity": {
-          "autoFocus": [
-            {"object": "person", "weight": 100},
-            {"object": "cat", "avoid": true}
+        actionType: "crop",
+        dimensions: {width: 200},
+        gravity: {
+          gravityType: 'auto',
+          autoFocus: [
+            {object: "person", weight: 100},
+            {object: "cat", avoid: true}
           ]
         }
       }
     ]);
   });
+
+  it('should generate focusOnGravity model', () => {
+    const transformation = new Transformation()
+      .addAction(Resize.crop(200).gravity(
+        Gravity.focusOn(FocusOn.cat(), FocusOn.dog()).fallbackGravity(
+          Gravity.autoGravity().autoFocus(
+            AutoFocus.focusOn(FocusOn.microwave()).weight(30),
+            AutoFocus.focusOn(FocusOn.bicycle()).avoid()
+          )
+        )));
+
+    const model = transformation.toJson();
+
+    expect(model).toStrictEqual([
+      {
+        actionType: 'crop',
+        dimensions: {width: 200},
+        gravity: {
+          gravityType: 'object',
+          focusOnObjects: ['cat', 'dog'],
+          fallbackGravity: {
+            gravityType: 'auto',
+            autoFocus: [
+              {object: 'microwave', weight: 30},
+              {object: 'bicycle', avoid: true}
+            ]
+          }
+        }
+      }
+    ]);
+  });
 });

src/actions/resize/ResizeAdvancedAction.ts

@@ -2,7 +2,7 @@ import {ResizeSimpleAction} from "./ResizeSimpleAction.js";
 import {IGravity} from "../../qualifiers/gravity/GravityQualifier.js";
 import {Qualifier} from "../../internal/qualifier/Qualifier.js";
 import {IActionModel} from "../../internal/models/IActionModel.js";
-import {createGravityModel} from "../../internal/models/createGravityModel.js";
+import {createGravityModel, IGravityModel} from "../../internal/models/createGravityModel.js";
 import {createGravityFromModel} from "../../internal/models/createGravityFromModel.js";
 import {IResizeAdvancedActionModel} from "../../internal/models/IResizeAdvancedActionModel.js";
 
@@ -30,7 +30,7 @@ class ResizeAdvancedAction extends ResizeSimpleAction{
     const result = super.fromJson.apply(this, [actionModel]);
 
     if (actionModel.gravity) {
-      result.gravity(createGravityFromModel(actionModel.gravity));
+      result.gravity(createGravityFromModel(actionModel.gravity as IGravityModel));
     }
 
     return result;

src/internal/models/createGravityFromModel.ts

@@ -1,7 +1,7 @@
 import {
   IAutoGravityModel,
   IAutoGravityObjectModel,
-  ICompassGravityModel,
+  ICompassGravityModel, IFocusOnGravityModel,
   IGravityModel,
   IOcrGravityModel
 } from "./createGravityModel.js";
@@ -10,6 +10,7 @@ import {autoGravity, focusOn} from "../../qualifiers/gravity.js";
 import {FocusOnValue, ocr} from "../../qualifiers/focusOn.js";
 import {AutoGravity} from "../../qualifiers/gravity/autoGravity/AutoGravity.js";
 import {AutoFocus} from "../../qualifiers/autoFocus.js";
+import {FocusOnGravity} from "../../qualifiers/gravity/focusOnGravity/FocusOnGravity.js";
 
 /**
  * Validates that gravityModel is an ICompassGravityModel
@@ -59,6 +60,22 @@ function createAutoGravityFromModel(gravityModel: IAutoGravityModel): AutoGravit
   return autoGravity().autoFocus(...autoFocus);
 }
 
+/**
+ * Create FocusOnGravity from given IFocusOnGravityModel
+ * @param gravityModel
+ */
+function createFocusOnGravityFromModel(gravityModel: IFocusOnGravityModel): FocusOnGravity {
+  const focusOnObjects = (gravityModel.focusOnObjects || []).map((str) => new FocusOnValue(str));
+  const result = focusOn(...focusOnObjects);
+
+  if (gravityModel.fallbackGravity) {
+    const autoGravity = createAutoGravityFromModel(gravityModel.fallbackGravity);
+    result.fallbackGravity(autoGravity);
+  }
+
+  return result;
+}
+
 /**
  * Create gravity instance from given gravity model
  * @param gravityModel
@@ -75,6 +92,8 @@ function createGravityFromModel(gravityModel: IGravityModel): IGravity {
   if (isAutoGravityModel(gravityModel)) {
     return createAutoGravityFromModel(gravityModel);
   }
+
+  return createFocusOnGravityFromModel(gravityModel);
 }
 
 export {createGravityFromModel};

src/internal/models/createGravityModel.ts

@@ -2,9 +2,11 @@ import {IGravity} from "../../qualifiers/gravity/GravityQualifier.js";
 import {CompassGravity, ICompassGravity} from "../../qualifiers/gravity/compassGravity/CompassGravity.js";
 import {AutoGravity} from "../../qualifiers/gravity/autoGravity/AutoGravity.js";
 import {AutoFocus} from "../../qualifiers/autoFocus.js";
+import {FocusOnGravity} from "../../qualifiers/gravity/focusOnGravity/FocusOnGravity.js";
+import {autoGravity} from "../../qualifiers/gravity.js";
 
 export interface IGravityModel {
-  gravityType?: string;
+  gravityType: string;
 }
 
 export interface ICompassGravityModel extends IGravityModel {
@@ -26,7 +28,7 @@ export interface IAutoGravityModel extends IGravityModel {
 
 export interface IFocusOnGravityModel extends IGravityModel {
   focusOnObjects: string[], // 'cat' | 'dog' etc
-  fallbackGravity: IAutoGravityModel
+  fallbackGravity?: IAutoGravityModel
 }
 
 /**
@@ -109,15 +111,41 @@ function createIAutoFocusObject(gravity: AutoFocus): IAutoGravityObjectModel {
  * Creates an auto gravity model from given AutoGravity
  * @param gravity
  */
-function createAutoGravityModel(gravity: AutoGravity): IAutoGravityModel {
-  const values = gravity.qualifierValue.values.filter((v) => v !== 'auto');
+function createAutoGravityModel(gravity: 'auto' | AutoGravity): IAutoGravityModel {
+  const gravityQualifier = gravity === 'auto' ? new AutoGravity() : gravity;
+  const values = gravityQualifier.qualifierValue.values.filter((v) => v !== 'auto');
   const autoFocus = values.map(createIAutoFocusObject);
 
   return {
+    gravityType: 'auto',
     autoFocus
   };
 }
 
+/**
+ * Create IFocusOnGravityModel from FocusOnGravity
+ * @param gravity
+ */
+function createFocusOnGravityModel(gravity: FocusOnGravity): IFocusOnGravityModel {
+  const hasAutoGravity = `${gravity}`.split(':').includes('auto');
+  const values = gravity.qualifierValue.values;
+  const focusOnValues = hasAutoGravity ? values.slice(0, values.length - 1) : values;
+
+  const result: IFocusOnGravityModel = {
+    gravityType: 'object',
+    focusOnObjects: focusOnValues.map((v) => `${v}`)
+  };
+
+  if (hasAutoGravity) {
+    // Remove the first 'auto' value by slicing it, because it's added by autoGravity()
+    const autoFocusObjects = values[values.length -1].values.slice(1);
+    const autoGravityInstance = autoGravity().autoFocus(...autoFocusObjects);
+    result.fallbackGravity = createAutoGravityModel(autoGravityInstance);
+  }
+
+  return result;
+}
+
 /**
  * Create a model of given gravity
  * @param gravity
@@ -131,7 +159,9 @@ export function createGravityModel(gravity: IGravity): IGravityModel {
     return createOcrGravityModel();
   }
 
-  if (isAutoGravity(gravity)) {
+  if (gravity === 'auto' || isAutoGravity(gravity)){
     return createAutoGravityModel(gravity);
   }
+
+  return createFocusOnGravityModel(gravity as FocusOnGravity);
 }