summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorArun Persaud <arun@nubati.net>2012-10-06 00:19:12 -0700
committerArun Persaud <arun@nubati.net>2012-10-06 00:19:12 -0700
commit293b20963f2bbf0cfca1a146506d65d615b01c2c (patch)
tree6bc70a842bd4ba68a28645de1b2b85f3d8c68dad
parent494ee831e66d59afbf02d42ba59b7ba21f61c011 (diff)
downloade-DoKo-293b20963f2bbf0cfca1a146506d65d615b01c2c.tar.gz
e-DoKo-293b20963f2bbf0cfca1a146506d65d615b01c2c.tar.bz2
e-DoKo-293b20963f2bbf0cfca1a146506d65d615b01c2c.zip
starting to bootstrap the layout: navbar and tricks
- changing the tricks-selector to a paginator and fixing the js for highlighting - adding a navbar using bootstrap, probably should use .wrap more instead of adding divs to the code
-rw-r--r--css/standard.less33
-rw-r--r--include/cancelgame.php3
-rw-r--r--include/game.php14
-rw-r--r--include/output.php38
-rw-r--r--index.php2
-rw-r--r--js/game.js23
-rw-r--r--js/layout.js3
7 files changed, 61 insertions, 55 deletions
diff --git a/css/standard.less b/css/standard.less
index 3c5a9bc..5383d30 100644
--- a/css/standard.less
+++ b/css/standard.less
@@ -17,7 +17,7 @@
*
*/
-body { background-color: #ddd; }
+body { background-color: #ddd; padding-top:40px}
/* the header, footer, etc */
header {
@@ -51,13 +51,6 @@ footer {
footer .right { text-align:right; font-size:smaller;}
footer .left { float:left; font-size:smaller;}
-.status {
- position:absolute;
- right:4em;
- top:0.1em;
- font-size: smaller;
-}
-
.WIP {
background-color: #efaaaa;
text-size: larger;
@@ -263,25 +256,6 @@ div span.numberoftricks {
/* display the card tricks */
-ul.tricks {
- text-align:center;
- list-style:none;
- margin:0px;
- padding:3px;
- padding-bottom:3px;
- border-bottom:1px solid #444;
-}
-ul.tricks a { text-decoration:none; color:#000;}
-ul.tricks li {
- /*background-color:blue;*/
- padding:0.1em;
- margin:0.2em 0.5em;
- display:inline;
-}
-ul.tricks li.old { background-color:#fff; }
-ul.tricks li a:hover { background-color: #bbb;}
-ul.tricks li.nohighlight a:hover { background-color: #fff;}
-
div.tricks {
position: absolute;
top: 0;
@@ -806,7 +780,7 @@ header, footer {
border-top: 1px solid gray;
}
-.session div.sessionscore div, .status {
+.session div.sessionscore div {
right:0em;
}
@@ -849,4 +823,7 @@ header, footer {
text-align: right;
font-size: smaller;
}
+}
+.pagination {
+ text-align:center;
} \ No newline at end of file
diff --git a/include/cancelgame.php b/include/cancelgame.php
index da6ffcc..df6e98d 100644
--- a/include/cancelgame.php
+++ b/include/cancelgame.php
@@ -24,9 +24,6 @@
if(!isset($HOST))
exit;
-/* display the menu */
-output_status();
-
/* you should only get here from a game page, so $me should be set */
if(!myisset("me"))
{
diff --git a/include/game.php b/include/game.php
index d43699b..d07ff5b 100644
--- a/include/game.php
+++ b/include/game.php
@@ -367,7 +367,7 @@ switch($mystatus)
case 'check':
/* output sickness of other playes, in case they already selected and are sitting in front of the current player */
echo "\n<ul class=\"tricks\">\n";
- echo " <li onclick=\"hl('0');\" class=\"current\"><a href=\"#\">Pre</a>\n";
+ echo " <li onclick=\"hl('0');\" class=\"active\" id=\"tricks0\"><a href=\"#\">Pre</a>\n";
echo " </li>\n</ul>\n"; /* end div trick, end li trick , end tricks*/
/* end displaying sickness */
@@ -381,7 +381,7 @@ switch($mystatus)
$mygametype = DB_get_gametype_by_gameid($gameid);
- echo " <li onclick=\"hl('0');\" class=\"current\"><a href=\"#\">Pre</a>\n";
+ echo " <li onclick=\"hl('0');\" class=\"active\"><a href=\"#\">Pre</a>\n";
echo " </li>\n</ul>\n\n"; /* end div trick, end li trick , end ul tricks */
}
/* end output pre-game trick */
@@ -411,19 +411,19 @@ switch($mystatus)
{
$trick=$r[0];
if($trick!=$lasttrick)
- echo " <li onclick=\"hl('$trickNR');\" class=\"old\"><a href=\"#\">"._('Trick')." $trickNR</a></li>\n";
+ echo " <li onclick=\"hl('$trickNR');\" id=\"tricks$trickNR\"><a href=\"#\">"._('Trick')." $trickNR</a></li>\n";
else if($trick==$lasttrick)
- echo " <li onclick=\"hl('$trickNR');\" class=\"current\"><a href=\"#\">"._('Trick')." $trickNR</a></li>\n";
+ echo " <li onclick=\"hl('$trickNR');\" id=\"tricks$trickNR\" class=\"active\"><a href=\"#\">"._('Trick')." $trickNR</a></li>\n";
$trickNR++;
}
/* if game is over, also output link to Score tab */
if($mystatus=='gameover' && DB_get_game_status_by_gameid($gameid)=='gameover' )
- echo " <li onclick=\"hl('13');\" class=\"current\"><a href=\"#\">"._('Score')."</a></li>\n";
+ echo " <li onclick=\"hl('13');\" id=\"tricks13\" class=\"active\"><a href=\"#\">"._('Score')."</a></li>\n";
/* output previous/next buttons */
- echo ' <li onclick="hl_prev();" ><button>'._('prev')."</button></li>\n";
- echo ' <li onclick="hl_next();" ><button>'._('next')."</button></li>\n";
+ echo ' <li onclick="hl_prev();" id=\"prevtr\"><a href="#">'._('prev')."</a></li>\n";
+ echo ' <li onclick="hl_next();" id=\"nexttr\"><a href="#">'._('next')."</a></li>\n";
echo "</ul>\n\n";
diff --git a/include/output.php b/include/output.php
index 9094171..fa61c87 100644
--- a/include/output.php
+++ b/include/output.php
@@ -431,11 +431,6 @@ function output_header()
<script src="js/less.min.js" type="text/javascript"></script>
</head>
<body onload="high_last();">
-<header>
-<?php
- echo '<h1> '._('Welcome to E-Doko').' </h1>';
-?>
-</header>
<?php
echo "<div class=\"main\">";
@@ -464,6 +459,7 @@ function output_footer()
echo '<script src="'.autoversion('js/jquery.tablesorter.min.js'). '"></script>';
echo '<script src="'.autoversion('js/jquery.tools.min.js'). '"></script>';
echo '<script src="'.autoversion('js/bootstrap.min.js'). '"></script>';
+ echo '<script src="'.autoversion('js/layout.js'). '"></script>';
echo '<script src="'.autoversion('js/game.js'). '"></script>';
echo "</body>\n";
@@ -472,7 +468,7 @@ function output_footer()
return;
}
-function output_status()
+function output_navbar()
{
global $defaulttimezone, $INDEX, $WIKI, $RSS;
@@ -493,15 +489,27 @@ function output_status()
$token = get_user_token($myid);
/* logout info */
- echo "\n<div class=\"status\">\n";
- echo $name,"\n";
- echo " | <a href=\"".$INDEX."\">"._('mypage')."</a>\n";
- echo " | <a href=\"".$INDEX."?action=prefs\">"._('settings')."</a>\n";
- echo " | <a href=\"".$INDEX."?action=new\">"._('new game')."</a>\n";
- echo " | <a href=\"".$INDEX."?action=stats\">"._('statistics')."</a>\n";
- echo " | <a href=\"".$WIKI."\">"._('wiki/bugs')."</a>\n";
- echo " | <a href=\"".$RSS."?uid=".$myid."&amp;token=".$token."\">"._('atom')."</a>\n";
- echo " |&nbsp;&nbsp;&nbsp; <a href=\"".$INDEX."?action=logout\">"._('logout')."</a>\n";
+ echo "\n<div class=\"navbar navbar-fixed-top\">\n";
+ echo " <div class=\"navbar-inner\">\n";
+ echo " <span class=\"brand\" href=\"#\">E-DoKo</span>\n";
+ echo " <ul class=\"nav\">";
+ echo " <li><a href=\"#\">$name</a> </li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$INDEX."\">"._('mypage')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$INDEX."?action=prefs\">"._('settings')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$INDEX."?action=new\">"._('new game')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$INDEX."?action=stats\">"._('statistics')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$WIKI."\">"._('wiki/bugs')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$RSS."?uid=".$myid."&amp;token=".$token."\">"._('atom')."</a></li>\n";
+ echo " <li class=\"divider-vertical\"></li>\n";
+ echo " <li> <a href=\"".$INDEX."?action=logout\">"._('logout')."</a></li>\n";
+ echo " </ul>\n";
+ echo " </div>\n";
echo "</div>\n\n";
echo "<div class=\"lastlogin\"><span>"._('last login').": ".date("r",$unixtime)."</span></div>\n\n";
diff --git a/index.php b/index.php
index 0001408..bbdfeb2 100644
--- a/index.php
+++ b/index.php
@@ -138,7 +138,7 @@ switch($action)
/* ask for login or display login info, needs to go at the end, so that we have the
* session-variable already set.
*/
-output_status();
+output_navbar();
output_footer();
diff --git a/js/game.js b/js/game.js
index 3a1a080..d1d8405 100644
--- a/js/game.js
+++ b/js/game.js
@@ -5,9 +5,30 @@ var current=0;
/* do the higlighting */
function hl(num) {
var i;
- for(i=0;i<14;i++){ $("#trick"+i).hide(); }
+ for(i=0;i<14;i++){ $("#trick"+i).hide(); $("#tricks"+i).removeClass('active'); }
$("#trick"+num).css('display', 'block');
+ $("#tricks"+num).addClass('active');
current=num;
+
+ if(document.getElementById("tricks0"))
+ min=0;
+ else
+ min=1;
+
+ if(document.getElementById("tricks13"))
+ max=13;
+ else
+ min=12;
+
+ if(current==min)
+ $("#prevtr").addClass('disabled');
+ else
+ $("#prevtr").removeClass('disabled');
+ if(current==max)
+ $("#nexttr").addClass('disabled');
+ else
+ $("#nexttr").removeClass('disabled');
+
}
/* highlight the last trick, useful when a page is called the first time*/
diff --git a/js/layout.js b/js/layout.js
new file mode 100644
index 0000000..b98db8e
--- /dev/null
+++ b/js/layout.js
@@ -0,0 +1,3 @@
+$(".navbar .nav").addClass("pull-right");
+$("table").addClass("table table-striped");
+$("ul.tricks").wrap('<div class="pagination">'); \ No newline at end of file