diff --git a/src/pages/drag/index.astro b/src/pages/drag/index.astro index 01529dd..5f8e207 100644 --- a/src/pages/drag/index.astro +++ b/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);