kar
/
phaser-game-bs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fetch

pull/1/head
ov 2023-07-23 11:14:58 +05:30
parent 28dd7ab327
commit 8117642d5a
1 changed files with 130 additions and 54 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

184
src/pages/drag/index.astro
View File

@ -90,39 +90,143 @@ const blockMatches = [
targetName: "target4",
},
];
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
})
.catch(error => {
console.error('Error fetching initial data:', error);
});
class MyGame extends Phaser.Scene {
constructor() {
super();
}
preload() {
fetch(`https://management.beanstalkedu.com/items/game_drag`)
.then(response => response.json())
.then(data => {
console.log(data.data);
// const params = new URLSearchParams(window.location.search);
// const paramsID = params.get('id');
// fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`)
// .then(response => response.json())
// .then(data => {
// console.log(data.data);
// // let ttt="ttt";
// })
// .catch(error => {
// console.error('Error fetching initial data:', error);
// });
async function getAssetDetails(){
const params = new URLSearchParams(window.location.search);
const paramsID = params.get('id');
console.log(paramsID);
fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`)
.then(response => response.json())
.then(dataWithParamsID => {
const description = dataWithParamsID.data.description;
console.log(description);
const text = this.add.text(900, 20, description, {
fontSize: '32px',
color: '#ffffff',
});
text.setOrigin(0.5);
// let description_txt = this.add.text(0, 0, description, {font: '40px Ariel', fill: '#7c4c23' });
Phaser.Display.Align.In.Center(description_txt);
})
.catch(error => {
console.error('Error fetching data using paramsID:', error);
try {
const response = await fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`, {
// method: "POST", // or 'PUT'
// headers: {
// "Content-Type": "application/json",
// },
body: JSON.stringify(data),
});
})
.catch(error => {
console.error('Error fetching initial data:', error);
});
const result = await response.json();
console.log("Success:", result);
// this.load.image("bg", '/assets/background.jpg');
} catch (error) {
console.error("Error:", error);
}
}
// console.log(getAssetDetails());
// getAssetDetails();
// async function postJSON(data) {
// try {
// const response = await fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`, {
// method: "POST", // or 'PUT'
// headers: {
// "Content-Type": "application/json",
// },
// body: JSON.stringify(data),
// });
// const result = await response.json();
// console.log("Success:", result);
// } catch (error) {
// console.error("Error:", error);
// }
// }
// const data = { username: "example" };
// postJSON(data);
var progressBar = this.add.graphics();
var progressBox = this.add.graphics();
progressBox.fillStyle(0x222222, 0.8);
progressBox.fillRect(240, 270, 320, 50);
var width = this.cameras.main.width;
var height = this.cameras.main.height;
var loadingText = this.make.text({
x: width / 2,
y: height / 2 - 50,
text: 'Loading...',
style: {
font: '20px monospace',
fill: '#ffffff'
}
});
loadingText.setOrigin(0.5, 0.5);
var percentText = this.make.text({
x: width / 2,
y: height / 2 - 5,
text: '0%',
style: {
font: '18px monospace',
fill: '#ffffff'
}
});
percentText.setOrigin(0.5, 0.5);
var assetText = this.make.text({
x: width / 2,
y: height / 2 + 50,
text: '',
style: {
font: '18px monospace',
fill: '#ffffff'
}
});
assetText.setOrigin(0.5, 0.5);
this.load.on('progress', function (value) {
percentText.setText(parseInt(value * 100) + '%');
progressBar.clear();
progressBar.fillStyle(0xffffff, 1);
progressBar.fillRect(250, 280, 300 * value, 30);
});
this.load.on('fileprogress', function (file) {
assetText.setText('Loading asset: ' + file.key);
});
this.load.on('complete', function () {
progressBar.destroy();
progressBox.destroy();
loadingText.destroy();
percentText.destroy();
assetText.destroy();
});
// this.load.image('logo', 'zenvalogo.png');
for (var i = 0; i < 5; i++) {
this.load.image('logo'+i, '/assets/background.jpg');
}
this.load.image("tick", '/assets/tick.png');
this.load.image("bg", '/assets/background.jpg');
@ -149,35 +253,7 @@ class MyGame extends Phaser.Scene {
});
}
create() {
fetch(`https://management.beanstalkedu.com/items/game_drag`)
.then(response => response.json())
.then(data => {
// console.log(data.data);
const params = new URLSearchParams(window.location.search);
const paramsID = params.get('id');
console.log(paramsID);
fetch(`https://management.beanstalkedu.com/items/game_drag/${encodeURIComponent(paramsID)}`)
.then(response => response.json())
.then(dataWithParamsID => {
const leftImage1 = dataWithParamsID.data.left_image1
console.log(leftImage1);
})
.catch(error => {
console.error('Error fetching data using paramsID:', error);
});
})
.catch(error => {
console.error('Error fetching initial data:', error);
});
// fetch(`https://management.beanstalkedu.com/items/game_drag`)
// .then(response => response.json())
// .then(data => {
// // console.log(data)
// const queryString = window.location.search;
// console.log(queryString)
// })
// .catch(error => {
// });
console.log(data)
const bgWidthX = window.innerWidth / 2;
const bgWidthY = window.innerHeight / 2;
this.add.image(bgWidthX, bgWidthY, "bg").setScale(2.4);