Enahncement of UI for `doctrines`

app/components/doctrine_index_table_component/doctrine_index_table_component.html.erb

@@ -7,7 +7,7 @@
   
   <tbody>
     <% search_results.each do |search_result| %>
-      <tr href="<%= document_path(search_result.document_id) %>" class="clickable-tr">
+      <tr href="<%= document_path(search_result.doctrine_jurisprudences.first.jurisprudence_id) %>" class="clickable-tr">
         <td> <%= document_reference_number(search_result.document) %> </td>
         <td> <%= document_title(search_result.document) %> </td>
         <td> <%= date_or_year(search_result.document) %> </td>

app/components/document_doctrine_index_component.rb

@@ -10,14 +10,9 @@ class DocumentDoctrineIndexComponent < BaseComponent
   delegate :id, to: :doctrine
   delegate :subject_ids, to: :doctrine
   delegate :content, to: :doctrine
-  delegate :document_id, to: :doctrine
   delegate :annotations, to: :doctrine
   delegate :subjects, to: :doctrine
 
-  def doctrine_form_url
-    jurisprudence_doctrines_path(jurisprudence_id: document_id)
-  end
-
   def annotation_form_url
     doctrine_annotations_path(doctrine_id: id)
   end

app/components/document_doctrine_index_component/document_doctrine_index_component.html.erb

@@ -1,4 +1,4 @@
-<div class="row-flex m-3 mt-0 doctrine-content-body clickable-link" href="<%= opts[:is_disable_clickable_link].present? ? '#' : document_doctrine_path(document_id, id)%>">
+<div class="row-flex m-3 mt-0 doctrine-content-body clickable-link" href="<%= opts[:document_id].present? ? document_doctrine_path(opts[:document_id], id) : doctrine_path(id)%>">
   <% if opts[:is_subjects_index].blank? %>
     <% if opts[:is_doctrines_index].present? && opts[:subject_ids].reject(&:blank?).present? %>
       <h5 style="color: darkred;"> <%= subjects.where(id: opts[:subject_ids].map(&:to_i)).map(&:lineage_name).join(" ") %> </h5>

app/components/document_doctrine_show_component.rb

@@ -1,8 +1,9 @@
 class DocumentDoctrineShowComponent < BaseComponent
-  attr_reader :current_user, :doctrine, :subjects
+  attr_reader :current_user, :document_id, :doctrine, :subjects
 
-  def initialize(current_user:, doctrine:, subjects:, opts: {})
+  def initialize(current_user:, doctrine:, document_id:, subjects:, opts: {})
     @doctrine = doctrine
+    @document_id = document_id
     @current_user = current_user
     @subjects = subjects
   end
@@ -10,19 +11,9 @@ class DocumentDoctrineShowComponent < BaseComponent
   delegate :id, to: :doctrine
   delegate :subject_ids, to: :doctrine
   delegate :content, to: :doctrine
-  delegate :document_id, to: :doctrine
-  delegate :document, to: :doctrine
   delegate :annotations, to: :doctrine
   delegate :subjects, to: :doctrine
 
-  def doctrine_form_url
-    jurisprudence_doctrines_path(jurisprudence_id: document_id)
-  end
-
-  def edit_doctrine_form_url
-    jurisprudence_doctrines_path(jurisprudence_id: document_id, id: id)
-  end
-
   def annotation_form_url
     doctrine_annotations_path(doctrine_id: id,)
   end
@@ -37,6 +28,10 @@ class DocumentDoctrineShowComponent < BaseComponent
     Cdao::Subject.all.order(name: :asc)
   end
 
+  def document
+    Document.find(document_id)
+  end
+
   def date_or_year(annotation)
     return annotation.document.docdate.to_date.strftime("%B %d, %Y") if annotation.document.docdate.present?
 

app/components/document_doctrine_show_component/document_doctrine_show_component.html.erb

