From 3688a574794e6f988a75d10de5c39f51864c489c Mon Sep 17 00:00:00 2001
From: harsh singh <22je0388@iitism.ac.in>
Date: Fri, 15 Mar 2024 03:49:07 +0530
Subject: [PATCH] changes made to resizable image

---
 activities/Fototoon.activity/js/activity.js |  3 ++-
 activities/Fototoon.activity/js/toon.js     | 19 +++++++++++++++++--
 2 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/activities/Fototoon.activity/js/activity.js b/activities/Fototoon.activity/js/activity.js
index ca538e0ef..1debc8c7b 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 4ec8cddc6..6dd72ac8e 100644
--- a/activities/Fototoon.activity/js/toon.js
+++ b/activities/Fototoon.activity/js/toon.js
@@ -1020,6 +1020,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);
@@ -1115,11 +1116,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';
@@ -1127,7 +1129,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();