|
|
@@ -0,0 +1,169 @@ |
|
|
<div class="event-progress"> |
|
|
<div class="event-progress-bar progress-bar active" style="width: {{totals.overall.percentage}}%;" ng-class="{'progress-bar-striped': totals.overall.selected === totals.overall.total}"></div> |
|
|
<span>{{totals.overall.selected}} / {{totals.overall.total}} Unlocks</span> |
|
|
</div> |
|
|
<div class="col-md-8 col-padding"> |
|
|
<legendary-skins></legendary-skins> |
|
|
<div id="voicelines" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Voice Lines <small class="itemTotal">{{totals['voicelines'].selected}}/{{totals['voicelines'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-3"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.voicelines track by $index" |
|
|
ng-init="type = 'voicelines'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="300" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4 ng-if="::item.heroName">{{::item.heroName}}</h4> |
|
|
<h3 class="{{::item.quality}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div id="icons" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Player Icons <small class="itemTotal">{{totals['icons'].selected}}/{{totals['icons'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-4"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.icons track by $index" |
|
|
ng-init="type = 'icons'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4>{{::item.heroName || 'All'}}</h4> |
|
|
<h3 class="{{::item.quality || 'common'}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<div class="col-md-4 col-padding"> |
|
|
<div id="skins" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Skins <small class="itemTotal">{{totals['skins'].selected}}/{{totals['skins'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-2"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.skins track by $index" |
|
|
ng-init="type = 'skins'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4 ng-if="::item.heroName">{{::item.heroName}}</h4> |
|
|
<h3 class="{{::item.quality}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div id="victoryposes" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Victory Poses <small class="itemTotal">{{totals['poses'].selected}}/{{totals['poses'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-2"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.poses track by $index" |
|
|
ng-init="type = 'poses'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4 ng-if="::item.heroName">{{::item.heroName}}</h4> |
|
|
<h3 class="{{::item.quality}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div id="emotes" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Emotes <small class="itemTotal">{{totals['emotes'].selected}}/{{totals['emotes'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-2"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.emotes track by $index" |
|
|
ng-init="type = 'emotes'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4 ng-if="::item.heroName">{{::item.heroName}}</h4> |
|
|
<h3 class="{{::item.quality}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div id="intros" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Highlight Intros <small class="itemTotal">{{totals['intros'].selected}}/{{totals['intros'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-2"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.intros track by $index" |
|
|
ng-init="type = 'intros'" |
|
|
class="item" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4 ng-if="::item.heroName">{{::item.heroName}}</h4> |
|
|
<h3 class="{{::item.quality}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div id="sprays" class="section"> |
|
|
<div class="section-header"> |
|
|
<h2>Sprays <small class="itemTotal">{{totals['sprays'].selected}}/{{totals['sprays'].total}}</small></h2> |
|
|
</div> |
|
|
<div class="items flex-2"> |
|
|
<div |
|
|
ng-repeat="item in ::data.items.sprays track by $index" |
|
|
ng-init="type = 'sprays'" |
|
|
class="item" |
|
|
achievement="{{::item.achievement}}" |
|
|
uib-tooltip-template="'imagePreviewTemplate.html'" |
|
|
tooltip-popup-delay="275" |
|
|
tooltip-class="img-preview" |
|
|
tooltip-enable="{{::canPlayType(type)}}" |
|
|
tooltip-placement="bottom auto"> |
|
|
<input type="checkbox" id="{{type + item.id + $index}}" ng-model="checked[item.hero][type][item.id]" ng-change="onSelect(item, type)"> |
|
|
<label for="{{type + item.id + $index}}"> |
|
|
<h4>{{::item.heroName || 'All'}}</h4> |
|
|
<h3 class="{{::item.quality || 'common'}}">{{::item.name}} <small class="color-cost">{{ ::item | itemPrice:type:true }}</small></h3> |
|
|
</label> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
<script type="text/ng-template" id="imagePreviewTemplate.html"> |
|
|
<tooltip-image-preview></tooltip-image-preview> |
|
|
</script> |