diff --git a/dist/p5.svg.js b/dist/p5.svg.js index 69e18e5..caca818 100644 --- a/dist/p5.svg.js +++ b/dist/p5.svg.js @@ -1,5 +1,5 @@ ;(function() { -/*! p5.svg.js v0.1.1 June 17, 2015 */ +/*! p5.svg.js v0.1.1 June 18, 2015 */ var core, p5SVGElement, svgcanvas, renderingsvg, io, src_app; (function (root, factory) { if (typeof define === 'function' && define.amd) @@ -1367,7 +1367,7 @@ var core, p5SVGElement, svgcanvas, renderingsvg, io, src_app; p5.prototype.noSVG = function () { if (this.svg) { this.svg.remove(); - this.svg = null; + this.svg = null; // this.canvas = null; } }; /** @@ -1574,11 +1574,11 @@ var core, p5SVGElement, svgcanvas, renderingsvg, io, src_app; 'jpeg', 'png', 'jpg', - 'svg' + 'svg', + '' ]; - var ext = this._checkFileExtension(filename, ''); + var ext = this._checkFileExtension(filename, '')[1]; var useSVG = svg && svg.nodeName && svg.nodeName.toLowerCase() === 'svg' && supportedExtensions.indexOf(ext) > -1; - useSVG = useSVG || arguments.length === 0; if (useSVG) { this.saveSVG(svg, filename); } else { diff --git a/logs.md b/logs.md index 26fa006..bd42e75 100644 --- a/logs.md +++ b/logs.md @@ -324,3 +324,9 @@ - Rewrite svg2img, _makeSVGFrame and saveSVG to allow saving a non-default SVG - add noSVG + +- Extends p5's save method with SVG support + +- Unit test for pending jobs in saveFrames + +- Unit tests for save() diff --git a/src/io.js b/src/io.js index 8d4f81a..ff77903 100644 --- a/src/io.js +++ b/src/io.js @@ -217,11 +217,10 @@ define(function (require) { svg = svg || this.svg; var filename = args[0]; - var supportedExtensions = ['jpeg', 'png', 'jpg', 'svg']; - var ext = this._checkFileExtension(filename, ''); + var supportedExtensions = ['jpeg', 'png', 'jpg', 'svg', '']; + var ext = this._checkFileExtension(filename, '')[1]; var useSVG = svg && svg.nodeName && svg.nodeName.toLowerCase() === 'svg' && supportedExtensions.indexOf(ext) > -1; - useSVG = useSVG || arguments.length === 0; if (useSVG) { this.saveSVG(svg, filename); diff --git a/src/rendering/svg.js b/src/rendering/svg.js index af40e6d..af07b14 100644 --- a/src/rendering/svg.js +++ b/src/rendering/svg.js @@ -47,6 +47,7 @@ define(function(require) { if (this.svg) { this.svg.remove(); this.svg = null; + // this.canvas = null; } }; diff --git a/test/index.html b/test/index.html index ff73af7..e99c416 100644 --- a/test/index.html +++ b/test/index.html @@ -40,7 +40,9 @@

SVG & Canvas

"unit/shape/attributes", "unit/shape/vertex", "unit/shape/curves", - "unit/io/io", + "unit/io/save", + "unit/io/save-svg", + "unit/io/save-frames", "unit/rendering/rendering" ], function() { mocha.run(); diff --git a/test/unit/io/io.js b/test/unit/io/io.js deleted file mode 100644 index f06bbb9..0000000 --- a/test/unit/io/io.js +++ /dev/null @@ -1,189 +0,0 @@ -define(function(require) { - var p5 = require('p5'); - require('p5.svg'); - var assert = require('chai').assert; - - var testDownload = function(filename, ext, fn, done) { - new p5(function(p) { - p.setup = function() { - p.createSVG(100, 100); - p.background(255); - p.stroke(0, 0, 0); - p.line(0, 0, 100, 100); - - p.downloadFile = function(dataURL, _filename, _ext) { - try { - assert.notEqual(dataURL.indexOf('image/octet-stream'), -1); - assert.equal(_filename, filename); - assert.equal(_ext, ext); - done(); - p.svg.remove(); - } catch(e) { - done(e); - } - }; - fn(p); - }; - }); - }; - - describe('IO', function() { - - describe('IO/save', function() { - it('save()', function(done) { - testDownload('untitled', 'svg', function(p) { - p.save(); - }, done); - }); - }); - - describe('IO/saveSVG', function() { - - it('should save untitled.svg', function(done) { - testDownload('untitled', 'svg', function(p) { - p.saveSVG(); - }, done); - }); - it('should save hello.svg', function(done) { - testDownload('hello', 'svg', function(p) { - p.saveSVG('hello.svg'); - }, done); - }); - it('should save hello.jpg', function(done) { - testDownload('hello', 'jpg', function(p) { - p.saveSVG('hello', 'jpg'); - }, done); - }); - it('should save hello.jpeg', function(done) { - testDownload('hello', 'jpeg', function(p) { - p.saveSVG('hello.jpeg'); - }, done); - }); - it('should save hello.png', function(done) { - testDownload('hello', 'png', function(p) { - p.saveSVG('hello.png'); - }, done); - }); - it('source is Graphics', function(done) { - testDownload('source-graphics', 'png', function(p) { - p.saveSVG(p._defaultGraphics, 'source-graphics.png'); - }, done); - }); - it('source is ', function(done) { - testDownload('source-svg', 'png', function(p) { - p.saveSVG(p.svg, 'source-svg.png'); - }, done); - }); - it('should throw if given unsupported type', function() { - new p5(function(p) { - p.setup = function() { - p.createSVG(100, 100); - p.background(255); - p.stroke(0, 0, 0); - p.line(0, 0, 100, 100); - assert.throws(function() { - p.saveSVG('hello.txt'); - }); - p.svg.remove(); - }; - }); - }); - }); - - describe('IO/saveFrames', function() { - it('should capture canvas frames', function(done) { - new p5(function(p) { - p.setup = function() { - p.createCanvas(100, 100); - p.strokeWeight(3); - p.saveFrames('hello', 'png', 0.5, 10, function(frames) { - try { - assert.ok(frames.length > 1); - done(); - } catch (e) { - done(e); - } - p.canvas.remove(); - }); - }; - p.draw = function() { - var i = p.frameCount * 2; - p.line(0, 0, i, i); - }; - }); - }); - - it('should capture svg frames', function(done) { - new p5(function(p) { - p.setup = function() { - p.createSVG(100, 100); - p.strokeWeight(3); - p.saveFrames('hello', 'svg', 0.5, 10, function(frames) { - try { - assert.ok(frames.length > 1); - done(); - } catch (e) { - done(e); - } - p.svg.remove(); - }); - }; - p.draw = function() { - var i = p.frameCount * 2; - p.line(0, 0, i, i); - }; - }); - }); - - it('should download svg frames', function(done) { - new p5(function(p) { - p.setup = function() { - p.createSVG(100, 100); - var _downloadFile = p.downloadFile; - var count = 0; - p.downloadFile = function() { - count++; - if (count > 1) { - done(); - p.svg.remove(); - } - }; - p.saveFrames('hello', 'svg', 0.5, 10); - }; - p.draw = function() { - var i = p.frameCount * 2; - p.line(0, 0, i, i); - }; - }); - }); - - it('should wait all pending jobs done', function(done) { - new p5(function(p) { - p.setup = function() { - p.createSVG(100, 100); - var _downloadFile = p.downloadFile; - var count = 0; - p._makeSVGFrame = function(options) { - // slow version - setTimeout(function() { - options.callback(); - }, 500); - }; - p.downloadFile = function() { - count++; - if (count > 1) { - done(); - p.svg.remove(); - } - }; - p.saveFrames('hello', 'svg', 0.5, 10); - }; - p.draw = function() { - var i = p.frameCount * 2; - p.line(0, 0, i, i); - }; - }); - }); - }); - }); -}); diff --git a/test/unit/io/save-frames.js b/test/unit/io/save-frames.js new file mode 100644 index 0000000..4e032ec --- /dev/null +++ b/test/unit/io/save-frames.js @@ -0,0 +1,128 @@ +define(function(require) { + var p5 = require('p5'); + require('p5.svg'); + var assert = require('chai').assert; + + describe('IO/saveFrames', function() { + it('should capture canvas frames', function(done) { + new p5(function(p) { + p.setup = function() { + p.createCanvas(100, 100); + p.strokeWeight(3); + p.saveFrames('hello', 'png', 0.5, 10, function(frames) { + try { + assert.ok(frames.length > 1); + done(); + } catch (e) { + done(e); + } finally { + p.noCanvas(); + } + }); + }; + p.draw = function() { + var i = p.frameCount * 2; + p.line(0, 0, i, i); + }; + }); + }); + + it('should capture svg frames', function(done) { + new p5(function(p) { + p.setup = function() { + p.createSVG(100, 100); + p.strokeWeight(3); + p.saveFrames('hello', 'svg', 0.5, 10, function(frames) { + try { + assert.ok(frames.length > 1); + done(); + } catch (e) { + done(e); + } + p.noSVG(); + }); + }; + p.draw = function() { + var i = p.frameCount * 2; + p.line(0, 0, i, i); + }; + }); + }); + + it('should capture svg frames even omitting duration and fps', function(done) { + this.timeout(0); + new p5(function(p) { + p.setup = function() { + p.createSVG(100, 100); + p.strokeWeight(3); + p.saveFrames('hello', 'svg', null, null, function(frames) { + try { + assert.ok(frames.length > 1); + done(); + } catch (e) { + done(e); + } + p.noSVG(); + }); + }; + p.draw = function() { + var i = p.frameCount * 2; + p.line(0, 0, i, i); + }; + }); + }); + + it('should download svg frames', function(done) { + new p5(function(p) { + p.setup = function() { + p.createSVG(100, 100); + var _downloadFile = p.downloadFile; + var count = 0; + p.downloadFile = function() { + count++; + if (count > 1) { + done(); + p.noSVG(); + } + }; + p.saveFrames('hello', 'svg', 0.5, 10); + }; + p.draw = function() { + var i = p.frameCount * 2; + p.line(0, 0, i, i); + }; + }); + }); + + it('should wait all pending jobs done', function(done) { + new p5(function(p) { + p.setup = function() { + p.createSVG(100, 100); + var _downloadFile = p.downloadFile; + var pending = 0; + var _makeSVGFrame = p._makeSVGFrame; + p._makeSVGFrame = function(options) { + // slow version + pending++; + setTimeout(function() { + _makeSVGFrame.call(p, options); + }, 500); + }; + p.downloadFile = function() { + pending--; + if (pending === 0) { + done(); + p.noSVG(); + } + }; + p.saveFrames('hello', 'svg', 0.5, 10); + }; + p.draw = function() { + var i = p.frameCount * 2; + p.line(0, 0, i, i); + }; + }); + }); + }); + +}); diff --git a/test/unit/io/save-svg.js b/test/unit/io/save-svg.js new file mode 100644 index 0000000..3226ff4 --- /dev/null +++ b/test/unit/io/save-svg.js @@ -0,0 +1,59 @@ +define(function(require) { + var p5 = require('p5'); + require('p5.svg'); + var assert = require('chai').assert; + var testDownload = require('./test-download.js'); + + describe('IO/saveSVG', function() { + + it('should save untitled.svg', function(done) { + testDownload('untitled', 'svg', function(p) { + p.saveSVG(); + }, done); + }); + it('should save hello.svg', function(done) { + testDownload('hello', 'svg', function(p) { + p.saveSVG('hello.svg'); + }, done); + }); + it('should save hello.jpg', function(done) { + testDownload('hello', 'jpg', function(p) { + p.saveSVG('hello', 'jpg'); + }, done); + }); + it('should save hello.jpeg', function(done) { + testDownload('hello', 'jpeg', function(p) { + p.saveSVG('hello.jpeg'); + }, done); + }); + it('should save hello.png', function(done) { + testDownload('hello', 'png', function(p) { + p.saveSVG('hello.png'); + }, done); + }); + it('source is Graphics', function(done) { + testDownload('source-graphics', 'png', function(p) { + p.saveSVG(p._defaultGraphics, 'source-graphics.png'); + }, done); + }); + it('source is ', function(done) { + testDownload('source-svg', 'png', function(p) { + p.saveSVG(p.svg, 'source-svg.png'); + }, done); + }); + it('should throw if given unsupported type', function() { + new p5(function(p) { + p.setup = function() { + p.createSVG(100, 100); + p.background(255); + p.stroke(0, 0, 0); + p.line(0, 0, 100, 100); + assert.throws(function() { + p.saveSVG('hello.txt'); + }); + p.svg.remove(); + }; + }); + }); + }); +}); diff --git a/test/unit/io/save.js b/test/unit/io/save.js new file mode 100644 index 0000000..0b80288 --- /dev/null +++ b/test/unit/io/save.js @@ -0,0 +1,32 @@ +define(function(require) { + var p5 = require('p5'); + require('p5.svg'); + var assert = require('chai').assert; + var testDownload = require('./test-download.js'); + + describe('IO/save', function() { + it('save()', function(done) { + testDownload('untitled', 'svg', function(p) { + p.save(); + }, done); + }); + + it('save(Graphics)', function(done) { + testDownload('untitled', 'svg', function(p) { + p.save(p._defaultGraphics); + }, done); + }); + + it('save()', function(done) { + testDownload('untitled', 'svg', function(p) { + p.save(p.svg); + }, done); + }); + + it('canvas\'s save should still work', function(done) { + testDownload('canvas-save.png', 'png', function(p) { + p.save('canvas-save.png'); + }, done, true); + }); + }); +}); diff --git a/test/unit/io/test-download.js b/test/unit/io/test-download.js new file mode 100644 index 0000000..c9a391c --- /dev/null +++ b/test/unit/io/test-download.js @@ -0,0 +1,34 @@ +define(function(require) { + var p5 = require('p5'); + require('p5.svg'); + var assert = require('chai').assert; + + var testDownload = function(filename, ext, fn, done, useCanvas) { + new p5(function(p) { + p.setup = function() { + useCanvas ? p.createCanvas(100, 100) : p.createSVG(100, 100); + p.background(255); + p.stroke(0, 0, 0); + p.strokeWeight(3); + p.line(0, 0, 100, 100); + + var _downloadFile = p5.prototype.downloadFile; + p5.prototype.downloadFile = function(dataURL, _filename, _ext) { + try { + assert.notEqual(dataURL.indexOf('image/octet-stream'), -1); + assert.equal(_filename, filename); + assert.equal(_ext, ext); + useCanvas ? p.noCanvas() : p.noSVG(); + done(); + } catch(e) { + useCanvas ? p.noCanvas() : p.noSVG(); + done(e); + } + }; + fn(p); + }; + }); + }; + + return testDownload; +}); diff --git a/test/unit/rendering/rendering.js b/test/unit/rendering/rendering.js index 6c8cc4d..42e8c71 100644 --- a/test/unit/rendering/rendering.js +++ b/test/unit/rendering/rendering.js @@ -15,6 +15,7 @@ define(function(require) { p.noSVG(); assert.strictEqual(svg.parentElement, null); assert.strictEqual(p.svg, null); + // assert.strictEqual(p.canvas, null); }; }); });