commit
3ed170c09b
File diff suppressed because it is too large
Load Diff
|
|
@ -17,6 +17,7 @@
|
|||
"astro-eslint-parser": "^0.14.0",
|
||||
"eslint": "^8.44.0",
|
||||
"flowbite-typography": "^1.0.3",
|
||||
"html2canvas": "^1.4.1",
|
||||
"phaser": "^3.60.0",
|
||||
"shiki": "^0.14.3",
|
||||
"tailwind-scrollbar": "^3.0.4",
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@
|
|||
const urlParams = new URLSearchParams(queryString);
|
||||
const userId = urlParams.get('userId');
|
||||
const gameVersion = urlParams.get('gameName');
|
||||
let gameId;
|
||||
const gameId = urlParams.get('id');
|
||||
let submitNotic;
|
||||
|
||||
console.log(userId);
|
||||
|
|
@ -118,7 +118,7 @@ function submitUserData(drawingZone) {
|
|||
|
||||
};
|
||||
console.log(userData);
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore`, {
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
|
|
|
|||
|
|
@ -194,7 +194,7 @@ function submitUserData(drawingZone) {
|
|||
'gameStar' : starValue
|
||||
};
|
||||
console.log(userData);
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore`, {
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ const queryString = window.location.search;
|
|||
const urlParams = new URLSearchParams(queryString);
|
||||
const userId = urlParams.get('userId');
|
||||
const gameVersion = urlParams.get('gameName');
|
||||
let gameId;
|
||||
const gameId = urlParams.get('id');
|
||||
let submitNotic;
|
||||
|
||||
console.log(userId);
|
||||
|
|
@ -16,13 +16,7 @@ let startTime = Date.now();
|
|||
const url = window.location.href;
|
||||
const gameName = url.split('/');
|
||||
const gameType = gameName[3].split('?id=');
|
||||
// let gameVersion;
|
||||
|
||||
// console.log("Here is game name ", gameType[0])
|
||||
|
||||
// if(gameType[0] == "guided-tracing"){
|
||||
// gameVersion = gameType[0].split('?')[0];
|
||||
// gameId = gameName[4];
|
||||
// let gameVersion;iVBORw0KGgoAAAANSUhEUgAAB4A
|
||||
// console.log('Type - 1');
|
||||
|
||||
// } else if(gameName.length == 4){
|
||||
|
|
@ -105,8 +99,8 @@ function submitUserData(drawingZone) {
|
|||
'score' : scoreTotal,
|
||||
'gameStar' : starValue
|
||||
};
|
||||
// console.log(userData);
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore`, {
|
||||
console.log(userData);
|
||||
fetch(`https://api.teachertrainingkolkata.in/api/saveGameScore2`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json'
|
||||
|
|
|
|||
|
|
@ -219,7 +219,25 @@ import Layout from '../layouts/Layout.astro';
|
|||
// .catch(error => {
|
||||
// console.error('Error fetching initial data:', error);
|
||||
// });
|
||||
|
||||
function captureSnapshot(scene) {
|
||||
customCursor.setVisible(false);
|
||||
if (scene.game.renderer) {
|
||||
scene.game.renderer.snapshot((image) => {
|
||||
customCursor.setVisible(true);
|
||||
image.style.width = '160px';
|
||||
image.style.height = '120px';
|
||||
image.style.paddingLeft = '2px';
|
||||
document.body.appendChild(image);
|
||||
const link = document.createElement('a');
|
||||
link.href = image.src;
|
||||
link.download = 'my_drawing.png';
|
||||
link.click();
|
||||
document.body.removeChild(image);
|
||||
});
|
||||
} else {
|
||||
console.error('Renderer is not available.');
|
||||
}
|
||||
}
|
||||
const config = {
|
||||
type: Phaser.AUTO,
|
||||
width: window.innerWidth,
|
||||
|
|
@ -262,6 +280,7 @@ import Layout from '../layouts/Layout.astro';
|
|||
}
|
||||
|
||||
function create() {
|
||||
const scene = this;
|
||||
// const params = new URLSearchParams(window.location.search);
|
||||
// const paramsID = params.get('id');
|
||||
// fetch(`https://game-du.teachertrainingkolkata.in/items/game_drawing/${encodeURIComponent(paramsID)}?filter[status][_eq]=published`)
|
||||
|
|
@ -361,14 +380,8 @@ import Layout from '../layouts/Layout.astro';
|
|||
colorContainer.style.left = '10px';
|
||||
colorContainer.style.display = 'flex';
|
||||
colorContainer.style.marginBottom = '0';
|
||||
if(!isMobile){
|
||||
colorContainer.style.flexDirection = 'row';
|
||||
}
|
||||
if(isMobile){
|
||||
colorContainer.style.display = 'none';
|
||||
colorContainer.style.flexDirection = 'row';
|
||||
|
||||
}
|
||||
colorContainer.style.flexDirection = 'row';
|
||||
|
||||
colorContainer.style.backgroundColor = '#FFFFFF';
|
||||
colorContainer.style.padding = '1px 10px';
|
||||
colorContainer.style.borderRadius = '30px';
|
||||
|
|
@ -382,10 +395,27 @@ import Layout from '../layouts/Layout.astro';
|
|||
colorEraserCont.style.display = 'flex';
|
||||
colorEraserCont.style.flexDirection = 'row';
|
||||
|
||||
let clearAndDownloadContainer = document.createElement('div');
|
||||
clearAndDownloadContainer.style.display = 'flex';
|
||||
clearAndDownloadContainer.style.flexDirection = 'row';
|
||||
clearAndDownloadContainer.style.gap = '15px';
|
||||
|
||||
let downloadButton = document.createElement('button');
|
||||
downloadButton.innerHTML = '<svg fill="#394FC0" width="48px" height="48px" viewBox="-6.5 0 32 32" version="1.1" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"> <title>save</title> <path d="M12.188 4.469v4.656h2.438l-4.875 5.875-4.875-5.875h2.563v-4.656h4.75zM16.313 12l2.844 4.5c0.156 0.375 0.344 1.094 0.344 1.531v8.656c0 0.469-0.375 0.813-0.813 0.813h-17.844c-0.469 0-0.844-0.344-0.844-0.813v-8.656c0-0.438 0.156-1.156 0.313-1.531l2.844-4.5c0.156-0.406 0.719-0.75 1.125-0.75h1.281l1.313 1.594h-2.625l-2.531 4.625c-0.031 0-0.031 0.031-0.031 0.063 0 0.063 0 0.094-0.031 0.125h16.156v-0.125c0-0.031-0.031-0.063-0.031-0.094l-2.531-4.594h-2.625l1.313-1.594h1.25c0.438 0 0.969 0.344 1.125 0.75zM7.469 21.031h4.594c0.406 0 0.781-0.375 0.781-0.813 0-0.406-0.375-0.781-0.781-0.781h-4.594c-0.438 0-0.813 0.375-0.813 0.781 0 0.438 0.375 0.813 0.813 0.813z"></path> </g></svg>'
|
||||
downloadButton.style.boxShadow = '5px 10px 30px #7c4c2390';
|
||||
downloadButton.style.borderRadius = '8px';
|
||||
|
||||
downloadButton.addEventListener('click', () => {
|
||||
captureSnapshot(scene);
|
||||
});
|
||||
|
||||
let clearBoard = document.createElement('button');
|
||||
clearBoard.innerHTML ='<svg width="48px" height="48px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" stroke="#0348A8"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M6 12h12M4 16h12M8 8h12" stroke="#0348A8" stroke-width="1.5" stroke-miterlimit="10" stroke-linecap="round"></path></g></svg>';
|
||||
clearBoard.style.boxShadow = '5px 10px 30px #7c4c2390';
|
||||
clearBoard.style.borderRadius = '8px';
|
||||
|
||||
clearAndDownloadContainer.appendChild(clearBoard);
|
||||
clearAndDownloadContainer.appendChild(downloadButton);
|
||||
colorContainer.appendChild(colorEraserCont);
|
||||
|
||||
let colorViewButton = this.add.image(window.innerWidth / 7, window.innerHeight / 1.25, 'colorButton');
|
||||
|
|
@ -634,8 +664,9 @@ import Layout from '../layouts/Layout.astro';
|
|||
colorPreview.style.width = '40px';
|
||||
colorPreview.style.height = '40px';
|
||||
colorPreview.style.backgroundColor = 'blue';
|
||||
// Append the color buttons container to the color container
|
||||
colorButtonsContainer.appendChild(clearBoard);
|
||||
// Append the color buttons container to the color container downloadButton
|
||||
|
||||
colorButtonsContainer.appendChild(clearAndDownloadContainer);
|
||||
colorContainer.appendChild(colorButtonsContainer);
|
||||
|
||||
// Append the color container to the document body
|
||||
|
|
@ -825,39 +856,8 @@ import Layout from '../layouts/Layout.astro';
|
|||
snapNotice = this.add.text(customWidth / 2, customHeight / 2, 'Succecfully Downloaded', {font :'700 30px Quicksand', fill: '#05b3a4'});
|
||||
snapNotice.setVisible(false);
|
||||
}
|
||||
function captureSnapshot(drawingZone) {
|
||||
// snapNotice.setVisible(true);
|
||||
submitButton.setVisible(false);
|
||||
// snapshotButton.setVisible(false);
|
||||
customCursor.setVisible(false);
|
||||
muteIcon.setVisible(false);
|
||||
retryButton.setVisible(false);
|
||||
galleryButton.setVisible(false);
|
||||
|
||||
|
||||
drawingZone.renderer.snapshot((image) => {
|
||||
submitButton.setVisible(true);
|
||||
snapshotButton.setVisible(true);
|
||||
customCursor.setVisible(true);
|
||||
muteIcon.setVisible(true);
|
||||
retryButton.setVisible(true);
|
||||
galleryButton.setVisible(true);
|
||||
|
||||
image.style.width = '160px';
|
||||
image.style.height = '120px';
|
||||
image.style.paddingLeft = '2px';
|
||||
document.body.appendChild(image);
|
||||
// Download the snapshot as an image
|
||||
const link = document.createElement('a');
|
||||
link.href = image.src;
|
||||
link.download = 'my_drawing.png';
|
||||
link.click();
|
||||
document.body.removeChild(image);
|
||||
// Clear the drawing
|
||||
// graphics.clear();
|
||||
});
|
||||
}
|
||||
|
||||
function startDrawing(x, y) {
|
||||
if (!isErasing) {
|
||||
graphics.lineStyle(brushSize * 2, Phaser.Display.Color.HexStringToColor(selectedColor).color);
|
||||
|
|
|
|||
Loading…
Reference in New Issue