lab
This commit is contained in:
parent
7cd9c68a10
commit
36984ff1d4
20 changed files with 321 additions and 391 deletions
|
|
@ -1,62 +1,34 @@
|
|||
// Entry point for the build script in your package.json
|
||||
// import "@hotwired/turbo-rails";
|
||||
// import "jquery";
|
||||
import "foundation-sites";
|
||||
// import 'foundation-sites/dist/css/foundation.min.css'; // CSS
|
||||
import "./controllers";
|
||||
|
||||
// // Entry point for the build script in your package.json
|
||||
|
||||
import jquery from "jquery";
|
||||
|
||||
window.jQuery = jquery;
|
||||
window.$ = jquery;
|
||||
|
||||
$(function () {
|
||||
$(document).foundation();
|
||||
});
|
||||
|
||||
// Load reviews on package's details page
|
||||
// load_reviews = function() {
|
||||
// // Display message while loading reviews
|
||||
// // $('#reviews').html("<i>Loading reviews...</i>");
|
||||
|
||||
// // Hide the DIV so that in can be faded in later
|
||||
// $('#reviews').hide();
|
||||
|
||||
// // The URL is specified in the #reviews's DIV data attribute
|
||||
// var url = $('#reviews').attr('data-package-reviews-url');
|
||||
// $('#reviews').load(url, null,
|
||||
// // Fade in the reviews as soon as the DIV is loaded and filled
|
||||
// function(){
|
||||
// $(this).fadeIn('slow')
|
||||
// }
|
||||
// );
|
||||
// };
|
||||
// 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();
|
||||
// $("#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);
|
||||
};
|
||||
// $("#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) {
|
||||
$('#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
|
||||
}
|
||||
};
|
||||
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
|
||||
function upload_paste_handler(event)
|
||||
{
|
||||
export function upload_paste_handler(event) {
|
||||
console.log("paste!");
|
||||
var items = (event.clipboardData || event.originalEvent.clipboardData).items;
|
||||
|
||||
|
|
@ -65,15 +37,13 @@ function upload_paste_handler(event)
|
|||
// return;
|
||||
// }
|
||||
|
||||
for (var i = 0 ; i < items.length ; i++)
|
||||
{
|
||||
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 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();
|
||||
|
|
@ -82,41 +52,68 @@ function upload_paste_handler(event)
|
|||
}
|
||||
}
|
||||
|
||||
function upload_file_with_ajax(file)
|
||||
{
|
||||
if (file==null)
|
||||
{
|
||||
function upload_file_with_ajax(file) {
|
||||
if (file == null) {
|
||||
console.log("File was null. Strange.");
|
||||
display_error('Maybe the image was too large.');
|
||||
display_error("Maybe the image was too large.");
|
||||
return;
|
||||
}
|
||||
var formData = new FormData();
|
||||
formData.append('file', file);
|
||||
formData.append("file", file);
|
||||
|
||||
$.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);
|
||||
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
|
||||
},
|
||||
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);
|
||||
})
|
||||
.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(
|
||||
'<div class="callout alert alert-callout-subtle radius">Sorry, pasting did not work. ' + msg + '</div>')
|
||||
function display_error(msg) {
|
||||
// $("#messages").html(
|
||||
// '<div class="callout alert alert-callout-subtle radius">Sorry, pasting did not work. ' + msg + "</div>"
|
||||
// );
|
||||
document.querySelector("#messages").innerHTML = `
|
||||
<div class="callout alert alert-callout-subtle radius">
|
||||
Sorry, pasting did not work. ${msg}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,4 @@
|
|||
// This file is auto-generated by ./bin/rails stimulus:manifest:update
|
||||
// Run that command whenever you add a new controller or create them with
|
||||
// ./bin/rails generate stimulus controllerName
|
||||
|
||||
import { application } from "./application"
|
||||
|
||||
import HelloController from "./hello_controller"
|
||||
application.register("hello", HelloController)
|
||||
// Import and register all your controllers from the importmap via controllers/**/*_controller
|
||||
import { application } from "controllers/application"
|
||||
import { eagerLoadControllersFrom } from "@hotwired/stimulus-loading"
|
||||
eagerLoadControllersFrom("controllers", application)
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue