limit corner radius

CHANGELOG.md

@@ -1,3 +1,10 @@
+## 5.2.1
+
+* Bug Fixes
+
+* Enhancements
+    * `cornerRadius` of Rect is limited by `width/2` and `height/2`
+
 ## 5.2.0 2014-01-22
 
 * Bug Fixes

bower.json

@@ -1,10 +1,10 @@
 {
   "name": "KineticJS",
-  "version": "5.2.0",
+  "version": "5.1.10",
-  "homepage": "http://kineticjs.com/",
   "authors": [
     "Eric Rowell", "Anton Lavrenov"
   ],
+  "homepage": "http://lavrton.github.io/KineticJS/",
   "description": "KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.",
   "keywords": [
     "canvas",
@@ -16,17 +16,14 @@
   "ignore": [
     "**/.*",
     "test",
-    "tests",
+    "resources",
-    "doc-includes",
     "src",
     "*.yml",
     ".jshitrc",
     ".npmignore",
+    ".travis.yml",
     ".gitignore",
-    "Gruntfile.js",
+    "Gruntfile.js"
-    "bower-template.json",
-    "server.js",
-    "presentation-schedule.md"
   ],
-  "main": "kinetic.js"
+  "main": "kinetic.min.js"
 }

resources/bower-template.json

@@ -1,10 +1,10 @@
 {
   "name": "KineticJS",
   "version": "@@version",
-  "homepage": "http://kineticjs.com/",
   "authors": [
     "Eric Rowell", "Anton Lavrenov"
   ],
+  "homepage": "http://lavrton.github.io/KineticJS/",
   "description": "KineticJS is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.",
   "keywords": [
     "canvas",
@@ -16,17 +16,14 @@
   "ignore": [
     "**/.*",
     "test",
-    "tests",
+    "resources",
-    "doc-includes",
     "src",
     "*.yml",
     ".jshitrc",
     ".npmignore",
+    ".travis.yml",
     ".gitignore",
-    "Gruntfile.js",
+    "Gruntfile.js"
-    "bower-template.json",
-    "server.js",
-    "presentation-schedule.md"
   ],
-  "main": "kinetic.js"
+  "main": "kinetic.min.js"
 }

src/shapes/Rect.js

@@ -41,6 +41,7 @@
             }
             else {
                 // arcTo would be nicer, but browser support is patchy (Opera)
+                cornerRadius = Math.min(cornerRadius, width / 2, height / 2);
                 context.moveTo(cornerRadius, 0);
                 context.lineTo(width - cornerRadius, 0);
                 context.arc(width - cornerRadius, cornerRadius, cornerRadius, Math.PI * 3 / 2, 0, false);

test/unit/shapes/Rect-test.js

@@ -178,4 +178,30 @@ suite('Rect', function(){
       compareLayerAndCanvas(layer, canvas);
   });
 
+    // ======================================================
+    test('limit corner radius', function() {
+        var stage = addStage();
+        var layer = new Kinetic.Layer();
+        var rect = new Kinetic.Rect({
+            x: 50,
+            y: 50,
+            width: 100,
+            height: 100,
+            fill: 'black',
+            cornerRadius : 100
+        });
+
+        layer.add(rect);
+        stage.add(layer);
+
+        // as corner radius is much bigger we should have circe in the result
+        var canvas = createCanvas();
+        var context = canvas.getContext('2d');
+        context.beginPath();
+        context.arc(100, 100, 50, 0, Math.PI * 2);
+        context.fillStyle = 'black';
+        context.fill();
+        compareLayerAndCanvas(layer, canvas);
+    });
+
 });