Template updates, mainly updating the deck view
This commit is contained in:
parent
5d7e896415
commit
0f7d70da83
6 changed files with 142 additions and 56 deletions
|
@ -24,6 +24,8 @@ class Card(models.Model, mtg.Card):
|
|||
|
||||
def __unicode__(self):
|
||||
return self.name
|
||||
def get_cost(self):
|
||||
return mtg.ManaCost(self.cost)
|
||||
class Deck(models.Model):
|
||||
name = models.CharField(max_length=80)
|
||||
cards = models.ManyToManyField(Card, through='Included')
|
||||
|
|
|
@ -2,7 +2,7 @@ from django.http import Http404
|
|||
from django.shortcuts import render_to_response
|
||||
from mtgweb.analyzer.models import Deck
|
||||
from mtgweb.lib.mtg import mtg
|
||||
from pygooglechart import PieChart3D
|
||||
from pygooglechart import PieChart3D, SimpleLineChart, Axis
|
||||
|
||||
def index(request):
|
||||
decks = Deck.objects.all()
|
||||
|
@ -58,4 +58,5 @@ def detail(request, id):
|
|||
'deck': deck,
|
||||
'land_chart': land_chart,
|
||||
'symbol_chart': symbol_chart,
|
||||
'ramp_chart': ramp_chart,
|
||||
'curve': curve})
|
||||
|
|
|
@ -7,30 +7,41 @@ h1, h2, h3, h4, h5, h6 {
|
|||
text-shadow: 2px 2px 2px #999;
|
||||
}
|
||||
|
||||
#main {
|
||||
width: 990px;
|
||||
}
|
||||
header {
|
||||
border-bottom: 2px solid #999;
|
||||
}
|
||||
#navigation {
|
||||
width: 140px;
|
||||
position: absolute;
|
||||
}
|
||||
#navigation ul {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
float: left;
|
||||
width: 100%;
|
||||
background-color: #ddd;
|
||||
border-bottom: 1px solid #999;
|
||||
}
|
||||
#navigation li {
|
||||
list-style: none;
|
||||
float: left;
|
||||
}
|
||||
#navigation a {
|
||||
#navigation a,
|
||||
#navigation a:visited,
|
||||
#navigation a:hover {
|
||||
display: block;
|
||||
padding: 2px;
|
||||
background-color: #ddd;
|
||||
border-bottom: 1px solid #999;
|
||||
text-decoration: none;
|
||||
padding-left: 1em;
|
||||
padding-right: 1em;
|
||||
}
|
||||
#navigation a:hover {
|
||||
background-color: #ccc;
|
||||
}
|
||||
#content {
|
||||
margin-left: 160px;
|
||||
padding-top: 2em;
|
||||
padding-left: 60px;
|
||||
}
|
||||
/* Cards and mana symbols */
|
||||
.mana.symbol {
|
||||
|
@ -65,11 +76,11 @@ header {
|
|||
background-color: #eee;
|
||||
padding: 3px;
|
||||
height: 1em;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.card .title .name,
|
||||
.card .info .type {
|
||||
font-weight: bold;
|
||||
float: left;
|
||||
text-shadow: 2px 2px 2px #999;
|
||||
}
|
||||
.card .title .cost,
|
||||
|
@ -125,3 +136,27 @@ header {
|
|||
.mana-curve .bar {
|
||||
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;
|
||||
}
|
||||
|
|
|
@ -7,7 +7,9 @@
|
|||
<div class="title">
|
||||
<span class="name">{{ card.name|title }}</span>
|
||||
<span class="cost">
|
||||
{% if cost.converted > 0 %}
|
||||
{% include 'cards/manacost.html' %}
|
||||
{% endif %}
|
||||
</span>
|
||||
</div>
|
||||
<div class="picture"></div>
|
||||
|
|
|
@ -6,24 +6,68 @@
|
|||
|
||||
{% block content %}
|
||||
<h2>{{deck}}</h2>
|
||||
<h3>Mana</h3>
|
||||
<h4>Lands</h4>
|
||||
<img src="{{ land_chart.get_url }}" />
|
||||
<h4>Symbols</h4>
|
||||
<img src="{{ symbol_chart.get_url }}" />
|
||||
<h4>Curve</h4>
|
||||
<table class="mana-curve">
|
||||
<section class="mana">
|
||||
<h3>Mana</h3>
|
||||
<section class="lands">
|
||||
<h4>Lands</h4>
|
||||
<img src="{{ land_chart.get_url }}" />
|
||||
</section>
|
||||
<section class="symbols">
|
||||
<h4>Symbols</h4>
|
||||
<img src="{{ symbol_chart.get_url }}" />
|
||||
</section>
|
||||
<section class="curve">
|
||||
<h4>Curve</h4>
|
||||
<table class="mana-curve">
|
||||
{% for cost, count in curve.items %}
|
||||
<tr>
|
||||
<td class="cost">{{ cost }}</td>
|
||||
<td><div class="bar" style="text-align: right; width: {% widthratio count curve.values|getsum 100 %}%">{{ count }}</div></td>
|
||||
<td><div class="bar" style="text-align: right; width: {% widthratio count curve.values|getmax 100 %}%">{{ count }}</div></td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</table>
|
||||
<h3>Cards</h3>
|
||||
<ul>
|
||||
{% for card in deck.included_set.all %}
|
||||
<li>{{card.count}}x <a href="{% url mtgweb.cards.views.display name=card.card.name %}">{{ card.card }}</a></li>
|
||||
</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 %}
|
||||
</ul>
|
||||
</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 %}
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
<title>{% block title %}MTG Armory{% endblock %}</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="main">
|
||||
<header>
|
||||
<h1>MTG Armory</h1>
|
||||
</header>
|
||||
|
@ -33,5 +34,6 @@
|
|||
</section>
|
||||
<footer>
|
||||
</footer>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in a new issue