hextris/js/view.js

220 lines
7.2 KiB
JavaScript
Raw Normal View History

2014-08-23 02:10:55 +00:00
// t: current time, b: begInnIng value, c: change In value, d: duration
function easeOutCubic(t, b, c, d) {
2015-05-24 14:54:12 +00:00
return c * ((t = t / d - 1) * t * t + 1) + b;
2014-08-23 02:10:55 +00:00
}
function renderText(x, y, fontSize, color, text, font) {
2015-05-24 14:54:12 +00:00
ctx.save();
if (!font) {
2015-09-21 06:27:05 +00:00
var font = '20px Exo';
2015-05-24 14:54:12 +00:00
}
fontSize *= settings.scale;
ctx.font = fontSize + font;
ctx.textAlign = 'center';
ctx.fillStyle = color;
ctx.fillText(text, x, y + (fontSize / 2) - 9 * settings.scale);
ctx.restore();
2014-08-23 02:10:55 +00:00
}
function drawScoreboard() {
2015-05-24 14:54:12 +00:00
if (scoreOpacity < 1) {
scoreOpacity += 0.01;
textOpacity += 0.01;
}
ctx.globalAlpha = textOpacity;
var scoreSize = 50;
var scoreString = String(score);
if (scoreString.length == 6) {
scoreSize = 43;
} else if (scoreString.length == 7) {
scoreSize = 35;
} else if (scoreString.length == 8) {
scoreSize = 31;
} else if (scoreString.length == 9) {
scoreSize = 27;
}
if (rush ==1){
var color = "rgb(236, 240, 241)";
}
var fontSize = settings.platform == 'mobile' ? 35 : 30;
2015-06-09 21:08:29 +00:00
var h = trueCanvas.height / 2 + gdy + 100 * settings.scale;
2015-05-24 14:54:12 +00:00
if (gameState === 0) {
renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2 + gdy, 60, "rgb(236, 240, 241)", String.fromCharCode("0xf04b"), 'px FontAwesome');
2018-02-15 21:05:28 +00:00
renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2.15 + gdy - 155 * settings.scale, 150, "#2c3e50", "Hextris");
renderText(trueCanvas.width / 2 + gdx + 5 * settings.scale, h + 10, fontSize, "rgb(44,62,80)", 'Play!');
2015-05-24 14:54:12 +00:00
} else if (gameState != 0 && textOpacity > 0) {
textOpacity -= 0.05;
renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2 + gdy, 60, "rgb(236, 240, 241)", String.fromCharCode("0xf04b"), 'px FontAwesome');
2015-06-10 18:51:23 +00:00
renderText(trueCanvas.width / 2 + gdx + 6 * settings.scale, trueCanvas.height / 2 + gdy - 155 * settings.scale, 150, "#2c3e50", "Hextris");
2015-06-09 21:08:29 +00:00
renderText(trueCanvas.width / 2 + gdx + 5 * settings.scale, h, fontSize, "rgb(44,62,80)", 'Play!');
2015-05-24 14:54:12 +00:00
ctx.globalAlpha = scoreOpacity;
renderText(trueCanvas.width / 2 + gdx, trueCanvas.height / 2 + gdy, scoreSize, color, score);
} else {
ctx.globalAlpha = scoreOpacity;
renderText(trueCanvas.width / 2 + gdx, trueCanvas.height / 2 + gdy, scoreSize, color, score);
}
ctx.globalAlpha = 1;
2014-08-23 02:10:55 +00:00
}
function clearGameBoard() {
2015-05-24 14:54:12 +00:00
drawPolygon(trueCanvas.width / 2, trueCanvas.height / 2, 6, trueCanvas.width / 2, 30, hexagonBackgroundColor, 0, 'rgba(0,0,0,0)');
2014-08-23 02:10:55 +00:00
}
function drawPolygon(x, y, sides, radius, theta, fillColor, lineWidth, lineColor) {
2015-05-24 14:54:12 +00:00
ctx.fillStyle = fillColor;
ctx.lineWidth = lineWidth;
ctx.strokeStyle = lineColor;
ctx.beginPath();
var coords = rotatePoint(0, radius, theta);
ctx.moveTo(coords.x + x, coords.y + y);
var oldX = coords.x;
var oldY = coords.y;
for (var i = 0; i < sides; i++) {
coords = rotatePoint(oldX, oldY, 360 / sides);
ctx.lineTo(coords.x + x, coords.y + y);
oldX = coords.x;
oldY = coords.y;
}
ctx.closePath();
ctx.fill();
ctx.stroke();
ctx.strokeStyle = 'rgba(0,0,0,0)';
2014-08-23 02:10:55 +00:00
}
function toggleClass(element, active) {
2015-05-24 14:54:12 +00:00
if ($(element).hasClass(active)) {
$(element).removeClass(active);
} else {
$(element).addClass(active);
}
2014-08-23 02:10:55 +00:00
}
function showText(text) {
2015-05-24 14:54:12 +00:00
var messages = {
2015-06-10 18:51:23 +00:00
'paused': "<div class='centeredHeader unselectable'>Game Paused</div>",
'pausedAndroid': "<div class='centeredHeader unselectable'>Game Paused</div><div class='unselectable centeredSubHeader' style='position:absolute;margin-left:-150px;left:50%;margin-top:20px;width:300px;font-size:16px;'><a href = 'https://play.google.com/store/apps/details?id=com.hextris.hextrisadfree' target='_blank'Want to support the developers? Don't like ads? Tap for Hextris ad-free!</a></div>",
'pausediOS': "<div class='centeredHeader unselectable'>Game Paused</div><div class='unselectable centeredSubHeader' style='position:absolute;margin-left:-150px;left:50%;margin-top:20px;width:300px;font-size:16px;'><a href = 'https://itunes.apple.com/us/app/hextris-ad-free/id912895524?mt=8' target='_blank'>Want to support the developers? Don't like ads? Tap for Hextris ad-free!</a></div>",
'pausedOther': "<div class='centeredHeader unselectable'>Game Paused</div><div class='unselectable centeredSubHeader' style='margin-top:10px;position:absolute;left:50%;margin-left:-190px;max-width:380px;font-size:18px;'><a href = 'http://hextris.github.io/' target='_blank'>Want to support the developers? Click here to buy one of the ad-free mobile versions!</a></div>",
'start': "<div class='centeredHeader unselectable' style='line-height:80px;'>Press enter to start</div>"
2015-05-24 14:54:12 +00:00
};
if (text == 'paused') {
if (settings.os == 'android') {
text = 'pausedAndroid'
} else if (settings.os == 'ios') {
text = 'pausediOS'
} else if (settings.platform == 'nonmobile') {
text = 'pausedOther'
}
2015-05-24 14:54:12 +00:00
}
if (text == 'gameover') {
//Clay('client.share.any', {text: 'Think you can beat my score of '+ score + ' in Super Cool Game?'})
2015-05-30 00:23:17 +00:00
$("#gameoverscreen").fadeIn();
}
2015-05-24 14:54:12 +00:00
$(".overlay").html(messages[text]);
$(".overlay").fadeIn("1000", "swing");
2014-08-23 02:10:55 +00:00
}
function setMainMenu() {
2015-05-24 14:54:12 +00:00
gameState = 4;
canRestart = false;
setTimeout(function() {
canRestart = 's';
}, 500);
$('#restartBtn').hide();
if ($("#pauseBtn").replace(/^.*[\\\/]/, '') == "btn_pause.svg") {
$("#pauseBtn").attr("src","./images/btn_resume.svg");
} else {
$("#pauseBtn").attr("src","./images/btn_pause.svg");
}
2014-08-23 02:10:55 +00:00
}
function hideText() {
2015-08-27 04:11:04 +00:00
$(".overlay").fadeOut(150, function() {
2015-05-24 14:54:12 +00:00
$(".overlay").html("");
})
2014-08-23 02:10:55 +00:00
}
function gameOverDisplay() {
2015-08-27 01:57:52 +00:00
settings.ending_block=false;
2015-06-03 19:45:16 +00:00
Cookies.set("visited",true);
2015-05-24 14:54:12 +00:00
var c = document.getElementById("canvas");
c.className = "blur";
2015-06-01 23:15:32 +00:00
updateHighScores();
2015-08-27 01:28:53 +00:00
if (highscores.length === 0 ){
$("#currentHighScore").text(0);
}
else {
$("#currentHighScore").text(highscores[0])
}
$("#gameoverscreen").fadeIn();
2015-05-30 16:36:18 +00:00
$("#buttonCont").fadeIn();
$("#container").fadeIn();
$("#socialShare").fadeIn();
$("#restart").fadeIn();
2015-09-21 06:27:05 +00:00
set_score_pos();
2014-08-23 02:10:55 +00:00
}
2015-06-01 23:15:32 +00:00
function updateHighScores (){
$("#cScore").text(score);
2015-06-03 19:45:16 +00:00
$("#1place").text(highscores[0]);
$("#2place").text(highscores[1]);
$("#3place").text(highscores[2]);
2015-06-01 23:15:32 +00:00
}
2015-09-21 06:27:05 +00:00
2015-08-27 02:34:21 +00:00
var pausable = true;
2014-08-23 02:10:55 +00:00
function pause(o) {
if (gameState == 0 || gameState == 2 || !pausable) {
return;
}
2015-08-27 02:34:21 +00:00
pausable = false;
2015-05-24 14:54:12 +00:00
writeHighScores();
var message;
if (o) {
message = '';
} else {
message = 'paused';
}
var c = document.getElementById("canvas");
if (gameState == -1) {
2015-08-27 04:18:31 +00:00
$('#fork-ribbon').fadeOut(300, 'linear');
$('#restartBtn').fadeOut(300, "linear");
$('#buttonCont').fadeOut(300, "linear");
2015-05-24 14:54:12 +00:00
if ($('#helpScreen').is(':visible')) {
2015-08-27 04:18:31 +00:00
$('#helpScreen').fadeOut(300, "linear");
2015-05-24 14:54:12 +00:00
}
$("#pauseBtn").attr("src", "./images/btn_pause.svg");
2015-08-27 04:18:31 +00:00
$('.helpText').fadeOut(300, 'linear');
$('#overlay').fadeOut(300, 'linear');
2015-05-24 14:54:12 +00:00
hideText();
setTimeout(function() {
gameState = prevGameState;
2015-08-27 02:34:21 +00:00
pausable =true;
2015-08-27 04:11:04 +00:00
}, 400);
2015-05-24 14:54:12 +00:00
} else if (gameState != -2 && gameState !== 0 && gameState !== 2) {
2015-08-27 04:18:31 +00:00
$('#restartBtn').fadeIn(300, "linear");
$('#buttonCont').fadeIn(300, "linear");
$('.helpText').fadeIn(300, 'linear');
2015-05-24 14:54:12 +00:00
if (message == 'paused') {
showText(message);
}
2015-08-27 04:18:31 +00:00
$('#fork-ribbon').fadeIn(300, 'linear');
2015-05-24 14:54:12 +00:00
$("#pauseBtn").attr("src","./images/btn_resume.svg");
$('#overlay').fadeIn(300, 'linear');
2015-05-24 14:54:12 +00:00
prevGameState = gameState;
2015-08-27 02:34:21 +00:00
setTimeout(function() {
pausable = true;
2015-08-27 04:11:04 +00:00
}, 400);
2015-05-24 14:54:12 +00:00
gameState = -1;
}
2014-08-23 02:10:55 +00:00
}