mirror of
https://github.com/konvajs/konva.git
synced 2025-06-27 21:30:35 +08:00
fixed stage.hide() bug, created new isVisible() method, and moved visible check to container
This commit is contained in:
parent
c17029d38e
commit
3a520376e5
11
dist/kinetic-core.js
vendored
11
dist/kinetic-core.js
vendored
@ -327,6 +327,12 @@ Kinetic.Node.prototype = {
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* determine if shape is visible or not
|
||||
*/
|
||||
isVisible: function() {
|
||||
return this.attrs.visible;
|
||||
},
|
||||
/**
|
||||
* show node
|
||||
*/
|
||||
@ -1032,10 +1038,11 @@ Kinetic.Container.prototype = {
|
||||
* draw children
|
||||
*/
|
||||
_drawChildren: function() {
|
||||
var stage = this.getStage();
|
||||
var children = this.children;
|
||||
for(var n = 0; n < children.length; n++) {
|
||||
var child = children[n];
|
||||
if(child.nodeType === 'Shape') {
|
||||
if(child.nodeType === 'Shape' && child.isVisible() && stage.isVisible()) {
|
||||
child._draw(child.getLayer());
|
||||
}
|
||||
else {
|
||||
@ -2281,7 +2288,7 @@ Kinetic.Shape.prototype = {
|
||||
* @param {Layer} layer Layer that the shape will be drawn on
|
||||
*/
|
||||
_draw: function(layer) {
|
||||
if(this.attrs.visible && this.drawFunc !== undefined) {
|
||||
if(layer !== undefined && this.drawFunc !== undefined) {
|
||||
var stage = layer.getStage();
|
||||
var context = layer.getContext();
|
||||
var family = [];
|
||||
|
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
@ -109,10 +109,11 @@ Kinetic.Container.prototype = {
|
||||
* draw children
|
||||
*/
|
||||
_drawChildren: function() {
|
||||
var stage = this.getStage();
|
||||
var children = this.children;
|
||||
for(var n = 0; n < children.length; n++) {
|
||||
var child = children[n];
|
||||
if(child.nodeType === 'Shape') {
|
||||
if(child.nodeType === 'Shape' && child.isVisible() && stage.isVisible()) {
|
||||
child._draw(child.getLayer());
|
||||
}
|
||||
else {
|
||||
|
@ -174,6 +174,12 @@ Kinetic.Node.prototype = {
|
||||
}
|
||||
}
|
||||
},
|
||||
/**
|
||||
* determine if shape is visible or not
|
||||
*/
|
||||
isVisible: function() {
|
||||
return this.attrs.visible;
|
||||
},
|
||||
/**
|
||||
* show node
|
||||
*/
|
||||
|
@ -175,7 +175,7 @@ Kinetic.Shape.prototype = {
|
||||
* @param {Layer} layer Layer that the shape will be drawn on
|
||||
*/
|
||||
_draw: function(layer) {
|
||||
if(this.attrs.visible && this.drawFunc !== undefined) {
|
||||
if(layer !== undefined && this.drawFunc !== undefined) {
|
||||
var stage = layer.getStage();
|
||||
var context = layer.getContext();
|
||||
var family = [];
|
||||
|
@ -1674,6 +1674,105 @@ Test.prototype.tests = {
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
},
|
||||
'STAGE - hide stage': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
width: 578,
|
||||
height: 200
|
||||
});
|
||||
var layer = new Kinetic.Layer();
|
||||
var group = new Kinetic.Group();
|
||||
|
||||
var rect = new Kinetic.Rect({
|
||||
x: 200,
|
||||
y: 100,
|
||||
width: 100,
|
||||
height: 50,
|
||||
fill: 'red',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4,
|
||||
draggable: true,
|
||||
rotationDeg: 60,
|
||||
scale: {
|
||||
x: 2,
|
||||
y: 1
|
||||
}
|
||||
});
|
||||
|
||||
group.add(rect);
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
|
||||
stage.hide();
|
||||
|
||||
stage.draw();
|
||||
},
|
||||
'STAGE - hide layer': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
width: 578,
|
||||
height: 200
|
||||
});
|
||||
var layer = new Kinetic.Layer();
|
||||
var group = new Kinetic.Group();
|
||||
|
||||
var rect = new Kinetic.Rect({
|
||||
x: 200,
|
||||
y: 100,
|
||||
width: 100,
|
||||
height: 50,
|
||||
fill: 'red',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4,
|
||||
draggable: true,
|
||||
rotationDeg: 60,
|
||||
scale: {
|
||||
x: 2,
|
||||
y: 1
|
||||
}
|
||||
});
|
||||
|
||||
group.add(rect);
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
|
||||
layer.hide();
|
||||
|
||||
stage.draw();
|
||||
},
|
||||
'STAGE - hide group': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
width: 578,
|
||||
height: 200
|
||||
});
|
||||
var layer = new Kinetic.Layer();
|
||||
var group = new Kinetic.Group();
|
||||
|
||||
var rect = new Kinetic.Rect({
|
||||
x: 200,
|
||||
y: 100,
|
||||
width: 100,
|
||||
height: 50,
|
||||
fill: 'red',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4,
|
||||
draggable: true,
|
||||
rotationDeg: 60,
|
||||
scale: {
|
||||
x: 2,
|
||||
y: 1
|
||||
}
|
||||
});
|
||||
|
||||
group.add(rect);
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
|
||||
group.hide();
|
||||
|
||||
stage.draw();
|
||||
},
|
||||
'STAGE - save image as png (click on circle to open new window)': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
|
@ -581,28 +581,6 @@ Test.prototype.tests = {
|
||||
|
||||
test(layer.children.length === 0, 'layer should have 0 children');
|
||||
},
|
||||
'LAYERS - hide layer': 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.getWidth() / 2,
|
||||
y: stage.getHeight() / 2,
|
||||
radius: 70,
|
||||
fill: 'green',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4
|
||||
});
|
||||
|
||||
layer.add(circle);
|
||||
stage.add(layer);
|
||||
|
||||
layer.hide();
|
||||
layer.draw();
|
||||
},
|
||||
////////////////////////////////////////////////////////////////////////
|
||||
// GROUPS tests
|
||||
////////////////////////////////////////////////////////////////////////
|
||||
@ -629,30 +607,6 @@ Test.prototype.tests = {
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
},
|
||||
'GROUPS - hide group': 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.Circle({
|
||||
x: stage.getWidth() / 2,
|
||||
y: stage.getHeight() / 2,
|
||||
radius: 70,
|
||||
fill: 'green',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4
|
||||
});
|
||||
|
||||
group.add(circle);
|
||||
layer.add(group);
|
||||
stage.add(layer);
|
||||
|
||||
group.hide();
|
||||
layer.draw();
|
||||
},
|
||||
'GROUPS - create two groups, move first group': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
@ -1649,28 +1603,6 @@ Test.prototype.tests = {
|
||||
|
||||
layer.draw();
|
||||
},
|
||||
'SHAPES - hide circle': 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.getWidth() / 2,
|
||||
y: stage.getHeight() / 2,
|
||||
radius: 70,
|
||||
fill: 'green',
|
||||
stroke: 'black',
|
||||
strokeWidth: 4
|
||||
});
|
||||
|
||||
layer.add(circle);
|
||||
stage.add(layer);
|
||||
|
||||
circle.hide();
|
||||
layer.draw();
|
||||
},
|
||||
'SHAPES - hide show circle': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
container: containerId,
|
||||
@ -1690,11 +1622,17 @@ Test.prototype.tests = {
|
||||
layer.add(circle);
|
||||
stage.add(layer);
|
||||
|
||||
test(circle.isVisible() === true, 'circle should be visible');
|
||||
|
||||
circle.hide();
|
||||
layer.draw();
|
||||
|
||||
test(circle.isVisible() === false, 'circle should be hidden');
|
||||
|
||||
circle.show();
|
||||
layer.draw();
|
||||
|
||||
test(circle.isVisible() === true, 'circle should be visible');
|
||||
},
|
||||
'SHAPES - set shape alpha to 0.5': function(containerId) {
|
||||
var stage = new Kinetic.Stage({
|
||||
|
Loading…
Reference in New Issue
Block a user