increased width, updated time, thestaircase

Author: sklett-src

app/assets/javascripts/angular/directives/matches.js

@@ -49,7 +49,27 @@ gg.directive('matches', ['Match', function(Match) {
 
       // sets location to show the given match very bluntly
       $scope.go = function(id) {
-        window.location = '/matches/' + id;
+       // window.location = '/matches/' + id;
+      }
+
+      $scope.go_middleclick = function(event, id) {
+	
+//	var is_chrome = navigator.userAgent.toLowerCase().indexOf('chrome') > -1;
+	
+switch(event.which) {
+		case 1:
+			 window.location = '/matches/' + id;
+		break;
+		case 2:
+//			window.name = 'testsk'
+//var activeTab = $("[href=" + location.hash + "]");
+//localStorage.setItem("lastTab", $(this).attr('href'));
+			window.open('/matches/' + id, '_blank');
+//			window.open('', 'testsk').focus();
+break;
+		default:
+			window.open('/matches/' + id,'_blank');	
+	}
       }
 
       // bind our identity bind to urlFilter (uhhh)

app/assets/javascripts/angular/templates/matches/index.jst.ejs

@@ -49,15 +49,14 @@
         <th class="league">avg league<b class="arrow"></b></th>
         <th class="date">played<b class="arrow"></b></th>
       </tr>
-      <tr ng-repeat="match in matches" ng-click="go(match.id)">
-        <td class="num">
+      <tr ng-repeat="match in matches" ng-click="go(match.id)" ng-mousedown="go_middleclick($event, match.id)">
+       <td class="num">
           {{ matches.total - (((matches.page-1) * matches.limit) + $index ) }}
           <div class="ggtipper2 icon icon-text-16" data-gravity='nw' title="{{match.my_matchnote.note}}" ng-show="match.hasMatchNote()"></div>
         </td>
         <td class="map nowrap"><a target="_self" href="/matches/{{ match.id }}">{{ match.map_name }}</a></td>
         <td class="type">{{ match.game_type }}</td>
-        <td class="matchup">
-          {{ match.matchup(identity.id) }}
+        <td class="matchup"><a target="_self" href="/matches/{{ match.id }}">{{ match.matchup(identity.id) }}
         </td>
         <td class="team1" ng-bind-html="match.team_names(1).join(', ')"></td>
         <td class="team2" ng-bind-html="match.team_names(2).join(', ')"></td>
@@ -85,3 +84,4 @@
   </div>
 
 </div>
+

app/assets/javascripts/jquery/jquery.timeago.js

@@ -15,6 +15,8 @@
  */
 (function($) {
   $.timeago = function(timestamp) {
+//	console.log('timestamp')
+//	console.log(timestamp)
     if (timestamp instanceof Date) {
       return inWords(timestamp);
     } else if (typeof timestamp === "string") {
@@ -68,7 +70,7 @@
       }
 
       var seconds = Math.abs(distanceMillis) / 1000;
-      var minutes = seconds / 60;
+      var minutes = seconds / 60 - 60;
       var hours = minutes / 60;
       var days = hours / 24;
       var years = days / 365;
@@ -100,10 +102,17 @@
 
       function substitute(stringOrFunction, number) {
         var string = $.isFunction(stringOrFunction) ? stringOrFunction(number, distanceMillis) : stringOrFunction;
-        var value = ($l.numbers && $l.numbers[number]) || number;
+//console.log(stringOrFunction)
+//console.log(number)        
+var value = ($l.numbers && $l.numbers[number]) || number;
         return string.replace(/%d/i, value);
       }
 
+
+	//var skminutes =  substitute($l.minutes, Math.round(minutes))
+	//console.log(minutes)
+	//console.log(skminutes)
+
       var words = seconds < 45 && substitute($l.seconds, Math.round(seconds)) ||
         seconds < 90 && substitute($l.minute, 1) ||
         minutes < 45 && substitute($l.minutes, Math.round(minutes)) ||

app/assets/stylesheets/controllers/matches.css.scss

@@ -90,7 +90,7 @@
     clear: both;
 
     .canvas {
-      width: 1024px;
+      max-width: 1600px;
       height: 170px;
     }
   }

app/assets/stylesheets/controllers/tour.css.scss

@@ -1,7 +1,7 @@
 #tour {
   .content {
     @include center;
-    width: 1044px;
+    max-width: 1600px;
 
     min-height: 600px;
 //    max-width: 900px;

app/assets/stylesheets/directives/army.css.scss

@@ -213,7 +213,7 @@
       // because we never want it transition inwards to leave the background
       // exposed ..
       &:nth-last-child(1) {
-        width: 1024px !important;
+        max-width: 1600px !important;
       }
     }
 
@@ -332,4 +332,4 @@
     background: white;
     @include border-radius(2px);
   }
-}
+}

app/assets/stylesheets/layout.css.scss

@@ -3,7 +3,7 @@
 
 // A bunch of (temporary?) generic mixins
 @mixin center {
-  width: $gg-width;
+  max-width: $gg-width;
   margin: 0px auto;
 }
 
@@ -132,7 +132,7 @@ header {
     position: relative;
 
     padding: 0px 0px;
-    width: $gg-width - 0px * 2;
+    max-width: $gg-width - 0px * 2;
 
     // Notes about the "centering" going on: the line-height and va:middle
     // constructs in header are very ..uncompromising currently. This whole

app/views/home/staircase.html.erb

@@ -6,6 +6,7 @@
 <div id="tour">
   <div class="content">
 <div class="boxy">
-<p>To see charts and league badges for your Saturation Speed, you can use the training methodology called TheStaircase, which is integrated into GGGReplays.  You can read more about TheStaircase <a href="http://www.teamliquid.net/forum/viewmessage.php?topic_id=374400">here</a>.  To turn on TheStaircase view, click on the menu in the upper-right hand corner of the window:</p>
+<p>To see charts and league badges for your Saturation Speed, you can use the training methodology called TheStaircase, which is integrated into GGGReplays. You can read more about TheStaircase <a target='_blank' href="https://docs.google.com/spreadsheets/d/1ZVfn8u6zYFWcuq6xPb6svABp_Q0hbyvrTrlx9tzr3Vk">here</a>.  To turn on TheStaircase view, click on the menu in the upper-right hand corner of the window.</p>
+<p>More resources about TheStaircase: <a target='_blank' href="http://liquipedia.net/starcraft2/TheStaircase">On Liquipedia</a>.</p>
   </div>
 </div>

app/views/home/tour.html.erb

@@ -3,6 +3,27 @@
   <meta name="Description" content="Track your Starcraft 2 stats so you can get better faster. Spending Skill, race-specific macro, army composition and more.">
 <% end %>
 
+<style>
+        body{
+                margin:1em auto;
+                //max-width:40em;
+                padding:0.62em;
+        }
+        article {
+                font:1.05em/1.47 sans-serif;
+        }
+
+        h15,h25,h35 {
+                line-height:1.2;
+        }
+        @media print2{
+                body{
+                        max-width:none
+                }
+        }
+</style>
+
+
 <div id="tour">
   <div class="content">
 <h1>Play, Share, Learn and Win with the help of Science! <a target="_blank" href="http://reddit.com/r/gggreplays">www.reddit.com/r/gggreplays</a></h1>

app/views/layouts/application.html.erb

@@ -162,9 +162,10 @@ _\%_____/\%_____/\%_____/\%_/   /\%___fx/\%_____/\__/   /\%_____/\__/   /.com_
             </ul>
           </li>
           <!--li><a class="menu-item" target="_self" href="/tour"><span>tour</span></a></li-->
-          <li><a class="menu-item" target="_self" href="/staircase"><span>staircase</span></a></li>
+          <li><a class="menu-item" target="_self" href="/staircase"><span>thestaircase</span></a></li>
           <li><a class="menu-item" target="_self" href="/feedback"><span>feedback</span></a></li>
           <li><a class="menu-item" target="_self" href="/support"><span>support GGG</span></a></li>
+          <li><a class="menu-item" target="_blank" href="https://reddit.com/r/gggreplays"><span>reddit</span></a></li>
         </ul>
       </div>