From 385c284c9691b15bbc90c26f43eac063ec0085c6 Mon Sep 17 00:00:00 2001 From: Guangcong Luo Date: Sat, 5 Mar 2016 22:42:03 -0600 Subject: [PATCH] Support sorting pokemon in teambuilder --- js/search.js | 104 +++++++++++++++++++++++++++++++++++++++---- style/utilichart.css | 42 +++++++++++++++++ 2 files changed, 137 insertions(+), 9 deletions(-) diff --git a/js/search.js b/js/search.js index 7b41bdb5e..3f511dce6 100644 --- a/js/search.js +++ b/js/search.js @@ -27,6 +27,7 @@ this.resultSet = null; this.filters = null; + this.sortCol = null; this.renderedIndex = 0; this.renderingDone = true; this.cur = {}; @@ -53,6 +54,18 @@ } if (self.$inputEl) self.$inputEl.focus(); }); + this.$el.on('click', '.sortcol', function (e) { + e.preventDefault(); + e.stopPropagation(); + var sortCol = e.currentTarget.dataset.sort; + if (self.sortCol === sortCol) { + self.sortCol = null; + } else { + self.sortCol = sortCol; + } + self.q = undefined; + self.find(''); + }); } Search.prototype.$ = function (query) { @@ -97,7 +110,7 @@ if (!query) { // search field is blank, display default results - if (!this.filters && this.defaultResultSet) { + if (!this.filters && !this.sortCol && this.defaultResultSet) { this.renderedIndex = 0; this.renderingDone = false; this.updateScroll(); @@ -384,6 +397,7 @@ if (!node.dataset.entry) return; var entry = node.dataset.entry.split(':'); if (this.qType === 'pokemon') { + if (entry[0] === this.sortCol) this.sortCol = null; if (entry[0] !== 'type' && entry[0] !== 'move' && entry[0] !== 'ability' && entry[0] !== 'egggroup' && entry[0] !== 'tier') return; if (entry[0] === 'move') entry[1] = toId(entry[1]); if (!this.filters) this.filters = []; @@ -412,8 +426,8 @@ return true; }; Search.prototype.allPokemon = function () { - if (this.filters) return this.filteredPokemon(); - var resultSet = []; + if (this.filters || this.sortCol) return this.filteredPokemon(); + var resultSet = [['sortpokemon', '']]; for (var id in BattlePokedex) { switch (id) { case 'bulbasaur': @@ -469,6 +483,26 @@ this.renderingDone = false; this.updateScroll(); }; + Search.prototype.allTypes = function (resultSet) { + if (!resultSet) resultSet = []; + for (var id in window.BattleTypeChart) { + resultSet.push(['type', id]); + } + this.resultSet = resultSet; + this.renderedIndex = 0; + this.renderingDone = false; + this.updateScroll(); + }; + Search.prototype.allAbilities = function (resultSet) { + if (!resultSet) resultSet = []; + for (var id in BattleAbilities) { + resultSet.push(['ability', id]); + } + this.resultSet = resultSet; + this.renderedIndex = 0; + this.renderingDone = false; + this.updateScroll(); + }; Search.prototype.getFilterText = function (q) { var buf = '

Filters: '; for (var i = 0; i < this.filters.length; i++) { @@ -481,10 +515,19 @@ return buf + '

'; }; Search.prototype.filteredPokemon = function () { - var resultSet = [['html', this.getFilterText()]]; - resultSet.push(['header', "Filtered results"]); + var resultSet = []; + var filters = this.filters || []; + var sortCol = this.sortCol; + + this.resultSet = [['sortpokemon', '']]; + if (filters.length) this.resultSet.push(['html', this.getFilterText()], ['header', "Filtered results"]); + if (sortCol === 'type') { + return this.allTypes(this.resultSet); + } else if (sortCol === 'ability') { + return this.allAbilities(this.resultSet); + } + var illegalResultSet = []; - var filters = this.filters; var genChar = '' + this.gen; for (var id in BattlePokedex) { var template = BattlePokedex[id]; @@ -524,12 +567,33 @@ } if (i < filters.length) continue; if (this.legalityFilter && !(id in this.legalityFilter)) { - illegalResultSet.push(['pokemon', id]); + if (!sortCol) illegalResultSet.push(['pokemon', id]); } else { resultSet.push(['pokemon', id]); } } - this.resultSet = resultSet.concat(illegalResultSet); + if (sortCol === 'hp' || sortCol === 'atk' || sortCol === 'def' || sortCol === 'spa' || sortCol === 'spd' || sortCol === 'spe') { + resultSet = resultSet.sort(function (row1, row2) { + var stat1 = BattlePokedex[row1[1]].baseStats[sortCol]; + var stat2 = BattlePokedex[row2[1]].baseStats[sortCol]; + return stat2 - stat1; + }); + } else if (sortCol === 'bst') { + resultSet = resultSet.sort(function (row1, row2) { + var base1 = BattlePokedex[row1[1]].baseStats; + var base2 = BattlePokedex[row2[1]].baseStats; + var bst1 = base1.hp + base1.atk + base1.def + base1.spa + base1.spd + base1.spe; + var bst2 = base2.hp + base2.atk + base2.def + base2.spa + base2.spd + base2.spe; + return bst2 - bst1; + }); + } else if (sortCol === 'name') { + resultSet = resultSet.sort(function (row1, row2) { + var name1 = row1[1]; + var name2 = row2[1]; + return name1 < name2 ? -1 : name1 > name2 ? 1 : 0; + }); + } + this.resultSet = this.resultSet.concat(resultSet, illegalResultSet); this.renderedIndex = 0; this.renderingDone = false; this.updateScroll(); @@ -630,7 +694,10 @@ }; Search.prototype.setType = function (qType, format, set, cur) { if (!format) format = ''; - if (this.qType !== qType) this.filters = null; + if (this.qType !== qType) { + this.filters = null; + this.sortCol = null; + } this.qType = qType; this.q = undefined; this.cur = cur || {}; @@ -806,6 +873,7 @@ if (i) this.defaultResultSet = [[qType, i]].concat(this.defaultResultSet); break; } + if (qType === 'pokemon') this.defaultResultSet = [['sortpokemon', '']].concat(this.defaultResultSet); if (this.legalityFilter) { for (var i = 0; i < this.defaultResultSet.length; i++) { @@ -854,6 +922,8 @@ return '
  • ' + id + '
    • '; case 'header': return '

  • ' + id + '

    • '; + case 'sortpokemon': + return this.renderPokemonSortRow(); case 'pokemon': var pokemon = BattlePokedex[id]; return this.renderPokemonRow(pokemon, matchStart, matchLength, errorMessage, attrs); @@ -909,6 +979,22 @@ } return 'Error: not found'; }; + Search.prototype.renderPokemonSortRow = function () { + var buf = '
  • '; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += ''; + buf += '
    • '; + return buf; + }; Search.prototype.renderPokemonRow = function (pokemon, matchStart, matchLength, errorMessage, attrs) { if (!attrs) attrs = ''; var id = toId(pokemon.species); diff --git a/style/utilichart.css b/style/utilichart.css index 9ffa70b28..712a0420f 100644 --- a/style/utilichart.css +++ b/style/utilichart.css @@ -278,3 +278,45 @@ .utilichart .itemdesccol { width: 464px; } + +.utilichart .sortrow { + background: #CCC; + border-bottom: 1px solid #888; + height: 20px; + color: black; +} +.utilichart .sortcol { + font-family: Verdana, sans-serif; + font-size: 8pt; + background: transparent; + color: black; + float: left; + border-radius: 0; + border: 0; + padding: 0 0 0 0; + text-align: center; + height: 20px; +} +.utilichart .sortcol.cur { + font-weight: bold; + background: #DDD; +} +.utilichart .sortcol:hover { + background: #EEE; +} +.utilichart .numsortcol { + width: 80px; +} +.utilichart .pnamesortcol { + width: 127px; +} +.utilichart .typesortcol { + width: 70px; +} +.utilichart .abilitysortcol { + width: 172px; +} +.utilichart .statsortcol { + width: 24px; + text-align: right; +}