correlr/mtg-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

Template updates, mainly updating the deck view

Browse source
This commit is contained in:
Correl Roush 2010-09-22 21:26:21 -04:00
parent 5d7e896415
commit 0f7d70da83
6 changed files with 142 additions and 56 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
analyzer/models.py
View file

@ -24,6 +24,8 @@ class Card(models.Model, mtg.Card):
def __unicode__(self): def __unicode__(self):
return self.name return self.name
def get_cost(self):
return mtg.ManaCost(self.cost)
class Deck(models.Model): class Deck(models.Model):
name = models.CharField(max_length=80) name = models.CharField(max_length=80)
cards = models.ManyToManyField(Card, through='Included') cards = models.ManyToManyField(Card, through='Included')

3
decks/views.py
View file

@ -2,7 +2,7 @@ from django.http import Http404
from django.shortcuts import render_to_response from django.shortcuts import render_to_response
from mtgweb.analyzer.models import Deck from mtgweb.analyzer.models import Deck
from mtgweb.lib.mtg import mtg from mtgweb.lib.mtg import mtg
from pygooglechart import PieChart3D from pygooglechart import PieChart3D, SimpleLineChart, Axis
def index(request): def index(request):
decks = Deck.objects.all() decks = Deck.objects.all()
@ -58,4 +58,5 @@ def detail(request, id):
'deck': deck, 'deck': deck,
'land_chart': land_chart, 'land_chart': land_chart,
'symbol_chart': symbol_chart, 'symbol_chart': symbol_chart,
'ramp_chart': ramp_chart,
'curve': curve}) 'curve': curve})

49
media/mtg.css
View file

