wbrawner/hextris
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

changed shadow to gradient

Browse source
This commit is contained in:
Michael Yang 2014-05-21 17:18:18 -04:00
parent 137d2567ec
commit 797701c4e4
4 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

BIN
asdf.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 42 KiB

2
index.html
View file

@ -23,7 +23,7 @@
<span id="score" style="color: #ecf0f1; font-size: 4vmin;">0 (x1)</span>
</div>
<canvas id="canvas" width="800" height="800" style="position: absolute; left: calc(50% - 80vmin / 2); height: 80vmin; width: 80vmin; background-color: rgba(0,0,0,0);"></canvas>
<canvas id="canvas" width="800" height="800" style="position: absolute; left: calc(50% - 80vmin / 2); height: 80vmin; width: 80vmin; background: -webkit-radial-gradient(#2980b9 35%,rgba(44,62,80,50) 68%);"></canvas>
<div id="leftTap" style="position: absolute; left: 0; top: 0; height: 100%; width: 50%;"></div>
<div id="rightTap" style="position: absolute; right: 0; top: 0; height :100%; width: 50%;"></div>

3
js/main.js
View file

@ -3,6 +3,7 @@ var ctx = canvas.getContext('2d');
ctx.translate(0.5, 0.5);
canvas.originalHeight = canvas.height;
canvas.originalWidth = canvas.width;
if (window.devicePixelRatio) {
canvas.width *= window.devicePixelRatio;
canvas.height *= window.devicePixelRatio;
@ -96,7 +97,7 @@ function update() {
function render() {
document.getElementById("score").innerHTML = score + " (x" + scoreScalar * scoreAdditionCoeff + ")";
ctx.clearRect(0, 0, canvas.originalWidth, canvas.originalHeight);
clearGameBoard();

6
js/view.js
View file

@ -26,10 +26,10 @@ function clearShadows() {
}
function clearGameBoard() {
ctx.shadowColor = '#2980b9';
ctx.shadowBlur = 25;
// ctx.shadowColor = '#2980b9';
// ctx.shadowBlur = 25;
drawPolygon(canvas.originalWidth / 2, canvas.originalHeight / 2, 6, canvas.originalWidth / 2 - 25, 30, hexagonBackgroundColor);
clearShadows();
// clearShadows();
}
function drawPolygon(x, y, sides, radius, theta, color, fill) { // can make more elegant, reduce redundancy, fix readability