View comments for draft text

app/assets/javascripts/application.js

@@ -77,7 +77,8 @@ var initialize_modules = function() {
   App.MarkdownEditor.initialize();
   App.LegislationAllegations.initialize();
   App.Legislation.initialize();
-  App.LegislationAnnotatable.initialize();
+  if ( $(".legislation-annotatable").length )
+    App.LegislationAnnotatable.initialize();
 };
 
 $(function(){

app/assets/javascripts/legislation_allegations.js.coffee

@@ -3,6 +3,9 @@ App.LegislationAllegations =
   toggle_comments: ->
     $('.draft-allegation').toggleClass('comments-on');
 
+  show_comments: ->
+    $('.draft-allegation').addClass('comments-on');
+
   initialize: ->
     $('.js-toggle-allegations .draft-panel').on
         click: (e) ->

app/assets/javascripts/legislation_annotatable.js.coffee

@@ -1,7 +1,35 @@
 _t = (key) -> new Gettext().gettext(key)
 
 App.LegislationAnnotatable =
+
+  renderAnnotationComments: (event) ->
+    $('.comment-box').offset(top: event.offset)
+    $.ajax
+      method: "GET"
+      url: event.annotation_url + "/annotations/" + event.annotation_id + "/comments"
+      dataType: 'script'
+
+  viewerExtension: (viewer) ->
+    viewer._onHighlightMouseover = (event) ->
+      App.LegislationAllegations.show_comments()
+      $.event.trigger
+        type: "renderLegislationAnnotation"
+        annotation_id: $(event.target).data("annotation-id")
+        annotation_url: $(event.target).closest(".legislation-annotatable").data("legislation-annotatable-base-url")
+        offset: $(event.target).offset()["top"]
+
+
+
+  scrollToAnchor: ->
+    annotationsLoaded: (annotations) ->
+      anchor = $(location).attr('hash')
+      ann_id = anchor.split("-")[-1..]
+      el = $("span[data-annotation-id='" + ann_id + "']")
+      $('html,body').animate({scrollTop: el.offset().top})
+
   initialize: ->
+    $(document).on("renderLegislationAnnotation", App.LegislationAnnotatable.renderAnnotationComments)
+
     current_user_id = $('html').data('current-user-id')
     if current_user_id == ""
       annotator.ui.editor.Editor.template = [
@@ -27,7 +55,8 @@ App.LegislationAnnotatable =
             ann["legislation_draft_version_id"] = ann_id
             ann.permissions = ann.permissions || {}
             ann.permissions.admin = []
-        .include(annotator.ui.main, { element: this })
+        .include(annotator.ui.main, { element: this, viewerExtensions: [App.LegislationAnnotatable.viewerExtension] })
+        .include(App.LegislationAnnotatable.scrollToAnchor)
         .include(annotator.storage.http, { prefix: base_url, urls: { search: "/annotations/search" } })
 
       app.start().then ->

app/controllers/legislation/annotations_controller.rb

@@ -32,6 +32,10 @@ class Legislation::AnnotationsController < ApplicationController
     render json: annotations_hash.to_json
   end
 
+  def comments
+    @annotation = Legislation::Annotation.find(params[:annotation_id])
+  end
+
   private
 
     def annotation_params

app/models/abilities/everyone.rb

@@ -15,7 +15,7 @@ module Abilities
       can [:read, :changes, :go_to_version], Legislation::DraftVersion
       can [:read], Legislation::Question
       can [:create], Legislation::Answer
-      can [:search, :read, :create], Legislation::Annotation
+      can [:search, :comments, :read, :create], Legislation::Annotation
     end
   end
 end

app/views/legislation/annotations/_comments_for.html.erb

@@ -0,0 +1,42 @@
+<div class="comment-header">
+  <span class="icon-comment" aria-hidden="true"></span>
+  <div class="comment-number"><%= t('legislation.annotations.comments.comments_count', count: annotation.comments_count) %></div>
+  <%= link_to legislation_process_draft_version_annotation_path(annotation.draft_version.process, annotation.draft_version, annotation) do %>
+    <span class="icon-expand" aria-hidden="true"></span>
+  <% end %>
+</div>
+<div class="comments-wrapper">
+  <% annotation.comments.each do |comment| %>
+  <div class="comment">
+    <div class="comment-text">
+      <p><%= comment.body %></p>
+    </div>
+    <div class="comment-meta">
+      <div class="comment-more-info">
+        <div class="comment-expand">
+          <%= link_to legislation_process_draft_version_annotation_path(annotation.draft_version.process, annotation.draft_version, annotation) do %>
+            <%= t('legislation.annotations.comments.see_complete') %>
+          <% end %>
+        </div>
+        <div class="comment-replies">
+          <%= link_to legislation_process_draft_version_annotation_path(annotation.draft_version.process, annotation.draft_version, annotation) do %>
+            <%= t('legislation.annotations.comments.replies_count', count: comment.children.size) %>
+          <% end %>
+        </div>
+      </div>
+      <div class="comment-votes">
+        <div id="<%= dom_id(comment) %>_votes" class="comment-votes float-right">
+          <%= render 'comments/votes', comment: comment %>
+        </div>
+      </div>
+    </div>
+  </div>
+  <% end %>
+
+</div>
+<div class="comment-footer">
+  <%= link_to legislation_process_draft_version_annotation_path(annotation.draft_version.process, annotation.draft_version, annotation), class: "button strong" do %>
+    <%= t('legislation.annotations.comments.see_all') %>
+  <% end %>
+  <a class="button strong publish-comment" title="Publicar comentario" href="#">Publicar comentario</a>
+</div>

app/views/legislation/annotations/comments.js.erb

@@ -0,0 +1,2 @@
+$("#comments-box").html("<%= j render('comments_for', annotation: @annotation) %>");
+

app/views/legislation/draft_versions/show.html.erb

@@ -64,6 +64,13 @@
           <span class="panel-title"><%= t('.text_comments') %></span>
         </div>
 
+        <div class="comment-box" id="comments-box">
+          <div class="comment-header">
+            <span class="icon-comment" aria-hidden="true"></span>
+            <div class="comment-number"><%= t('.loading_comments') %></div>
+          </div>
+        </div>
+
       </div>
     </div>
   </div>