half done porting end game
This commit is contained in:
Garrett Finucane
parent
74173cb921
commit
ece7cfb977
7 changed files with 223 additions and 100 deletions
117
index.html
117
index.html
|
|
@ -55,27 +55,24 @@
|
|||
<script type = 'text/javascript' charset = 'utf-8' src = 'cordova.js'></script>
|
||||
<script src="vendor/sweet-alert.min.js"></script>
|
||||
<link rel="stylesheet" type="text/css" href="vendor/sweet-alert.css">
|
||||
<link rel="stylesheet" href="style/rrssb.css" />
|
||||
<script type="text/javascript" src = 'vendor/rrssb.min.js'></script>
|
||||
<script type="text/javascript">
|
||||
(function addRussianSocialShare(){
|
||||
var lang = navigator.language || navigator.userLanguage;
|
||||
// debugger;
|
||||
if (lang.substr(0, 2) == 'ru') {
|
||||
$('.rrssb-facebook').remove();
|
||||
var n = $.parseHTML('<li class="rrssb-vk"> <a href="http://vk.com/share.php?url=http://kurtnoble.com/labs/rrssb/index.html" class="popup"> <span class="rrssb-icon"> <svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="70 70 378.7 378.7"><path d="M254.998 363.106h21.217s6.408-.706 9.684-4.23c3.01-3.24 2.914-9.32 2.914-9.32s-.415-28.47 12.796-32.663c13.03-4.133 29.755 27.515 47.482 39.685 13.407 9.206 23.594 7.19 23.594 7.19l47.407-.662s24.797-1.53 13.038-21.027c-.96-1.594-6.85-14.424-35.247-40.784-29.728-27.59-25.743-23.126 10.063-70.85 21.807-29.063 30.523-46.806 27.8-54.405-2.596-7.24-18.636-5.326-18.636-5.326l-53.375.33s-3.96-.54-6.892 1.216c-2.87 1.716-4.71 5.726-4.71 5.726s-8.452 22.49-19.714 41.618c-23.77 40.357-33.274 42.494-37.16 39.984-9.037-5.842-6.78-23.462-6.78-35.983 0-39.112 5.934-55.42-11.55-59.64-5.802-1.4-10.076-2.327-24.915-2.48-19.046-.192-35.162.06-44.29 4.53-6.072 2.975-10.757 9.6-7.902 9.98 3.528.47 11.516 2.158 15.75 7.92 5.472 7.444 5.28 24.154 5.28 24.154s3.145 46.04-7.34 51.758c-7.193 3.922-17.063-4.085-38.253-40.7-10.855-18.755-19.054-39.49-19.054-39.49s-1.578-3.873-4.398-5.947c-3.42-2.51-8.2-3.307-8.2-3.307l-50.722.33s-7.612.213-10.41 3.525c-2.488 2.947-.198 9.036-.198 9.036s39.707 92.902 84.672 139.72c41.234 42.93 88.048 40.112 88.048 40.112"/></svg> </span> <span class="rrssb-text">vk.com</span> </a> </li>');
|
||||
$('.rrssb-buttons').prepend(n);
|
||||
}
|
||||
|
||||
})()
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="fb-root"></div>
|
||||
<script>(function(d, s, id) {
|
||||
var js, fjs = d.getElementsByTagName(s)[0];
|
||||
if (d.getElementById(id)) return;
|
||||
js = d.createElement(s); js.id = id;
|
||||
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&version=v2.0";
|
||||
fjs.parentNode.insertBefore(js, fjs);
|
||||
}(document, 'script', 'facebook-jssdk'));
|
||||
</script>
|
||||
<canvas id="canvas"></canvas>
|
||||
<div id='devtools' style='z-index:3;display:none;position:absolute;left:50%;width:400px;height:400px;top:50%;margin-top:-200px;margin-left:-200px;'>
|
||||
<h2 id = 'clickToExit' style = 'background-color:#fff;color:#000'>Click to exit</h2>
|
||||
<textarea id ='devtoolsText' style = 'height:300px;width:400px;'></textarea>
|
||||
</div>
|
||||
<div class="faded overlay"></div>
|
||||
<div id="attributions">
|
||||
<a href = 'https://itunes.apple.com/us/app/id903769553?mt=8'><b>iOS</b></a> <a href ='https://play.google.com/store/apps/details?id=com.hextris.hextris'><b>Android</b></a><br>
|
||||
<a href="http://hextris.github.io/hextris/" target="_blank">About/Contact</a>
|
||||
</div>
|
||||
<div id='startBtn' ></div>
|
||||
<div id="helpScreen" class = 'unselectable'>
|
||||
<div class = 'instructions_body' id = 'inst_main_body'>
|
||||
|
|
@ -85,17 +82,87 @@
|
|||
<div class="faded overlay"></div>
|
||||
<img id="pauseBtn" src="./images/btn_pause.svg" />
|
||||
<img id = 'restartBtn' src="./images/btn_restart.svg" />
|
||||
<div id="bottombar">
|
||||
<div style="bottom:4px; padding-right:4px;" class="fb-like" data-href="http://hextris.github.io/hextris" data-width="20" data-layout="button_count" data-action="like" data-show-faces="false" data-share="true"></div>
|
||||
<a onClick="tweetblock=true" href="https://twitter.com/intent/tweet?hashtags=hextris&original_referer=http%3A%2F%2F0.0.0.0%3A8080%2F&text=Play%20Hextris!%20-&tw_p=tweetbutton&url=http%3A%2F%2Fhextris.github.io%2F" class="twitter-share-button" data-url="http://hextris.github.io/" data-text="Play Hextris! -" data-hashtags="hextris">Tweet</a>
|
||||
<a href="https://twitter.com/hextris" class="twitter-follow-button" data-show-count="false" data-show-screen-name="false">Follow @hextris</a>
|
||||
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
|
||||
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
|
||||
<iframe id = 'ghl' src="//ghbtns.com/github-btn.html?user=Hextris&repo=Hextris&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="90" height="20" onload='showbottombar()'></iframe>
|
||||
</div>
|
||||
<div id = 'HIGHSCORE'>HIGH SCORE</div>
|
||||
<script> (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); ga('create', 'UA-51272720-2', 'auto'); ga('send', 'pageview');
|
||||
</script>
|
||||
<a href="https://github.com/hextris/hextris"><img id="fork-ribbon" style="position: absolute; top: 0; right: 0; border: 0;z-index:100000000;" src="https://camo.githubusercontent.com/a6677b08c955af8400f44c6298f40e7d19cc5b2d/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f72696768745f677261795f3664366436642e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png"></a>
|
||||
|
||||
|
||||
<!--GAME OVER SCREEN-->
|
||||
<div id="gameoverscreen">
|
||||
<div id = 'container'>
|
||||
<div id = 'gameOverBox' class = 'GOTitle'>GAME OVER</div>
|
||||
<div id = 'cScore'>1843</div>
|
||||
<div id = 'highScoresTitle' class = 'GOTitle'>HIGH SCORES</div>
|
||||
<div class = 'score'><span class = 'scoreNum'>1.</span> 1870</div>
|
||||
<div class = 'score'><span class = 'scoreNum'>2.</span> 1540</div>
|
||||
<div class = 'score'><span class = 'scoreNum'>3.</span> 1130</div>
|
||||
<div class = 'score'><span class = 'scoreNum'>4.</span> 960</div>
|
||||
</div>
|
||||
<div id = 'bottomContainer'>
|
||||
<img id = 'restart' src = './images/btn_restart.svg' height = '57px'>
|
||||
<div id = 'socialShare'>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="224.6377px" height="57px" viewBox="0 0 255 65" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Share button</title>
|
||||
<defs>
|
||||
</defs>
|
||||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="Game-over-" sketch:type="MSArtboardGroup" transform="translate(-95.000000, -565.000000)">
|
||||
<g id="Share-button" sketch:type="MSLayerGroup" transform="translate(95.000000, 565.000000)">
|
||||
<a style="cursor:pointer;"class="popup" onclick="window.open('https://twitter.com/intent/tweet?text=Can you beat my score of points at&button_hashtag=hextris ? http://hextris.github.io/hextris @hextris','name','width=600,height=400')" ><polygon id="Score-hex-2" fill="#3498DB" sketch:type="MSShapeGroup" transform="translate(127.661316, 32.500000) rotate(-90.000000) translate(-127.661316, -32.500000) " points="127.661316 -94.814636 160.137269 -76.064636 160.137269 141.064636 127.661317 159.814636 95.185364 141.064636 95.1853635 -76.064636 "></polygon></a>
|
||||
<text style="cursor:pointer;"class="popup" onclick="window.open('https://twitter.com/intent/tweet?text=Can you beat my score of points at&button_hashtag=hextris ? http://hextris.github.io/hextris @hextris','name','width=600,height=400')" id="SHARE-MY-SCORE!" sketch:type="MSTextLayer" font-family="Exo" font-size="16" font-weight="420" fill="#FFFFFF">
|
||||
<tspan x="67" y="39">SHARE MY SCORE!</tspan>
|
||||
</text>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
</div>
|
||||
<div id = 'buttonCont'>
|
||||
<ul class="rrssb-buttons">
|
||||
<li class="rrssb-facebook">
|
||||
<!-- Replace with your URL. For best results, make sure you page has the proper FB Open Graph tags in header:
|
||||
https://developers.facebook.com/docs/opengraph/howtos/maximizing-distribution-media-content/ -->
|
||||
<a href="https://www.facebook.com/sharer/sharer.php?u=http://kurtnoble.com/labs/rrssb/index.html" class="popup">
|
||||
<span class="rrssb-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="xMidYMid" width="29" height="29" viewBox="0 0 29 29">
|
||||
<path d="M26.4 0H2.6C1.714 0 0 1.715 0 2.6v23.8c0 .884 1.715 2.6 2.6 2.6h12.393V17.988h-3.996v-3.98h3.997v-3.062c0-3.746 2.835-5.97 6.177-5.97 1.6 0 2.444.173 2.845.226v3.792H21.18c-1.817 0-2.156.9-2.156 2.168v2.847h5.045l-.66 3.978h-4.386V29H26.4c.884 0 2.6-1.716 2.6-2.6V2.6c0-.885-1.716-2.6-2.6-2.6z"
|
||||
class="cls-2" fill-rule="evenodd" />
|
||||
</svg>
|
||||
</span>
|
||||
<span class="rrssb-text">fb</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="rrssb-twitter">
|
||||
<!-- Replace href with your Meta and URL information -->
|
||||
<a href="http://twitter.com/home?status=Ridiculously%20Responsive%20Social%20Sharing%20Buttons%20by%20%40dbox%20and%20%40joshuatuscan%3A%20http%3A%2F%2Fkurtnoble.com%2Flabs%2Frrssb%20%7C%20http%3A%2F%2Fkurtnoble.com%2Flabs%2Frrssb%2Fmedia%2Frrssb-preview.png"
|
||||
class="popup">
|
||||
<span class="rrssb-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28">
|
||||
<path d="M24.253 8.756C24.69 17.08 18.297 24.182 9.97 24.62c-3.122.162-6.22-.646-8.86-2.32 2.702.18 5.375-.648 7.507-2.32-2.072-.248-3.818-1.662-4.49-3.64.802.13 1.62.077 2.4-.154-2.482-.466-4.312-2.586-4.412-5.11.688.276 1.426.408 2.168.387-2.135-1.65-2.73-4.62-1.394-6.965C5.574 7.816 9.54 9.84 13.802 10.07c-.842-2.738.694-5.64 3.434-6.48 2.018-.624 4.212.043 5.546 1.682 1.186-.213 2.318-.662 3.33-1.317-.386 1.256-1.248 2.312-2.4 2.942 1.048-.106 2.07-.394 3.02-.85-.458 1.182-1.343 2.15-2.48 2.71z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="rrssb-text">twitter</span>
|
||||
</a>
|
||||
</li>
|
||||
<li class="rrssb-github">
|
||||
<a href="https://github.com/hextris/hextris">
|
||||
<span class="rrssb-icon">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="28" height="28" viewBox="0 0 28 28">
|
||||
<path d="M13.97 1.57c-7.03 0-12.733 5.703-12.733 12.74 0 5.622 3.636 10.393 8.717 12.084.637.13.87-.277.87-.615 0-.302-.013-1.103-.02-2.165-3.54.77-4.29-1.707-4.29-1.707-.578-1.473-1.413-1.863-1.413-1.863-1.154-.79.09-.775.09-.775 1.276.104 1.96 1.316 1.96 1.312 1.135 1.936 2.99 1.393 3.712 1.06.116-.823.445-1.384.81-1.704-2.83-.32-5.802-1.414-5.802-6.293 0-1.39.496-2.527 1.312-3.418-.132-.322-.57-1.617.123-3.37 0 0 1.07-.343 3.508 1.305 1.016-.282 2.105-.424 3.188-.43 1.082 0 2.167.156 3.198.44 2.43-1.65 3.498-1.307 3.498-1.307.695 1.754.258 3.043.13 3.37.815.903 1.314 2.038 1.314 3.43 0 4.893-2.978 5.97-5.814 6.286.458.388.876 1.16.876 2.358 0 1.703-.016 3.076-.016 3.482 0 .334.232.748.877.61 5.056-1.687 8.7-6.456 8.7-12.08-.055-7.058-5.75-12.757-12.792-12.75z"
|
||||
/>
|
||||
</svg>
|
||||
</span>
|
||||
<span class="rrssb-text">github</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!--DONE WITH GAME OVER SCREEN-->
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,6 @@
|
|||
$(document).ready(function() {
|
||||
initialize();
|
||||
$('#bottombar').hide();
|
||||
});
|
||||
|
||||
function showbottombar() {
|
||||
var isOffline = 'onLine' in navigator && !navigator.onLine;
|
||||
if (isOffline) {
|
||||
setTimeout(showbottombar, 1000);
|
||||
} else {
|
||||
window.iframeHasLoaded = true;
|
||||
if (gameState != 1) {
|
||||
$('#bottombar').fadeIn(150, 'linear');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function hidebottombar() {
|
||||
$('#bottombar').fadeOut(150, 'linear');
|
||||
}
|
||||
|
||||
function initialize(a) {
|
||||
window.rush = 1;
|
||||
window.lastTime = Date.now();
|
||||
|
|
|
|||
|
|
@ -120,12 +120,22 @@ function addKeyListeners() {
|
|||
init(1);
|
||||
canRestart = false;
|
||||
});
|
||||
$("#restart").on('touchstart', function() {
|
||||
init(1);
|
||||
canRestart = false;
|
||||
});
|
||||
|
||||
}
|
||||
else {
|
||||
$("#restartBtn").on('mousedown', function() {
|
||||
init(1);
|
||||
canRestart = false;
|
||||
});
|
||||
$("#restart").on('mousedown', function() {
|
||||
init(1);
|
||||
canRestart = false;
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
function inside (point, vs) {
|
||||
|
|
|
|||
|
|
@ -63,13 +63,11 @@ function hideUIElements() {
|
|||
$('#restartBtn').hide();
|
||||
$('#startBtn').hide();
|
||||
$("#attributions").hide();
|
||||
$("#bottombar").hide();
|
||||
}
|
||||
|
||||
function init(b) {
|
||||
if(settings.ending_block && b == 1){return;}
|
||||
if (b) {
|
||||
hidebottombar();
|
||||
|
||||
|
||||
$("#pauseBtn").attr('src',"./images/btn_pause.svg");
|
||||
|
|
@ -197,7 +195,6 @@ function setStartScreen() {
|
|||
$('#restartBtn').hide();
|
||||
$('#startBtn').show();
|
||||
$('#attributions').show();
|
||||
showbottombar();
|
||||
|
||||
gameState = 0;
|
||||
requestAnimFrame(animLoop);
|
||||
|
|
@ -244,7 +241,6 @@ function animLoop() {
|
|||
if ($('#restartBtn').is(':visible')) $('#restartBtn').fadeOut(150, "linear");
|
||||
if ($('#openSideBar').is(':visible')) $('.openSideBar').fadeOut(150, "linear");
|
||||
|
||||
showbottombar();
|
||||
canRestart = 0;
|
||||
clearSaveState();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -103,7 +103,6 @@ function showText(text) {
|
|||
'paused': "<div class='centeredHeader unselectable'>Paused</div><br><div class='unselectable centeredSubHeader'>Press p to resume</div><div style='height:100px;line-height:100px;cursor:pointer;'></div>",
|
||||
'pausedAndroid': "<div class='centeredHeader unselectable'>Paused</div><br><div class='unselectable centeredSubHeader'>Press <i class='fa fa-play'></i> to resume</div><div style='height:100px;line-height:100px;cursor:pointer;'></div><div class='unselectable centeredSubHeader' style='margin-top:-50px;'><a href = 'market://details?id=com.hextris.hextrisadfree' target='_blank'>Don't like ads? Want to support the developer? Tap for the ad-free version.</a></div>",
|
||||
'start': "<div class='centeredHeader unselectable' style='line-height:80px;'>Press enter to start</div>",
|
||||
'gameover': "<div class='centeredHeader unselectable'> Game Over: " + score + " pts</div><br><div style='font-size:24px;' class='centeredHeader unselectable'> High Scores:</div><table class='tg' style='margin:0px auto'> "
|
||||
};
|
||||
|
||||
if (text == 'paused') {
|
||||
|
|
@ -114,41 +113,11 @@ function showText(text) {
|
|||
|
||||
if (text == 'gameover') {
|
||||
//Clay('client.share.any', {text: 'Think you can beat my score of '+ score + ' in Super Cool Game?'})
|
||||
var allZ = 1;
|
||||
var i;
|
||||
|
||||
for (i = 0; i < 3; i++) {
|
||||
if (highscores.length > i) {
|
||||
messages['gameover'] += "<tr> <th class='tg-031e'>" + (i + 1) + ".</th> <th class='tg-031e'>" + highscores[i] + " pts</th> </tr>";
|
||||
}
|
||||
}
|
||||
|
||||
var restartText;
|
||||
if (settings.platform == 'mobile') {
|
||||
restartText = 'Tap anywhere to restart!';
|
||||
} else {
|
||||
restartText = 'Press enter (or click anywhere!) to restart!';
|
||||
}
|
||||
|
||||
messages['gameover'] += "</table><br><div class='unselectable centeredSubHeader' id = 'tapToRestart'>" + restartText + "</div>";
|
||||
if (allZ) {
|
||||
for (i = 0; i < highscores.length; i++) {
|
||||
if (highscores[i] !== 0) {
|
||||
allZ = 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
messages['gameover'] += "<div class='fltrt' id='tweetStuff'><a class='tweet' href='https://twitter.com/intent/tweet?text=Can you beat my score of "+ score +" points at&button_hashtag=hextris ? http://hextris.github.io/hextris @hextris' data-lang='en' data-related='hextris:hextris' target='_blank'>Share Your Score on Twitter!!!</a></div>"
|
||||
$("#gameoverscreen").fadeIn();
|
||||
}
|
||||
$(".overlay").html(messages[text]);
|
||||
$(".overlay").fadeIn("1000", "swing");
|
||||
|
||||
if (text == 'gameover') {
|
||||
if (settings.platform == 'mobile') {
|
||||
$('.tg').css('margin-top', '6px');
|
||||
$("#tapToRestart").css('margin-top','-19px')
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function setMainMenu() {
|
||||
|
|
@ -214,7 +183,6 @@ function gameOverDisplay() {
|
|||
var c = document.getElementById("canvas");
|
||||
c.className = "blur";
|
||||
showText('gameover');
|
||||
showbottombar();
|
||||
}
|
||||
|
||||
function pause(o) {
|
||||
|
|
@ -237,14 +205,12 @@ function pause(o) {
|
|||
$("#pauseBtn").attr("src", "./images/btn_pause.svg");
|
||||
$('.helpText').fadeOut(200, 'linear');
|
||||
hideText();
|
||||
hidebottombar();
|
||||
setTimeout(function() {
|
||||
gameState = prevGameState;
|
||||
}, 200)
|
||||
} else if (gameState != -2 && gameState !== 0 && gameState !== 2) {
|
||||
$('#restartBtn').fadeIn(150, "linear");
|
||||
$('.helpText').fadeIn(200, 'linear');
|
||||
showbottombar();
|
||||
if (message == 'paused') {
|
||||
showText(message);
|
||||
}
|
||||
|
|
|
|||
125
style/style.css
125
style/style.css
|
|
@ -359,15 +359,19 @@ body {
|
|||
height:100%;
|
||||
width:100%;
|
||||
background-color:#ecf0f1;
|
||||
z-index:3;
|
||||
z-index:0;
|
||||
}
|
||||
|
||||
#title {
|
||||
z-index:99;
|
||||
margin-top:20px;
|
||||
color:#2c3e50;
|
||||
}
|
||||
|
||||
#gameoverscreen {
|
||||
display:none;
|
||||
|
||||
}
|
||||
|
||||
.unselectable {
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
|
|
@ -376,21 +380,114 @@ body {
|
|||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#bottombar {
|
||||
padding:0;
|
||||
position:fixed;
|
||||
width:1000px;
|
||||
text-align:center;
|
||||
left:50%;
|
||||
margin-left:-500px;
|
||||
bottom:10px;
|
||||
z-index:98;
|
||||
}
|
||||
|
||||
#afterhr {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin-bottom: -10px;
|
||||
padding-bottom: -10px;
|
||||
}
|
||||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Exo;
|
||||
font-weight: light;
|
||||
src:url("./style/fonts/Exo2-ExtraLight.otf") format("opentype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Exo;
|
||||
src:url("./style/fonts/Exo2-Regular.otf") format("opentype");
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: Exo;
|
||||
font-weight: bold;
|
||||
src:url("./style/fonts/Exo2-SemiBold.otf") format("opentype");
|
||||
}
|
||||
|
||||
#container {
|
||||
color: #232323;
|
||||
position: absolute;
|
||||
left:50%;
|
||||
top:50%;
|
||||
text-align: center;
|
||||
transform: translate(-50%, -50%);
|
||||
font-family: Exo;
|
||||
-webkit-transform: translate(-50%, -50%);
|
||||
-moz-transform: translate(-50%, -50%);
|
||||
-ms-transform: translate(-50%, -50%);
|
||||
}
|
||||
|
||||
.GOTitle {
|
||||
font-weight: bold;
|
||||
font-size: 24.2000px;
|
||||
}
|
||||
|
||||
#gameOverBox {
|
||||
|
||||
}
|
||||
|
||||
.scoreNum {
|
||||
font-weight: normal ! important;
|
||||
}
|
||||
|
||||
#cScore {
|
||||
font-size: 60.5000px;
|
||||
font-weight:light;
|
||||
margin-bottom: 5px;
|
||||
margin-top: -10px;
|
||||
}
|
||||
|
||||
#highScoresTitle {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.score {
|
||||
font-weight: light;
|
||||
line-height: 18px;
|
||||
}
|
||||
|
||||
#restart {
|
||||
bottom:0;
|
||||
position: absolute;
|
||||
left:calc(50% - 124px);
|
||||
transform: translate(-50%, 0%);
|
||||
-webkit-transform: translate(-50%, 0%);
|
||||
-moz-transform: translate(-50%, 0%);
|
||||
-ms-transform: translate(-50%, 0%);
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
#socialShare {
|
||||
bottom: 0;
|
||||
margin-bottom: 10px;
|
||||
position: absolute;
|
||||
left:calc(50% + 30px);
|
||||
transform: translate(-50%, 0%);
|
||||
-webkit-transform: translate(-50%, 0%);
|
||||
-moz-transform: translate(-50%, 0%);
|
||||
-ms-transform: translate(-50%, 0%);
|
||||
}
|
||||
|
||||
#bottomContainer {
|
||||
position: absolute;
|
||||
width:100%;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
#buttonCont {
|
||||
position: absolute;
|
||||
/*width:100%;*/
|
||||
left: 50%;
|
||||
width: 310px;
|
||||
margin-left:-8px;
|
||||
bottom:78px;
|
||||
transform: translate(-50%, 0%);
|
||||
-webkit-transform: translate(-50%, 0%);
|
||||
-moz-transform: translate(-50%, 0%);
|
||||
-ms-transform: translate(-50%, 0%);
|
||||
/*width:300px;*/
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -110,6 +110,7 @@
|
|||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<div id"gameoverscreen">
|
||||
<div id = 'container'>
|
||||
<div id = 'gameOverBox' class = 'GOTitle'>GAME OVER</div>
|
||||
<div id = 'cScore'>1843</div>
|
||||
|
|
@ -123,7 +124,7 @@
|
|||
<img id = 'restart' src = './images/btn_restart.svg' height = '57px'>
|
||||
<div id = 'socialShare'>
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg width="224.6377px" height="57px" viewBox="0 0 255 65" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<svg width="224.6377px" height="57px" viewBox="0 0 255 65" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
|
||||
<!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
|
||||
<title>Share button</title>
|
||||
<defs>
|
||||
|
|
@ -131,7 +132,7 @@
|
|||
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
|
||||
<g id="Game-over-" sketch:type="MSArtboardGroup" transform="translate(-95.000000, -565.000000)">
|
||||
<g id="Share-button" sketch:type="MSLayerGroup" transform="translate(95.000000, 565.000000)">
|
||||
<polygon id="Score-hex-2" fill="#3498DB" sketch:type="MSShapeGroup" transform="translate(127.661316, 32.500000) rotate(-90.000000) translate(-127.661316, -32.500000) " points="127.661316 -94.814636 160.137269 -76.064636 160.137269 141.064636 127.661317 159.814636 95.185364 141.064636 95.1853635 -76.064636 "></polygon>
|
||||
<a style="cursor:pointer;"class="popup" onclick="window.open('https://twitter.com/intent/tweet?text=Can you beat my score of points at&button_hashtag=hextris ? http://hextris.github.io/hextris @hextris','name','width=600,height=400')" ><polygon id="Score-hex-2" fill="#3498DB" sketch:type="MSShapeGroup" transform="translate(127.661316, 32.500000) rotate(-90.000000) translate(-127.661316, -32.500000) " points="127.661316 -94.814636 160.137269 -76.064636 160.137269 141.064636 127.661317 159.814636 95.185364 141.064636 95.1853635 -76.064636 "></polygon></a>
|
||||
<text id="SHARE-MY-SCORE!" sketch:type="MSTextLayer" font-family="Exo" font-size="16" font-weight="420" fill="#FFFFFF">
|
||||
<tspan x="67" y="39">SHARE MY SCORE!</tspan>
|
||||
</text>
|
||||
|
|
@ -219,5 +220,9 @@
|
|||
})()
|
||||
</script>
|
||||
<script type="text/javascript" src = 'vendor/rrssb.min.js'></script>
|
||||
<script type="text/javascript" >
|
||||
|
||||
</script>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue