Web (Storycraft): show a bar indicating the progress of the detailed game

This commit is contained in:
Brian S. Stephan 2011-02-20 13:11:49 -06:00
parent 576cea4c0a
commit d2a6267d95
5 changed files with 42 additions and 4 deletions

View File

@ -112,6 +112,19 @@ body {
text-decoration: none;
}
.gameitem .progressblock {
width: 100%;
margin: 10px;
}
.progressbar .yui-pb {
height: 10px;
}
.progressbar .yui-pb-bar {
background-color: #811610;
}
.storyblock {
border: 1px solid #e0e0e0;
margin: 0px 10px;

View File

@ -20,10 +20,7 @@ def game_index(request, game_id):
game = get_object_or_404(StorycraftGame, pk=game_id)
players = StorycraftPlayer.objects.filter(game=game.id)
lines = []
if game.is_completed():
lines = StorycraftLine.objects.filter(game=game.id)
lines = StorycraftLine.objects.filter(game=game.id)
return render_to_response('storycraft/game_index.html', {'game': game, 'players': players, 'lines': lines}, context_instance=RequestContext(request))

View File

@ -5,6 +5,17 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>dr.botzo &mdash; Storycraft</title>
<link rel="stylesheet" href="/static/storycraft/page.css" type="text/css" />
<!-- Required CSS -->
<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/2.8.2r1/build/progressbar/assets/skins/sam/progressbar.css">
<!-- Dependency source file -->
<script src = "http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js" ></script>
<script src = "http://yui.yahooapis.com/2.8.2r1/build/element/element-min.js" ></script>
<!-- Optional dependency source file -->
<script src="http://yui.yahooapis.com/2.8.2r1/build/animation/animation-min.js" type="text/javascript"></script>
<!-- ProgressBar source file -->
<script src = "http://yui.yahooapis.com/2.8.2r1/build/progressbar/progressbar-min.js" ></script>
</head>
<body>
{% if messages %}

View File

@ -5,6 +5,17 @@
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>dr.botzo &mdash; Storycraft</title>
<link rel="stylesheet" href="/static/storycraft/page.css" type="text/css" />
<!-- Required CSS -->
<link type="text/css" rel="stylesheet" href="http://yui.yahooapis.com/2.8.2r1/build/progressbar/assets/skins/sam/progressbar.css">
<!-- Dependency source file -->
<script src = "http://yui.yahooapis.com/2.8.2r1/build/yahoo-dom-event/yahoo-dom-event.js" ></script>
<script src = "http://yui.yahooapis.com/2.8.2r1/build/element/element-min.js" ></script>
<!-- Optional dependency source file -->
<script src="http://yui.yahooapis.com/2.8.2r1/build/animation/animation-min.js" type="text/javascript"></script>
<!-- ProgressBar source file -->
<script src = "http://yui.yahooapis.com/2.8.2r1/build/progressbar/progressbar-min.js" ></script>
</head>
<body>
{% if messages %}

View File

@ -11,6 +11,12 @@
{% endfor %}
</ul>
{% endif %}
{% if lines %}
<div class="progressblock" id="progressblock{{game.id}}">
<div class="progressbar" id="progressbar{{game.id}}"></div>
</div>
<script>var pb = new YAHOO.widget.ProgressBar().render('progressbar{{game.id}}'); var space = YAHOO.util.Dom.getRegion('progressblock{{game.id}}'); pb.set('width', space.width-35); pb.set('minValue', 0); pb.set('maxValue', {{ game.game_length }}); pb.set('value', 0); if (0) { pb.set('anim', true); var anim = pb.get('anim'); anim.duration = 2; } pb.set('value', {{ lines|length }});</script>
{% endif %}
</div>
<!--