next-cloudinary 1.6.0 → 1.8.0

package/dist/next-cloudinary.umd.js

@@ -247,6 +247,10 @@
       prefix: 'e',
       qualifier: 'improve'
     },
+    multiply: {
+      prefix: 'e',
+      qualifier: 'multiply'
+    },
     negate: {
       prefix: 'e',
       qualifier: 'negate'
@@ -262,6 +266,10 @@
       prefix: 'e',
       qualifier: 'outline'
     },
+    overlay: {
+      prefix: 'e',
+      qualifier: 'overlay'
+    },
     pixelate: {
       prefix: 'e',
       qualifier: 'pixelate'
@@ -286,6 +294,10 @@
       prefix: 'e',
       qualifier: 'saturation'
     },
+    screen: {
+      prefix: 'e',
+      qualifier: 'screen'
+    },
     sepia: {
       prefix: 'e',
       qualifier: 'sepia'
@@ -328,6 +340,57 @@
     }
   };
 
+  /**
+   * constructTransformation
+   */
+
+  function constructTransformation(_ref) {
+    var prefix = _ref.prefix,
+      qualifier = _ref.qualifier,
+      value = _ref.value;
+    var transformation = '';
+    if (prefix) {
+      transformation = prefix + "_";
+    }
+    if (value === true || value === 'true') {
+      return "" + transformation + qualifier;
+    }
+    if (typeof value === 'string' || typeof value === 'number') {
+      if (prefix) {
+        return "" + transformation + qualifier + ":" + value;
+      } else {
+        return qualifier + "_" + value;
+      }
+    }
+  }
+
+  /**
+   * Retrieves the transformations added to a cloudiary image url. If no transformation is recognized it returns an empty array.
+   *
+   * @param {string} src The cloudiary url.
+   *
+   * @return {array} The array of transformations
+   */
+
+  function getTransformations(src, preserveTransformations) {
+    if (typeof src !== "string") {
+      throw new Error("Invalid src of type " + typeof src);
+    }
+    if (src.includes("res.cloudinary.com") && preserveTransformations) {
+      var regex = new RegExp("(https?)://(res.cloudinary.com)/([^/]+)/(image|video|raw)/(upload|authenticated)/(.*)/(v[0-9]+)/(.+)(?:.[a-z]{3})?", "gi");
+      var groups = regex.exec(src);
+      var transformationStr = groups.slice(1).find(function (i) {
+        return i.includes("_");
+      });
+      if (transformationStr) {
+        return transformationStr.split(",").join("/").split("/");
+      } else {
+        return [];
+      }
+    }
+    return [];
+  }
+
   var props$6 = [].concat(Object.keys(effects), ['effects']);
   function plugin$6(_temp) {
     var _ref = _temp === void 0 ? {} : _temp,
@@ -358,36 +421,16 @@
         cldImage.effect(transformationString);
       });
     }
