Handle commentReply subs at the template level #6, show loader when s…

…ubscriptions are loading #3

client/views/comments/replies.html

@@ -1,15 +1,19 @@
 <template name="replies">
   <div class="comment-container {{side}} {{#if side}}{{side}}{{color}}{{/if}}" id="{{id}}-replies">
-    <div class="comment-replies clearfix">
-      {{> newComment}}
-    </div>
+    {{#if Template.subscriptionsReady}}
+      <div class="comment-replies clearfix">
+        {{> newComment}}
+      </div>
 
-    {{#if hasReplies}}
-      {{#each replies}}
-        {{> commentRow}}
-      {{/each}}
+      {{#if hasReplies}}
+        {{#each replies}}
+          {{> commentRow}}
+        {{/each}}
+      {{else}}
+        <div class="muted">{{_ "no_more"}}</div>
+      {{/if}}
     {{else}}
-      <div class="muted">{{_ "no_more"}}</div>
+      <div class="loader">{{_ "loading"}}</div>
     {{/if}}
   </div>
 </template>

client/views/comments/replies.js

@@ -1,4 +1,8 @@
-Template.replies.rendered = function () {
+Template.replies.onCreated(function () {
+  this.subscribe('commentReplies', this.data.id);
+});
+
+Template.replies.onRendered(function () {
   var container = this.firstNode;
   container._uihooks = {
     insertElement: function (node, next) {
@@ -14,11 +18,11 @@ Template.replies.rendered = function () {
       }
     }
   }
-};
+});
 
 Template.replies.helpers({
   hasReplies: function () {
-    var comment = Comments.findOne(this.id);
+    var comment = Comments.findOne(this.id, { fields: { 'replies': 1 } });
     return comment && comment.replies.length;
   },
   replies: function () {