New character layout

This commit is contained in:
2010-12-22 22:55:40 +00:00
parent b65e282308
commit c464ef6cf7
4 changed files with 109 additions and 36 deletions

View File

@@ -101,12 +101,16 @@ border-collapse: collapse;
border-spacing: 0px;} border-spacing: 0px;}
table td table td
{background-color: #CCC; {
color: #000; color: #000;
padding: 4px; padding: 4px;
text-align: left; text-align: left;
border: 1px #fff solid;} border: 1px #fff solid;}
table tr { background-color: #CCC; }
table tr:nth-child(odd) { background-color: #ddd; }
table tr:hover { background-color: #eed; }
table th table th
{background-color: #333; {background-color: #333;
color: #fff; color: #fff;
@@ -115,3 +119,22 @@ text-align: left;
border-bottom: 2px #fff solid; border-bottom: 2px #fff solid;
font-size: 12px; font-size: 12px;
font-weight: bold;} font-weight: bold;}
.character_info > div { margin-bottom: 2em; }
.character_info .character_portrait, .character_info .character_corporation, .character_info .character_alliance { float: right; }
.character_info .character_corporation { clear: right; margin-left: 2em; }
.character_info .character_corporation span, .character_info .character_alliance span { font-weight: bold; display: block; text-align: center; }
.character_info .character_attributes ul { margin: .25em 2em; padding: 0; }
.character_info .character_skills table { width: 100%; }
.character_info .character_stats table { width: 300px; }
.character_info .character_attributes .stat { font-weight: bold; }
.character_skills th { cursor:pointer;cursor:hand; }
.toggle_off th { background-color: #000; }
.skill_controls { margin-bottom: .5em; }
.skill_controls a {
background: none repeat scroll 0 0 #CC6600;
color: #FFFFFF;
display: inline-block;
padding: 4px 12px;
text-decoration: none;
}

View File

@@ -103,7 +103,7 @@ INSTALLED_APPS = (
'reddit', 'reddit',
'hr', 'hr',
'sso', 'sso',
'groups', # 'groups',
'api', 'api',
) )

View File

@@ -4,43 +4,93 @@
{% block content %} {% block content %}
<h1>{{ character.name }}</h1> <div class="character_info">
<h1>{{ character.name }}</h1>
<img src="http://img.eve.is/serv.asp?s=256&c={{ character.id }}"/> <div class="character_portrait">
<img src="http://img.eve.is/serv.asp?s=256&c={{ character.id }}" />
</div>
<div class="character_corporation">
<span><a href="http://evemaps.dotlan.net/ajax/opensearch?q={{ character.corporation.name }}">{{ character.corporation.ticker }}</a></span>
<img src="http://www.evecorplogo.net/logo.php?id={{ character.corporation.id }}" />
</div>
<div class="character_alliance">
<span><a href="http://evemaps.dotlan.net/ajax/opensearch?q={{ character.corporation.alliance.name }}">{{ character.corporation.alliance.ticker }}</a></span>
<img src="http://image.eveonline.com/Alliance/{{ character.corporation.alliance.id }}_64.png" />
</div>
<img src="http://www.evecorplogo.net/logo.php?id={{ character.corporation.id }}" width="128" height="128" /> <div class="character_attributes">
<h2>Attributes</h2>
<ul>
<li><span class="stat">Race:</span> <span class="value">{{ character.get_race_display }}</span></li>
<li><span class="stat">Gender:</span> <span class="value">{{ character.get_gender_display }}</span></li>
<li><span class="stat">Corporation:</span> <a href="http://evemaps.dotlan.net/ajax/opensearch?q={{ character.corporation.name }}">{{ character.corporation.name }}</a></span></li>
<li><span class="stat">Joined Corporation:</span> <span class="value">{{ character.corporation_date }}</span></li>
<li><span class="stat">Alliance:</span> <span class="value"><a href="http://evemaps.dotlan.net/ajax/opensearch?q={{ character.corporation.alliance.name }}">{{ character.corporation.alliance.name }}</a></span></li>
<li><span class="stat">Security Status:</span> {{ character.security_status }}</span></li>
<li><span class="stat">Director:</span> <span class="value">{{ character.director }}</span></li>
</ul>
</div>
<div class="character_stats">
<h2>Stats</h2>
<table>
<tr><th>Stat</th><th>Value</th></tr>
<tr><td class="stat">Intelligence</td><td> {{ character.attrib_intelligence }}</td></tr>
<tr><td class="stat">Memory</td><td>{{ character.attrib_memory }}</td></tr>
<tr><td class="stat">Charisma</td><td>{{ character.attrib_charisma }}</td></tr>
<tr><td class="stat">Perception</td><td>{{ character.attrib_perception }}</td></tr>
<tr><td class="stat">Willpower</td><td>{{ character.attrib_willpower }}</td></tr>
</table>
</div>
<ul> <div class="character_skills">
<li>Race: {{ character.get_race_display }}</li> <h2>Skills</h2>
<li>Gender: {{ character.get_gender_display }}</li>
<li>Corporation: {{ character.corporation.name }}</li> <div class="skill_controls">
<li>Joined Corporation: {{ character.corporation_date }}</li> <a href=#" id="openAll">Open All</a>
<li>Alliance: {{ character.corporation.alliance.name }}</li> <a href=#" id="collapseAll">Collapse All</a>
<li>Security Status: {{ character.security_status }}</li> </div>
<li>Director: {{ character.director }}</li> <table>
</ul> {% for g ,v in skills.items %}
<tr class="skill_heading"><th colspan=3>{{ g }}</th</tr>
{% for skill in v %}
<tr style="display:none;"><td>{{ skill.skill.name }} </td><td>Level {{ skill.level }}</td><td>{{ skill.skillpoints|intcomma }} SP</td></tr>
{% endfor %}
{% endfor %}
<tr><th colspan=2>Total SP</th><th>{{ character.total_sp|intcomma }} SP</td></tr>
</table>
</div>
</div>
<table> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<tr><th>Stat</th><th>Value</th></tr> <script type="text/javascript">
<tr><td>Intelligence</td><td> {{ character.attrib_intelligence }}</td></tr> $(function(){
<tr><td>Memory</td><td>{{ character.attrib_memory }}</td></tr> $(".skill_heading").bind("click", function(){
<tr><td>Charisma</td><td>{{ character.attrib_charisma }}</td></tr> $this = $(this);
<tr><td>Perception</td><td>{{ character.attrib_perception }}</td></tr> $this.nextUntil(".skill_heading").toggle();
<tr><td>Willpower</td><td>{{ character.attrib_willpower }}</td></tr>
</table> if($this.hasClass("toggle_off")){
<br/> $this.removeClass("toggle_off").removeClass("toggle_on");
}else{
<h2>Skills</h2> $this.removeClass("toggle_on").removeClass("toggle_off");
}
<table width="350px"> });
{% for g ,v in skills.items %}
<tr><th colspan=3>{{ g }}</th</tr> $("#openAll").bind("click", function(e){
{% for skill in v %} e.preventDefault();
<tr><td>{{ skill.skill.name }} </td><td>Level {{ skill.level }}</td><td>{{ skill.skillpoints|intcomma }} SP</td></tr> $(".character_skills tr").css({ display: "table-row" });
{% endfor %} });
{% endfor %}
<tr><th colspan=2>Total SP</th><th>{{ character.total_sp|intcomma }} SP</td></tr> $("#collapseAll").bind("click", function(e){
</table> e.preventDefault();
$(".character_skills tr:not(.skill_heading)").css({ display: "none" });
});
});
</script>
{% endblock %} {% endblock %}

View File

@@ -7,7 +7,7 @@
{% block content %} {% block content %}
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.js"></script> <script type="text/javascript" src="/media/js/jquery.min.js"></script>
<script type="text/javascript"> <script type="text/javascript">
function refresh_apikey(key) { function refresh_apikey(key) {