From e1b97b98df9219865d08566bb10309603a9b12fe Mon Sep 17 00:00:00 2001 From: yuan Date: Tue, 27 May 2014 00:57:19 -0700 Subject: added graphics effects that work for all redraws; incorporated most recent updates to Snap! --- objects.js | 136 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 file changed, 132 insertions(+), 4 deletions(-) (limited to 'objects.js') diff --git a/objects.js b/objects.js index 5f91606..b1e2892 100644 --- a/objects.js +++ b/objects.js @@ -1297,6 +1297,19 @@ SpriteMorph.prototype.init = function (globals) { this.isDraggable = true; this.isDown = false; + this.graphicsValues = { 'color': 0, //dictionary of all the orignal values + 'fisheye': 0, + 'whirl': 0, + 'pixelate': 0, + 'mosaic': 0, + 'brightness': 0, + 'negative': 0, + 'comic': 0, + 'duplicate': 0, + 'confetti': 0 + }; + this.graphicsChanged = false; + this.heading = 90; this.changed(); this.drawNew(); @@ -1421,6 +1434,9 @@ SpriteMorph.prototype.drawNew = function () { ctx.rotate(radians(facing - 90)); ctx.drawImage(pic.contents, 0, 0); + // apply graphics effects to image + this.image = this.applyGraphicsEffects(this.image); + // adjust my position to the rotation this.setCenter(currentCenter, true); // just me @@ -1443,6 +1459,7 @@ SpriteMorph.prototype.drawNew = function () { this.setCenter(currentCenter, true); // just me SpriteMorph.uber.drawNew.call(this, facing); this.rotationOffset = this.extent().divideBy(2); + this.image = this.applyGraphicsEffects(this.image); if (isLoadingCostume) { // retry until costume is done loading cst = this.costume; handle = setInterval( @@ -2833,12 +2850,118 @@ SpriteMorph.prototype.changeScale = function (delta) { // SpriteMorph graphic effects +SpriteMorph.prototype.applyGraphicsEffects = function (canvas) { +// For every effect: apply transform of that effect(canvas, stored value) +// The future: write more effects here + + function transform_negative(p, value) { + if (value !== 0) { + for (i = 0; i < p.length; i = i + 4) { + var rcom = 255 - p[i + 0] + var gcom = 255 - p[i + 1] + var bcom = 255 - p[i + 2] + + if (p[i + 0] < rcom) { //check if current number less than the complement. if so, then + p[i + 0] = p[i + 0] + value + } else if (p[i + 0] > rcom) { + p[i + 0] = p[i + 0] - value //or else decrease towards it + } + if (p[i + 1] < gcom) { + p[i + 1] = p[i + 1] + value + } else if (p[i + 1] > gcom) { + p[i + 1] = p[i + 1] - value + } + if (p[i + 2] < bcom) { + p[i + 2] = p[i + 2] + value + } else if (p[i + 2] > bcom) { + p[i + 2] = p[i + 2] - value + }; + }; + }; + return p; + }; + + function transform_brightness(p, value) { + if (value !== 0) { + for (i = 0; i < p.length; i += 4) { + p[i+0] = p[i+0] + value; //255 = 100% of this color. 255 everything = white. + p[i+1] = p[i+1] + value; //if value is negative, add more value to p. if value is positive, subtract value from p + p[i+2] = p[i+2] + value; + p[i+3] = p[i+3]; + }; + }; + return p; + }; + + function transform_comic(p, value) { + if (value !== 0) { + for (i = 0; i < p.length; i += 4) { + var frequency = value; + p[i + 0] = p[i + 0] + Math.sin(i * frequency) * 127 + 128 + p[i + 1] = p[i + 1] + Math.sin(i * frequency) * 127 + 128 + p[i + 2] = p[i + 2] + Math.sin(i * frequency) * 127 + 128 + p[i + 3] = p[i + 3]; + }; + }; + return p; + }; + + function transform_duplicate(p, value) { + if (value !== 0) { + for (i = 0; i < p.length; i += 4) { + p[i + 0] = p[i * value + 0] + p[i + 1] = p[i * value + 1] + p[i + 2] = p[i * value + 2] + p[i + 3] = p[i * value + 3]; + }; + }; + return p; + }; + + function transform_confetti(p, value) { + if (value !== 0) { + for (i = 0; i < p.length; i++) { + p[i] = Math.sin(value * p[i]) * 127 + p[i] + }; + }; + return p; + }; + + if (this.graphicsChanged) { + ctx = canvas.getContext("2d"); + imagedata = ctx.getImageData(0, 0, canvas.width, canvas.height); + pixels = imagedata.data; + + // for each effect, do a transform. at any given time, a sprite should wear all 7 effects + /*pixels = transform_whirl(pixels, this.graphicsValues['whirl']);*/ + pixels = transform_negative(pixels, this.graphicsValues['negative']); + pixels = transform_brightness(pixels, this.graphicsValues['brightness']); + pixels = transform_comic(pixels, this.graphicsValues['comic']); + /*pixels = transform_pixelate(pixels, this.graphicsValues['pixelate']);*/ + pixels = transform_duplicate(pixels, this.graphicsValues['duplicate']); + /*pixels = transform_color(pixels, this.graphicsValues['color']);*/ + /*pixels = transform_fisheye(pixels, this.graphicsValues['fisheye']);*/ + pixels = transform_confetti(pixels, this.graphicsValues['confetti']); + + //the last object will have all the transformations done on it + newimagedata = ctx.createImageData(imagedata); //make new imgdata object + newimagedata.data.set(pixels); //add transformed pixels + ctx.putImageData(newimagedata, 0, 0); + }; + + return canvas; //for each effect, apply the transformation on the image we receive +}; + SpriteMorph.prototype.setEffect = function (effect, value) { var eff = effect instanceof Array ? effect[0] : null; if (eff === 'ghost') { this.alpha = 1 - Math.min(Math.max(+value || 0, 0), 100) / 100; - this.changed(); - } + } else { + this.graphicsValues[eff] = value; + }; + this.graphicsChanged = true; + this.drawNew(); + this.changed(); }; SpriteMorph.prototype.getGhostEffect = function () { @@ -2848,11 +2971,16 @@ SpriteMorph.prototype.getGhostEffect = function () { SpriteMorph.prototype.changeEffect = function (effect, value) { var eff = effect instanceof Array ? effect[0] : null; if (eff === 'ghost') { - this.setEffect(effect, this.getGhostEffect() + (+value || 0)); - } + this.setEffect(effect, this.getGhostEffect() + (+value || 0)); //special for ghost because its value is the alpha value + } else { + this.setEffect(effect, this.graphicsValues[eff] + value); + }; }; SpriteMorph.prototype.clearEffects = function () { + for (var effect in this.graphicsValues) { + this.setEffect([effect], 0); + }; this.setEffect(['ghost'], 0); }; -- cgit v1.3.1 From ab218322f3227a40e38b891be84b58ad49c82d74 Mon Sep 17 00:00:00 2001 From: yuan Date: Wed, 28 May 2014 02:38:04 -0700 Subject: changed graphicsChanged boolean to a function --- objects.js | 47 +++++++++++++++++++++++++++++++++-------------- 1 file changed, 33 insertions(+), 14 deletions(-) (limited to 'objects.js') diff --git a/objects.js b/objects.js index b1e2892..c0e7357 100644 --- a/objects.js +++ b/objects.js @@ -1292,23 +1292,22 @@ SpriteMorph.prototype.init = function (globals) { this.idx = 0; // not to be serialized (!) - used for de-serialization this.wasWarped = false; // not to be serialized, used for fast-tracking - SpriteMorph.uber.init.call(this); - - this.isDraggable = true; - this.isDown = false; - - this.graphicsValues = { 'color': 0, //dictionary of all the orignal values + this.graphicsValues = { 'negative': 0, //dictionary of all the orignal values 'fisheye': 0, 'whirl': 0, 'pixelate': 0, 'mosaic': 0, 'brightness': 0, - 'negative': 0, + 'color': 0, 'comic': 0, 'duplicate': 0, 'confetti': 0 }; - this.graphicsChanged = false; + + SpriteMorph.uber.init.call(this); + + this.isDraggable = true; + this.isDown = false; this.heading = 90; this.changed(); @@ -2848,7 +2847,16 @@ SpriteMorph.prototype.changeScale = function (delta) { this.setScale(this.getScale() + (+delta || 0)); }; -// SpriteMorph graphic effects +//spritemorph graphics effects + +SpriteMorph.prototype.graphicsChanged = function () { + var myself = this; + return Object.keys(this.graphicsValues).some( + function(any) { + return myself.graphicsValues[any] < 0 || myself.graphicsValues[any] > 0; + } + ); +}; SpriteMorph.prototype.applyGraphicsEffects = function (canvas) { // For every effect: apply transform of that effect(canvas, stored value) @@ -2927,7 +2935,7 @@ SpriteMorph.prototype.applyGraphicsEffects = function (canvas) { return p; }; - if (this.graphicsChanged) { + if (this.graphicsChanged()) { //operates image pixel manipulation if graphicschanged = true. ctx = canvas.getContext("2d"); imagedata = ctx.getImageData(0, 0, canvas.width, canvas.height); pixels = imagedata.data; @@ -2957,9 +2965,8 @@ SpriteMorph.prototype.setEffect = function (effect, value) { if (eff === 'ghost') { this.alpha = 1 - Math.min(Math.max(+value || 0, 0), 100) / 100; } else { - this.graphicsValues[eff] = value; + this.graphicsValues[eff] = value; //changes the value of the dictionary }; - this.graphicsChanged = true; this.drawNew(); this.changed(); }; @@ -4134,6 +4141,18 @@ StageMorph.prototype.init = function (globals) { this.trailsCanvas = null; this.isThreadSafe = false; + this.graphicsValues = { 'negative': 0, //dictionary of all the orignal values + 'fisheye': 0, + 'whirl': 0, + 'pixelate': 0, + 'mosaic': 0, + 'brightness': 0, + 'color': 0, + 'comic': 0, + 'duplicate': 0, + 'confetti': 0 + }; + StageMorph.uber.init.call(this); this.acceptsDrops = false; @@ -4189,8 +4208,8 @@ StageMorph.prototype.setScale = function (number) { StageMorph.prototype.drawNew = function () { var ctx; - StageMorph.uber.drawNew.call(this); - if (this.costume) { + StageMorph.uber.drawNew.call(this); //call drawNew from framemorph + if (this.costume) { //if it's wearing a costume ctx = this.image.getContext('2d'); ctx.scale(this.scale, this.scale); ctx.drawImage( -- cgit v1.3.1 From 94ad721bfe5f63e6545abf96ca6349977c6b06fd Mon Sep 17 00:00:00 2001 From: yuan Date: Wed, 28 May 2014 23:17:04 -0700 Subject: good to go for stagemorph --- objects.js | 25 ++++++++++++++++--------- 1 file changed, 16 insertions(+), 9 deletions(-) (limited to 'objects.js') diff --git a/objects.js b/objects.js index c0e7357..5eb481c 100644 --- a/objects.js +++ b/objects.js @@ -1431,7 +1431,7 @@ SpriteMorph.prototype.drawNew = function () { ctx.scale(this.scale * stageScale, this.scale * stageScale); ctx.translate(shift.x, shift.y); ctx.rotate(radians(facing - 90)); - ctx.drawImage(pic.contents, 0, 0); + ctx.drawImage(pic.contents, 0, 0); // apply graphics effects to image this.image = this.applyGraphicsEffects(this.image); @@ -2978,7 +2978,7 @@ SpriteMorph.prototype.getGhostEffect = function () { SpriteMorph.prototype.changeEffect = function (effect, value) { var eff = effect instanceof Array ? effect[0] : null; if (eff === 'ghost') { - this.setEffect(effect, this.getGhostEffect() + (+value || 0)); //special for ghost because its value is the alpha value + this.setEffect(effect, this.getGhostEffect() + (+value || 0)); //special for ghost because of alpha value } else { this.setEffect(effect, this.graphicsValues[eff] + value); }; @@ -4141,7 +4141,7 @@ StageMorph.prototype.init = function (globals) { this.trailsCanvas = null; this.isThreadSafe = false; - this.graphicsValues = { 'negative': 0, //dictionary of all the orignal values + this.graphicsValues = { 'negative': 0, //dictionary of all the original values 'fisheye': 0, 'whirl': 0, 'pixelate': 0, @@ -4208,15 +4208,16 @@ StageMorph.prototype.setScale = function (number) { StageMorph.prototype.drawNew = function () { var ctx; - StageMorph.uber.drawNew.call(this); //call drawNew from framemorph - if (this.costume) { //if it's wearing a costume + StageMorph.uber.drawNew.call(this); + if (this.costume) { //if wearing a costume ctx = this.image.getContext('2d'); ctx.scale(this.scale, this.scale); - ctx.drawImage( - this.costume.contents, - (this.width() / this.scale - this.costume.width()) / 2, - (this.height() / this.scale - this.costume.height()) / 2 + ctx.drawImage( //drawimage on this new 2d canvas with these inputs: image, x and y + this.costume.contents, //this is the image + (this.width() / this.scale - this.costume.width()) / 2, //width = canvas wdith - costume width/2 + (this.height() / this.scale - this.costume.height()) / 2 //this is the y ); + this.image = this.applyGraphicsEffects(this.image) //apply graphics effects to this image. } }; @@ -5240,6 +5241,12 @@ StageMorph.prototype.reportCostumes // StageMorph graphic effects +StageMorph.prototype.graphicsChanged + = SpriteMorph.prototype.graphicsChanged; + +StageMorph.prototype.applyGraphicsEffects + = SpriteMorph.prototype.applyGraphicsEffects; + StageMorph.prototype.setEffect = SpriteMorph.prototype.setEffect; -- cgit v1.3.1 From 8971d29adc0fbcb75b60dd58c3043c8eb2e150a1 Mon Sep 17 00:00:00 2001 From: yuan Date: Wed, 28 May 2014 23:45:43 -0700 Subject: cleaned up my comments --- objects.js | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) (limited to 'objects.js') diff --git a/objects.js b/objects.js index 5eb481c..7d6ce14 100644 --- a/objects.js +++ b/objects.js @@ -2847,7 +2847,7 @@ SpriteMorph.prototype.changeScale = function (delta) { this.setScale(this.getScale() + (+delta || 0)); }; -//spritemorph graphics effects +// Spritemorph graphics effects SpriteMorph.prototype.graphicsChanged = function () { var myself = this; @@ -4209,13 +4209,13 @@ StageMorph.prototype.setScale = function (number) { StageMorph.prototype.drawNew = function () { var ctx; StageMorph.uber.drawNew.call(this); - if (this.costume) { //if wearing a costume + if (this.costume) { ctx = this.image.getContext('2d'); ctx.scale(this.scale, this.scale); - ctx.drawImage( //drawimage on this new 2d canvas with these inputs: image, x and y - this.costume.contents, //this is the image - (this.width() / this.scale - this.costume.width()) / 2, //width = canvas wdith - costume width/2 - (this.height() / this.scale - this.costume.height()) / 2 //this is the y + ctx.drawImage( + this.costume.contents, + (this.width() / this.scale - this.costume.width()) / 2, + (this.height() / this.scale - this.costume.height()) / 2 ); this.image = this.applyGraphicsEffects(this.image) //apply graphics effects to this image. } -- cgit v1.3.1 From e7f9ff5dcbac3459c9ab111aea3e4096467d5ea5 Mon Sep 17 00:00:00 2001 From: yuan Date: Mon, 2 Jun 2014 00:07:00 -0700 Subject: JSLinted --- blocks.js | 4 +- objects.js | 183 ++++++++++++++++++++++++++++++++----------------------------- 2 files changed, 97 insertions(+), 90 deletions(-) (limited to 'objects.js') diff --git a/blocks.js b/blocks.js index da5e929..65ab90b 100644 --- a/blocks.js +++ b/blocks.js @@ -918,8 +918,8 @@ SyntaxElementMorph.prototype.labelPart = function (spec) { negative : ['negative'], comic: ['comic'], duplicate: ['duplicate'], - confetti: ['confetti'], - }, + confetti: ['confetti'] + }, true ); part.setContents(['ghost']); diff --git a/objects.js b/objects.js index 7d6ce14..81ce072 100644 --- a/objects.js +++ b/objects.js @@ -1292,11 +1292,11 @@ SpriteMorph.prototype.init = function (globals) { this.idx = 0; // not to be serialized (!) - used for de-serialization this.wasWarped = false; // not to be serialized, used for fast-tracking - this.graphicsValues = { 'negative': 0, //dictionary of all the orignal values - 'fisheye': 0, - 'whirl': 0, - 'pixelate': 0, - 'mosaic': 0, + this.graphicsValues = { 'negative': 0, + 'fisheye': 0, + 'whirl': 0, + 'pixelate': 0, + 'mosaic': 0, 'brightness': 0, 'color': 0, 'comic': 0, @@ -1431,7 +1431,7 @@ SpriteMorph.prototype.drawNew = function () { ctx.scale(this.scale * stageScale, this.scale * stageScale); ctx.translate(shift.x, shift.y); ctx.rotate(radians(facing - 90)); - ctx.drawImage(pic.contents, 0, 0); + ctx.drawImage(pic.contents, 0, 0); // apply graphics effects to image this.image = this.applyGraphicsEffects(this.image); @@ -2847,13 +2847,14 @@ SpriteMorph.prototype.changeScale = function (delta) { this.setScale(this.getScale() + (+delta || 0)); }; -// Spritemorph graphics effects +// Spritemorph graphic effects SpriteMorph.prototype.graphicsChanged = function () { var myself = this; return Object.keys(this.graphicsValues).some( - function(any) { - return myself.graphicsValues[any] < 0 || myself.graphicsValues[any] > 0; + function (any) { + return myself.graphicsValues[any] < 0 || + myself.graphicsValues[any] > 0; } ); }; @@ -2861,103 +2862,106 @@ SpriteMorph.prototype.graphicsChanged = function () { SpriteMorph.prototype.applyGraphicsEffects = function (canvas) { // For every effect: apply transform of that effect(canvas, stored value) // The future: write more effects here + var ctx, imagedata, pixels, newimagedata; function transform_negative(p, value) { + var i, rcom, gcom, bcom; if (value !== 0) { - for (i = 0; i < p.length; i = i + 4) { - var rcom = 255 - p[i + 0] - var gcom = 255 - p[i + 1] - var bcom = 255 - p[i + 2] - - if (p[i + 0] < rcom) { //check if current number less than the complement. if so, then - p[i + 0] = p[i + 0] + value - } else if (p[i + 0] > rcom) { - p[i + 0] = p[i + 0] - value //or else decrease towards it + for (i = 0; i < p.length; i += 4) { + rcom = 255 - p[i]; + gcom = 255 - p[i + 1]; + bcom = 255 - p[i + 2]; + + if (p[i] < rcom) { //compare to the complement + p[i] += value; + } else if (p[i] > rcom) { + p[i] -= value; } if (p[i + 1] < gcom) { - p[i + 1] = p[i + 1] + value + p[i + 1] += value; } else if (p[i + 1] > gcom) { - p[i + 1] = p[i + 1] - value + p[i + 1] -= value; } if (p[i + 2] < bcom) { - p[i + 2] = p[i + 2] + value + p[i + 2] += value; } else if (p[i + 2] > bcom) { - p[i + 2] = p[i + 2] - value - }; - }; - }; + p[i + 2] -= value; + } + } + } return p; - }; + } function transform_brightness(p, value) { + var i; if (value !== 0) { for (i = 0; i < p.length; i += 4) { - p[i+0] = p[i+0] + value; //255 = 100% of this color. 255 everything = white. - p[i+1] = p[i+1] + value; //if value is negative, add more value to p. if value is positive, subtract value from p - p[i+2] = p[i+2] + value; - p[i+3] = p[i+3]; - }; - }; + p[i] += value; //255 = 100% of this color + p[i + 1] += value; + p[i + 2] += value; + } + } return p; - }; + } function transform_comic(p, value) { + var i; if (value !== 0) { for (i = 0; i < p.length; i += 4) { - var frequency = value; - p[i + 0] = p[i + 0] + Math.sin(i * frequency) * 127 + 128 - p[i + 1] = p[i + 1] + Math.sin(i * frequency) * 127 + 128 - p[i + 2] = p[i + 2] + Math.sin(i * frequency) * 127 + 128 - p[i + 3] = p[i + 3]; - }; - }; - return p; - }; + p[i] += Math.sin(i * value) * 127 + 128; + p[i + 1] += Math.sin(i * value) * 127 + 128; + p[i + 2] += Math.sin(i * value) * 127 + 128; + } + } + return p; + } function transform_duplicate(p, value) { + var i; if (value !== 0) { for (i = 0; i < p.length; i += 4) { - p[i + 0] = p[i * value + 0] - p[i + 1] = p[i * value + 1] - p[i + 2] = p[i * value + 2] + p[i] = p[i * value]; + p[i + 1] = p[i * value + 1]; + p[i + 2] = p[i * value + 2]; p[i + 3] = p[i * value + 3]; - }; - }; + } + } return p; - }; + } function transform_confetti(p, value) { + var i; if (value !== 0) { - for (i = 0; i < p.length; i++) { - p[i] = Math.sin(value * p[i]) * 127 + p[i] - }; - }; + for (i = 0; i < p.length; i += 1) { + p[i] = Math.sin(value * p[i]) * 127 + p[i]; + } + } return p; - }; + } - if (this.graphicsChanged()) { //operates image pixel manipulation if graphicschanged = true. - ctx = canvas.getContext("2d"); + if (this.graphicsChanged()) { + ctx = canvas.getContext("2d"); imagedata = ctx.getImageData(0, 0, canvas.width, canvas.height); pixels = imagedata.data; - // for each effect, do a transform. at any given time, a sprite should wear all 7 effects - /*pixels = transform_whirl(pixels, this.graphicsValues['whirl']);*/ - pixels = transform_negative(pixels, this.graphicsValues['negative']); - pixels = transform_brightness(pixels, this.graphicsValues['brightness']); - pixels = transform_comic(pixels, this.graphicsValues['comic']); - /*pixels = transform_pixelate(pixels, this.graphicsValues['pixelate']);*/ - pixels = transform_duplicate(pixels, this.graphicsValues['duplicate']); - /*pixels = transform_color(pixels, this.graphicsValues['color']);*/ - /*pixels = transform_fisheye(pixels, this.graphicsValues['fisheye']);*/ - pixels = transform_confetti(pixels, this.graphicsValues['confetti']); - + //A sprite should wear all 7 effects at once + /*pixels = transform_whirl(pixels, this.graphicsValues.whirl);*/ + pixels = transform_negative(pixels, this.graphicsValues.negative); + pixels = transform_brightness(pixels, this.graphicsValues.brightness); + pixels = transform_comic(pixels, this.graphicsValues.comic); + /*pixels = transform_pixelate(pixels, this.graphicsValues.pixelate);*/ + pixels = transform_duplicate(pixels, this.graphicsValues.duplicate); + /*pixels = transform_color(pixels, this.graphicsValues.color);*/ + /*pixels = transform_fisheye(pixels, this.graphicsValues.fisheye);*/ + pixels = transform_confetti(pixels, this.graphicsValues.confetti); + //the last object will have all the transformations done on it - newimagedata = ctx.createImageData(imagedata); //make new imgdata object - newimagedata.data.set(pixels); //add transformed pixels + newimagedata = ctx.createImageData(imagedata); //make imgdata object + newimagedata.data.set(pixels); //add transformed pixels ctx.putImageData(newimagedata, 0, 0); - }; + } - return canvas; //for each effect, apply the transformation on the image we receive + return canvas; }; SpriteMorph.prototype.setEffect = function (effect, value) { @@ -2965,8 +2969,8 @@ SpriteMorph.prototype.setEffect = function (effect, value) { if (eff === 'ghost') { this.alpha = 1 - Math.min(Math.max(+value || 0, 0), 100) / 100; } else { - this.graphicsValues[eff] = value; //changes the value of the dictionary - }; + this.graphicsValues[eff] = value; + } this.drawNew(); this.changed(); }; @@ -2978,16 +2982,19 @@ SpriteMorph.prototype.getGhostEffect = function () { SpriteMorph.prototype.changeEffect = function (effect, value) { var eff = effect instanceof Array ? effect[0] : null; if (eff === 'ghost') { - this.setEffect(effect, this.getGhostEffect() + (+value || 0)); //special for ghost because of alpha value + this.setEffect(effect, this.getGhostEffect() + (+value || 0)); } else { this.setEffect(effect, this.graphicsValues[eff] + value); - }; + } }; SpriteMorph.prototype.clearEffects = function () { - for (var effect in this.graphicsValues) { - this.setEffect([effect], 0); - }; + var effect; + for (effect in this.graphicsValues) { + if (this.graphicsValues.hasOwnProperty(effect)) { + this.setEffect([effect], 0); + } + } this.setEffect(['ghost'], 0); }; @@ -4141,17 +4148,17 @@ StageMorph.prototype.init = function (globals) { this.trailsCanvas = null; this.isThreadSafe = false; - this.graphicsValues = { 'negative': 0, //dictionary of all the original values - 'fisheye': 0, - 'whirl': 0, - 'pixelate': 0, - 'mosaic': 0, + this.graphicsValues = { 'negative': 0, + 'fisheye': 0, + 'whirl': 0, + 'pixelate': 0, + 'mosaic': 0, 'brightness': 0, 'color': 0, 'comic': 0, 'duplicate': 0, 'confetti': 0 - }; + }; StageMorph.uber.init.call(this); @@ -4209,15 +4216,15 @@ StageMorph.prototype.setScale = function (number) { StageMorph.prototype.drawNew = function () { var ctx; StageMorph.uber.drawNew.call(this); - if (this.costume) { + if (this.costume) { ctx = this.image.getContext('2d'); ctx.scale(this.scale, this.scale); - ctx.drawImage( - this.costume.contents, + ctx.drawImage( + this.costume.contents, (this.width() / this.scale - this.costume.width()) / 2, - (this.height() / this.scale - this.costume.height()) / 2 + (this.height() / this.scale - this.costume.height()) / 2 ); - this.image = this.applyGraphicsEffects(this.image) //apply graphics effects to this image. + this.image = this.applyGraphicsEffects(this.image); } }; -- cgit v1.3.1