spee.ch/views/partials/trendingAssets.handlebars
2017-08-24 16:09:04 -07:00

39 lines
1 KiB
Handlebars

<script src="/vendors/masonry/masonry.pkgd.min.js"></script>
<div class="full">
<h2>Trending</h2>
<p><i>The 25 most popular assets on spee.ch</i></p>
<div class="grid" data-masonry='{ "itemSelector": ".grid-item" }'>
{{#each trendingAssets}}
<div class="all-claims-item">
<a href="/{{this.claimId}}/{{this.name}}">
{{#ifConditional this.fileType '===' 'video/mp4'}}
<img class="all-claims-asset" src="/assets/img/content-freedom-large.png"/>
{{else}}
<img class="all-claims-asset" src="/{{this.claimId}}/{{this.name}}.ext" />
{{/ifConditional}}
</a>
<div class="all-claims-details">
<ul style="list-style-type:none">
<li><bold>{{this.name}}</bold></li>
<li><i>Claim Id: {{this.claimId}}</i></li>
<li><strong>{{this.title}}</strong></li>
</ul>
</div>
</div>
{{/each}}
</div>
</div>
<script>
var elem = document.querySelector('.grid');
var msnry = new Masonry( elem, {
itemSelector: '.grid-item'
});
function resetTrendingLayout() {
msnry.layout();
}
</script>