diff --git a/info.txt b/info.txt new file mode 100644 index 0000000..1d7ca1a --- /dev/null +++ b/info.txt @@ -0,0 +1 @@ +1. Auto brake line Drag v4 Left & Right Heading. \ No newline at end of file diff --git a/src/pages/cross/cross_phonics_v1.astro b/src/pages/cross/cross_phonics_v1.astro index 482b675..32c8bee 100644 --- a/src/pages/cross/cross_phonics_v1.astro +++ b/src/pages/cross/cross_phonics_v1.astro @@ -10,7 +10,7 @@ import Layout from "../../layouts/Layout.astro";
-
+
@@ -24,45 +24,45 @@ import Layout from "../../layouts/Layout.astro";

--> -

+

-
-
-
@@ -257,7 +257,6 @@ import Layout from "../../layouts/Layout.astro"; text-align: center; font-weight: bold; color: #7C4C23; - font-size: 20px; padding-top: 10px; } #LearningArea, #LearningSubArea_copy{ diff --git a/src/pages/cross/cross_phonics_v2.astro b/src/pages/cross/cross_phonics_v2.astro index 4d1a120..a1480d7 100644 --- a/src/pages/cross/cross_phonics_v2.astro +++ b/src/pages/cross/cross_phonics_v2.astro @@ -10,7 +10,7 @@ import Layout from "../../layouts/Layout.astro";
-
+
@@ -24,63 +24,63 @@ import Layout from "../../layouts/Layout.astro";

--> -

+

-
-
-
@@ -292,7 +292,6 @@ import Layout from "../../layouts/Layout.astro"; text-align: center; font-weight: bold; color: #7C4C23; - font-size: 20px; padding-top: 10px; } #LearningArea, #LearningSubArea_copy{ diff --git a/src/pages/cross/v1.astro b/src/pages/cross/v1.astro index bd4eadb..7eb5346 100644 --- a/src/pages/cross/v1.astro +++ b/src/pages/cross/v1.astro @@ -10,7 +10,7 @@ import Layout from "../../layouts/Layout.astro";
-
+
@@ -24,45 +24,45 @@ import Layout from "../../layouts/Layout.astro";

--> -

+

@@ -258,7 +258,6 @@ import Layout from "../../layouts/Layout.astro"; text-align: center; font-weight: bold; color: #7C4C23; - font-size: 20px; padding-top: 10px; } #LearningArea, #LearningSubArea_copy{ diff --git a/src/pages/cross/v2.astro b/src/pages/cross/v2.astro index 1d1fde9..2d91e54 100644 --- a/src/pages/cross/v2.astro +++ b/src/pages/cross/v2.astro @@ -10,7 +10,7 @@ import Layout from "../../layouts/Layout.astro";
-
+
@@ -24,70 +24,70 @@ import Layout from "../../layouts/Layout.astro";

--> -

+

-
-
-

- +
@@ -292,7 +292,6 @@ import Layout from "../../layouts/Layout.astro"; text-align: center; font-weight: bold; color: #7C4C23; - font-size: 20px; padding-top: 10px; } #LearningArea, #LearningSubArea_copy{ diff --git a/src/pages/cross/v3.astro b/src/pages/cross/v3.astro index ce283ea..19587bf 100644 --- a/src/pages/cross/v3.astro +++ b/src/pages/cross/v3.astro @@ -11,7 +11,7 @@ import Layout from "../../layouts/Layout.astro";
-
+
@@ -22,7 +22,7 @@ import Layout from "../../layouts/Layout.astro";
-

+

