diff --git a/activities/Fototoon.activity/js/activity.js b/activities/Fototoon.activity/js/activity.js index ca538e0ef5..1debc8c7bb 100644 --- a/activities/Fototoon.activity/js/activity.js +++ b/activities/Fototoon.activity/js/activity.js @@ -109,7 +109,8 @@ define(["sugar-web/activity/activity","sugar-web/datastore","sugar-web/env","tex element.src = text; } element.onload = function () { - toonModel.addImage(element.src); + toonModel.addGlobe(toon.TYPE_RECTANGLE); + // toonModel.addImage(element.src); }; }); }, { mimetype: 'image/png' }, { mimetype: 'image/jpeg' }, { activity: 'org.olpcfrance.PaintActivity'}); diff --git a/activities/Fototoon.activity/js/toon.js b/activities/Fototoon.activity/js/toon.js index 2d939dcd8e..fbb094072b 100644 --- a/activities/Fototoon.activity/js/toon.js +++ b/activities/Fototoon.activity/js/toon.js @@ -1019,6 +1019,7 @@ define(["easel","sugar-web/datastore","sugar-web/env","l10n","humane"], function } else if (this._type == TYPE_EXCLAMATION) { this.createShapeExclamation(scaled_x, scaled_y, scale_x, scale_y); } else if (this._type == TYPE_RECTANGLE) { + // this.createShapeRectangle('image/url'); this.createShapeRectangle(); } else { this.createShapeGlobe(scaled_x, scaled_y, scale_x, scale_y); @@ -1114,11 +1115,12 @@ define(["easel","sugar-web/datastore","sugar-web/env","l10n","humane"], function this._shape.setTransform(0, 0, scale_x, scale_y); }; - this.createShapeRectangle = function() { + this.createShapeRectangle = function(imageSrc) { var x = this._x; var y = this._y; var w = this._width; var h = this._height; + this._shape = new createjs.Shape(); this._shape.name = 'rect'; @@ -1126,7 +1128,20 @@ define(["easel","sugar-web/datastore","sugar-web/env","l10n","humane"], function this._shape.graphics.setStrokeStyle(LINE_WIDTH, "round", null, null, true); this._shape.graphics.beginStroke(BLACK); - this._shape.graphics.beginFill(WHITE); + + var image = document.createElement("img"); + image.crossOrigin = "Anonymous"; // Should work fine + image.src = imageSrc; + var bitmap = new createjs.Bitmap(image); + + // var bitmap = new createjs.Bitmap(image); + bitmap.x = x - w; + bitmap.y = y - h; + bitmap.scaleX = image.width; + bitmap.scaleY = image.height; + + this._shape.graphics.beginBitmapFill(bitmap.image, "no-repeat"); + if(!imageSrc) this._shape.graphics.beginFill(WHITE); this._shape.graphics.rect(x - w , y - h, w * 2, h * 2); this._shape.graphics.endStroke();