+
+
+
+
+
\ No newline at end of file
diff --git a/src/components/GameCanvas.svelte b/src/components/GameCanvas.svelte
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/HUD.svelte b/src/components/HUD.svelte
new file mode 100644
index 0000000..e69de29
diff --git a/src/game/Enemy.js b/src/game/Enemy.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/game/Fragment.js b/src/game/Fragment.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/game/Player.js b/src/game/Player.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/game/TarPuddle.js b/src/game/TarPuddle.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/game/levelData.js b/src/game/levelData.js
new file mode 100644
index 0000000..e69de29
diff --git a/src/routes/Game.svelte b/src/routes/Game.svelte
new file mode 100644
index 0000000..4432b31
--- /dev/null
+++ b/src/routes/Game.svelte
@@ -0,0 +1,7 @@
+
+ ColorQuest - Game (this is a placeholder)
+
+
+
+
+
\ No newline at end of file
diff --git a/src/routes/GameOver.svelte b/src/routes/GameOver.svelte
new file mode 100644
index 0000000..120c191
--- /dev/null
+++ b/src/routes/GameOver.svelte
@@ -0,0 +1,7 @@
+
+ ColorQuest - Game Over (this is a placeholder)
+
+
+
+
+
\ No newline at end of file
diff --git a/src/routes/Home.svelte b/src/routes/Home.svelte
new file mode 100644
index 0000000..146fdd9
--- /dev/null
+++ b/src/routes/Home.svelte
@@ -0,0 +1,7 @@
+
+ ColorQuest - Home (this is a placeholder)
+
+
+
+
+
\ No newline at end of file
diff --git a/src/routes/LevelSelect.svelte b/src/routes/LevelSelect.svelte
new file mode 100644
index 0000000..2d40e80
--- /dev/null
+++ b/src/routes/LevelSelect.svelte
@@ -0,0 +1,7 @@
+
+ ColorQuest - Level Select (this is a placeholder)
+
+
+
+
+
\ No newline at end of file
diff --git a/src/stores/colorStore.js b/src/stores/colorStore.js
new file mode 100644
index 0000000..ced6a95
--- /dev/null
+++ b/src/stores/colorStore.js
@@ -0,0 +1,69 @@
+// this is a shared state between game canvas and UI screens
+
+// svelte stores are like global variables
+// they update evey component that reads them
+// so I can place my color states here so they are updated everywhere
+
+
+// a writebale is a box that holds a value
+// any svelte comonent can read from within it
+//autupdated when value changes
+// its like the dollar sign notation
+
+// -- so these are the global variables ----
+
+import {writeable} from 'svelte/store';
+
+// world starts gray so unlockedColors start as an empty array (there is none)
+export const unlockedColors = writable({});
+
+// the current level number
+export const currentLevel = writable(1);
+
+// opacity of color being unlccked: 0.0 is gray, 1.0 is full color
+// this increases per fragment collected
+export const colorOpacity = writable(0.0);
+
+// the hex color for the current level
+export const levelColor = writable('#888888');
+
+// how many fragment have been collected
+export const fragmentsCollected = writable(0);
+
+//player lives
+export const lives = writable(3);
+
+// --- these are the global functions -----
+
+// for collecting a fragment
+// we update the number of fragments collected and the color opacity
+export function onFragmentCollection(totalFragments, hexColor){
+ fragmentsCollected.update(n => {
+ const newCount = n + 1;
+ // opacity is a fraction of the number of fragments collected
+ colorOpacity.set(newCount / totalFragments);
+ return newCount;
+ });
+ levelColor.set(hexColor);
+}
+
+// starting a level over
+export function resetLevel(levelNum, hexColor){
+ currentLevel.set(levelNum);
+ levelColor.set(hexColor);
+ colorOpacity.set(0.0); // back to gray
+ fragmentsCollected.set(0);
+ lives.set(3); // reset lives
+}
+
+// compleating a level!
+export function completeLevel(hexColor){
+ unlockedColors.update(arr => {
+ if (!arr.includes(hexColor)) return [...arr, hexColor];
+ return arr; // we don't want duplicate colors so only add if not already existed
+ // bascially person can play game again but color has been gained anyway
+ });
+}
+
+
+