@@ -245,7 +245,6 @@ import Layout from "../../layouts/Layout.astro"; text-align: center; font-weight: bold; color: #7C4C23; - font-size: 20px; padding-top: 10px; } #LearningArea, #LearningSubArea{ diff --git a/src/pages/drag/dragdrop_phonics.astro b/src/pages/drag/dragdrop_phonics.astro index 21172ac..bdb2662 100644 --- a/src/pages/drag/dragdrop_phonics.astro +++ b/src/pages/drag/dragdrop_phonics.astro @@ -71,11 +71,11 @@ import Layout from '../../layouts/Layout.astro'; let retryButton; let blockMatches; if(isMobile){ - topLogoWidth = 4.5; + topLogoWidth = 4.5; muteIconWidth = 1.8; - resetIconWidth = 1.47; - tickIconWidth = 1.24; - cancelIconWidth = 1.08; + resetIconWidth = 1.5; + tickIconWidth = 1.28; + cancelIconWidth = 1.12; noticeWidth = 100; noticeHeight = 0; buttonWidth = 67; diff --git a/src/pages/drag/index.astro b/src/pages/drag/index.astro index f0c4921..13d2360 100644 --- a/src/pages/drag/index.astro +++ b/src/pages/drag/index.astro @@ -70,11 +70,11 @@ import Layout from '../../layouts/Layout.astro'; let cancelIconWidth; if(isMobile){ - topLogoWidth = 5; - muteIconWidth = 2; - resetIconWidth = 1.6; - tickIconWidth = 1.34; - cancelIconWidth = 1.16; + topLogoWidth = 4.5; + muteIconWidth = 1.8; + resetIconWidth = 1.5; + tickIconWidth = 1.28; + cancelIconWidth = 1.12; noticeWidth = 100; noticeHeight = 0; buttonWidth = 67; @@ -314,10 +314,11 @@ import Layout from '../../layouts/Layout.astro'; // console.log(data) const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; const baseFontSize = 24; - const responsiveFontSize = (window.innerWidth / 940) * baseFontSize; + let textSizeScale; if(isMobile){textSizeScale = 540}else{textSizeScale = 940}; + const responsiveFontSize = (window.innerWidth / textSizeScale) * baseFontSize; let wrapWidth; if(isMobile){wrapWidth = 10;} else{wrapWidth = 200;} - const descrptText = this.add.text(screenCenterX, 100, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); + const descrptText = this.add.text(screenCenterX, 90, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); blockMatches = [ { blockName: "blocks1", diff --git a/src/pages/drag/match_phonics.astro b/src/pages/drag/match_phonics.astro index 9fc4eb8..c39f325 100644 --- a/src/pages/drag/match_phonics.astro +++ b/src/pages/drag/match_phonics.astro @@ -69,11 +69,11 @@ import Layout from '../../layouts/Layout.astro'; let tickIconWidth; let cancelIconWidth; if(isMobile){ - topLogoWidth = 5; - muteIconWidth = 2; - resetIconWidth = 1.6; - tickIconWidth = 1.34; - cancelIconWidth = 1.16; + topLogoWidth = 4.5; + muteIconWidth = 1.8; + resetIconWidth = 1.5; + tickIconWidth = 1.28; + cancelIconWidth = 1.12; noticeWidth = 100; noticeHeight = 0; buttonWidth = 67; @@ -314,12 +314,20 @@ import Layout from '../../layouts/Layout.astro'; targetName: `target${data.right_match4}`, }, ]; + let wrapWidth; + let textSizeScale; + if(isMobile){ + wrapWidth = 10; + textSizeScale = 540 + }else{ + wrapWidth = 200; + textSizeScale = 940 + }; + const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; const baseFontSize = 24; - const responsiveFontSize = (window.innerWidth / 940) * baseFontSize; - let wrapWidth; - if(isMobile){wrapWidth = 10;} else{wrapWidth = 200;} - const descrptText = this.add.text(screenCenterX, 100, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); + const responsiveFontSize = (window.innerWidth / textSizeScale) * baseFontSize; + const descrptText = this.add.text(screenCenterX, 85, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); // this.add.text(displayW / 14 - 15, 50, data.LearningArea, {font: `20px`}).setTint(0x7c4c23); // this.add.text(displayW / 14 - 15, 70, data.LearningSubArea_copy, {font: `19px`}).setTint(0x7c4c23); // Left Image Name diff --git a/src/pages/drag/v2.astro b/src/pages/drag/v2.astro index 99b9eb5..78ea0d0 100644 --- a/src/pages/drag/v2.astro +++ b/src/pages/drag/v2.astro @@ -69,11 +69,11 @@ import Layout from '../../layouts/Layout.astro'; let tickIconWidth; let cancelIconWidth; if(isMobile){ - topLogoWidth = 5; - muteIconWidth = 2; - resetIconWidth = 1.6; - tickIconWidth = 1.34; - cancelIconWidth = 1.16; + topLogoWidth = 4.5; + muteIconWidth = 1.8; + resetIconWidth = 1.5; + tickIconWidth = 1.28; + cancelIconWidth = 1.12; noticeWidth = 100; noticeHeight = 0; buttonWidth = 67; @@ -314,12 +314,20 @@ import Layout from '../../layouts/Layout.astro'; targetName: `target${data.right_match4}`, }, ]; - const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; - const baseFontSize = 24; - const responsiveFontSize = (window.innerWidth / 940) * baseFontSize; + let wrapWidth; - if(isMobile){wrapWidth = 10;} else{wrapWidth = 200;} - const descrptText = this.add.text(screenCenterX, 100, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); + let textSizeScale; + if(isMobile){ + wrapWidth = 10; + textSizeScale = 540 + } else{ + wrapWidth = 200; + textSizeScale = 940 + } + const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; + const baseFontSize = 24; + const responsiveFontSize = (window.innerWidth / textSizeScale) * baseFontSize; + const descrptText = this.add.text(screenCenterX, 90, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); // this.add.text(displayW / 14 - 15, 50, data.LearningArea, {font: `20px`}).setTint(0x7c4c23); // this.add.text(displayW / 14 - 15, 70, data.LearningSubArea_copy, {font: `19px`}).setTint(0x7c4c23); // Left Image Name diff --git a/src/pages/drag/v3.astro b/src/pages/drag/v3.astro index 25b5695..4fc4b5d 100644 --- a/src/pages/drag/v3.astro +++ b/src/pages/drag/v3.astro @@ -70,19 +70,21 @@ import Layout from '../../layouts/Layout.astro'; let cancelIconWidth; let retryButton; let blockMatches; + let retryButtonWidth; + let leftTargetZoneW; if(isMobile){ - topLogoWidth = 5; - muteIconWidth = 2; - resetIconWidth = 1.6; - tickIconWidth = 1.34; - cancelIconWidth = 1.16; + topLogoWidth = 4.5; + muteIconWidth = 1.8; + resetIconWidth = 1.5; + tickIconWidth = 1.28; + cancelIconWidth = 1.12; noticeWidth = 100; noticeHeight = 0; buttonWidth = 67; buttonHeight = 0; retryButtonWidth = window.innerWidth / 2 - 140; retryButtonHeight = window.innerHeight - 50; - leftTargetZoneW = window.innerWidth * 0.9 - 40; + leftTargetZoneW = window.innerWidth * 0.9 - 30; rightTargetZoneW = window.innerWidth / 6; } else { topLogoWidth = 6; @@ -131,19 +133,19 @@ import Layout from '../../layouts/Layout.astro'; }, { x: rightTargetZoneW, - y: 340, + y: 330, name: "target2", block: null, }, { x: rightTargetZoneW, - y: 510, + y: 480, name: "target3", block: null, }, { x: rightTargetZoneW, - y: 680, + y: 650, name: "target4", block: null, }, @@ -155,19 +157,19 @@ import Layout from '../../layouts/Layout.astro'; }, { x: leftTargetZoneW, - y: 340, + y: 330, name: "target6", block: null, }, { x: leftTargetZoneW, - y: 510, + y: 480, name: "target7", block: null, }, { x: leftTargetZoneW, - y: 680, + y: 650, name: "target8", block: null, }, @@ -360,12 +362,21 @@ import Layout from '../../layouts/Layout.astro'; } ]; // console.log(data) + + + let wrapWidth; + let textSizeScale; + if(isMobile){ + wrapWidth = 10; + textSizeScale = 540; + } else{ + wrapWidth = 200; + textSizeScale = 940 + } const screenCenterX = this.cameras.main.worldView.x + this.cameras.main.width / 2; const baseFontSize = 24; - const responsiveFontSize = (window.innerWidth / 940) * baseFontSize; - let wrapWidth; - if(isMobile){wrapWidth = 10;} else{wrapWidth = 200;} - const descrptText = this.add.text(screenCenterX, 100, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); + const responsiveFontSize = (window.innerWidth / textSizeScale) * baseFontSize; + const descrptText = this.add.text(screenCenterX, 85, data.description, { font: `${responsiveFontSize}px quicksand`, fill: '#60C6CB', align: "center", wordWrap: {width: window.innerWidth-wrapWidth}}, ).setOrigin(0.5); }) .catch(error => { console.error('Error fetching initial data:', error); diff --git a/src/pages/drag/v4.astro b/src/pages/drag/v4.astro index b102504..e39f7e1 100644 --- a/src/pages/drag/v4.astro +++ b/src/pages/drag/v4.astro @@ -52,6 +52,7 @@ import Layout from '../../layouts/Layout.astro';