Skip to content

Commit

Permalink
move to chrome storage api, light mode, add license
Browse files Browse the repository at this point in the history 
summary
- add light mode, dark mode partial support
- move the buttons to the top.
- move to chrome storage api dedicated for extensions
- add license
  • Loading branch information
Abdullah Jamal committed Feb 11, 2024
1 parent 95bc21a commit 601bd2b
Show file tree
Hide file tree
Showing 27 changed files with 402 additions and 308 deletions.
2 changes: 1 addition & 1 deletion css/style.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
body{
background-color: rgb(0, 2, 105);
background-color: rgb(19, 41, 75);
}
.header {
background-color: #9933cc;
Expand Down
41 changes: 22 additions & 19 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link href="css/style.css" rel="stylesheet" type="text/css" />
<link rel="manifest" href="/manifest.json" />
<script defer src="/js/app.js"></script>
<script defer src="/src/app.js"></script>
</head>

<body></body>
Expand All @@ -14,30 +14,33 @@
<!-- p5.js library -->
<script src="node_modules/p5/lib/p5.min.js"></script>

<script src="src/utils/base64Utils.js"></script>
<script src="src/service/storage.js"></script>

<!-- config file -->
<script src="js/setup/sketch.js"></script>
<script src="src/setup/sketch.js"></script>

<!-- class files -->
<script src="js/classes/networkClass.js"></script>
<script src="js/classes/shipClass.js"></script>
<script src="js/classes/playerClass.js"></script>
<script src="js/classes/botClass.js"></script>
<script src="js/classes/buttonClass.js"></script>
<script src="js/classes/animationClass.js"></script>
<script src="src/classes/networkClass.js"></script>
<script src="src/classes/shipClass.js"></script>
<script src="src/classes/playerClass.js"></script>
<script src="src/classes/botClass.js"></script>
<script src="src/classes/buttonClass.js"></script>
<script src="src/classes/animationClass.js"></script>

<script src="js/mapSwap.js"></script>
<script src="src/mapSwap.js"></script>

<!-- Game state files -->
<script src="js/states/menuState.js"></script>
<script src="js/states/newMapState.js"></script>
<script src="js/states/singlePlayerState.js"></script>
<script src="js/states/multiPlayerOfflineState.js"></script>
<script src="js/states/multiPlayerOnlineState.js"></script>
<script src="js/states/instructionsState.js"></script>
<script src="js/states/creditsState.js"></script>
<script src="js/states/statisticsState.js"></script>
<script src="js/states/winStateCall.js"></script>
<script src="src/states/menuState.js"></script>
<script src="src/states/newMapState.js"></script>
<script src="src/states/singlePlayerState.js"></script>
<script src="src/states/multiPlayerOfflineState.js"></script>
<script src="src/states/multiPlayerOnlineState.js"></script>
<script src="src/states/instructionsState.js"></script>
<script src="src/states/creditsState.js"></script>
<script src="src/states/statisticsState.js"></script>
<script src="src/states/winStateCall.js"></script>

<!-- main file -->
<script src="js/draw.js"></script>
<script src="src/draw.js"></script>
</html>
183 changes: 0 additions & 183 deletions js/setup/sketch.js
View file

This file was deleted.

0 js/README.md → src/README.md
View file
File renamed without changes.
0 js/SW.js → src/SW.js
View file
File renamed without changes.
0 js/app.js → src/app.js
View file
File renamed without changes.
44 changes: 23 additions & 21 deletions js/classes/animationClass.js → src/classes/animationClass.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -17,16 +17,16 @@ class animation {
ellipse(randomX, randomY, 15, 10);
}
}
drawFish(centerX, centerY, r, g, b) {
drawFish(centerX, centerY, rgb) {
var bodyLength = 72;
var bodyHeight = 43;

// noStroke();
fill(r, g, b);
fill(rgb);
// body
ellipse(centerX, centerY, bodyLength, bodyHeight);
// tail
fill(r, g, b);
fill(rgb);
var tailWidth = bodyLength / 4;
var tailHeight = bodyHeight / 2;
triangle(
Expand All @@ -48,52 +48,54 @@ class animation {
ellipse(submarine_X + 190, submarine_Y + 37, 35, 35);
}
drawFishGroup(x, y) {
this.drawFish(x + 100, y + 100, 100, 167, 100);
this.drawFish(x + 303, y + 100, 322, 144, 253);
this.drawFish(x + 164, y + 229, 292, 243, 112);
this.drawFish(x + 264, y + 303, 155, 118, 253);
this.drawFish(x + 331, y + 197, 155, 243, 146);
this.drawFish(x + 65, y + 294, 310, 20, 290);
this.drawFish(x + 100, y + 100, RGB.BOARD_ISLAND_BLOCK);
this.drawFish(x + 303, y + 100, RGB.BUTTON);
this.drawFish(x + 164, y + 229, RGB.BOARD_OCEAN_BLOCK);
this.drawFish(x + 264, y + 303, RGB.BOARD_ISLAND_BLOCK);
this.drawFish(x + 331, y + 197, RGB.BOARD_ISLAND_BLOCK);
this.drawFish(x + 65, y + 294, RGB.BUTTON);
}
drawSubmarine(submarine_X, submarine_Y) {
fill(150, 4, 4);
//Gray
fill(129, 133, 137);
ellipse(submarine_X + 196, submarine_Y + 36, 105, 70);
ellipse(submarine_X + 2, submarine_Y + 36, 105, 70);
fill(150, 3, 3);
fill(129, 133, 137);
rect(submarine_X + 1, submarine_Y + 1, 200, 70);

fill(100, 0, 38);
//Gunmetal Gray
fill(128, 128, 128);
rect(submarine_X + 93, submarine_Y + -42, 40, 45);
fill(100, 0, 38);
fill(128, 128, 128);
rect(submarine_X + 93, submarine_Y + 71, 40, 14);

this.submarineGlass(submarine_X, submarine_Y);
this.submarineGlass(submarine_X + -82, submarine_Y + 1);
this.submarineGlass(submarine_X + -164, submarine_Y + 1);
}

showMessage(msg, textMessageSize = 40, type = "info") {
// background(255, 255, 255, 30);
// fill(237, 34, 93);
if (type === "info") {
fill(0, 160, 0, 250);
fill(54, 157, 160, 250);
} else if (type === "warn") {
fill(224, 80, 70, 250);
fill(211, 187, 168, 250);
} else {
fill(156, 3, 3, 250);
}

strokeWeight(3);
rect(400, 200, 400, 150, 300);
fill(255, 255, 255);
if(type === "warn"){
fill(0, 0, 0)
}
else{
fill(255, 255, 255);
}
strokeWeight(1);
textFont("Helvetica");
textSize(textMessageSize);
text(msg, 440, 260, 400, 150);
}

animationPlay() {
background(0, 2, 105);
this.submarineX1 = this.submarineX1 - 1.5;
this.submarineX2 = this.submarineX2 + 1.5;
this.fishX1 = this.fishX1 + 2.5;
Expand Down
15 changes: 11 additions & 4 deletions js/classes/botClass.js → src/classes/botClass.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -35,15 +35,22 @@ botClass.prototype.drawProbabilityDensityGrid = function () {
var i = 1,
j = 1;
var indent = 150;
var indent_y = 120;

for (i = 0; i < 10; i++) {
for (j = 0; j < 10; j++) {
if (this.grid[i][j] > 2) {
fill(this.grid[i][j] * 25, 0, 0);
rect(indent + 550 + 35 * (i + 1), 80 + 35 * (j + 1), 35, 35);
if(!isLightTheme){
fill(this.grid[i][j] * 25, 0, 0);
}
else{
fill(0, 0, this.grid[i][j] * 25);
}
rect(indent + 550 + 35 * (i + 1), indent_y + 35 * (j + 1), 35, 35);
} else if (this.grid[i][j] === 2) {
fill(0, 0, 0);
rect(indent + 550 + 35 * (i + 1), 80 + 35 * (j + 1), 35, 35);
// fill(0, 0, 0);
fill(19, 41, 75);
rect(indent + 550 + 35 * (i + 1), indent_y + 35 * (j + 1), 35, 35);
}
}
}
Expand Down
4 changes: 2 additions & 2 deletions js/classes/buttonClass.js → src/classes/buttonClass.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,9 +10,9 @@ var button = function (str, x, y, w = 170, h = 40) {
// buttons method
button.prototype.draw = function () {
// fill(219, 9, 219, 200); -> light pink
fill(0, 190, 0, 200);
fill(RGB.BUTTON);
rect(this.x, this.y, this.width, this.height, 10);
fill(0, 0, 0);
fill(RGB.BUTTON_TEXT);
textSize(30);
text(this.txt, this.x + 11, this.y + 30);
};
Expand Down
0 js/classes/networkClass.js → src/classes/networkClass.js
View file
File renamed without changes.
Loading

0 comments on commit 601bd2b

Please sign in to comment.