Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Show more type effectiveness info (closes #10) #33

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Show more type effectiveness info (closes #10) #33

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 4 additions & 1 deletion js/pokedex-pokemon.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,7 +76,10 @@ var PokedexPokemonPanel = PokedexResultPanel.extend({
buf += '</dl>';

buf += '<dl>';
buf += '<dt style="clear:left">Base stats:</dt><dd><table class="stats">';
buf += '<dt style="clear:left">Defensive effectiveness:</dt>';
buf += '<dd>'+PokedexTypePanel.prototype.renderDefensiveEffectiveness(pokemon.types)+'</dd>';

buf += '<dt>Base stats:</dt><dd><table class="stats">';

var StatTitles = {
hp: "HP",
Expand Down
170 changes: 123 additions & 47 deletions js/pokedex.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -123,40 +123,135 @@ var PokedexTypePanel = PokedexResultPanel.extend({
var buf = '<div class="pfx-body dexentry">';
buf += '<a href="/" class="pfx-backbutton" data-target="back"><i class="fa fa-chevron-left"></i> Pok&eacute;dex</a>';
buf += '<h1><a href="/types/'+id+'" data-target="push" class="subtle">'+this.type+'</a></h1>';

buf += '<dl>';
var atLeastOne = false;
buf += '<dt>Defensive effectiveness:</dt><dd>'+this.renderDefensiveEffectiveness(type)+'</dd>';
buf += '<dt>Offensive effectiveness:</dt><dd>'+this.renderOffensiveEffectiveness(type)+'</dd>';
buf += '</dl>';

buf += '<dt>Weaknesses:</dt> <dd>';
for (var attackType in type.damageTaken) {
if (type.damageTaken[attackType] == 1) {
buf += '<a href="/types/'+toID(attackType)+'" data-target="push">'+Dex.getTypeIcon(attackType)+'</a> ';
atLeastOne = true;
// move list
buf += '<ul class="tabbar"><li><button class="button nav-first cur" value="move">Moves</button></li><li><button class="button nav-last" value="pokemon">Pokemon</button></li></ul>';
buf += '<ul class="utilichart nokbd">';
buf += '</ul>';

buf += '</div>';

this.html(buf);

setTimeout(this.renderMoveList.bind(this));
},
getTypeEffectiveness: function(attacking, defending) {
var attackingName = typeof attacking === 'string' ? attacking : attacking.name;
if (Array.isArray(defending)) {
var total = 0;
for (var i = 0; i < defending.length; i++) {
var defendingType = typeof defending[i] === 'string' ? Dex.types.get(defending[i]) : defending[i];
switch (defendingType.damageTaken[attackingName]) {
case 1: // super effective
++total;
break;
case 2: // not very effective
--total;
break;
case 3: // immune
return null;
}
}
return total;
}
var defendingType = typeof defending === 'string' ? Dex.types.get(defending) : defending;
switch (defendingType.damageTaken[attackingName]) {
case 1: // super effective
return 1;
case 2: // not very effective
return -1;
case 3: // immune
return null;
default:
return 0;
}
if (!atLeastOne) {
buf += '<em>No weaknesses</em>';
},
effectTypes: ['hail', 'sandstorm', 'powder', 'frz', 'brn', 'psn', 'par'],
renderDefensiveEffectiveness: function(defending) {
var imms = [];
if (Array.isArray(defending)) {
for (var i = 0; i < defending.length; i++) {
var defendingType = typeof defending[i] === 'string' ? Dex.types.get(defending[i]) : defending[i];
for (var j = 0; j < this.effectTypes.length; j++) {
if (defendingType.damageTaken[this.effectTypes[j]] === 3) {
imms.push(this.effectTypes[j]);
}
}
}
} else {
var defendingType = typeof defending === 'string' ? Dex.types.get(defending) : defending;
for (var j = 0; j < this.effectTypes.length; j++) {
if (defendingType.damageTaken[this.effectTypes[j]] === 3) {
imms.push(this.effectTypes[j]);
}
}
}
buf += '</dd>';

buf += '<dt>Resistances:</dt> <dd>';
atLeastOne = false;
for (var attackType in type.damageTaken) {
if (type.damageTaken[attackType] == 2) {
buf += '<a href="/types/'+toID(attackType)+'" data-target="push">'+Dex.getTypeIcon(attackType)+'</a> ';
atLeastOne = true;
var effs = [[], [], [], [], []];
for (var types = Dex.types.all(), i = 0; i < types.length; i++) {
var eff = this.getTypeEffectiveness(types[i], defending);
if (eff === null) {
imms.push(types[i].name);
} else {
effs[eff + 2].push(types[i].name);
}
}
if (!atLeastOne) {
buf += '<em>No resistances</em>';

return this.renderEffectivenessTable(effs, imms, 'defense');
},
renderOffensiveEffectiveness: function(attacking) {
var effs = [[], [], [], [], []];
var imms = [];
for (var types = Dex.types.all(), i = 0; i < types.length; i++) {
var eff = this.getTypeEffectiveness(attacking, types[i]);
if (eff === null) {
imms.push(types[i].name);
} else {
effs[eff + 2].push(types[i].name);
}
}
buf += '</dd>';
return this.renderEffectivenessTable(effs, imms, 'offense');
},
renderEffectivenessTable: function(effs, imms, cls) {
var hasDoubles = effs[0].length > 0 || effs[4].length > 0; // any .25x or 4x?
var buf = '<table class="typeeff '+cls+'">';

var i, max;
if (hasDoubles) {
buf += '<tr><th>.25x</th><th>.5x</th><th>2x</th><th>4x</th></tr>';
i = 0;
max = 4;
} else {
buf += '<tr><th>.5x</th><th>2x</th></tr>';
i = 1;
max = 3;
}

buf += '<tr>';
for (; i <= max; i++) {
if (i === 2) continue; // don't show neutral effectiveness
buf += '<td class="eff'+i+'">';
var atLeastOne = false;
for (let j = 0; j < effs[i].length; j++) {
buf += '<a href="/types/'+toID(effs[i][j])+'" data-target="push">'+Dex.getTypeIcon(effs[i][j])+'</a> ';
atLeastOne = true;
}
if (!atLeastOne) buf += '-';
buf += '</td>';
}
buf += '</tr>';

buf += '<dt>Immunities:</dt> <dd>';
atLeastOne = false;
for (var attackType in type.damageTaken) {
if (type.damageTaken[attackType] == 3) {
if (attackType === attackType.toLowerCase()) {
switch (attackType) {
if (imms.length > 0) {
buf += '<tr><td class="immune" colspan="'+(hasDoubles?'4':'2')+'">';
buf += '<div><strong>Immune:</strong></div>';
for (var i = 0; i < imms.length; i++) {
if (imms[i] === imms[i].toLowerCase()) {
switch (imms[i]) {
case 'hail':
buf += '<div><small><a href="/moves/hail" data-target="push">Hail</a> damage</small></div>';
break;
Expand All @@ -179,34 +274,15 @@ var PokedexTypePanel = PokedexResultPanel.extend({
buf += '<div><small>PAR status</small></div>';
break;
}
if (!atLeastOne) atLeastOne = null;
continue;
}
buf += '<a href="/types/'+toID(attackType)+'" data-target="push">'+Dex.getTypeIcon(attackType)+'</a> ';
atLeastOne = true;
}
}
if (!atLeastOne) {
if (atLeastOne === null) {
buf += '<div><em>No type immunities</em></div>';
} else {
buf += '<em>No immunities</em>';
buf += '<a href="/types/'+toID(imms[i])+'" data-target="push">'+Dex.getTypeIcon(imms[i])+'</a> ';
}
buf += '</td></tr>';
}
buf += '</dd>';

buf += '</dl>';

// move list
buf += '<ul class="tabbar"><li><button class="button nav-first cur" value="move">Moves</button></li><li><button class="button nav-last" value="pokemon">Pokemon</button></li></ul>';
buf += '<ul class="utilichart nokbd">';
buf += '</ul>';

buf += '</div>';

this.html(buf);

setTimeout(this.renderMoveList.bind(this));
buf += '</table>';
return buf;
},
events: {
'click .tabbar button': 'selectTab'
Expand Down
34 changes: 34 additions & 0 deletions theme/pokedex.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -409,6 +409,40 @@ a.subtle:hover {
.type.special{background-color:#ADB1BD;background:linear-gradient(#ADB1BD,#7D828D);border-color:#A1A5AD;color:#E0E2E4;}
.type.status{background-color:#CBC9CB;background:linear-gradient(#CBC9CB,#AAA6AA);border-color:#A99890;color:#F5F4F5;}

.typeeff {
width: 100%;
table-layout: fixed;
border-collapse: collapse;
font-size: 9pt;
}
.typeeff tr {
line-height: 1.25;
}
.typeeff th {
font-size: 7pt;
font-weight: bold;
}
.typeeff td {
padding: 2px 6px 0;
border: 1px solid #AAAAAA;
}
.typeeff.defense td.eff4, .typeeff.offense td.eff0 {
background-color: rgba(255,128,128,.2);
}
.typeeff.defense td.eff3, .typeeff.offense td.eff1 {
background-color: rgba(255,128,128,.1);
}
.typeeff.defense td.eff1, .typeeff.offense td.eff3 {
background-color: rgba(128,255,128,.1);
}
.typeeff.defense td.eff0, .typeeff.offense td.eff4 {
background-color: rgba(128,255,128,.2);
}
.typeeff td.immune {
padding-bottom: 2px;
background-color: rgba(128,128,128,.1);
}

.pokemonicon, .picon {
display: inline-block;
vertical-align: -6px;
Expand Down