@@ -7,7 +7,7 @@
 
   <div class="col-sm-2 d-flex justify-content-end pe-0">
     <a class="btn btn-sm btn-secondary me-3" data-controller="doctrines" data-document-id="<%= document_id %>" data-doctrine-id="<%= id %>" data-action="click->doctrines#renderForm" data-bs-toggle="modal" data-bs-target="#doctrineModal"> Edit </a>
-    <a class="btn btn-sm btn-danger" href="<%= jurisprudence_doctrine_path(document_id, id) %>" data-confirm="Are you sure to delete this record?" data-method="DELETE"> Delete </a>
+    <a class="btn btn-sm btn-danger" href="<%= api_doctrine_path(id) %>" data-confirm="Are you sure to delete this record?" data-method="DELETE"> Delete </a>
   </div>
 </div>
 

app/components/subject_index_form_component/subject_index_form_component.html.erb

@@ -1,4 +1,4 @@
-<%= form_for(subject_index, url: opts[:form_url], method: opts[:form_method]) do |form| %>
+<%= form_for(subject_index, url: opts[:form_url], method: opts[:form_method], data: { reflex: "submut->SubjectsReflex#save" }) do |form| %>
 	<div class="row">
 		<div class="col-sm-12 p-2">
 			<strong> <%= label_tag :name %> </strong>
@@ -9,9 +9,9 @@
 
 	<% if parent_id.present? %>
 		<div cass="row">
-			<div class="col-sm-12 p-2">
+			<div class="col-sm-12">
 				<strong> <%= label_tag :subjects %> </strong>
-				<%= select_tag :parent_id, options_from_collection_for_select(all_subjects, :id, :lineage_name, parent_id), class: "form-select default-selectize", prompt: "Please select" %>
+				<select class="form-control subjects-selectize ps-0" name="parent_id" id="parent_id" value="<%= parent_id %>"> </select>
 			</div>
 		</div>
 	<% end %>
@@ -19,6 +19,7 @@
 	<div class="row">
 		<div class="col-sm-12 d-flex justify-content-end p-2">
 			<%= submit_tag "Save", class: "btn btn-primary" %>
+			<button type="button" class="btn btn-secondary" href="<%= subject_indexes_path() %>"> Back </button>
 		</div>
 	</div>
 <% end %>

app/controllers/api/doctrines_controller.rb

@@ -21,13 +21,14 @@ module Api
       attrs = resource_params.to_unsafe_h.deep_symbolize_keys
       subject_ids = attrs.delete(:subject_ids)
 
-      @doctrine = Doctrine.new(attrs)
+      @doctrine = ::Doctrine.new(attrs)
 
       if @doctrine.save
         @doctrine.subject_ids = subject_ids if subject_ids.present?
 
         respond_with @doctrine
       else
+        raise @doctrine.errors.full_messages.inspect
         render errors: @doctrine.errors, status: 422
       end
     end

app/controllers/api/documents_controller.rb

@@ -1,7 +1,6 @@
 module Api
   class DocumentsController < BaseController
     load_and_authorize_resource :document, class: "Cdao::Document", only: %i[show]
-    authorize_resource :document, class: "Cdao::Document", only: %i[index]
 
     def index
       search = document_search(search_params)
@@ -21,10 +20,10 @@ module Api
         fulltext_fields = %i[reference_number title short_title].freeze
 
         search = Cdao::Document.search do
-          fulltext search_params[:q], fields: fulltext_fields, query_phrase_slop: 1, minimum_match: 1 if search_params[:q].present?
+          fulltext search_params[:q], fields: fulltext_fields, query_phrase_slop: 1 if search_params[:q].present?
 
           fulltext_fields.each do |field|
-            fulltext search_params[field], fields: [field], query_phrase_slop: 1, minimum_match: 1 if search_params[field].present?
+            fulltext search_params[field], fields: [field], query_phrase_slop: 1 if search_params[field].present?
           end
 
           with(:year, search_params[:year].to_i) if search_params[:year].present?

app/javascript/controllers/doctrines_controller.js

@@ -10,13 +10,12 @@ export default class extends ApplicationController {
     var document_id = this.element.dataset["documentId"], doctrine_id = this.element.dataset["doctrineId"],
         $modal = $("#doctrineModal"), $subject_ids_el = $modal.find(".subject-ids-selectize"), 
         $subject_ids_selectize = $subject_ids_el[0].selectize
-    
-    console.log(this.element.dataset)
+
+    $modal.find("#document_id").val(document_id)
 
     if (doctrine_id !== null && doctrine_id !== undefined && doctrine_id !== "") {
       $modal.find("#doctine_content_suggestions_div").hide()
       $.get("/api/doctrines/" + doctrine_id + ".json", {}, function (doctrine, status) {
-        $modal.find("#document_id").val(doctrine.document_id)
         $modal.find("#doctrine_id").val(doctrine.id)
         if (status === "success") {
           $.get("/api/subjects.json?doctrine_ids=" + doctrine.id, { per_page: 100 }, function (subjects, status) {
@@ -26,7 +25,9 @@ export default class extends ApplicationController {
               })
 
               $subject_ids_selectize.refreshOptions()
-              $subject_ids_selectize.setValue(doctrine.subject_ids)
+              $subject_ids_selectize.setValue(doctrine.subject_ids, true)
+              $subject_ids_selectize.blur()
+              $subject_ids_selectize.close()
             }
           });
 
@@ -41,22 +42,29 @@ export default class extends ApplicationController {
       $modal.find(".modal-title").text("New Doctrine")
       $modal.find(".trix-content").val("")
       $subject_ids_selectize.setValue([])
-      $modal.find("#document_id").val(document_id)
+      $modal.find("#doctrine_id").val('')
     }
   }
 
   save () {
     var $modal = $("#doctrineModal"), document_id = this.document_idTarget.value, doctrine_id = this.doctrine_idTarget.value
-    const params = { subject_ids: $modal.find("select[name='subject_ids[]']").val(), content: this.contentTarget.value }
+    var params = { subject_ids: $modal.find("select[name='subject_ids[]']").val(), content: this.contentTarget.value }
 
     if (doctrine_id !== null && doctrine_id !== undefined && doctrine_id !== "") {
       $.ajax({
-        url: "/jurisprudences/" + document_id + "/doctrines/" + doctrine_id,
+        url: "/api/doctrines/" + doctrine_id,
         type: 'PUT',
-        data: params
+        data: params,
+        success: function() {
+          location.pathname = "/documents/" + document_id + "/doctrines/" + doctrine_id
+        }
       })
     } else {
-      $.post("/jurisprudences/" + document_id + "/doctrines", params)
+      $.post("/api/doctrines", $.extend({ jurisprudence_ids: [document_id] }, params), function(data, status) {
+        if(status === 'success') {
+          location.pathname = "/documents/" + document_id + "/doctrines/" + data.id
+        }
+      })
     }
   }
 }

app/javascript/controllers/document_controller.js

@@ -4,6 +4,154 @@ export default class extends ApplicationController {
 
   connect () {
     super.connect()
+
+    $.fn.footnotes = function () {
+      var a, b, c;
+      a = $(this), b = a.find('a[href^="#footnote"]')
+
+      c = a.find('p>span, p>a[href^="#fn"]>span').filter(function() {
+        return ($(this).css('color') == 'rgb(255, 0, 0)')
+      })
+
+      b.each(function(){
+        var $this = $(this);
+        if($this.anchor_check()) {
+          if(!$this.parent('span.footnote-x').length) {
+            // Wrap the anchor with 'footnote-x'
+            $this.wrap('<span class="footnote-x"></span>')
+          }
+        }
+      })
+
+      // Append index to every anchor
+      b = a.find('span.footnote-x a[href^="#footnote"]')
+      b.each(function() {
+        var $this = $(this);
+        var $matches = $($this.prop("tagName") + '#' + $this.attr("id") + ':not([data-index])')
+        var index = 0;
+
+        $matches.each(function(){
+          $(this).attr('id', $(this).attr('id') + '_' + index)
+          $(this).attr('name', $(this).attr('name') + '_' + index)
+          $(this).attr('href', $(this).attr('href') + '_' + index)
+          $(this).attr('data-index', index)
+          index = index + 1;
+        })
+      })
+
+      c.each(function(){
+        var $this = $(this)
+        $this.footnote_check()
+      })
+
+      c = a.find('a[href^="#fn"]')
+
+      c.each(function() {
+        var $this = $(this);
+        var $matches = $($this.prop("tagName") + '#' + $this.attr("id") + ':not([data-index])')
+        var index = 0;
+        $matches.each(function(){
+          var self, parent
+          self = $(this), parent = self.parent()
+          self.closest('p').find('#cdasiatab').detach()
+          self.attr('id', self.attr('id') + '_' + index)
+          self.attr('name', self.attr('name') + '_' + index)
+          self.attr('href', self.attr('href') + '_' + index)
+          self.attr('data-index', index)
+          parent.is('a') ? parent.replaceWith(self) : parent.closest('a').replaceWith(parent) // Remove parent its parent 'a' tag
+          index = index + 1;
+        })
+      })
+    }
+
+    $.fn.anchor_check = function () {
+      var a, b, c, d;
+      a = $(this), b = a.attr('href'), c = $.trim(a.text())
+      if (!$.isNumeric($.trim(c)) && c != '*' && c != 'n') { return false }
+
+      if($.trim(b) && a.is('[href^="#footnote"]')){
+        // Check whether href, name and text is valid
+        var a_href_id = a.attr('href').substring(9) // Get only the value after '#footnote'
+        var a_name_id = a.attr('name') ? a.attr('name').substring(2) : a_href_id // Get only the value after 'fn' if name attr is present if not return a_href_id
+        var a_id = a.attr('id') ? a.attr('id').substring(2) : ''
+        if(a_href_id != a_name_id || a_href_id != c || a_id != c || a_name_id != c){
+            a.attr('href', '#footnote' + c), a.attr('id', 'fn' + c), a.attr('name', 'fn' + c)
+        }
+      } else {
+        // If anchor to footnote is invalid by href=#footnote*** or no href
+        // the text inside the 'a' tag will use as a reference
+        a.attr('href', '#footnote' + c), a.attr('id', 'fn' + c), a.attr('name', 'fn' + c)
+      }
+      return true;
+    }
+
+    $.fn.footnote_check = function () {
+      var a, b, c, d;
+      a = $(this), d = null
+
+      if (a.find('a:not([href^="#footnote"])').size()) {
+        a.find('a').each(function(){
+          b = $.trim($(this).text()), c = b.match(/([\*]{1,3}|[\d]{1,3})/)
+          if (c!= null) {
+            c = c[0]
+            d = $(document.createElement('a'))
+            d.text(b), d.attr('href', '#fn' + c), d.attr('id', 'footnote' + c), d.attr('name', 'footnote' + c), d.addClass('m-r-lg'), d.css('color', 'red')
+            a.html(''), a.append(d)
+            return true;
+          }
+        })
+
+        if (d=null) {
+          return false
+        }
+      } else if (!a.find('a').size()) {
+        b = $.trim(a.text()), c = b.match(/([\*]{1,3}|[\d]{1,3})/)
+        if(c!= null){
+          c = c[0]
+          d = $(document.createElement('a'))
+          d.text(b), d.attr('href', '#fn' + c), d.attr('id', 'footnote' + c), d.attr('name', 'footnote' + c), d.addClass('m-r-lg'), d.css('color', 'red')
+          a.html(''), a.append(d)
+        }else{
+          return false
+        }
+      }
+      return true
+    }
+
+    $.fn.footnote = function () {
+      var a = $(this)
+      var b, c, d;
+      b = $(a.attr('href'))
+
+      if (b.length<=0 && a.data('index')>0) {
+        var a_id = a.attr('id').substring(0, a.attr('id').indexOf('_'))
+        var a_like = $('a[href^="#footnote"][id^="' + a_id + '"]')
+        var a_found = false;
+        a_like.each(function() {
+          if(!a_found){ b = $($(this).attr('href')) }
+          a_found = b.length > 0
+        })
+      }
+
+      if (b.length>0) {
+        c = b.closest('p')
+        d = c.footnote_text(b.parent('span') || b), d = d.substring(0,499) + (d.length > 500 ? '...' : '')
+        a.attr('data-original-title', d), a.attr('data-toggle', 'tooltip')
+        a.tooltip({title: d}), a.tooltip('show')
+      }
+
+      return a
+    }
+
+    $.fn.footnote_text = function (except) {
+      var a = '';
+      $(this).children().not(except).each(function() {
+        // Check first if the current select element not equal to except
+        var self = $(this)
+        a += self.text()
+      })
+      return a;
+    }
   }
 
   search () {

app/javascript/controllers/selectize_controller.js

@@ -69,13 +69,28 @@ export default class extends ApplicationController {
 
     var $subject_ids_selectize = $(".subject-ids-selectize").selectize($.extend(subject_ids_opts, default_opts));
 
+    var subjects_selectize_opts = {
+      load: function (query, callback) {
+        $.get("/api/subjects.json", { q: query, per_page: 100 }, function (data, status) {
+          if (status === 'success') {
+            callback(data);
+          }
+        })
+      }
+    }
+
+    var $subjects_selectize = $(".subjects-selectize").selectize($.extend(subjects_selectize_opts, default_opts))
+
     $.get("/api/subjects.json", { per_page: 100 }, function (results, status) {
       if (status === 'success') {
         $.each(results, function (i, result) {
-          $subject_ids_selectize[0].selectize.addOption(result);
+          if ($subject_ids_selectize.length) $subject_ids_selectize[0].selectize.addOption(result, true);
+          if ($subjects_selectize.length) $subjects_selectize[0].selectize.addOption(result, true);
         })
 
-        $subject_ids_selectize[0].selectize.refreshOptions();
+        if ($subject_ids_selectize.length) $subject_ids_selectize[0].selectize.refreshOptions();
+
+        if ($subjects_selectize.length) $subjects_selectize[0].selectize.refreshOptions();
       }
     });
 

app/javascript/src/application.scss

@@ -43,7 +43,7 @@
 
 // Modal Form custom styling //
 
-.modal-doctrine-body .selectize-control {
+.selectize-control {
   border: none !important;
 }
 

app/models/doctrine.rb

@@ -1,6 +1,6 @@
 class Doctrine < ApplicationRecord
   has_many :doctrine_jurisprudences, dependent: :destroy
-  has_many :jurisprudences, through: :doctrine_jurisprudences
+  has_many :jurisprudences, class_name: "Cdao::Jurisprudence", through: :doctrine_jurisprudences
 
   has_many :doctrine_subjects, dependent: :destroy
   has_many :subjects, through: :doctrine_subjects
@@ -8,7 +8,7 @@ class Doctrine < ApplicationRecord
   has_many :annotations, dependent: :destroy
 
   validates :content, presence: true
-  validates :content_fingerprint, uniqueness: { scope: %i[document_id document_type] }
+  validates :content_fingerprint, uniqueness: true
 
   before_validation do
     self.content_fingerprint = Digest::SHA256.hexdigest(content)
@@ -52,7 +52,6 @@ class Doctrine < ApplicationRecord
     text :content
 
     integer :id
-    integer :document_id
 
     integer :subject_ids, multiple: true
 

app/reflexes/subjects_reflex.rb

@@ -4,4 +4,14 @@ class SubjectsReflex < ApplicationReflex
   def load_sidenav_accordion(search_results, opts = {})
     morph "#"
   end
+
+  def save
+    raise @subject_index.inspect
+  end
+
+  private
+
+    def resource_params
+      params.permit(:name, :parent_id, library_ids: [])
+    end
 end

app/views/api/doctrines/create.json.jbuilder

@@ -0,0 +1 @@
+json.(@doctrine,  *%i[id subject_ids content plain_content created_at updated_at])

app/views/api/doctrines/show.json.jbuilder

@@ -1 +1 @@
-json.(@doctrine,  *%i[id document_id subject_ids content plain_content created_at updated_at])
+json.(@doctrine,  *%i[id subject_ids content plain_content created_at updated_at])

app/views/doctrines/show.html.erb

@@ -0,0 +1,31 @@
+<div class="card mt-1 g-3">
+  <div class="card-header mb-0 col-sm-12">
+    <table class="table table-borderless mb-0">
+      <tbody>
+        <tr>
+          <td class="text-start" style="width: 160px;"> Reference Number: </td>
+          <td class="text-start"> <strong> <%= @document.reference_number %> </strong> </td>
+          <td class="text-end" style="width: 50px;" > Date: </td>
+          <td class="text-end" style="width: 160px;"> <strong> <%= @document.docdate.present? ? @document.docdate.strftime("%m/%d/%Y") : @document.year %> </strong> </td>
+        </tr>
+
+        <tr>
+          <td style="width: 160px;" class="text-start"> Title: </td>
+          <td colspan="3" class="text-start"> <strong> <%= @document.title %> </strong> </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+
+  <div class="card-body pt-0">
+    <div class="row">
+      <div class="d-flex justify-content-end p-2">
+        <a class="btn btn-sm btn-primary" data-controller="doctrines" data-document-id="<%= @document.id %>" data-action="click->doctrines#renderForm" data-bs-toggle="modal" data-bs-target="#doctrineModal"> Add Doctrine </a>
+      </div>
+    </div>
+
+    <div class="row">
+      <%= render(DocumentDoctrineShowComponent.new(current_user: current_user, doctrine: @doctrine, document_id: @document.id, subjects: @subjects)) %>
+    </div>
+  </div>
+</div>

app/views/document/doctrines/show.html.erb

@@ -25,7 +25,7 @@
     </div>
 
     <div class="row">
-      <%= render(DocumentDoctrineShowComponent.new(current_user: current_user, doctrine: @doctrine, subjects: @subjects)) %>
+      <%= render(DocumentDoctrineShowComponent.new(current_user: current_user, doctrine: @doctrine, document_id: @document.id, subjects: @subjects)) %>
     </div>
   </div>
 </div>

app/views/documents/show.html.erb

@@ -61,7 +61,7 @@
         </div>
 
         <div class="container-sm row-flex col-sm-12 p-0 doct-body-index">
-          <%= render(DocumentDoctrineIndexComponent.with_collection(@doctrines, current_user: current_user)) %>
+          <%= render(DocumentDoctrineIndexComponent.with_collection(@doctrines, current_user: current_user, opts: { document_id: @document.id })) %>
         </div>
       </div>
 

config/routes.rb

@@ -3,7 +3,7 @@ Rails.application.routes.draw do
 
   root to: "home#index"
 
-  resources :doctrines, only: %i[index] do
+  resources :doctrines, only: %i[index show] do
     get :search, on: :collection
     scope module: :doctrine do
       resources :annotations, only: %i[create update destroy]
@@ -26,7 +26,7 @@ Rails.application.routes.draw do
   end
 
   namespace :api, defaults: { format: :json } do
-    resources :doctrines, only: %i[index show] do
+    resources :doctrines do
       scope module: :doctrine do
         resources :annotations
       end