mirror of
https://github.com/konvajs/konva.git
synced 2025-06-28 07:25:56 +08:00
added data url support for Kinetic.Image, and added unit tests
This commit is contained in:
parent
4692c51c74
commit
864938ed33
18
dist/kinetic-core.js
vendored
18
dist/kinetic-core.js
vendored
@ -80,15 +80,18 @@ Kinetic.Type = {
|
||||
_isFunction: function(obj) {
|
||||
return !!(obj && obj.constructor && obj.call && obj.apply);
|
||||
},
|
||||
_isArray: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Array]';
|
||||
},
|
||||
_isObject: function(obj) {
|
||||
return (!!obj && obj.constructor == Object);
|
||||
},
|
||||
_isArray: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Array]';
|
||||
},
|
||||
_isNumber: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Number]';
|
||||
},
|
||||
_isString: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object String]';
|
||||
},
|
||||
/*
|
||||
* other utils
|
||||
*/
|
||||
@ -280,7 +283,14 @@ Kinetic.Type = {
|
||||
return arg;
|
||||
}
|
||||
|
||||
//if arg is image data, then convert it
|
||||
// if arg is a string, then it's a data url
|
||||
if(this._isString(arg)) {
|
||||
var imageObj = new Image();
|
||||
imageObj.src = arg;
|
||||
return imageObj;
|
||||
}
|
||||
|
||||
//if arg is an object that contains the data property, it's an image object
|
||||
if(arg.data) {
|
||||
var canvas = document.createElement('canvas');
|
||||
canvas.width = arg.width;
|
||||
|
4
dist/kinetic-core.min.js
vendored
4
dist/kinetic-core.min.js
vendored
File diff suppressed because one or more lines are too long
@ -15,15 +15,18 @@ Kinetic.Type = {
|
||||
_isFunction: function(obj) {
|
||||
return !!(obj && obj.constructor && obj.call && obj.apply);
|
||||
},
|
||||
_isArray: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Array]';
|
||||
},
|
||||
_isObject: function(obj) {
|
||||
return (!!obj && obj.constructor == Object);
|
||||
},
|
||||
_isArray: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Array]';
|
||||
},
|
||||
_isNumber: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object Number]';
|
||||
},
|
||||
_isString: function(obj) {
|
||||
return Object.prototype.toString.call(obj) == '[object String]';
|
||||
},
|
||||
/*
|
||||
* other utils
|
||||
*/
|
||||
@ -215,7 +218,14 @@ Kinetic.Type = {
|
||||
return arg;
|
||||
}
|
||||
|
||||
//if arg is image data, then convert it
|
||||
// if arg is a string, then it's a data url
|
||||
if(this._isString(arg)) {
|
||||
var imageObj = new Image();
|
||||
imageObj.src = arg;
|
||||
return imageObj;
|
||||
}
|
||||
|
||||
//if arg is an object that contains the data property, it's an image object
|
||||
if(arg.data) {
|
||||
var canvas = document.createElement('canvas');
|
||||
canvas.width = arg.width;
|
||||
|
@ -2032,6 +2032,52 @@ Test.prototype.tests = {
|
||||
|
||||
layer.add(image);
|
||||
layer.draw();
|
||||
|
||||
test(Kinetic.Type._isElement(image.getImage()), 'image property should have been converted to an image element');
|
||||
},
|
||||
'SHAPE - add image with data url': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
width: 578,
|
||||
height: 200
|
||||
});
|
||||
var layer = new Kinetic.Layer();
|
||||
var group = new Kinetic.Group();
|
||||
|
||||
var circle = new Kinetic.Ellipse({
|
||||
x: 100,
|
||||
y: stage.getHeight() / 2,
|
||||
radius: 70,
|
||||
fill: 'green',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4
|
||||
});
|
||||
|
||||
var circle2 = new Kinetic.Ellipse({
|
||||
x: 150,
|
||||
y: stage.getHeight() / 2,
|
||||
radius: 70,
|
||||
fill: 'yellow',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4
|
||||
});
|
||||
|
||||
group.add(circle);
|
||||
group.add(circle2);
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
|
||||
var image = new Kinetic.Image({
|
||||
image: layer.toDataURL(),
|
||||
x: 200,
|
||||
y: 0,
|
||||
draggable: true
|
||||
});
|
||||
|
||||
layer.add(image);
|
||||
layer.draw();
|
||||
|
||||
test(Kinetic.Type._isElement(image.getImage()), 'image property should have been converted to an image element');
|
||||
},
|
||||
'SHAPE - set image fill to color then image': function(containerId) {
|
||||
var imageObj = new Image();
|
||||
|
Loading…
Reference in New Issue
Block a user