Fixed bug in event detaching

4 files changed, 347 insertions, 46 deletions

diff --git a/spec/index.html b/spec/index.html
index ccd8e4a..db1ae59 100755
--- a/spec/index.html
+++ b/spec/index.html
@@ -57,7 +57,7 @@
 <script src="spec/memory.js"></script>
 <script src="spec/arrange.js"></script>
 <script src="spec/event.js"></script>
-<script src="spec/bbox.js"></script>
+<script src="spec/boxes.js"></script>
 <script src="spec/matrix.js"></script>
 <script src="spec/rect.js"></script>
 <script src="spec/circle.js"></script>
diff --git a/spec/spec/bbox.js b/spec/spec/bbox.js
deleted file mode 100755
index 44c1eb8..0000000
--- a/spec/spec/bbox.js
+++ /dev/null
@@ -1,43 +0,0 @@
-describe('BBox', function() {
-  
-  afterEach(function() {
-    draw.clear()
-  })
-  
-  it('creates a new instance without passing an element', function() {
-    var box = new SVG.BBox
-    expect(box.x).toBe(0)
-    expect(box.y).toBe(0)
-    expect(box.cx).toBe(0)
-    expect(box.cy).toBe(0)
-    expect(box.width).toBe(0)
-    expect(box.height).toBe(0)
-  })
-  
-  describe('merge()', function() {
-    it('merges various bounding boxes', function() {
-      var box1 = draw.rect(100,100).move(50,50).bbox()
-      var box2 = draw.rect(100,100).move(300,400).bbox()
-      var box3 = draw.rect(100,100).move(500,100).bbox()
-      var merged = box1.merge(box2).merge(box3)
-      expect(merged.x).toBe(50)
-      expect(merged.y).toBe(50)
-      expect(merged.cx).toBe(325)
-      expect(merged.cy).toBe(275)
-      expect(merged.width).toBe(550)
-      expect(merged.height).toBe(450)
-    })
-    it('returns a new bbox instance', function() {
-      var box1 = draw.rect(100,100).move(50,50).bbox()
-      var box2 = draw.rect(100,100).move(300,400).bbox()
-      var merged = box1.merge(box2)
-      expect(box1).not.toBe(merged)
-      expect(box2).not.toBe(merged)
-      expect(box1.x).toBe(50)
-      expect(box1.y).toBe(50)
-      expect(box2.x).toBe(300)
-      expect(box2.y).toBe(400)
-    })
-  })
-  
-})
\ No newline at end of file
diff --git a/spec/spec/boxes.js b/spec/spec/boxes.js
new file mode 100755
index 0000000..a6ff0bf
--- /dev/null
+++ b/spec/spec/boxes.js
@@ -0,0 +1,206 @@
+describe('BBox', function() {
+  
+  afterEach(function() {
+    draw.clear()
+  })
+  
+  it('creates a new instance without passing an element', function() {
+    var box = new SVG.BBox
+    expect(box.x).toBe(0)
+    expect(box.y).toBe(0)
+    expect(box.cx).toBe(0)
+    expect(box.cy).toBe(0)
+    expect(box.width).toBe(0)
+    expect(box.height).toBe(0)
+  })
+  
+  describe('merge()', function() {
+    it('merges various bounding boxes', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var box3 = draw.rect(100,100).move(500,100).bbox()
+      var merged = box1.merge(box2).merge(box3)
+      expect(merged.x).toBe(50)
+      expect(merged.y).toBe(50)
+      expect(merged.cx).toBe(325)
+      expect(merged.cy).toBe(275)
+      expect(merged.width).toBe(550)
+      expect(merged.height).toBe(450)
+    })
+    it('returns a new bbox instance', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var merged = box1.merge(box2)
+      expect(box1).not.toBe(merged)
+      expect(box2).not.toBe(merged)
+      expect(box1.x).toBe(50)
+      expect(box1.y).toBe(50)
+      expect(box2.x).toBe(300)
+      expect(box2.y).toBe(400)
+    })
+  })
+  
+})
+
+describe('TBox', function() {
+  
+  afterEach(function() {
+    draw.clear()
+  })
+  
+  it('creates a new instance without passing an element', function() {
+    var box = new SVG.TBox
+    expect(box.x).toBe(0)
+    expect(box.y).toBe(0)
+    expect(box.cx).toBe(0)
+    expect(box.cy).toBe(0)
+    expect(box.width).toBe(0)
+    expect(box.height).toBe(0)
+  })
+  
+  describe('merge()', function() {
+    it('merges various bounding boxes', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var box3 = draw.rect(100,100).move(500,100).bbox()
+      var merged = box1.merge(box2).merge(box3)
+      expect(merged.x).toBe(50)
+      expect(merged.y).toBe(50)
+      expect(merged.cx).toBe(325)
+      expect(merged.cy).toBe(275)
+      expect(merged.width).toBe(550)
+      expect(merged.height).toBe(450)
+    })
+    it('returns a new bbox instance', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var merged = box1.merge(box2)
+      expect(box1).not.toBe(merged)
+      expect(box2).not.toBe(merged)
+      expect(box1.x).toBe(50)
+      expect(box1.y).toBe(50)
+      expect(box2.x).toBe(300)
+      expect(box2.y).toBe(400)
+    })
+  })
+  
+})
+
+describe('RBox', function() {
+  
+  afterEach(function() {
+    draw.clear()
+  })
+  
+  it('creates a new instance without passing an element', function() {
+    var box = new SVG.RBox
+    expect(box.x).toBe(0)
+    expect(box.y).toBe(0)
+    expect(box.cx).toBe(0)
+    expect(box.cy).toBe(0)
+    expect(box.width).toBe(0)
+    expect(box.height).toBe(0)
+  })
+  
+  describe('merge()', function() {
+    it('merges various bounding boxes', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var box3 = draw.rect(100,100).move(500,100).bbox()
+      var merged = box1.merge(box2).merge(box3)
+      expect(merged.x).toBe(50)
+      expect(merged.y).toBe(50)
+      expect(merged.cx).toBe(325)
+      expect(merged.cy).toBe(275)
+      expect(merged.width).toBe(550)
+      expect(merged.height).toBe(450)
+    })
+    it('returns a new bbox instance', function() {
+      var box1 = draw.rect(100,100).move(50,50).bbox()
+      var box2 = draw.rect(100,100).move(300,400).bbox()
+      var merged = box1.merge(box2)
+      expect(box1).not.toBe(merged)
+      expect(box2).not.toBe(merged)
+      expect(box1.x).toBe(50)
+      expect(box1.y).toBe(50)
+      expect(box2.x).toBe(300)
+      expect(box2.y).toBe(400)
+    })
+  })
+  
+})
+
+describe('Boxes', function() {
+  var rect
+
+  beforeEach(function() {
+    rect = draw.rect(50, 180).move(25, 90).scale(2, 3, 25, 90).translate(10, 11)
+  })
+  afterEach(function() {
+    draw.clear()
+  })
+
+  describe('bbox()', function() {
+    it('returns an instance of SVG.BBox', function() {
+      expect(rect.bbox() instanceof SVG.BBox).toBeTruthy()
+    })
+    it('matches the size of the target element, ignoring transformations', function() {
+      var box = rect.bbox()
+      expect(box.x).toBe(25)
+      expect(box.y).toBe(90)
+      expect(box.cx).toBe(50)
+      expect(box.cy).toBe(180)
+      expect(box.width).toBe(50)
+      expect(box.height).toBe(180)
+      expect(box.w).toBe(50)
+      expect(box.h).toBe(180)
+      expect(box.x2).toBe(75)
+      expect(box.y2).toBe(270)
+    })
+  })
+
+  describe('tbox()', function() {
+    it('returns an instance of SVG.TBox', function() {
+      expect(rect.tbox() instanceof SVG.TBox).toBeTruthy()
+    })
+    it('matches the size of the target element, including transformations', function() {
+      var box = rect.tbox()
+      expect(box.x).toBe(60)
+      expect(box.y).toBe(281)
+      expect(box.cx).toBe(110)
+      expect(box.cy).toBe(551)
+      expect(box.width).toBe(100)
+      expect(box.height).toBe(540)
+      expect(box.w).toBe(100)
+      expect(box.h).toBe(540)
+      expect(box.x2).toBe(160)
+      expect(box.y2).toBe(821)
+    })
+  })
+
+  describe('rbox()', function() {
+    it('returns an instance of SVG.RBox', function() {
+      expect(rect.rbox() instanceof SVG.RBox).toBeTruthy()
+    })
+    it('matches the size of the target element, including transformations', function() {
+      var box = rect.rbox()
+      expect(box.x).toBe(60)
+      expect(box.y).toBe(281)
+      expect(box.cx).toBe(110)
+      expect(box.cy).toBe(551)
+      expect(box.width).toBe(100)
+      expect(box.height).toBe(540)
+      expect(box.w).toBe(100)
+      expect(box.h).toBe(540)
+      expect(box.x2).toBe(160)
+      expect(box.y2).toBe(821)
+    })
+  })
+
+})
+
+
+
+
+
+
diff --git a/spec/spec/event.js b/spec/spec/event.js
index f6c271e..01e6e7d 100644
--- a/spec/spec/event.js
+++ b/spec/spec/event.js
@@ -1,5 +1,6 @@
 describe('Event', function() {
-  var rect, toast, context
+  var rect, context
+    , toast = null
     , action = function() {
         toast = 'ready'
         context = this
@@ -29,6 +30,9 @@ describe('Event', function() {
         dispatchEvent(rect.click(action), 'click')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.click(action)).toBe(rect)
+      })
     })
 
     describe('dblclick()', function() {
@@ -45,6 +49,9 @@ describe('Event', function() {
         dispatchEvent(rect.dblclick(action), 'dblclick')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.dblclick(action)).toBe(rect)
+      })
     })
 
     describe('mousedown()', function() {
@@ -61,6 +68,9 @@ describe('Event', function() {
         dispatchEvent(rect.mousedown(action), 'mousedown')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mousedown(action)).toBe(rect)
+      })
     })
 
     describe('mouseup()', function() {
@@ -77,6 +87,9 @@ describe('Event', function() {
         dispatchEvent(rect.mouseup(action), 'mouseup')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mouseup(action)).toBe(rect)
+      })
     })
 
     describe('mouseover()', function() {
@@ -93,6 +106,9 @@ describe('Event', function() {
         dispatchEvent(rect.mouseover(action), 'mouseover')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mouseover(action)).toBe(rect)
+      })
     })
 
     describe('mouseout()', function() {
@@ -109,6 +125,9 @@ describe('Event', function() {
         dispatchEvent(rect.mouseout(action), 'mouseout')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mouseout(action)).toBe(rect)
+      })
     })
 
     describe('mousemove()', function() {
@@ -125,6 +144,9 @@ describe('Event', function() {
         dispatchEvent(rect.mousemove(action), 'mousemove')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mousemove(action)).toBe(rect)
+      })
     })
 
     describe('mouseenter()', function() {
@@ -141,6 +163,9 @@ describe('Event', function() {
         dispatchEvent(rect.mouseenter(action), 'mouseenter')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mouseenter(action)).toBe(rect)
+      })
     })
 
     describe('mouseleave()', function() {
@@ -157,6 +182,9 @@ describe('Event', function() {
         dispatchEvent(rect.mouseleave(action), 'mouseleave')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.mouseleave(action)).toBe(rect)
+      })
     })
 
   } else {
@@ -175,6 +203,9 @@ describe('Event', function() {
         dispatchEvent(rect.touchstart(action), 'touchstart')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.touchstart(action)).toBe(rect)
+      })
     })
 
     describe('touchmove()', function() {
@@ -191,6 +222,9 @@ describe('Event', function() {
         dispatchEvent(rect.touchmove(action), 'touchmove')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.touchmove(action)).toBe(rect)
+      })
     })
 
     describe('touchleave()', function() {
@@ -207,6 +241,9 @@ describe('Event', function() {
         dispatchEvent(rect.touchleave(action), 'touchleave')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.touchleave(action)).toBe(rect)
+      })
     })
 
     describe('touchend()', function() {
@@ -223,6 +260,9 @@ describe('Event', function() {
         dispatchEvent(rect.touchend(action), 'touchend')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.touchend(action)).toBe(rect)
+      })
     })
 
     describe('touchcancel()', function() {
@@ -239,8 +279,106 @@ describe('Event', function() {
         dispatchEvent(rect.touchcancel(action), 'touchcancel')
         expect(context).toBe(rect)
       })
+      it('returns the called element', function() {
+        expect(rect.touchcancel(action)).toBe(rect)
+      })
     })
 
   }
 
