Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
branch: master
Fetching contributors…

Cannot retrieve contributors at this time

179 lines (150 sloc) 5.925 kb
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Quirky</title>
<script src="jquery.min.js" type="text/javascript"></script>
<script src="jquery-ui.min.js" type="text/javascript" ></script>
<script src="jquery.cookie.js" type="text/javascript"></script>
<script src="game-client.js" type="text/javascript"></script>
<link href="layout.css" rel="stylesheet" type="text/css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans|Chango' rel='stylesheet' type='text/css'>
</head>
<!--
Copyright (C) 2012 Juan Lasheras (http://www.juanl.org).
This file is part of Quirky.
Quirky is free software: you can redistribute it and/or modify
it under the terms of the GNU General Public License as published by
the Free Software Foundation, either version 3 of the License, or
(at your option) any later version.
Quirky is distributed in the hope that it will be useful,
but WITHOUT ANY WARRANTY; without even the implied warranty of
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
GNU General Public License for more details.
You should have received a copy of the GNU General Public License
along with Quirky. If not, see <http://www.gnu.org/licenses/>.
-->
<!--
@author juan.lasheras@gmail.com (Juan Lasheras)
-->
<body>
<!-- Lobby -->
<div id="lobby">
<div class="logo">Quirky</div>
<button id="howtobttn" onclick="drawHowTo();">How to play</button>
<div id="lobby_chat"></div>
<div id="lobby_game_panel" class="panel">
<div id="no_games" style="display: none;">
<p>No games yet :(</p>
<p>Make one!</p>
</div>
<div id="add_game">
<input type="text" class="text" required maxlength="12"
title="Game Room name (max 12 characters.)" />
<button>New Game</button>
</div>
<hr/>
<div id="games"><table id="games_tbl"></table></div>
</div>
</div>
<!-- Add Guest -->
<div id="add_guest" style="display: none;">
<div class="logo">Quirky</div>
<div id="add_guest_form">
<p>is an open source clone of the
<a href="http://www.google.com/search?q=qwirkle+board+game">Qwirkle</a> board game.</p>
<p>What would you like to be called?</p>
<input type="text" class="text" required maxlength="12"
title="User name (max 12 characters.)"/>
<button>Ok</button>
</div>
</div>
<!-- Chat -->
<div id="chat_panel" style="display: none;">
<div id="chat_input" style="display: none;">
<input type="text" class="text" required maxlength="500"
title="Chat text (max 500 characters.)" />
<button>Chat</button>
</div>
<div id="chat_log" class="text"></div>
</div>
<!-- Game Room -->
<div id="game_room" style="display: none;">
<div id="sideboard" class="panel">
<button id="leave_game">&#8678; Leave Room</button>
<p id="turn"></p>
<button id="end_turn">End my turn</button>
<p>My Pieces (out of <span id="game_pieces"></span>)</p>
<div id="pieces"></div>
<div id="errors"></div>
<hr />
<p>Score</p>
<dl id="players"></dl>
</div>
<div id="game_room_main">
<div id="board"></div>
</div>
</div>
<!-- Loading Game -->
<div id="loading_game" style="display: none;">
<p>Loading.</p>
</div>
<!-- How to play -->
<div id="howto" style="display:none;">
<a href="">&#8678; Back to Lobby</a>
<h1>How to play Quirky</h1>
<p>Quirky is played with 2 to 6 players. The goal of Quirky is to form
lines (rows & columns) of blocks such that:</p>
<ul>
<li>The line shares either a common shape <em>or</em> color.</li>
<li>No block is duplicated within the line.</li>
</ul>
<h2>Scoring</h2>
<ul>
<li>1 point for each block placed.</li>
<li>When adding to an existing line 1 point is scored for each existing
block in that line.</li>
<li>6 bonus points is scored when a line is "completed". This means that
the line has 6 blocks of all the same color or shape.</li>
<li>Once all blocks have been played the player with the highest score
wins.</li>
</ul>
<h2>Turn Steps</h2>
<ul>
<li>Either: play then draw:
<ul>
<li>Add blocks to the board. Blocks can only be added to a single line
per turn, at either side.</li>
<li>Draw more blocks until you have 6.</li>
</ul>
</li>
<li><em>or</em>, trade:
<ul>
<li>Trade in any number of blocks. If you are unable to play any
blocks this turn, this is your only option.</li>
</ul>
</li>
</ul>
<a href="">&#8678; Back to Lobby</a>
</div>
<footer>
Created by <a href="http://www.twitter.com/jlas_">@jlas_</a>.
Fork it on <a href="http://www.github.com/jlas/quirky">GitHub</a>.
</footer>
<!-- subtle patterns attribution -->
<div about="http://subtlepatterns.com/about/"
style="display:none;">
<span property="dct:title">Subtle Patterns</span>
(<a rel="cc:attributionURL" property="cc:attributionName"
href="http://subtlepatterns.com">Subtle Patterns</a>) /
<a rel="license" href="http://creativecommons.org/licenses/by-sa/3.0/">
CC BY-SA 3.0</a>
</div>
</body>
<!-- Fork me banner -->
<a id="forkme" href="https://github.com/jlas/quirky">
<img style="position: absolute; top: 0; right: 0; border: 0;"
src="https://s3.amazonaws.com/github/ribbons/forkme_right_gray_6d6d6d.png"
alt="Fork me on GitHub">
</a>
</html>
Jump to Line
Something went wrong with that request. Please try again.