Version 2.1.0

New functionality and features ------------------------------ * New configuration parameter `:client_hints` * Enhanced auto `width` values * Enhanced `quality` values
cloudinary · Jun 22, 2016 · 83d2f9d · 83d2f9d
1 parent e5fc8f9
commit 83d2f9d
Show file tree

Hide file tree

Showing 29 changed files with 765 additions and 166 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,4 +1,24 @@
 
+2.1.0 / 2016-06-22
+==================
+
+New functionality and features
+------------------------------
+
+  * New configuration parameter `:client_hints`
+  * Enhanced auto `width` values
+  * Enhanced `quality` values
+
+Other Changes
+-------------
+
+  * Use duck-typing to set/get attributes.
+  * Updated dependencies
+  * Add `client_hints`, `width`, `quality` tests
+  * Create spec-helper.coffee. Add `sharedExamples`.
+  * Fix assets compilation issue with Cloudinary GEM cloudinary/cloudinary_gem#203
+  * Remove map reference in `js` folder. Fixes cloudinary/cloudinary_gem#199
+
 2.0.9 / 2016-06-05
 ==================
 

diff --git a/Gruntfile.coffee b/Gruntfile.coffee
@@ -61,26 +61,38 @@ module.exports = (grunt)->
         reporters: ['dots']
         configFile: 'karma.coffee'
         browserDisconnectTolerance: 3
+        files: [
+          { pattern: 'test/docRoot/*', watched: false, included: false, served: true, nocache: false}
+          { pattern: 'test/docRoot/css/*', watched: false, included: false, served: true, nocache: false}
+          { pattern: 'bower_components/bootstrap/dist/css/*', watched: false, included: false, served: true, nocache: false}
+          { pattern: 'bower_components/bootstrap/dist/js/*', watched: false, included: false, served: true, nocache: false}
+          { pattern: 'bower_components/blueimp-file-upload/js/*', watched: false, included: false, served: true, nocache: false}
+          { pattern: 'bower_components/jquery.ui/ui/*', watched: false, included: false, served: true, nocache: false}
+        ]
+
       'cloudinary-core':
         files:
           src:
             [
               "bower_components/lodash/lodash.js"
               "<%= karmaCommon %>"
+              "test/spec/responsive-core-spec.js"
             ]
 
 
       'cloudinary-core-shrinkwrap':
         files:
           src: [
               "<%= karmaCommon %>"
+              "test/spec/responsive-shrinkwrap-spec.js"
             ]
 
       'cloudinary-jquery':
         files:
           src: [
               "bower_components/jquery/dist/jquery.js"
               "<%= karmaCommon %>"
+              "test/spec/responsive-jquery-spec.js"
             ]
 
       'cloudinary-jquery-file-upload':
@@ -152,12 +164,12 @@ module.exports = (grunt)->
         files: for repo in repos
           dest = if /shrinkwrap/.test(repo) then "cloudinary-core" else repo
           {'cwd': 'build','src': ["#{repo}.js", "#{repo}.min.js", "#{repo}.min.js.map"], 'dest': "../pkg/pkg-#{dest}/", 'expand': true}
-      doc:
-        files: for repo in repos when !/shrinkwrap/.test(repo)
-          expand: true
-          cwd: "doc/pkg-#{repo}/"
-          src: ["**"]
-          dest: "../pkg/pkg-#{repo}/"
+#      doc:
+#        files: for repo in repos when !/shrinkwrap/.test(repo)
+#          expand: true
+#          cwd: "doc/pkg-#{repo}/"
+#          src: ["**"]
+#          dest: "../pkg/pkg-#{repo}/"
 
     version:
       options:
@@ -282,7 +294,7 @@ module.exports = (grunt)->
   grunt.loadNpmTasks('grunt-version')
 
   grunt.registerTask('default', ['concat', 'coffee'])