-})
\ No newline at end of file
+  describe('registerEvent()', function() {
+    it('creates a new custom event and stores it in the events object', function() {
+      expect(SVG.events['my:event']).toBeUndefined()
+      SVG.registerEvent('my:event')
+      expect(SVG.events['my:event'] instanceof CustomEvent).toBeTruthy()
+    })
+  })
+
+  describe('on()', function() {
+
+    beforeEach(function() {
+      SVG.registerEvent('my:event')
+    })
+
+    it('attaches and event to the element', function() {
+      dispatchEvent(rect.on('my:event', action), 'my:event')
+      expect(toast).toBe('ready')
+    })
+    it('applies the element as context', function() {
+      dispatchEvent(rect.on('my:event', action), 'my:event')
+      expect(context).toBe(rect)
+    })
+    it('stores the listener for future reference', function() {
+      rect.on('my:event', action)
+      expect(SVG.listeners[rect.node]['my:event'][action]).not.toBeUndefined()
+    })
+    it('returns the called element', function() {
+      expect(rect.on('my:event', action)).toBe(rect)
+    })
+  })
+
+  describe('off()', function() {
+    var butter = null
+
+    beforeEach(function() {
+      butter = null
+      SVG.registerEvent('my:event')
+    })
+
+    it('detaches a specific event listener', function() {
+      rect.on('my:event', action)
+      rect.off('my:event', action)
+      dispatchEvent(rect, 'my:event')
+      expect(toast).toBeNull()
+      expect(SVG.listeners[rect.node]['my:event'][action]).toBeUndefined()
+    })
+    it('detaches all listeners for an event without a listener given', function() {
+      rect.on('my:event', action)
+      rect.on('my:event', function() { butter = 'melting' })
+      rect.off('my:event')
+      dispatchEvent(rect, 'my:event')
+      expect(toast).toBeNull()
+      expect(butter).toBeNull()
+      expect(SVG.listeners[rect.node]['my:event']).toBeUndefined()
+    })
+    it('detaches all listeners without an argument', function() {
+      rect.on('my:event', action)
+      rect.on('click', function() { butter = 'melting' })
+      rect.off()
+      dispatchEvent(rect, 'my:event')
+      dispatchEvent(rect, 'click')
+      expect(toast).toBeNull()
+      expect(butter).toBeNull()
+      expect(SVG.listeners[rect.node]).toBeUndefined()
+    })
+    it('returns the called element', function() {
+      expect(rect.off('my:event', action)).toBe(rect)
+    })
+  })
+
+  describe('fire()', function() {
+
+    beforeEach(function() {
+      SVG.registerEvent('my:event')
+      rect.on('my:event', action)
+    })
+
+    it('fires an event for the element', function() {
+      expect(toast).toBeNull()
+      rect.fire('my:event')
+      expect(toast).toBe('ready')
+    })
+    it('returns the called element', function() {
+      expect(rect.fire('my:event')).toBe(rect)
+    })
+
+  })
+
+})
+
+
+
+
+
+
+