Permalink
Browse files

Added right click support.

Added Facebook share button (through old share api for now)
Minimized image.
Removed button hint labels again due to not being happy with it design-wise (aargh I feel like a coder who just went to the dark side)
  • Loading branch information...
1 parent 6e0d94e commit 683544f42e8ad807f69a76a3d6b7f876c45451e6 @mrtnkl mrtnkl committed Nov 17, 2014
Showing with 78 additions and 57 deletions.
  1. +1 −0 css/style.css
  2. BIN img/facebook.png
  3. BIN img/question.png
  4. +9 −8 index.html
  5. +68 −49 js/game.js
View
@@ -184,6 +184,7 @@ p {
#help.icon { background-image: url(../img/eye.png); }
#next.icon { background-image: url(../img/arrow-right.png); }
#tweet.icon { background-image: url(../img/twitter.png); }
+#facebookicon.icon { background-image: url(../img/facebook.png); }
#rules.icon { background-image: url(../img/question.png); }
#bar {
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
View
@@ -23,7 +23,7 @@
<link rel="icon" type="image/png" href="img/icon-1024.png" />
<link rel="shortcut icon" href="img/icon-1024.png" />
<link rel="apple-touch-icon-precomposed" href="img/icon-1024.png"/>
-
+
<meta name="msapplication-tap-highlight" content="no" />
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes"/>
@@ -156,14 +156,15 @@ <h2 id="boardsize"></h2>
</div>
<div id="score">
- <img id="trophy" src="img/trophy.png"><span id="scorenr">30744</span>
+ <img id="trophy" src="img/trophy.png"><span id="scorenr">42</span>
</div>
<div id="bar">
- <div class="iconcon" title="Undo last move" data-action="undo"><div id="undo" class="icon"></div></div>
- <div class="iconcon" title="Go back to menu" data-action="back"><div id="back" class="icon"></div></div>
- <a class="iconcon" title="Tweet this" id="tweeturl" target="_blank" href="about:blank" data-action="tweet"><span id="tweet" class="icon"></span></a>
- <div class="iconcon" title="Show hint" data-action="help"><div id="help" class="icon"></div></div>
- <div class="iconcon" title="Rules" data-action="rules"><div id="rules" class="icon"></div></div>
+ <div class="iconcon" data-action="back"><div id="back" class="icon"></div></div>
+ <div class="iconcon" data-action="undo"><div id="undo" class="icon"></div></div>
+ <a class="iconcon" id="tweeturl" target="_blank" href="about:blank" data-action="tweet"><span id="tweet" class="icon"></span></a>
+ <a class="iconcon" id="facebook" target="_blank" href="http://www.facebook.com/sharer/sharer.php" data-action="facebook"><span id="facebookicon" class="icon"></span></a>
+ <div class="iconcon" data-action="help"><div id="help" class="icon"></div></div>
+ <div class="iconcon" data-action="rules"><div id="rules" class="icon"></div></div>
</div>
</div>
</div>
@@ -194,4 +195,4 @@ <h2 id="boardsize"></h2>
<script type="text/javascript" src="js/levels.js"></script>
<script type="text/javascript" src="js/backgroundservice.js"></script>
</body>
-</html>
+</html>
View
@@ -29,7 +29,7 @@ var Game = new (function() {
function init() {
$('#scorenr').html(getScore());
- $('#tweeturl').hide();
+ $('#tweeturl, #facebook').hide();
if (!window.isWebApp)
$('#app').hide();
@@ -232,7 +232,7 @@ var Game = new (function() {
$('#menugrid').addClass('hidden');
$('#board').removeClass('hidden');
$('#bar [data-action]').show();
- $('#tweeturl').hide();
+ $('#tweeturl, #facebook').hide();
$('#chooseSize').removeClass('show');
$('#score').removeClass('show').hide();
$('#bar [data-action="help"]').removeClass('hidden wiggle');
@@ -273,7 +273,7 @@ var Game = new (function() {
var ojoo = getOjoo() + '!';
$('#boardsize').html('<span>' + ojoo + '</span>');
grid.each(function() { this.system = true; });
- $('#bar [data-action]').not('[data-action="back"]').hide();
+ $('#bar [data-action]').hide();
endGameTOH3 = setTimeout(function(){
$('#grid .tile').addClass('completed');
@@ -291,11 +291,12 @@ var Game = new (function() {
animateScore(oldScore, newScore);
if (tweet && !currentPuzzle.isTutorial) {
updateTweetUrl(currentPuzzle.size);
- $('#tweeturl').show();
+ $('#tweeturl, #facebook').show();
}
}
}
+ $('#bar [data-action="back"]').show();
setTimeout(function() { $('#score').addClass('show');}, 0);
}, 50);
@@ -321,9 +322,9 @@ var Game = new (function() {
function addEventListeners() {
document.addEventListener("backbutton", backButtonPressed, false);
- if (window.WinJS)
+ if (window.WinJS)
WinJS.Application.onbackclick = backButtonPressed;
-
+
$(document).on('keydown', function(evt){
if (evt.keyCode == 27 /* escape */) { backButtonPressed(); return false; }
if (evt.keyCode == 32 /* space */) { doAction('help'); return false; }
@@ -333,60 +334,78 @@ var Game = new (function() {
}
});
$(document).on('touchend mouseup', click);
- $(document).on('touchstart mousedown', '#grid td', function(e) {
- if (Utils.isDoubleTapBug(e)) return false;
- var $el = $(e.target).closest('td'),
- x = $el.attr('data-x') * 1,
- y = $el.attr('data-y') * 1,
- tile = grid.tile(x, y);
-
- clearTimeout(checkTOH);
-
- if (tile.system) {
- var $tile = $el.find('.tile');
- $tile.addClass('error');
- setTimeout(function() {
- $tile.removeClass('error');
- }, 500);
- return false;
- }
-
- if (Tutorial.active) {
- Tutorial.tapTile(tile);
- return false;
- }
-
- if (grid && grid.hint)
- grid.hint.clear();
-
- // create new undo
- var undoState = [tile, tile.value, new Date()];
- if (undoStack.length) {
- // check if the last state was done a few ms ago, then consider it as one change
- var lastState = undoStack[undoStack.length - 1],
- lastTile = lastState[0],
- lastChange = lastState[2];
- if (lastTile.id != tile.id || (new Date() - lastChange > 500))
- undoStack.push(undoState);
- }
- else
+ $(document).on('mousedown', '#grid td', tapTile);
+ $(document).on('contextmenu', function(e) {
+ e.preventDefault();
+ e.stopPropagation();
+ e.stopImmediatePropagation();
+ return false;
+ })
+ }
+
+ function tapTile (e) {
+ if (window.Utils && Utils.isDoubleTapBug(e)) return false;
+ var $el = $(e.target).closest('td'),
+ x = $el.attr('data-x') * 1,
+ y = $el.attr('data-y') * 1,
+ tile = grid.tile(x, y),
+ rightClick = (e.which === 3);
+
+ clearTimeout(checkTOH);
+
+ if (tile.system) {
+ var $tile = $el.find('.tile');
+ $tile.addClass('error');
+ setTimeout(function() {
+ $tile.removeClass('error');
+ }, 500);
+ return false;
+ }
+
+ if (Tutorial.active) {
+ Tutorial.tapTile(tile);
+ return false;
+ }
+
+ if (grid && grid.hint)
+ grid.hint.clear();
+
+ // create new undo
+ var undoState = [tile, tile.value, new Date()];
+ if (undoStack.length) {
+ // check if the last state was done a few ms ago, then consider it as one change
+ var lastState = undoStack[undoStack.length - 1],
+ lastTile = lastState[0],
+ lastChange = lastState[2];
+ if (lastTile.id != tile.id || (new Date() - lastChange > 500))
undoStack.push(undoState);
+ }
+ else
+ undoStack.push(undoState);
+ if (rightClick) {
+ if (tile.isEmpty)
+ tile.value = 2;
+ else if (tile.value == 2)
+ tile.value = 1;
+ else
+ tile.clear();
+ } else {
if (tile.isEmpty)
tile.value = 1;
else if (tile.value == 1)
tile.value = 2;
else
tile.clear();
+ }
- //if (tile.value > 0)
- checkTOH = setTimeout(function(){checkForLevelComplete();}, 700);
- return false;
- });
+ //if (tile.value > 0)
+ checkTOH = setTimeout(function(){checkForLevelComplete();}, 700);
+ return false;
}
function click(evt) {
- if (Utils.isDoubleTapBug(evt)) return false;
+ if (window.Utils && Utils.isDoubleTapBug(evt)) return false;
var $el = $(evt.target).closest('*[data-action]'),
action = $(evt.target).closest('*[data-action]').attr('data-action'),
value = $el.attr('data-value');
@@ -652,4 +671,4 @@ var Game = new (function() {
window.__defineGetter__('tile', function() { return grid.tile; });
this.__defineGetter__('grid', function() { return grid; });
this.__defineGetter__('debug', function() { return debug; });
-})();
+})();

0 comments on commit 683544f

Please sign in to comment.