Skip to content

Commit 56e95ba

Browse files
patorjkpatorjk
authored
Merge pull request patorjk#84 from Rb64/headcolor
Issue patorjk#81 Headcolor
2 parents c03c341 + 4dfc91b commit 56e95ba

5 files changed

+154
-0
lines changed

‎css/head-snake.css

+142
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,142 @@
1+
body {
2+
margin:0px;
3+
padding:0px;
4+
background-color: rgb(0, 0, 0);
5+
}
6+
7+
#game-area {
8+
margin:10px;
9+
padding:0px;
10+
}
11+
12+
#mode-wrapper {
13+
color: #ffffff;
14+
font-family: Verdana, arial, helvetica, sans-serif;
15+
font-size: 14px;
16+
17+
}
18+
19+
#game-area:focus { outline: none; }
20+
21+
a.snake-link, a.snake-link:link, a.snake-link:visited {
22+
color: #FCFC54;
23+
}
24+
25+
a.snake-link:hover {
26+
color: #FfFf54;
27+
}
28+
29+
.snake-pause-screen {
30+
font-family: Verdana, arial, helvetica, sans-serif;
31+
font-size: 14px;
32+
position:absolute;
33+
width:300px;
34+
height:80px;
35+
text-align:center;
36+
top:50%;
37+
left:50%;
38+
margin-top:-40px;
39+
margin-left:-150px;
40+
display:none;
41+
background-color:black;
42+
color:white;
43+
}
44+
45+
.snake-panel-component {
46+
position: absolute;
47+
font-family: Verdana, arial, helvetica, sans-serif;
48+
font-size: 14px;
49+
color: #ffffff;
50+
text-align: center;
51+
padding: 8px;
52+
margin: 0px;
53+
}
54+
55+
#snake-snakehead-alive {
56+
background-image: url('./images/green-head-snakeblock.png');
57+
margin: 0px;
58+
padding: 0px;
59+
background-color: rgb(10, 173, 10);
60+
position: absolute;
61+
border: 0px solid #000080;
62+
background-repeat: no-repeat;
63+
border-radius: 4px;
64+
}
65+
66+
.snake-snakebody-block {
67+
margin: 0px;
68+
padding: 0px;
69+
background-color: #FF0000;
70+
position: absolute;
71+
border: 0px solid #000080;
72+
background-repeat: no-repeat;
73+
}
74+
75+
.snake-snakebody-alive {
76+
background-image: url('./images/green-body-snakeblock.png'), url('./images/green-body-snakeblock.png');
77+
}
78+
.snake-snakebody-dead {
79+
background-image: url('./images/deadblock.png'), url('./images/deadblock.png');
80+
}
81+
82+
.snake-food-block {
83+
margin: 0px;
84+
padding: 0px;
85+
background-color: rgb(182, 11, 11);
86+
border: 0px solid #000080;
87+
position: absolute;
88+
border-radius: 6px;
89+
}
90+
91+
.snake-playing-field {
92+
margin: 0px;
93+
padding: 0px;
94+
position: absolute;
95+
background-color: rgb(245, 245, 220);
96+
border: 0px solid #0000A8;
97+
}
98+
99+
.snake-game-container {
100+
margin: 0px;
101+
padding: 0px;
102+
border-width: 0px;
103+
border-style: none;
104+
zoom: 1;
105+
position: relative;
106+
}
107+
108+
.snake-welcome-dialog {
109+
padding: 8px;
110+
margin: 0px;
111+
background-color: #000000;
112+
color: #ffffff;
113+
font-family: Verdana, arial, helvetica, sans-serif;
114+
font-size: 14px;
115+
position: absolute;
116+
top: 50%;
117+
left: 50%;
118+
width: 300px;
119+
/*height: 150px;*/
120+
margin-top: -100px;
121+
margin-left: -158px;
122+
text-align: center;
123+
display: block;
124+
}
125+
126+
.snake-try-again-dialog, .snake-win-dialog {
127+
padding: 8px;
128+
margin: 0px;
129+
background-color: #000000;
130+
color: #ffffff;
131+
font-family: Verdana, arial, helvetica, sans-serif;
132+
font-size: 14px;
133+
position: absolute;
134+
top: 50%;
135+
left: 50%;
136+
width: 300px;
137+
height: 100px;
138+
margin-top: -75px;
139+
margin-left: -158px;
140+
text-align: center;
141+
display: none;
142+
}

‎css/images/green-body-snakeblock.png

5.08 KB
Loading

‎css/images/green-head-snakeblock.png

5.38 KB
Loading

‎index.html

+4
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,9 @@
5757
case 5:
5858
changeTheme('css/Senura-snake.css?' + Math.random());
5959
break;
60+
case 6:
61+
changeTheme('css/head-snake.css?' + Math.random());
62+
break;
6063
default:
6164
changeTheme('css/main-snake.css?' + Math.random());
6265
break;
@@ -90,6 +93,7 @@
9093
<option>Green Theme by CoffeeCatDE</option>
9194
<option>Matrix Theme by Geahad Haymor</option>
9295
<option>Theme by Senura Ratnayake</option>
96+
<option>Snake Head Theme by Rb64</option>
9397
</select>
9498
</div>
9599
<div style="display:inline-block;margin-right:10px;">

‎js/snake.js

+8
Original file line numberDiff line numberDiff line change
@@ -177,6 +177,7 @@ SNAKE.Snake = SNAKE.Snake || (function() {
177177
me.snakeHead = me.snakeBody["b0"];
178178
me.snakeTail = me.snakeBody["b0"];
179179
me.snakeHead.elm.className = me.snakeHead.elm.className.replace(/\bsnake-snakebody-dead\b/,'');
180+
me.snakeHead.elm.id = "snake-snakehead-alive";
180181
me.snakeHead.elm.className += " snake-snakebody-alive";
181182

182183
// ----- private methods -----
@@ -332,6 +333,12 @@ SNAKE.Snake = SNAKE.Snake || (function() {
332333

333334
newHead.elmStyle.left = newHead.xPos + "px";
334335
newHead.elmStyle.top = newHead.yPos + "px";
336+
if(me.snakeLength>1){
337+
newHead.elm.id="snake-snakehead-alive";
338+
oldHead.elm.id = "";
339+
}
340+
341+
335342

336343
// check the new spot the snake moved into
337344

@@ -458,6 +465,7 @@ SNAKE.Snake = SNAKE.Snake || (function() {
458465
blockPool.concat(blocks);
459466
me.snakeHead.elm.className = me.snakeHead.elm.className.replace(/\bsnake-snakebody-dead\b/,'')
460467
me.snakeHead.elm.className += " snake-snakebody-alive";
468+
me.snakeHead.elm.id = "snake-snakehead-alive";
461469
me.snakeHead.row = config.startRow || 1;
462470
me.snakeHead.col = config.startCol || 1;
463471
me.snakeHead.xPos = me.snakeHead.row * playingBoard.getBlockWidth();

0 commit comments

Comments
 (0)