cdao-pjet/app/javascript/controllers/doctrines_controller.js

import ApplicationController from './application_controller'
export default class extends ApplicationController {
  static targets = ["input", "document_id", "doctrine_id", "headnote", "content"]

  connect () {
    super.connect()
  }

  renderForm () {
    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

    $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("#doctrine_id").val(doctrine.id)
        if (status === "success") {
          $.get("/api/subjects.json?doctrine_ids=" + doctrine.id, { per_page: 100 }, function (subjects, status) {
            if (status === "success") {
              $.each(subjects, function(i, subject) {
                $subject_ids_selectize.addOption(subject)
              })

              $subject_ids_selectize.refreshOptions()
              $subject_ids_selectize.setValue(doctrine.subject_ids, true)
              $subject_ids_selectize.blur()
              $subject_ids_selectize.close()
            }
          });

          $modal.find(".trix-content").val(doctrine.content)
          $modal.find("#headnote").val(doctrine.headnote)
        }
      })

      $modal.find(".modal-title").text("Update Doctrine")
      $(".selectize-dropdown").hide()
    } else {
      $modal.find("#doctine_content_suggestions_div").show()
      $modal.find(".modal-title").text("New Doctrine")
      $modal.find(".trix-content").val("")
      $subject_ids_selectize.setValue([])
      $modal.find("#doctrine_id").val('')
      $modal.find("#headnote").val('')
    }
  }

  save () {
    var $this = this, $form = $("#doctrineForm"), document_id = $this.document_idTarget.value, doctrine_id = $this.doctrine_idTarget.value
    var params = { subject_ids: $form.find("select[name='subject_ids[]']").val(), headnote: $this.headnoteTarget.value, 
                   content: $this.contentTarget.value }

    console.log(params)

    if (!params.subject_ids.length) {
      $form.find("#subjects-blank-message").show()
    }

    if (!params.headnote.length) {
      $form.find("#headnote-blank-message").show()
    }

    if (!params.content.length) {
      $form.find("#content-blank-message").show()
    }

    if (params.subject_ids.length && params.headnote.length && params.content.length) {
      if (doctrine_id !== null && doctrine_id !== undefined && doctrine_id !== "") {
        $.ajax({
          url: "/api/doctrines/" + doctrine_id,
          type: 'PUT',
          data: params,
          success: function() {
            $(".btn-close-x").trigger("click");
            $('.toast').addClass('bg-success').show();
            $( ".toast-body" ).html( "<span><b>Submitted Successfully</b></span>" );
            location.pathname = "/documents/" + document_id + "/doctrines/" + doctrine_id
          },
          error: function() { 
            $(".btn-close-x").trigger("click");
            $('.toast').addClass('bg-danger').show();
            $( ".toast-body" ).html( "<span><b>Unexpected Error Problem Occurred</b></span>" );
          }
        })
      } else {
        $.post("/api/doctrines", $.extend({ jurisprudence_ids: [document_id] }, params), function(data, status) {
          if(status === 'success') {
            $('.toast').addClass('bg-success').show();
            $( ".toast-body" ).html( "<span><b>Submitted Successfully</b></span>" );

            const contrim_alert = confirm("Do you want to create an Annotation?")

            if (contrim_alert) {
              $this.stimulate("DoctrinesReflex#render_annotation_form", document_id, data.id)
              $('.toast').fadeOut(5000)
            } else {
              $(".btn-close-x").trigger("click")
              location.pathname = "/documents/" + document_id + "/doctrines/" + data.id
            }
          } else {
            $(".btn-close-x").trigger("click");
            $('.toast').addClass('bg-danger').show();
            $( ".toast-body" ).html( "<span><b>Unexpected Error Problem Occurred</b></span>" );
          }
        })
      }
    }
  }

  delete(ev) {
    var doctrine_id = this.element.dataset["doctrineId"], document_id = this.element.dataset["documentId"]

    ev.preventDefault();
    const contrim_alert = confirm("Are you sure to delete this record?")
    if (contrim_alert) {
      $.ajax({
        url: "/api/doctrines/" + doctrine_id,
        type: 'DELETE',
        success: function() {
          $('.toast').addClass('bg-danger').show();
          $( ".toast-body" ).html( "<span><b>Deleted Successfully</b></span>" );
          location.pathname = "/documents/" + document_id
        },
        error: function () {
          $('.toast').addClass('bg-danger').show();
          $( ".toast-body" ).html( "<span><b>Unexpected Error Problem Occurred</b></span>" );
        }
      })
    }
  }

  saveAnnotation () {
    var $form = $("#doctrineForm")
    const params = { doctrine_id: $form.find("#doctrine_id").val(), document_id: $form.find("#document_id").val(),
                     document_ids: $form.find("#document_ids").val().split(","), content: $form.find("#document_title").val(),
                     phil_rep: $form.find("#phil_rep").val(), editor_notes: $form.find("#editor_notes").val(),
                     annomark_ids: $form.find("select[name='annomark_ids[]']").val() }
    
    $.post("/api/doctrines/" + params.doctrine_id + "/annotations", params, function (result, status) {
      if(status === "success") {
        $(".btn-close-x").trigger("click");
        $('.toast').addClass('bg-success').show();
        $( ".toast-body" ).html( "<span><b>Submitted Successfully</b></span>" );
        location.pathname = "/documents/" + $form.find("#current_document_id").val() + "/doctrines/" + params.doctrine_id
      } else {
        $(".btn-close-x").trigger("click")
        $('.toast').addClass('bg-danger').show()
        $( ".toast-body" ).html( "<span><b>Unexpected Error Problem Occurred</b></span>" )
      }
    })
  }

  closeDoctrineAnnotationModalForm () {
    var $current_document_id = $("#doctrineModal").find("#current_document_id").val() 
    var $doctrine_id = $("#doctrineModal").find("#doctrine_id").val() 
    $(".btn-close-x").trigger("click");
    location.pathname = "/documents/" + $current_document_id + "/doctrines/" + $doctrine_id
  }
}