make the sprites only resize to what they need to be

src/scripts/editor.js

@@ -595,12 +595,14 @@ function renderCostumesList() {
     editBtn.draggable = false;
     editBtn.title = "Edit costume";
     editBtn.onclick = () => {
-      openCostumeEditor(costume, async (dataURL) => {
-        if (!dataURL) return;
+      openCostumeEditor(costume, async (costumeData) => {
+        if (!costumeData) return;
         
         // Update the existing costume
-        const newTexture = PIXI.Texture.from(dataURL);
+        const newTexture = PIXI.Texture.from(costumeData.dataURL);
+        newTexture.editorData = costumeData.editorData;
         costume.texture = newTexture;
+        costume.editorData = costumeData.editorData;
         
         // Update sprite if this is the current costume
         if (activeSprite.pixiSprite.texture === costume.texture) {
@@ -613,11 +615,11 @@ function renderCostumesList() {
         if (currentSocket && currentRoom) {
           currentSocket.emit("projectUpdate", {
             roomId: currentRoom,
-            type: "updateCostume",
+            type: "addCostume",
             data: {
               spriteId: activeSprite.id,
-              name: costume.name,
-              texture: dataURL,
+              name: uniqueName,
+              texture: costumeData.dataURL,
             },
           });
         }
@@ -1825,6 +1827,7 @@ loadButton.addEventListener("click", () => {
 });
 loadInput.addEventListener("change", loadProject);
 
+// Create new costume with editor
 // Create new costume with editor
 document.getElementById('create-costume-button')?.addEventListener('click', () => {
   if (!activeSprite) {
@@ -1832,10 +1835,13 @@ document.getElementById('create-costume-button')?.addEventListener('click', () =
     return;
   }
 
-  openCostumeEditor(null, async (dataURL) => {
-    if (!dataURL || !activeSprite) return;
+  openCostumeEditor(null, async (costumeData) => {
+    if (!costumeData || !activeSprite) return;
 
-    const texture = PIXI.Texture.from(dataURL);
+    const texture = PIXI.Texture.from(costumeData.dataURL);
+  
+    // Store the editorData along with the texture for future editing
+    texture.editorData = costumeData.editorData;
 
     let uniqueName = 'costume';
     let counter = 1;