gistfile1.erb

<!-- WCS main page -->

...
...
<!-- GGTracker stuff starts here -->
<div id="match" ng-controller="MatchController">
 <div class="djcloak match-wrapper top">
  <div class="video-wrapper">
    <div id="ytplayer"></div>
  </div>

  <%= render('armychart') %>
  <%= render('armydetails') %>
  <%= javascript_include_tag "ytglue" %>
<!-- GGTracker stuff ends here -->
...
...


<!-- _armychart -->
 <span class="title lefty" style="font-size:12px">ARMY STRENGTH, MINERALS + GAS</span>
  <armychart id="armychart" data-width="897px" data-height="150" data-data="armies_and_idents" data-frame="current_frame" data-initial-frame="0" data-chart="armychart" data-armies="armies" data-match="match" data-timebarwidth="3" data-current-time="current_time" style="background: #dbdee3">
  </armychart>
<!-- ----------- -->


<!-- _armydetails -->

  <span class="title lefty armycomp" style="font-size:12px">ARMY COMPOSITION AND RESOURCE VALUE</span>
  <div class="teams">
    <% for team in [1,2] do %>

      <div class="team team<%= team %>">
        <div>
          <army data-entity="match.entity_team(<%= team %>)" data-frame="current_frame" data-match="match"></army>
        </div>

        <div class="livestats">
          <span>INCOME m: {{ match.teams[<%= team %>].elem('MineralsCollectionRate', current_frame) }} g: {{ match.teams[<%= team %>].elem('VespeneCollectionRate', current_frame) }} w: {{ match.teams[<%= team %>].elem('WorkersActiveCount', current_frame) }}</span><br>
          <span>TOTAL RESOURCES LOST: {{ match.teams[<%= team %>].elem('Lost', current_frame) }} </span>
        </div>
      </div>

    <% end %>
    <div class="ggclear"></div>
  </div> <!-- teams -->

<!-- ----------- -->






<!-- army directive's template -->
<div class="army grp-entity{{ entity.index }}">
  <div class="entity">
    <div class="name"><span class="flag" style="background-color: #{{ entity.color }};"></span>{{ entity.identity.name }}</div>

    <ul class="stats">
      <li class="minerals" title="Mineral value of army">
        <div class="icon sc2-mineral-16"></div><span class="value">{{ army.minerals }}</span>
      </li>
      <li class="gas" title="Gas value of army">
        <div class="icon sc2-gas-16"></div><span class="value">{{ army.gas }}</span>
      </li>
      <li class="supply" title="Supply used by army">
        <div class="icon sc2-supply-16"></div><span class="value">{{ army.supply }}</span>
      </li>
    </ul>

    <div class="ggclear"></div>
  </div>

  <div class="units" style="border-color: #{{ entity.color }};">
    <div class="unit" ng-class="{inactive: count == 0}" ng-repeat="(unit, count) in army.units">
      <div class="unit-mpq-32 unit-mpq-32-{{ unit }}"></div> 
      <span class="count">{{ count }}</span>
    </div>
  </div>
</div>

<!-- -------------  -->