lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-06-28 00:36:20 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

updated functional tests with new toDataUrl functionality

Browse Source
This commit is contained in:
Eric Rowell 2012-03-24 00:08:08 -07:00
parent 0610337db5
commit 50ddf3f952
4 changed files with 109 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
dist/kinetic-core.js vendored
View File

@ -3,7 +3,7 @@
* http://www.kineticjs.com/ * http://www.kineticjs.com/
* Copyright 2012, Eric Rowell * Copyright 2012, Eric Rowell
* Licensed under the MIT or GPL Version 2 licenses. * Licensed under the MIT or GPL Version 2 licenses.
* Date: Mar 23 2012 * Date: Mar 24 2012
* *
* Copyright (C) 2011 - 2012 by Eric Rowell * Copyright (C) 2011 - 2012 by Eric Rowell
* *
@ -1118,12 +1118,12 @@ Kinetic.Stage.prototype = {
/** /**
* Creates a composite data URL and passes it to a callback. If MIME type is not * Creates a composite data URL and passes it to a callback. If MIME type is not
* specified, then "image/png" will result. For "image/jpeg", specify a quality * specified, then "image/png" will result. For "image/jpeg", specify a quality
* level as arg2 (range 0.0 - 1.0) * level as quality (range 0.0 - 1.0)
* @param {function} callback * @param {function} callback
* @param {String} mimeType (optional) * @param {String} mimeType (optional)
* @param {Number} arg2 (optional) * @param {Number} quality (optional)
*/ */
toDataURL: function(callback, mimeType, arg2) { toDataURL: function(callback, mimeType, quality) {
var bufferLayer = this.bufferLayer; var bufferLayer = this.bufferLayer;
var bufferContext = bufferLayer.getContext(); var bufferContext = bufferLayer.getContext();
var layers = this.children; var layers = this.children;
@ -1138,7 +1138,7 @@ Kinetic.Stage.prototype = {
addLayer(n); addLayer(n);
} }
else { else {
callback(bufferLayer.getCanvas().toDataURL(mimeType, arg2)); callback(bufferLayer.getCanvas().toDataURL(mimeType, quality));
} }
}; };
imageObj.src = dataURL; imageObj.src = dataURL;
@ -1373,7 +1373,7 @@ Kinetic.Stage.prototype = {
// propapgate backwards through children // propapgate backwards through children
for(var i = children.length - 1; i >= 0; i--) { for(var i = children.length - 1; i >= 0; i--) {
var child = children[i]; var child = children[i];
if (child.isListening) { if(child.isListening) {
if(child.className === 'Shape') { if(child.className === 'Shape') {
var exit = this._detectEvent(child, evt); var exit = this._detectEvent(child, evt);
if(exit) { if(exit) {

2
dist/kinetic-core.min.js vendored
View File

@ -3,7 +3,7 @@
* http://www.kineticjs.com/ * http://www.kineticjs.com/
* Copyright 2012, Eric Rowell * Copyright 2012, Eric Rowell
* Licensed under the MIT or GPL Version 2 licenses. * Licensed under the MIT or GPL Version 2 licenses.
* Date: Mar 23 2012 * Date: Mar 24 2012
* *
* Copyright (C) 2011 - 2012 by Eric Rowell * Copyright (C) 2011 - 2012 by Eric Rowell
* *

10
src/Stage.js
View File

@ -132,12 +132,12 @@ Kinetic.Stage.prototype = {
/** /**
* Creates a composite data URL and passes it to a callback. If MIME type is not * Creates a composite data URL and passes it to a callback. If MIME type is not
* specified, then "image/png" will result. For "image/jpeg", specify a quality * specified, then "image/png" will result. For "image/jpeg", specify a quality
* level as arg2 (range 0.0 - 1.0) * level as quality (range 0.0 - 1.0)
* @param {function} callback * @param {function} callback
* @param {String} mimeType (optional) * @param {String} mimeType (optional)
* @param {Number} arg2 (optional) * @param {Number} quality (optional)
*/ */
toDataURL: function(callback, mimeType, arg2) { toDataURL: function(callback, mimeType, quality) {
var bufferLayer = this.bufferLayer; var bufferLayer = this.bufferLayer;
var bufferContext = bufferLayer.getContext(); var bufferContext = bufferLayer.getContext();
var layers = this.children; var layers = this.children;
@ -152,7 +152,7 @@ Kinetic.Stage.prototype = {
addLayer(n); addLayer(n);
} }
else { else {
callback(bufferLayer.getCanvas().toDataURL(mimeType, arg2)); callback(bufferLayer.getCanvas().toDataURL(mimeType, quality));
} }
}; };
imageObj.src = dataURL; imageObj.src = dataURL;
@ -387,7 +387,7 @@ Kinetic.Stage.prototype = {
// propapgate backwards through children // propapgate backwards through children
for(var i = children.length - 1; i >= 0; i--) { for(var i = children.length - 1; i >= 0; i--) {
var child = children[i]; var child = children[i];
if (child.isListening) { if(child.isListening) {
if(child.className === 'Shape') { if(child.className === 'Shape') {
var exit = this._detectEvent(child, evt); var exit = this._detectEvent(child, evt);
if(exit) { if(exit) {

101
tests/js/functionalTests.js
View File

@ -303,9 +303,9 @@ Test.prototype.tests = {
}); });
} }
var stage = new Kinetic.Stage({ var stage = new Kinetic.Stage({
container: containerId, container: containerId,
width: 578, width: 578,
height: 200 height: 200
}); });
var layer = new Kinetic.Layer(); var layer = new Kinetic.Layer();
var greenBox = new Kinetic.Rect({ var greenBox = new Kinetic.Rect({
@ -1000,7 +1000,7 @@ Test.prototype.tests = {
layer.add(rect); layer.add(rect);
stage.add(layer); stage.add(layer);
stage.rotateDeg(20); stage.rotateDeg(20);
stage.setScale(0.5); stage.setScale(0.5);
stage.draw(); stage.draw();
@ -1344,4 +1344,97 @@ Test.prototype.tests = {
layer.add(group); layer.add(group);
stage.add(layer); stage.add(layer);
}, },
'STAGE - save image as png (click on circle to open new window)': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
radius: 70,
fill: 'violet',
stroke: 'black',
strokeWidth: 4
});
circle.on('click', function() {
stage.toDataURL(function(dataUrl) {
/*
* here you can do anything you like with the data url.
* In this tutorial we'll just open the url with the browser
* so that you can see the result as an image
*/
window.open(dataUrl);
});
});
layer.add(circle);
stage.add(layer);
},
'STAGE - save image as low quality jpg (click on circle to open new window)': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
radius: 70,
fill: 'violet',
stroke: 'black',
strokeWidth: 4
});
circle.on('click', function() {
stage.toDataURL(function(dataUrl) {
/*
* here you can do anything you like with the data url.
* In this tutorial we'll just open the url with the browser
* so that you can see the result as an image
*/
window.open(dataUrl);
}, 'image/jpeg', 0);
});
layer.add(circle);
stage.add(layer);
},
'STAGE - save image as high quality jpg (click on circle to open new window)': function(containerId) {
var stage = new Kinetic.Stage({
container: containerId,
width: 578,
height: 200
});
var layer = new Kinetic.Layer();
var circle = new Kinetic.Circle({
x: stage.width / 2,
y: stage.height / 2,
radius: 70,
fill: 'violet',
stroke: 'black',
strokeWidth: 4
});
circle.on('click', function() {
stage.toDataURL(function(dataUrl) {
/*
* here you can do anything you like with the data url.
* In this tutorial we'll just open the url with the browser
* so that you can see the result as an image
*/
window.open(dataUrl);
}, 'image/jpeg', 1);
});
layer.add(circle);
stage.add(layer);
}
}; };