init mygame

src/pages/drag/index.astro

@@ -90,14 +90,34 @@ const blockMatches = [
     targetName: "target4",
   },
 ];
+var assetsList = {}
+
 const params = new URLSearchParams(window.location.search);
     const paramsID = params.get('id');
     const data =       fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`)
     .then(response => response.json())
-    .then(data => { 
-      // console.log(data.data);
-      // let ttt="ttt";
-      data
+    .then(({data}) => {
+      console.log("finding:: data",data)
+      const {left_image1, right_image1} = data
+
+      assetsList.left_image1 = "https://management.beanstalkedu.com/assets/" + left_image1
+      assetsList.right_image1 = "https://management.beanstalkedu.com/assets/" + right_image1
+
+      const config = {
+        type: Phaser.AUTO,
+        width: window.innerWidth,
+        height: window.innerHeight,
+        
+        parent: "phaser-example",
+        scale: {
+          mode: Phaser.Scale.FIT,
+          autoCenter: Phaser.Scale.CENTER_HORIZONTALLY,
+        },
+        
+        scene: MyGame,
+      };
+      const game = new Phaser.Game(config);    
+
     })
     .catch(error => {
       console.error('Error fetching initial data:', error);
@@ -227,15 +247,15 @@ class MyGame extends Phaser.Scene {
                 this.load.image('logo'+i, '/assets/background.jpg');
             }
 
-    
     this.load.image("tick", '/assets/tick.png');
     this.load.image("bg", '/assets/background.jpg');
-    this.load.image("target1", '/assets/yam.png');
+    this.load.image("target1", assetsList.right_image1);
     this.load.image("target2", '/assets/hay.png');
     this.load.image("target3", '/assets/mat.png');
     this.load.image("target4", '/assets/star.png');
     this.load.image("border", '/assets/squar.png');
-    this.load.spritesheet("blocks1", '/assets/chat.png',{
+
+    this.load.spritesheet("blocks1", assetsList.left_image1,{
       frameWidth: 100,
       frameHeight: 100,
     });
@@ -253,7 +273,6 @@ class MyGame extends Phaser.Scene {
     });
   }
   create() {
-  console.log(data)
     const bgWidthX = window.innerWidth / 2;
     const bgWidthY = window.innerHeight / 2;
     this.add.image(bgWidthX, bgWidthY, "bg").setScale(2.4);
@@ -405,21 +424,6 @@ const isMatch = (blockName, targetName) => {
   // console.log("Result", result)
   return match !== undefined;
 };
-const config = {
-  type: Phaser.AUTO,
-  width: window.innerWidth,
-  height: window.innerHeight,
-  
-  parent: "phaser-example",
-  scale: {
-    mode: Phaser.Scale.FIT,
-    autoCenter: Phaser.Scale.CENTER_HORIZONTALLY,
-  },
-  
-  scene: MyGame,
-};
-
-const game = new Phaser.Game(config);
 </script>
 <style>
   * {