-  grunt.registerTask('compile', ['clean:build', 'clean:js', 'concat', 'coffee', 'copy:backward-compatible', 'copy:dist'])
+  grunt.registerTask('compile', ['clean:build', 'clean:js', 'concat', 'coffee', 'copy:backward-compatible'])
   grunt.registerTask('build', ['clean', 'concat', 'coffee', 'copy:backward-compatible', 'jsdoc'])
   grunt.registerTask('lodash', (name, target)->
     lodashCalls = grunt.file.read('src/util/lodash.coffee').match(/_\.\w+/g)

diff --git a/Gruntfile.js b/Gruntfile.js
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "cloudinary",
-  "version": "2.0.9",
+  "version": "2.1.0",
   "title": "Cloudinary jQuery Plugin",
   "authors": [
     {

diff --git a/js/jquery.cloudinary.js b/js/jquery.cloudinary.js
@@ -1,6 +1,6 @@
 
 /**
- * Cloudinary's JavaScript library - Version 2.0.9
+ * Cloudinary's JavaScript library - Version 2.1.0
  * Copyright Cloudinary
  * see https://github.com/cloudinary/cloudinary_js
  *
@@ -2391,6 +2391,12 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
       return element;
     };
 
+    HtmlTag.isResponsive = function(tag, responsiveClass) {
+      var dataSrc;
+      dataSrc = Util.getData(tag, 'src-cache') || Util.getData(tag, 'src');
+      return Util.hasClass(tag, responsiveClass) && /\bw_auto\b/.exec(dataSrc);
+    };
+
     return HtmlTag;
 
   })();
@@ -2839,9 +2845,9 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
 
   })(TextLayer);
   Cloudinary = (function() {
-    var AKAMAI_SHARED_CDN, CF_SHARED_CDN, DEFAULT_POSTER_OPTIONS, DEFAULT_VIDEO_SOURCE_TYPES, OLD_AKAMAI_SHARED_CDN, SHARED_CDN, VERSION, absolutize, applyBreakpoints, cdnSubdomainNumber, closestAbove, cloudinaryUrlPrefix, defaultBreakpoints, finalizeResourceType, parentWidth;
+    var AKAMAI_SHARED_CDN, CF_SHARED_CDN, DEFAULT_POSTER_OPTIONS, DEFAULT_VIDEO_SOURCE_TYPES, OLD_AKAMAI_SHARED_CDN, SHARED_CDN, VERSION, absolutize, applyBreakpoints, cdnSubdomainNumber, closestAbove, cloudinaryUrlPrefix, defaultBreakpoints, finalizeResourceType, findContainerWidth, maxWidth, updateDpr;
 
-    VERSION = "2.0.9";
+    VERSION = "2.1.0";
 
     CF_SHARED_CDN = "d3jpl91pxevbkh.cloudfront.net";
 
@@ -3360,11 +3366,11 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
      * @ignore
      */
 
-    Cloudinary.prototype.calc_breakpoint = function(element, width) {
+    Cloudinary.prototype.calc_breakpoint = function(element, width, steps) {
       var breakpoints, point;
       breakpoints = Util.getData(element, 'breakpoints') || Util.getData(element, 'stoppoints') || this.config('breakpoints') || this.config('stoppoints') || defaultBreakpoints;
       if (Util.isFunction(breakpoints)) {
-        return breakpoints(width);
+        return breakpoints(width, steps);
       } else {
         if (Util.isString(breakpoints)) {
           breakpoints = ((function() {
@@ -3419,8 +3425,11 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
       return dprString;
     };
 
-    defaultBreakpoints = function(width) {
-      return 100 * Math.ceil(width / 100);
+    defaultBreakpoints = function(width, steps) {
+      if (steps == null) {
+        steps = 100;
+      }
+      return steps * Math.ceil(width / steps);
     };
 
     closestAbove = function(list, value) {
@@ -3515,17 +3524,17 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
       return this;
     };
 
-    applyBreakpoints = function(tag, width, options) {
+    applyBreakpoints = function(tag, width, steps, options) {
       var ref, ref1, ref2, responsive_use_breakpoints;
       responsive_use_breakpoints = (ref = (ref1 = (ref2 = options['responsive_use_breakpoints']) != null ? ref2 : options['responsive_use_stoppoints']) != null ? ref1 : this.config('responsive_use_breakpoints')) != null ? ref : this.config('responsive_use_stoppoints');
       if ((!responsive_use_breakpoints) || (responsive_use_breakpoints === 'resize' && !options.resizing)) {
         return width;
       } else {
-        return this.calc_breakpoint(tag, width);
+        return this.calc_breakpoint(tag, width, steps);
       }
     };
 
-    parentWidth = function(element) {
+    findContainerWidth = function(element) {
       var containerWidth, style;
       containerWidth = 0;
       while (((element = element != null ? element.parentNode : void 0) instanceof Element) && !containerWidth) {
@@ -3537,6 +3546,20 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
       return containerWidth;
     };
 
+    updateDpr = function(dataSrc, roundDpr) {
+      return dataSrc.replace(/\bdpr_(1\.0|auto)\b/g, 'dpr_' + this.device_pixel_ratio(roundDpr));
+    };
+
+    maxWidth = function(requiredWidth, tag) {
+      var imageWidth;
+      imageWidth = Util.getData(tag, 'width') || 0;
+      if (requiredWidth > imageWidth) {
+        imageWidth = requiredWidth;
+        Util.setData(tag, 'width', requiredWidth);
+      }
+      return requiredWidth;
+    };
+
 
     /**
     * Update hidpi (dpr_auto) and responsive (w_auto) fields according to the current container size and the device pixel ratio.
@@ -3554,10 +3577,16 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
      */
 
     Cloudinary.prototype.cloudinary_update = function(elements, options) {
-      var client_hints, containerWidth, dataSrc, imageWidth, j, len, ref, ref1, ref2, ref3, ref4, ref5, ref6, ref7, requestedWidth, responsive, responsiveClass, roundDpr, setUrl, tag;
+      var client_hints, containerWidth, dataSrc, j, len, match, ref, ref1, ref2, ref3, ref4, ref5, ref6, ref7, requiredWidth, responsive, responsiveClass, roundDpr, setUrl, tag;
       if (options == null) {
         options = {};
       }
+      client_hints = (ref = (ref1 = options.client_hints) != null ? ref1 : this.config('client_hints')) != null ? ref : false;
+      client_hints = client_hints || (typeof document !== "undefined" && document !== null ? document.querySelector('meta[http-equiv="Accept-CH"]') : void 0);
+      if (client_hints) {
+        return;
+      }
+      responsive = (ref2 = (ref3 = options.responsive) != null ? ref3 : this.config('responsive')) != null ? ref2 : false;
       elements = (function() {
         switch (false) {
           case !Util.isArray(elements):
@@ -3570,32 +3599,33 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
             return [elements];
         }
       })();
-      responsiveClass = (ref = (ref1 = this.responsiveConfig['responsive_class']) != null ? ref1 : options['responsive_class']) != null ? ref : this.config('responsive_class');
-      roundDpr = (ref2 = options['round_dpr']) != null ? ref2 : this.config('round_dpr');
+      responsiveClass = (ref4 = (ref5 = this.responsiveConfig['responsive_class']) != null ? ref5 : options['responsive_class']) != null ? ref4 : this.config('responsive_class');
+      roundDpr = (ref6 = options['round_dpr']) != null ? ref6 : this.config('round_dpr');
       for (j = 0, len = elements.length; j < len; j++) {
         tag = elements[j];
-        if (!((ref3 = tag.tagName) != null ? ref3.match(/img/i) : void 0)) {
+        if (!((ref7 = tag.tagName) != null ? ref7.match(/img/i) : void 0)) {
           continue;
         }
         setUrl = true;
-        client_hints = (ref4 = (ref5 = options.client_hints) != null ? ref5 : this.config('client_hints')) != null ? ref4 : false;
-        responsive = (ref6 = (ref7 = options.responsive) != null ? ref7 : this.config('responsive')) != null ? ref6 : false;
         if (responsive && !client_hints) {
           Util.addClass(tag, responsiveClass);
         }
         dataSrc = Util.getData(tag, 'src-cache') || Util.getData(tag, 'src');
         if (!Util.isEmpty(dataSrc)) {
-          dataSrc = dataSrc.replace(/\bdpr_(1\.0|auto)\b/g, 'dpr_' + this.device_pixel_ratio(roundDpr));
-          if (Util.hasClass(tag, responsiveClass) && /\bw_auto\b/.exec(dataSrc)) {
-            containerWidth = parentWidth(tag);
+          dataSrc = updateDpr.call(this, dataSrc, roundDpr);
+          if (HtmlTag.isResponsive(tag, responsiveClass)) {
+            containerWidth = findContainerWidth(tag);
             if (containerWidth !== 0) {
-              requestedWidth = applyBreakpoints.call(this, tag, containerWidth, options);
-              imageWidth = Util.getData(tag, 'width') || 0;
-              if (requestedWidth > imageWidth) {
-                imageWidth = requestedWidth;
-                Util.setData(tag, 'width', requestedWidth);
+              switch (false) {
+                case !/w_auto:breakpoints/.test(dataSrc):
+                  requiredWidth = maxWidth(containerWidth, tag);
+                  dataSrc = dataSrc.replace(/w_auto:breakpoints([_0-9]*)(:[0-9]+)?/, "w_auto:breakpoints$1:" + requiredWidth);
+                  break;
+                case !(match = /w_auto(:(\d+))?/.exec(dataSrc)):
+                  requiredWidth = applyBreakpoints.call(this, tag, containerWidth, match[2], options);
+                  requiredWidth = maxWidth(requiredWidth, tag);
+                  dataSrc = dataSrc.replace(/w_auto[^,\/]*/g, "w_" + requiredWidth);
               }
-              dataSrc = dataSrc.replace(/\bw_auto\b/g, 'w_' + imageWidth);
               Util.removeAttribute(tag, 'width');
               if (!options.responsive_preserve_height) {
                 Util.removeAttribute(tag, 'height');
@@ -4033,7 +4063,7 @@ var extend = function(child, parent) { for (var key in parent) { if (hasProp.cal
     TextLayer: TextLayer,
     SubtitlesLayer: SubtitlesLayer,
     Cloudinary: Cloudinary,
-    VERSION: "2.0.9",
+    VERSION: "2.1.0",
     CloudinaryJQuery: CloudinaryJQuery
   };
   return cloudinary;

diff --git a/karma.cloudinary-core.coffee b/karma.cloudinary-core.coffee
@@ -5,7 +5,7 @@ module.exports = (config) ->
   config.set
 
     # base path that will be used to resolve all patterns (eg. files, exclude)
-    basePath: ''
+#    basePath: '.'
 
 
     # frameworks to use
@@ -23,6 +23,9 @@ module.exports = (config) ->
       'test/spec/tagspec.js'
       'test/spec/videourlspec.js'
       'test/spec/chaining-spec.js'
+      'test/spec/responsive-core-spec.js'
+      { pattern: 'test/docRoot/responsive-core-test.html', watched: false, included: false, served: true, nocache: false}
+      { pattern: 'bower_components/bootstrap/dist/css/*', watched: false, included: false, served: true, nocache: false}
     ]
 
     # preprocess matching files before serving them to the browser