docbrown/app/views/internal/articles/_article_script.html.erb

<script>
 function timeNow(objectID) {
   var seconds = new Date().getTime() / 1000;
   document.getElementById("featured_number_" + objectID).value = Math.round(seconds);
 }

 function sink(objectID) {
   var seconds = new Date().getTime() / 1080;
   document.getElementById("featured_number_" + objectID).value = Math.round(seconds);
 }

 window.addEventListener('load', function() {
   function submitForms() {
     var form = $(this);
     var valuesToSubmit = $(this).serialize();
     $.ajax({
       type: "POST",
       url: $(this).attr('action'), //sumbits it to the given url of the form
       data: valuesToSubmit,
     }).success(function (json) {
       form.parents(".card").addClass("highlighted-bg")
       form.parents(".card").addClass("highlighted-border")
       setTimeout(function () {
         form.parents(".card").removeClass("highlighted-bg")
       }, 350)
     });
     return false; // prevents normal behaviour
   }

   $('.card').on("submit", "form", submitForms)
   $('.buffer-area').on("submit", "form", submitForms)

   function tagSuggestedTweet(event) {
     var updateId = $(this).data("id");
     var updateElement = $(`#suggested-tweet-${updateId}`)
     if (event.target.classList.contains('buffer-confirm')) {
       updateElement.find('.card-header h2').append('<span class="ml-2 badge badge-success">Confirm</span>')
     } else if (event.target.classList.contains('buffer-dismiss')) {
       updateElement.find('.card-header h2').append('<span class="ml-2 badge badge-danger">Dismiss</span>')
     }
   }

   $('.buffer-form').on("submit", tagSuggestedTweet);

   imageUploadButt = document.getElementById('image-upload-button')
   imageUpload = document.getElementById('image-upload')
   imageUploadSubmit = document.getElementById('image-upload-submit')

   if (imageUploadButt && imageUpload && imageUploadSubmit) {
     imageUploadButt.onclick = function (e) {
       e.preventDefault();
       document.getElementById('image-upload').click();
     }
     imageUpload.onchange = function (e) {
       var image = document.getElementById('image-upload').files;
       if (image.length > 0) {
         document.getElementById('uploaded-image').style = 'display:none';
         document.getElementById('image-upload-submit').value = "uploading";
         setTimeout(function () {
           document.getElementById('image-upload-submit').click(function () {
           });
         }, 50)
       }
     }
     imageUploadSubmit.onclick = function (e) {
       e.preventDefault();
       var image = document.getElementById('image-upload').files;
       if (image.length > 0) {
         var ajaxReq = createAjaxReq();
         ajaxReq.onreadystatechange = uploadImageCb.bind(this, ajaxReq);
         ajaxReq.open('POST', '/image_uploads', true);
         ajaxReq.send(generateUploadFormdata(image));
       }
     }
   }

   function generateUploadFormdata(image) {
     var token = document.getElementsByName('authenticity_token')[0].value;
     var formData = new FormData();
     formData.append('authenticity_token', token);
     formData.append('image', image[0]);
     return formData;
   }

   function uploadImageCb(ajaxReq) {
     if (ajaxReq.status === 200 && ajaxReq.readyState === XMLHttpRequest.DONE) {
       var address = document.getElementById('uploaded-image');
       address.value = JSON.parse(ajaxReq.response).link;
       address.style.display = "inline-block";
       address.style.width = "90%";
       address.select();
       var uploadedMessage = '';
       document.getElementById('image-upload-submit').style.display = 'none';
     }
   }

   function createAjaxReq() {
     if (window.XMLHttpRequest) {
       return new XMLHttpRequest();
     } else {
       return new ActiveXObject("Microsoft.XMLHTTP");
     }
   }
 });
</script>