reworked textPath (see #705)

2 files changed, 48 insertions, 37 deletions

diff --git a/spec/spec/fx.js b/spec/spec/fx.js
index 4a54229..36c7f37 100644
--- a/spec/spec/fx.js
+++ b/spec/spec/fx.js
@@ -2072,23 +2072,25 @@ describe('FX', function() {
       var startValue = new SVG.PathArray('M10 80 C 40 10, 65 10, 95 80 S 150 150, 180 80')
         , endValue = new SVG.PathArray('M10 80 C 40 150, 65 150, 95 80 S 150 10, 180 80')
         , morph = new SVG.PathArray(startValue).morph(endValue)
+        , textPath
 
       var text = draw.text(function(add) {
         add.tspan("We go up and down, then we go down, then up again")
       })
 
-      fx = text.path(startValue).animate(500).plot(endValue)
+      textPath = text.path(startValue)
+      fx = textPath.animate(500).plot(endValue)
 
       fx.start()
-      expect(text.array()).toEqual(morph.at(0))
+      expect(textPath.array()).toEqual(morph.at(0))
 
       jasmine.clock().tick(250) // Have the animation be half way
       fx.step()
-      expect(text.array()).toEqual(morph.at(0.5))
+      expect(textPath.array()).toEqual(morph.at(0.5))
 
       jasmine.clock().tick(250) // Have the animation reach its end
       fx.step()
-      expect(text.array()).toEqual(morph.at(1))
+      expect(textPath.array()).toEqual(morph.at(1))
     })
 
     it('should allow plot to be called on a line', function() {
@@ -2151,21 +2153,22 @@ describe('FX', function() {
 
       var path = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100'
 
-      text.path(path).font({ size: 42.5, family: 'Verdana' })
+      var textPath = text.path(path).font({ size: 42.5, family: 'Verdana' })
+      
 
-      text.textPath().attr('startOffset', startValue)
-      fx = text.textPath().animate(1000).attr('startOffset', endValue)
+      textPath.attr('startOffset', startValue)
+      fx = textPath.animate(1000).attr('startOffset', endValue)
 
       fx.start()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(0).value)
+      expect(textPath.attr('startOffset')).toBe(morph.at(0).value)
 
       jasmine.clock().tick(500) // Have the animation be half way
       fx.step()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(0.5).value)
+      expect(textPath.attr('startOffset')).toBe(morph.at(0.5).value)
 
       jasmine.clock().tick(500) // Have the animation reach its end
       fx.step()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(1).value)
+      expect(textPath.attr('startOffset')).toBe(morph.at(1).value)
     })
 
     it('should be possible to animate non-numeric attributes', function () {
@@ -2220,21 +2223,21 @@ describe('FX', function() {
 
       var path = 'M 100 200 C 200 100 300 0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100'
 
-      text.path(path).font({ size: 42.5, family: 'Verdana' })
+      var textPath = text.path(path).font({ size: 42.5, family: 'Verdana' })
 
-      text.textPath().attr('startOffset', startValue)
-      fx = text.textPath().animate(1000).attr('startOffset', endValue)
+      textPath.attr('startOffset', startValue)
+      fx = textPath.animate(1000).attr('startOffset', endValue)
 
       fx.start()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(0).toString())
+      expect(textPath.attr('startOffset')).toBe(morph.at(0).toString())
 
       jasmine.clock().tick(500) // Have the animation be half way
       fx.step()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(0.5).toString())
+      expect(textPath.attr('startOffset')).toBe(morph.at(0.5).toString())
 
       jasmine.clock().tick(500) // Have the animation reach its end
       fx.step()
-      expect(text.textPath().attr('startOffset')).toBe(morph.at(1).toString())
+      expect(textPath.attr('startOffset')).toBe(morph.at(1).toString())
     })
 
     it('should allow 0 to be specified without unit', function () {
diff --git a/spec/spec/textpath.js b/spec/spec/textpath.js
index ee046ea..e64f721 100644
--- a/spec/spec/textpath.js
+++ b/spec/spec/textpath.js
@@ -1,33 +1,49 @@
 describe('TextPath', function() {
   var text
+    , path
+    , txt = 'We go up, then we go down, then up again'
     , data = 'M 100 200 C 200 100 300  0 400 100 C 500 200 600 300 700 200 C 800 100 900 100 900 100'
 
   beforeEach(function() {
-    text = draw.text('We go up, then we go down, then up again')
+    text = draw.text(txt)
+    path = draw.path(data)
   })
 
   afterEach(function() {
     draw.clear()
   })
 
-  describe('path()', function() {
-    it('returns the text element', function() {
-      expect(text.path(data)).toBe(text)
+  describe('text().path()', function() {
+    it('returns an instance of TextPath', function() {
+      expect(text.path(data) instanceof SVG.TextPath).toBe(true)
     })
     it('creates a textPath node in the text element', function() {
       text.path(data)
-      expect(text.node.firstChild.nodeName).toBe('textPath')
+      expect(text.node.querySelector('textPath')).not.toBe(null)
+    })
+  })
+
+  describe('path().text()', function() {
+    it('returns an instance of TextPath', function() {
+      expect(path.text(txt) instanceof SVG.TextPath).toBe(true)
+    })
+    it('creates a text with textPath node and inserts it after the path', function() {
+      var instance = path.text(txt)
+      expect(instance.parent() instanceof SVG.Text).toBe(true)
+      expect(SVG.adopt(path.node.nextSibling) instanceof SVG.Text).toBe(true)
     })
   })
 
   describe('textPath()', function() {
-    it('creates a reference to the textPath', function() {
-      expect(text.path(data).textPath() instanceof SVG.TextPath).toBe(true)
+    it('returns all textPath elements in a text', function() {
+      text.path(data)
+      expect(text.textPath().length).toBe(1)
+      expect(text.textPath()[0] instanceof SVG.TextPath).toBe(true)
     })
   })
 
   describe('track()', function() {
-    it('creates a reference to the path', function() {
+    it('returns the referenced path instance', function() {
       expect(text.path(data).track() instanceof SVG.Path).toBe(true)
     })
   })
@@ -37,26 +53,18 @@ describe('TextPath', function() {
       expect(text.path(data).array()).toEqual(new SVG.PathArray(data))
     })
     it('return null if there is no underlying path', function () {
-      expect(text.array()).toBe(null)
+      expect(text.path(data).attr('href', null, SVG.xlink).array()).toBe(null)
     })
   })
 
   describe('plot()', function() {
     it('change the array of the underlying path when a string is passed', function() {
-      expect(text.path().plot(data)).toBe(text)
-      expect(text.array()).toEqual(new SVG.PathArray(data))
-    })
-    it('do nothing when a string is passed and there is no underlying path', function() {
-      expect(text.plot(data)).toBe(text)
-      expect(text.array()).toEqual(null)
+      expect(text.path().plot(data).array()).toEqual(new SVG.PathArray(data))
     })
     it('return the path array of the underlying path when no arguments is passed', function () {
-      text.path(data)
-      expect(text.plot()).toBe(text.array())
-      expect(text.plot()).not.toBe(null)
-    })
-    it('return null when no arguments is passed and there is no underlying path', function () {
-      expect(text.plot()).toBe(null)
+      var textPath = text.path(data)
+      expect(textPath.plot()).toBe(textPath.array())
+      expect(textPath.plot()).not.toBe(null)
     })
   })
 })