// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails import "@hotwired/turbo-rails" import "controllers" // Initialize the upload form. function upload_form_init() { // Disable the submit button if Javascript is supported. // Upload will start right after selecting images. // $("#file-submit").hide(); document.getElementById("file-submit").style.display = "none"; // Install event handler to notice when files were selected. // $("#file").on("change", upload_form_files_selected); document.getElementById("file").addEventListener("change", upload_form_files_selected); } function upload_form_files_selected() { no_files = this.files.length; if (no_files > 0) { document.getElementById("file-label").innerHTML = `${no_files} files selected - uploading…`; document.getElementById("file-select-button").disabled = true; document.getElementById("file-form").submit(); // $("#file-label").html(no_files + " files selected - uploading…"); // change label // $("#file-select-button").attr("disabled", "disabled"); // disable select button // $("#file-form").trigger("submit"); // start upload } } // Handle Ctrl-V to paste an image directly export function upload_paste_handler(event) { console.log("paste!"); var items = (event.clipboardData || event.originalEvent.clipboardData).items; // /*Make Sure Only One File is Copied*/ // if (items.length != 1) { // return; // } for (var i = 0; i < items.length; i++) { var item = items[i]; console.log(item); console.log("item size=" + item.size); if (!item.type.startsWith("image/")) { console.log("Skipping file with type " + item.type); continue; } console.log(item.type); var file = item.getAsFile(); console.log(file); upload_file_with_ajax(file); } } function upload_file_with_ajax(file) { if (file == null) { console.log("File was null. Strange."); display_error("Maybe the image was too large."); return; } var formData = new FormData(); formData.append("file", file); fetch(ajax_upload_url, { method: "POST", body: formData, headers: { // 'Content-Type' is omitted to let the browser set it automatically // with the proper boundary for FormData }, }) .then(async (response) => { if (!response.ok) { const errorData = await response.json(); console.log(`AJAX file upload returned error: ${response.statusText}`); display_error(errorData); throw new Error("Upload failed"); } return response.json(); }) .then((data) => { console.log("AJAX file upload was ok"); window.location.replace(after_upload_url); }) .catch((error) => { if (error.message !== "Upload failed") { console.log(`AJAX file upload error: ${error}`); } }); // $.ajax(ajax_upload_url, { // type: "POST", // contentType: false, // processData: false, // data: formData, // //dataType: 'json', // error: function (xhr, txt, err) { // console.log("AJAX file upload returned error: " + txt + " / " + err); // response = JSON.parse(xhr.responseText); // display_error(response); // }, // success: function (res) { // console.log("AJAX file upload was ok"); // // Go back to details page to show the new upload // window.location.replace(after_upload_url); // }, // }); } function display_error(msg) { // $("#messages").html( // '