Skip to content

Instantly share code, notes, and snippets.

@sirwan

sirwan/gist:5884227

Created June 28, 2013 12:07
Download ZIP

Revisions

  1. sirwan created this gist Jun 28, 2013.
    61 changes: 61 additions & 0 deletions gistfile1.js
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,61 @@
    <script type="text/template" id="myuploads-template">
    <h3>cached snaps</h3>
    <ul class="thumbnails">
    <% _.each(snapshots, function(snapshot){ %>
    <li>

    <div class="thumbnail">
    <a href="/<%=snapshot.get('username')%>/<%=snapshot.get('slug_title')%>">
    <img id="snapshot-thumb" src="<%=snapshot.get('thumbnail_url')%>" alt="<%=snapshot.get('title')%>" width="<%=snapshot.get('thumbnail_width')%>" height="<%=snapshot.get('thumbnail_height')%>">
    </a>

    <span class="caption">
    <%=snapshot.get('title')%><br/>
    </span>

    <ul class="stats">
    <li><%=snapshot.get('count_views')%> Views</li>
    <li><%=snapshot.get('count_comments')%> Comments</li>
    <li><%=snapshot.get('count_likes')%> Likes</li>
    </ul>

    <div class="author">
    <a href="/sirwan"><b><%=snapshot.get('username')%></b></a> posted <b><time class="timeago" datetime="<%=snapshot.get('created_at')%>"><%=snapshot.get('created_at')%></time></b>
    </div>

    <div class="conversation">
    <%//LOOP THE BELOW COMMENTS.%>
    <%_.each(snapshot.comments, function(comment){%>

    <div class="comment"><a class="commenter" href="/<%=comment.username%>"><b><%=comment.get('username')%></b></a> <%=comment.comment%></div>
    <%});%>
    </div>

    </div>

    </li>
    <% }); %>
    </ul>
    </script>


    <script>
    var MyUploadsView = Backbone.View.extend({
    el: '.main',
    render: function(){
    var that = this;
    var snapshots = new Snapshots();
    snapshots.fetch({
    success: function(snapshots){
    var template = _.template($('#myuploads-template').html(), {snapshots: snapshots.models});
    that.$el.html(template);
    that.$el.find(".timeago").timeago();
    var container = document.querySelector('.thumbnails');
    var imgLoad = imagesLoaded( container, function(){
    pckry = new Packery(container);
    });
    }
    });
    }
    });
    </script>