updates for last jsdom and node-canvas

This commit is contained in:
Anton Lavrenov 2017-07-31 11:34:10 +02:00
parent c851b19808
commit 4b53436a24
5 changed files with 65 additions and 63 deletions

View File

@ -2,7 +2,7 @@
* Konva JavaScript Framework v1.6.7
* http://konvajs.github.io/
* Licensed under the MIT or GPL Version 2 licenses.
* Date: Fri Jul 28 2017
* Date: Mon Jul 31 2017
*
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
* Modified work Copyright (C) 2014 - 2017 by Anton Lavrenov (Konva)
@ -248,14 +248,15 @@
// only CommonJS-like enviroments that support module.exports,
// like Node.
var Canvas = require('canvas');
var jsdom = require('jsdom').jsdom;
var JSDOM = require('jsdom').JSDOM;
Konva.window = jsdom(
Konva.window = new JSDOM(
'<!DOCTYPE html><html><head></head><body></body></html>'
).defaultView;
).window;
Konva.document = Konva.window.document;
Konva.window.Image = Canvas.Image;
Konva._nodeCanvas = Canvas;
Konva.isNode = true;
}
module.exports = Konva;
return;
@ -815,7 +816,9 @@
);
},
createCanvasElement: function() {
var canvas = Konva.document.createElement('canvas');
var canvas = Konva.isNode
? new Konva._nodeCanvas()
: Konva.document.createElement('canvas');
// on some environments canvas.style is readonly
try {
canvas.style = canvas.style || {};

12
konva.min.js vendored

File diff suppressed because one or more lines are too long

View File

@ -1,71 +1,67 @@
var fs = require('fs'),
Konva = require('konva');
var fs = require('fs'), Konva = require('../dist/konva-dev');
// Create stage. Container parameter is not required in NodeJS.
var stage = new Konva.Stage({
width : 100,
height : 100
width: 100,
height: 100
});
var layer = new Konva.Layer();
stage.add(layer);
var rect = new Konva.Rect({
width : 100,
height : 100,
x : 50,
y : 50,
fill : 'green'
width: 100,
height: 100,
x: 50,
y: 50,
fill: 'green'
});
var text = new Konva.Text({
text : 'Generated inside node js',
x : 20,
y : 20,
fill : 'black'
text: 'Generated inside node js',
x: 20,
y: 20,
fill: 'black'
});
layer.add(rect).add(text);
layer.draw();
stage.setSize({
width : 200,
height : 200
width: 200,
height: 200
});
// check tween works
var tween = new Konva.Tween({
node : rect,
duration : 1,
x : -50
node: rect,
duration: 1,
x: -50
});
tween.play();
// After tween we want to convert stage to dataURL
setTimeout(function(){
stage.toDataURL({
callback: function(data){
// Then add result to stage
var img = new Konva.window.Image();
img.onload = function() {
var image = new Konva.Image({
image : img,
x : 10,
y : 50
});
layer.add(image);
layer.draw();
// save stage image as file
stage.toDataURL({
callback: function(data){
var base64Data = data.replace(/^data:image\/png;base64,/, '');
fs.writeFile('out.png', base64Data, 'base64', function(err) {
err && console.log(err);
console.log('See out.png');
});
}
});
};
img.src = data;
}
});
setTimeout(function() {
stage.toDataURL({
callback: function(data) {
// Then add result to stage
var img = new Konva.window.Image();
img.onload = function() {
var image = new Konva.Image({
image: img,
x: 10,
y: 50
});
layer.add(image);
layer.draw();
// save stage image as file
stage.toDataURL({
callback: function(data) {
var base64Data = data.replace(/^data:image\/png;base64,/, '');
fs.writeFile('./out.png', base64Data, 'base64', function(err) {
err && console.log(err);
console.log('See out.png');
});
}
});
};
img.src = data;
}
});
}, 1050);

View File

@ -248,14 +248,15 @@
// only CommonJS-like enviroments that support module.exports,
// like Node.
var Canvas = require('canvas');
var jsdom = require('jsdom').jsdom;
var JSDOM = require('jsdom').JSDOM;
Konva.window = jsdom(
Konva.window = new JSDOM(
'<!DOCTYPE html><html><head></head><body></body></html>'
).defaultView;
).window;
Konva.document = Konva.window.document;
Konva.window.Image = Canvas.Image;
Konva._nodeCanvas = Canvas;
Konva.isNode = true;
}
module.exports = Konva;
return;

View File

@ -544,7 +544,9 @@
);
},
createCanvasElement: function() {
var canvas = Konva.document.createElement('canvas');
var canvas = Konva.isNode
? new Konva._nodeCanvas()
: Konva.document.createElement('canvas');
// on some environments canvas.style is readonly
try {
canvas.style = canvas.style || {};