manually adding logos for now

.gitignore

@@ -2,4 +2,5 @@ app/settings.js
 node_modules/
 build/
 *.log
-.env
+.env
+.DS_Store

gulpfile.js

@@ -26,6 +26,9 @@ gulp.task('web-app', function(cb) {
 		gulp.src('./web/appDependencies/lib/**/*')
 			.pipe(gulp.dest('./build/lib')),
 
+		gulp.src('./web/appDependencies/img/logo*')
+			.pipe(gulp.dest('./build/img')),
+
 		gulp.src('./web/index.*')
 			.pipe(gulp.dest('./build'))
 	).on('end', cb);

optimlol_api/controllers/summonerController.js

@@ -139,18 +139,24 @@ module.exports = function() {
 				summoner.recentHistory = null;
 
 				if (championStats) {
+					var allIndex = null;
 					championStats.champions.forEach(function(championStat, index) {
 						// we get data back with string id's le sigh....
 						var championIdString = championStat.id.toString();
 						if (championIdString !== "0") {
 							championStat.championKey = champions.data.data[championIdString].key.toLowerCase();
 							championStat.championName = champions.data.data[championIdString].name;
 						} else {
-							championStats.allChampIndex = index;
+							allIndex = index;
 							championStat.championName = "All";
+							summoner.totalStats = championStat;
 						}
 					});
 
+					if (allIndex) {
+						championStats.champions.splice(allIndex, 1);
+					}
+
 					summoner.championStats = championStats.champions;
 				}
 

web/app/common/sort.js

@@ -1,7 +1,6 @@
 define([], function() {
 	var _sort = function(arrayToSort, sortingKey, direction) {
 		var _comparator = function(a, b) {
-			console.log(a, b);
 			if (a[sortingKey] < b[sortingKey]) {
 				if (direction === "ascending") {
 					return -1;

web/app/viewmodels/optimlol.js

@@ -32,10 +32,14 @@
 					.then(function(result) {
 						if (result.id) {
 							summoner.displayName = result.name;
-							summoner.championStats = result.championStats;
-							if (summoner.championStats && summoner.championStats.length) {
-								sorter.sort(summoner.championStats, "performance", "descending");
+							if (result.recentHistory && result.recentHistory.champions) {
+								sorter.sort(result.recentHistory.champions, "count", "descending");
+							}
+							summoner.recentHistory = result.recentHistory;
+							if (result.championStats && result.championStats.length) {
+								sorter.sort(result.championStats, "performance", "descending");
 							}
+							summoner.championStats = result.championStats;
 							summoner.totalStats = result.totalStats;
 							summoner.summonerId(result.id);
 							summoner.status(STATUS.VALID);

web/app/views/optimlol.html

@@ -29,7 +29,17 @@ <h2>Welcome to OptimLoL</h2>
             </thead>
             <tbody class="summoner-info" data-bind="foreach: validSummoners">
                 <td class="name" data-bind="text: displayName"></td>
-                <td class="recently-played">N/A</td>
+                <td class="recently-played">
+                    <ul class="champion-list" data-bind="foreach: recentHistory.champions">
+                        <!-- ko if: $index() < 5 -->
+                        <li class="champion-data">
+                            <div data-bind="css: 'icon-champion-large-' + championKey"/>
+                            <div data-bind="text: 'Games: ' + count"/>
+                            <div><span class="wins" data-bind="text: wins"/> / <span class="losses" data-bind="text: losses"/></div>
+                        </li>
+                        <!-- /ko -->
+                    </ul>
+                </td>
                 <td class="best-performance">
                     <ul class="champion-list" data-bind="foreach: championStats">
                         <!-- ko if: $index() < 5 -->
@@ -42,10 +52,10 @@ <h2>Welcome to OptimLoL</h2>
                     </ul>
                 </td>
                 <td class="img-link">
-                    <a data-bind="attr: { href: lolKingUrl }"><img class="icon" src="/img/lolking.png"/></a>
+                    <a data-bind="attr: { href: lolKingUrl }"><img class="icon" src="/img/logo_lolking.png"/></a>
                 </td>
                 <td class="img-link">
-                    <a data-bind="attr: { href: naOpGgUrl }"><img class="icon" src="/img/naopgg.png"/></a>
+                    <a data-bind="attr: { href: naOpGgUrl }"><img class="icon" src="/img/logo_opgg.png"/></a>
                 </td>
             </tbody>
         </table>

web/appDependencies/sass/_optimlol.scss

@@ -42,9 +42,7 @@
                 .name {
                     width: 20%;
                 }
-                .recently-played {
-                    width: 35%;
-                }
+                .recently-played,
                 .best-performance {
                     width: 35%;