@ -7,30 +7,41 @@ h1, h2, h3, h4, h5, h6 {
text-shadow: 2px 2px 2px #999; text-shadow: 2px 2px 2px #999;
} }
#main {
width: 990px;
}
header { header {
border-bottom: 2px solid #999; border-bottom: 2px solid #999;
} }
#navigation { #navigation {
width: 140px;
position: absolute;
} }
#navigation ul { #navigation ul {
margin: 0px;
padding: 0px; padding: 0px;
float: left;
width: 100%;
background-color: #ddd;
border-bottom: 1px solid #999;
} }
#navigation li { #navigation li {
list-style: none; list-style: none;
float: left;
} }
#navigation a { #navigation a,
#navigation a:visited,
#navigation a:hover {
display: block; display: block;
padding: 2px; padding: 2px;
background-color: #ddd; text-decoration: none;
border-bottom: 1px solid #999; padding-left: 1em;
padding-right: 1em;
} }
#navigation a:hover { #navigation a:hover {
background-color: #ccc; background-color: #ccc;
} }
#content { #content {
margin-left: 160px; padding-top: 2em;
padding-left: 60px;
} }
/* Cards and mana symbols */ /* Cards and mana symbols */
.mana.symbol { .mana.symbol {
@ -65,11 +76,11 @@ header {
background-color: #eee; background-color: #eee;
padding: 3px; padding: 3px;
height: 1em; height: 1em;
vertical-align: middle;
} }
.card .title .name, .card .title .name,
.card .info .type { .card .info .type {
font-weight: bold; font-weight: bold;
float: left;
text-shadow: 2px 2px 2px #999; text-shadow: 2px 2px 2px #999;
} }
.card .title .cost, .card .title .cost,
@ -125,3 +136,27 @@ header {
.mana-curve .bar { .mana-curve .bar {
background-color: #999; background-color: #999;
} }
section.mana {
width: 500px;
position: absolute;
margin-left: 430px;
}
section.mana section {
float: left;
}
section.mana section.curve,
section.mana section.ramp {
width: 100%;
}
section.mana table {
width: 100%;
}
section.cards {
width: 400px;
}
section.cards .card-type {
font-weight: bold;
text-shadow: 2px 2px 2px #999;
list-style: none;
}

4
templates/cards/view.html
View file

@ -7,7 +7,9 @@
<div class="title"> <div class="title">
<span class="name">{{ card.name|title }}</span> <span class="name">{{ card.name|title }}</span>
<span class="cost"> <span class="cost">
{% include 'cards/manacost.html' %} {% if cost.converted > 0 %}
{% include 'cards/manacost.html' %}
{% endif %}
</span> </span>
</div> </div>
<div class="picture"></div> <div class="picture"></div>

84
templates/decks/detail.html
View file

@ -6,24 +6,68 @@
{% block content %} {% block content %}
<h2>{{deck}}</h2> <h2>{{deck}}</h2>
<h3>Mana</h3> <section class="mana">
<h4>Lands</h4> <h3>Mana</h3>
<img src="{{ land_chart.get_url }}" /> <section class="lands">
<h4>Symbols</h4> <h4>Lands</h4>
<img src="{{ symbol_chart.get_url }}" /> <img src="{{ land_chart.get_url }}" />
<h4>Curve</h4> </section>
<table class="mana-curve"> <section class="symbols">
{% for cost, count in curve.items %} <h4>Symbols</h4>
<tr> <img src="{{ symbol_chart.get_url }}" />
<td class="cost">{{ cost }}</td> </section>
<td><div class="bar" style="text-align: right; width: {% widthratio count curve.values|getsum 100 %}%">{{ count }}</div></td> <section class="curve">
</tr> <h4>Curve</h4>
{% endfor %} <table class="mana-curve">
</table> {% for cost, count in curve.items %}
<h3>Cards</h3> <tr>
<ul> <td class="cost">{{ cost }}</td>
{% for card in deck.included_set.all %} <td><div class="bar" style="text-align: right; width: {% widthratio count curve.values|getmax 100 %}%">{{ count }}</div></td>
<li>{{card.count}}x <a href="{% url mtgweb.cards.views.display name=card.card.name %}">{{ card.card }}</a></li> </tr>
{% endfor %} {% endfor %}
</ul> </table>
</section>
<section class="ramp">
<h4>Ramp</h4>
<table>
<tr>
<td>
<img src="{{ ramp_chart.get_url }}" />
</td>
<td>
<table>
{% for turn in deck.ramp %}
<tr>
<td>Turn {{ turn.turn }}</td>
<td>{{ turn.probability }}%</td>
</tr>
{% endfor %}
</table>
</tr>
</table>
</section>
</section>
<section class="cards">
<h3>Cards</h3>
{% regroup deck.included_set.all by card.type as cards %}
<ul>
{% for group in cards %}
<li class="card-type">{{ group.grouper|title }}
<ul>
{% for included in group.list %}
<li>
<div class="card {% if included.card.colors|length > 1 %}gold{% else %}{{ included.card.colors|join:' ' }}{% endif %}">
<div class="title">
<span class="name">{{ included.count }}x</span>
<a class="name" href="{% url mtgweb.cards.views.display name=included.card.name %}">{{ included.card.name }}</a>
<span class="cost">{% with included.card.get_cost as cost %}{% if cost.converted > 0 %}{% include 'cards/manacost.html' %}{% endif %}{% endwith %}</span>
</div>
</div>
</li>
{% endfor %}
</ul>
</li>
{% endfor %}
</li>
</section>
{% endblock %} {% endblock %}

56
templates/main.html
View file

@ -6,32 +6,34 @@
<title>{% block title %}MTG Armory{% endblock %}</title> <title>{% block title %}MTG Armory{% endblock %}</title>
</head> </head>
<body> <body>
<header> <div id="main">
<h1>MTG Armory</h1> <header>
</header> <h1>MTG Armory</h1>
<section id="navigation"> </header>
<ul> <section id="navigation">
<li><a href="{% url mtgweb.analyzer.views.index %}">Home</a></li> <ul>
<li><a href="/cards/">Cards</a></li> <li><a href="{% url mtgweb.analyzer.views.index %}">Home</a></li>
<li><a href="/decks/">Decks</a></li> <li><a href="/cards/">Cards</a></li>
</ul> <li><a href="/decks/">Decks</a></li>
</section> </ul>
<section id="content"> </section>
{% block content %} <section id="content">
<h2>Welcome to the MTG Armory</h2> {% block content %}
<p> <h2>Welcome to the MTG Armory</h2>
Someday this might grow up into yet another deck builder <p>
site for folks to flock to and keep track of their stuff. Someday this might grow up into yet another deck builder
For now, though, it's just an awful looking dumping ground site for folks to flock to and keep track of their stuff.
for my own decks and Python experimentation. For now, though, it's just an awful looking dumping ground
</p> for my own decks and Python experimentation.
<p> </p>
This whole thing is just an excercise in learning Django <p>
and HTML5, so don't expect too much out of it. Ever. This whole thing is just an excercise in learning Django
</p> and HTML5, so don't expect too much out of it. Ever.
{% endblock %} </p>
</section> {% endblock %}
<footer> </section>
</footer> <footer>
</footer>
</div>
</body> </body>
</html> </html>