-
-    /**
-     * constructEffect
-     */
-
-    function constructEffect(_ref2) {
-      var effect = _ref2.effect,
-        value = _ref2.value;
-      var prefix = effect.prefix,
-        qualifier = effect.qualifier;
-      var transformation = '';
-      if (prefix) {
-        transformation = prefix + "_";
-      }
-      if (value === true) {
-        return "" + transformation + qualifier;
-      } else if (typeof value === 'string' || typeof value === 'number') {
-        if (prefix) {
-          return "" + transformation + qualifier + ":" + value;
-        } else {
-          return qualifier + "_" + value;
-        }
-      }
-    }
-    function constructTransformationString(_ref3) {
-      var effects = _ref3.effects,
-        options = _ref3.options;
+    function constructTransformationString(_ref2) {
+      var effects = _ref2.effects,
+        options = _ref2.options;
       return Object.keys(effects).map(function (key) {
-        return constructEffect({
-          effect: effects[key],
+        var _effects$key = effects[key],
+          prefix = _effects$key.prefix,
+          qualifier = _effects$key.qualifier;
+        return constructTransformation({
+          qualifier: qualifier,
+          prefix: prefix,
           value: options[key]
         });
       });
@@ -413,7 +456,7 @@
     }
   }
 
-  var _excluded$3 = ["publicId", "url", "position", "text", "effects"];
+  var _excluded$3 = ["publicId", "url", "position", "text", "effects", "appliedEffects"];
   var props$5 = ['text', 'overlays'];
   var DEFAULT_TEXT_OPTIONS = {
     color: 'black',
@@ -456,6 +499,8 @@
         text$1 = _ref2.text,
         _ref2$effects = _ref2.effects,
         layerEffects = _ref2$effects === void 0 ? [] : _ref2$effects,
+        _ref2$appliedEffects = _ref2.appliedEffects,
+        appliedEffects = _ref2$appliedEffects === void 0 ? [] : _ref2$appliedEffects,
         options = _objectWithoutPropertiesLoose(_ref2, _excluded$3);
       var hasPublicId = typeof publicId === 'string';
       var hasUrl = typeof url === 'string';
@@ -489,7 +534,11 @@
       Object.keys(options).forEach(function (key) {
         if (!primary[key]) return;
         var qualifier = primary[key].qualifier;
-        primary$1.push(qualifier + "_" + options[key]);
+        var transformation = constructTransformation({
+          qualifier: qualifier,
+          value: options[key]
+        });
+        primary$1.push(transformation);
       });
 
       // Layer effects
@@ -499,27 +548,33 @@
 
       layerEffects.forEach(function (effect) {
         Object.keys(effect).forEach(function (key) {
-          if (primary[key]) {
-            var qualifier = primary[key].qualifier;
-            primary$1.push(qualifier + "_" + effect[key]);
-          } else if (effects[key]) {
-            var _qualifiersEffects$ke = effects[key],
-              _qualifier = _qualifiersEffects$ke.qualifier,
-              prefix = _qualifiersEffects$ke.prefix;
-            var transformation = '';
-            if (prefix) {
-              transformation = prefix + "_";
-            }
-            if (effect[key] === true) {
-              primary$1.push("" + transformation + _qualifier);
-            } else if (typeof effect[key] === 'string' || typeof effect[key] === 'number') {
-              if (prefix) {
-                primary$1.push("" + transformation + _qualifier + ":" + effect[key]);
-              } else {
-                primary$1.push(_qualifier + "_" + effect[key]);
-              }
-            }
-          }
+          var _ref3 = primary[key] || effects[key] || {},
+            qualifier = _ref3.qualifier,
+            prefix = _ref3.prefix;
+          var transformation = constructTransformation({
+            qualifier: qualifier,
+            prefix: prefix,
+            value: effect[key]
+          });
+          primary$1.push(transformation);
+        });
+      });
+
+      // Applied Layer effects
+      // Similar to layer effects but they get appended to an additional transformation
+      // along with fl_layer_applied
+
+      appliedEffects.forEach(function (effect) {
+        Object.keys(effect).forEach(function (key) {
+          var _ref4 = primary[key] || effects[key] || {},
+            qualifier = _ref4.qualifier,
+            prefix = _ref4.prefix;
+          var transformation = constructTransformation({
+            qualifier: qualifier,
+            prefix: prefix,
+            value: effect[key]
+          });
+          applied.push(transformation);
         });
       });
 
@@ -556,7 +611,11 @@
         Object.keys(position$1).forEach(function (key) {
           if (!position[key]) return;
           var qualifier = position[key].qualifier;
-          applied.push(qualifier + "_" + position$1[key]);
+          var transformation = constructTransformation({
+            qualifier: qualifier,
+            value: position$1[key]
+          });
+          applied.push(transformation);
         });
       }
 
@@ -931,33 +990,6 @@
     return src;
   }
 
-  /**
-   * Retrieves the transformations added to a cloudiary image url. If no transformation is recognized it returns an empty array.
-   *
-   * @param {string} src The cloudiary url.
-   *
-   * @return {array} The array of transformations
-   */
-
-  function getTransformations(src, preserveTransformations) {
-    if (typeof src !== "string") {
-      throw new Error("Invalid src of type " + typeof src);
-    }
-    if (src.includes("res.cloudinary.com") && preserveTransformations) {
-      var regex = new RegExp("(https?)://(res.cloudinary.com)/([^/]+)/(image|video|raw)/(upload|authenticated)/(.*)/(v[0-9]+)/(.+)(?:.[a-z]{3})?", "gi");
-      var groups = regex.exec(src);
-      var transformationStr = groups.slice(1).find(function (i) {
-        return i.includes("_");
-      });
-      if (transformationStr) {
-        return transformationStr.split(",").join("/").split("/");
-      } else {
-        return [];
-      }
-    }
-    return [];
-  }
-
   /**
    * createPlaceholderUrl
    */
@@ -1292,6 +1324,8 @@
   exports.CldUploadButton = CldUploadButton;
   exports.CldUploadWidget = CldUploadWidget;
   exports.cloudinaryLoader = cloudinaryLoader;
+  exports.constructCloudinaryUrl = constructCloudinaryUrl;
+  exports.effects = effects;
   exports.position = position;
   exports.primary = primary;
   exports.text = text;