Fix topic summary citations (viewing and editing)

Author: ptgolden

editorsnotes/admin_custom/forms/topics.py

@@ -12,7 +12,6 @@ class TopicForm(models.ModelForm):
     class Media:
         js = (
             "function/admin-bootstrap-topic.js",
-            "function/admin-bootstrap-note-sections.js",
         )
     class Meta:
         model = Topic
@@ -28,7 +27,10 @@ class CitationForm(models.ModelForm):
     class Meta:
         model = Citation
         fields = ('document', 'notes', 'ordering',)
-        widgets = {'document': forms.widgets.HiddenInput()}
+        widgets = {
+            'document': forms.widgets.HiddenInput(),
+            'ordering': forms.widgets.HiddenInput()
+        }
 
 CitationFormset = generic_inlineformset_factory(
     Citation, form=CitationForm, extra=1)

editorsnotes/admin_custom/static/function/admin-bootstrap-base.js

@@ -208,14 +208,14 @@ $(document).ready(function () {
     .autocomplete({
       source: function (request, response) {
         $.ajax({
-          url: '/api/topics/',
+          url: '/api' + window.location.pathname.match(/^\/projects\/[^/]+/)[0] + '/topics/',
           dataType: 'json',
           data: {'q': request.term},
           beforeSend: function () {
             $('#related-topics-loading').css('display', 'inline-block');
           },
           success: function (data) {
-            response($.map(data, function (item, index) {
+            response($.map(data.results, function (item, index) {
               return { id: item.id, label: item.preferred_name, uri: item.uri };
             }));
           },

editorsnotes/admin_custom/static/function/admin-bootstrap-topic.js

@@ -1,8 +1,94 @@
+function bindCitation($citation) {
+  var $input = $citation.find('.citation-document input')
+    , prefix = 'id_' + $citation.prop('id')
+    , autocompleteopts
+    , editor = new wysihtml5.Editor(prefix + '-notes', {
+      toolbar: $citation.prop('id') + '-toolbar',
+      parserRules: wysihtml5ParserRules,
+      useLineBreaks: false,
+      stylesheets: ['/static/function/wysihtml5/stylesheet.css']
+    });
+
+  $('#' + prefix + '-toolbar').show();
+
+  if ($input.length) {
+    autocompleteopts= $.extend($('body').data('baseAutocompleteOptions'), {
+      select: function (e, ui) {
+        if (!ui.item) return;
+        $citation.find('.citation-document').addClass('document-selected');
+        $input.replaceWith(ui.item.value);
+        $citation.find('#' + prefix + '-document').val(ui.item.id);
+      }
+    });
+
+    $input.autocomplete(autocompleteopts)
+      .data('ui-autocomplete')._renderItem = function (ul, item) {
+        return $('<li>')
+          .data('ui-autocomplete-item', item)
+          .append('<a>' + item.value + '</a>')
+          .appendTo(ul)
+      }
+  }
+
+
+
+}
+
+function citationFormset($el) {
+  var lastForm;
+
+  this.$el = $el;
+  this.$items = $el.find('#citation-items');
+  this.managementForm = $el.find('#id_citation-TOTAL_FORMS');
+  this.lastForm = this.$items.children().last();
+  this.blankForm = this.lastForm.clone();
+  this.counter = parseInt(this.managementForm.val(), 10);
+
+  this.$items.children().each(function (idx, el) {
+    bindCitation($(el));
+  });
+
+  return this;
+}
+
+citationFormset.prototype.addCitation = function () {
+  var that = this
+    , newForm
+    , searchstr
+
+  if (this.lastForm.is(':hidden')) {
+    this.lastForm.removeClass('hide');
+    return
+  }
+
+  newForm = this.blankForm.clone().removeClass('hide');
+  searchstr = 'citation-' + (this.counter - 1) + '-'
+
+  newForm.prop('id', 'citation-' + that.counter);
+  newForm.find('[name^="' + searchstr + '"], [id^="' + searchstr + '"]')
+    .each(function (idx, el) {
+      if (el.name) el.name = el.name.replace('-' + (that.counter - 1) + '-', '-' + that.counter + '-');
+      if (el.id) el.id = el.id.replace('-' + (that.counter - 1) + '-', '-' + that.counter + '-');
+    });
+
+  newForm.appendTo(that.$items);
+  bindCitation(newForm);
+
+  this.counter += 1;
+  this.managementForm.val(that.counter);
+}
+
+
 $(document).ready(function() {
   var editor = new wysihtml5.Editor('id_summary', {
     toolbar: 'summary-toolbar',
     parserRules: wysihtml5ParserRules,
     useLineBreaks: false,
     stylesheets: ['/static/function/wysihtml5/stylesheet.css']
   });
+
+  var formset = new citationFormset($('#citations-formset'));
+
+  $('#add-citation').on('click', formset.addCitation.bind(formset));
+
 });

editorsnotes/admin_custom/static/style/bootstrap-admin.css

@@ -76,6 +76,29 @@
         display: none;
     }
 
+    /* Hide delete field for citations */
+    .citation input[id$="-DELETE"] {
+        display: none;
+    }
+
+    /* Topic citation spacing (DELETE ME GOD DELETE ME WHEN YOU CAN) */
+    .citation-document i {
+        font-size: 24px;
+        position: relative;
+        top: 4px;
+        margin-right: 4px;
+    }
+    .citation-document input {
+        width: 750px;
+    }
+
+    .citation-document.document-selected * {
+        display: inline-block;
+    }
+    #citations-formset .citation {
+        margin: 1em 0 2em;
+    }
+
 
     /* Transcript editor should be large */
     fieldset[name="transcript_content"] textarea {

editorsnotes/admin_custom/templates/includes/citation_formset.html

@@ -8,15 +8,18 @@
     {% for citation in citations_formset %}
     {% with citation.instance as c %}
 
-    <div class="citation citation-edit {% if forloop.last %}hide{% endif %}" id="{{ citation.prefix }}">
+    <div class="citation citation-edit {% if not c %}hide{% endif %}" id="{{ citation.prefix }}">
 
       <div class="citation-document">
         <i class="icon-file"></i>
-        {% if c.document %} {{ c.document.description|as_text }} {% endif %}
+        {% if c.document %}
+        {{ c.document.description|as_text }}
+        {% else %}
+        <input data-target-model="documents" data-project-slug="{{ project.slug }}" />
+        {% endif %}
       </div>
 
-      <div class="citation-notes">{% if c.has_notes %}{{ c.notes|as_html }}{% endif %}</div>
-
+      {% include "includes/wysihtml5_full_toolbar.html" with toolbar_id=citation.prefix|add:"-toolbar" %}
       <div class="citation-fields">
         {% for field in citation %} {{ field }} {% endfor %}
       </div>
@@ -28,7 +31,6 @@
 
   </div>
 
-  {% include "includes/wysihtml5_full_toolbar.html" with toolbar_id="citation-toolbar" %}
   {% include "includes/add_document_modal.html" %}
 
 </div>

editorsnotes/admin_custom/templates/topic_admin.html

@@ -40,12 +40,14 @@ <h3>{% if form.instance.id %}Change {% else %}Add {% endif %}topic</h3>
     </fieldset>
     {% endwith %}
 
+    {% comment %}
     {% with formset=formsets.topicassignment %}
     <fieldset name="related_topics_fields" class="related-topics">
       <legend>Related topics</legend>
       {% include "includes/bootstrap_formset.html" %}
     </fieldset>
     {% endwith %}
+    {% endcomment %}
 
     <fieldset name="article_fields">
       <legend>Article</legend>
@@ -56,14 +58,16 @@ <h3>{% if form.instance.id %}Change {% else %}Add {% endif %}topic</h3>
       </div>
 
       <div class="article-citations" style="margin: 1em .5em;">
-        <h4>Citations</h4>
+        <legend>Citations</legend>
         {% include "includes/citation_formset.html" with citations_formset=formsets.citation %}
-        <a href="#" id="add-citation">Add citation</a>
+        <button type="button" class="btn btn-primary" id="add-citation">Add citation</a>
       </div>
 
   </fieldset>
 
-  <button type="submit" class="btn btn-primary">Save</button>
+  <hr />
+
+  <button type="submit" class="btn">Save</button>
 
   </form>
 {% endblock %}

editorsnotes/admin_custom/tests.py

@@ -9,6 +9,11 @@
 
 class TopicAdminTestCase(WebTest):
     fixtures = ['projects.json']
+    def create_test_topic(self):
+        project = main_models.Project.objects.get(slug='emma');
+        node, topic = main_models.Topic.objects.create_along_with_node(
+            u'Emma Goldman', project, project.members.get())
+        return topic
     def test_create_topic(self):
         "A user should be able to create a topic with a unique name."
         topic_name = u'Emma Goldman'
@@ -33,6 +38,26 @@ def test_create_topic(self):
         self.assertEqual(error_messages[0].text.strip(),
                          u'Topic with this preferred name already exists.')
 
+    def test_add_citation(self):
+        topic = self.create_test_topic()
+        document = main_models.Document.objects.create(
+            description="a test document",
+            project_id=topic.project_id,
+            creator_id=topic.creator_id,
+            last_updater_id=topic.last_updater_id)
+        url = reverse('admin:main_topic_change',
+                      kwargs={'project_slug': 'emma', 'topic_node_id': topic.topic_node_id})
+
+        form = self.app.get(url, user='barry').forms[1]
+        form['citation-0-document'] = document.id
+        form['citation-0-notes'] = 'it was an interesting thing I found in here'
+
+        resp = form.submit().follow()
+        topic = main_models.Topic.objects.get(id=topic.id)
+        self.assertEqual(topic.summary_cites.count(), 1)
+        self.assertEqual(topic.summary_cites.get().document_id, document.id)
+        self.assertEqual(topic.summary_cites.get().object_id, topic.id)
+
     def test_create_empty_topic_error(self):
         "A user should not be able to create a topic with an empty name."
         add_url = reverse('admin:main_topic_add', kwargs={'project_slug': 'emma'})

editorsnotes/main/templates/citation.include

@@ -1,15 +1,17 @@
 {% load typogrify display %}
 
-<div class="citation">
-	{% filter typogrify %}
-	<div class="citation-document">
+<div class="note-section">
+	<div class="citation-side">
 		<i class="icon-file"></i>
-		<a href="{{ cite.document.get_absolute_url }}">{{ cite.document.as_html }}</a>
 	</div>
-  {% endfilter %}
-	{% if cite.has_notes %}
-	<div class="citation-notes">
-		{{ cite.notes|as_html }}
+	<div class="citation-main">
+		<div class="citation-document">
+			<a href="{{ cite.document.get_absolute_url }}">{{ cite.document.as_html }}</a>
+		</div>
+		{% if cite.has_notes %}
+		<div class="note-section-text-content">
+			{{ cite.notes|as_html }}
+		</div>
+		{% endif %}
 	</div>
-	{% endif %}
 </div>

editorsnotes/static/function/base.js

@@ -17,7 +17,7 @@ $(document).ready(function () {
 
   var baseAutocompleteOptions = {
     source: function(request, response, x) {
-      var targetModel = this.element.attr('search-target') || this.element.data('search-target')
+      var targetModel = this.element.attr('search-target') || this.element.data('targetModel')
         , query = {'q': request.term}
         , projectSlug = this.element.data('projectSlug')
         , url = '/api/'
@@ -28,6 +28,8 @@ $(document).ready(function () {
       }
       url += (targetModel + '/');
 
+      console.log(this.element);
+
       modelMap = {
         topics: function (item) {
           var val = item.preferred_name;