diff --git a/app/javascript/components/FileUploadUppy.jsx b/app/javascript/components/FileUploadUppy.jsx index 1b36fad239..c14da94a3d 100755 --- a/app/javascript/components/FileUploadUppy.jsx +++ b/app/javascript/components/FileUploadUppy.jsx @@ -20,7 +20,7 @@ class FileUploadUppy extends React.Component { const t = this; this.uppy = new Uppy({ id: "uppy-file-upload", - // autoProceed: false, + autoProceed: true, restrictions: { allowedFileTypes: [".mp4", ".mp3"] }, @@ -44,30 +44,30 @@ class FileUploadUppy extends React.Component { } }) .on("file-removed", (file, c, d) => { - console.log("---", file, c, d); + console.log("File Removed --- ", file, c, d); }) .on("file-added", () => { - console.log("file added"); - }) - .on("upload-success", () => { - console.log("upload-success"); + console.log("File Added, ", t.props.uploadData); }) .on("complete", function({ failed, successful }) { if(failed.length > 0) { - console.error('UPLOAD ERROR'); + console.log("File Upload S3 --- Error"); } if(successful.length > 0) { + console.log("File Upload S3 --- Success"); const { uploadURL, name, size } = successful[0]; const { container_id, step } = t.props; + let formData = new FormData(); + const newS3URl = uploadURL.replace('http://localhost:9000/', 's3://'); + console.log(newS3URl); + formData.append('selected_files[0][url]', newS3URl); + formData.append('container_id', container_id); + formData.append('step', step); + fetch('http://localhost:3000/master_files', { method: 'POST', - headers: { }, - body: JSON.stringify({ - container_id: container_id, - step: step, - authenticity_token: $('input[name=authenticity_token]').val(), - selected_files: { '0': { url: uploadURL, filename: name, filesize: size } } - }) + headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }, + body: formData }); } }); @@ -80,21 +80,19 @@ class FileUploadUppy extends React.Component { render() { return ( -
- - - + +
); } diff --git a/app/views/media_objects/_file_upload.html.erb b/app/views/media_objects/_file_upload.html.erb index 505de5c80b..0bddeec201 100644 --- a/app/views/media_objects/_file_upload.html.erb +++ b/app/views/media_objects/_file_upload.html.erb @@ -170,7 +170,7 @@ Unless required by applicable law or agreed to in writing, software distributed
<% end %> -
+

Upload through the web (files must not exceed <%= number_to_human_size MasterFile::MAXIMUM_UPLOAD_SIZE %>)

<%= react_component("FileUploadUppy", { uploadData: upload_form_data, container_id: @media_object.id, step: 'file_upload' }) %> diff --git a/docker-compose.yml b/docker-compose.yml index fa70c49084..c5c6838bdf 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -98,12 +98,12 @@ services: - COMPANION_AWS_SECRET=minio123 - COMPANION_AWS_BUCKET=masterfiles # - COMPANION_AWS_REGION=us-east-1 - - COMPANION_AWS_ENDPOINT="http://localhost:9000" + # - COMPANION_AWS_ENDPOINT="http://localhost:9000" # to enable S3 Transfer Acceleration (default: false) - COMPANION_AWS_USE_ACCELERATE_ENDPOINT="false" # to set a canned ACL for uploaded objects: https://docs.aws.amazon.com/AmazonS3/latest/dev/acl-overview.html#canned-acl - COMPANION_AWS_ACL="private" - - COMPANION_S3_ENDPOINT=http://localhost:9000 + # - COMPANION_S3_ENDPOINT=http://localhost:9000 # any long set of random characters for the server session - COMPANION_SECRET="shh!Issa Secret!" # specifying a secret file will override a directly set secret @@ -210,6 +210,8 @@ services: environment: MINIO_ACCESS_KEY: minio MINIO_SECRET_KEY: minio123 + # MINIO_SERVER_URL: http://minio:9000 + # MINIO_BROWSER_REDIRECT_URL: http://minio:9000 volumes: - data:/data ports: diff --git a/vendor/assets/javascripts/jasny-bootstrap.min.js b/vendor/assets/javascripts/jasny-bootstrap.min.js deleted file mode 100644 index 0242942f43..0000000000 --- a/vendor/assets/javascripts/jasny-bootstrap.min.js +++ /dev/null @@ -1,6 +0,0 @@ -/*! - * Jasny Bootstrap v4.0.0 (http://jasny.github.io/bootstrap) - * Copyright 2012-2019 Arnold Daniels - * Licensed under () - */ -if("undefined"==typeof jQuery)throw new Error("Jasny Bootstrap's JavaScript requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]};return!1}void 0===a.support.transition&&(a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one(a.support.transition.end,function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b()}))}(window.jQuery),function(a){"use strict";var b=navigator.userAgent.match(/iPhone/i)||navigator.userAgent.match(/iPod/i),c=function(b,d){if(this.$element=a(b),this.options=a.extend({},c.DEFAULTS,d),this.state=null,this.placement=null,this.$calcClone=null,this.calcClone(),this.options.recalc&&a(window).on("resize",a.proxy(this.recalc,this)),this.options.autohide&&!this.options.modal){navigator.userAgent.match(/(iPad|iPhone)/i);a(document).on("click touchstart",a.proxy(this.autohide,this))}a(this.$element).on("shown.bs.dropdown",a.proxy(function(b){a(this.$element).find(".dropdown .dropdown-backdrop").remove()},this)),"boolean"==typeof this.options.disablescrolling&&(this.options.disableScrolling=this.options.disablescrolling,delete this.options.disablescrolling),this.options.toggle&&this.toggle()};c.DEFAULTS={toggle:!0,placement:"auto",autohide:!0,recalc:!0,disableScrolling:!0,modal:!1,backdrop:!1,exclude:null},c.prototype.setWidth=function(){var b=this.$element.outerWidth(),c=a(window).width();c-=68,this.$element.css("width",b>c?c:b)},c.prototype.offset=function(){switch(this.placement){case"left":case"right":return this.$element.outerWidth();case"top":case"bottom":return this.$element.outerHeight()}},c.prototype.calcPlacement=function(){function b(a,b){return"auto"===e.css(b)?a:"auto"===e.css(a)?b:parseInt(e.css(a),10)>parseInt(e.css(b),10)?b:a}if("auto"!==this.options.placement)return void(this.placement=this.options.placement);this.$element.hasClass("in")||this.$element.css("visiblity","hidden !important").addClass("in");var c=a(window).width()/this.$element.outerWidth(),d=a(window).height()/this.$element.outerHeight(),e=this.$element;this.placement=c>d?b("left","right"):b("top","bottom"),"hidden !important"===this.$element.css("visibility")&&this.$element.removeClass("in").css("visiblity","")},c.prototype.opposite=function(a){switch(a){case"top":return"bottom";case"left":return"right";case"bottom":return"top";case"right":return"left"}},c.prototype.getCanvasElements=function(){var b=this.options.canvas?a(this.options.canvas):this.$element,c=b.find("*").filter(function(){return"fixed"===getComputedStyle(this).getPropertyValue("position")}).not(this.options.exclude);return b.add(c)},c.prototype.slide=function(b,c,d){if(!a.support.transition){var e={};return e[this.placement]="+="+c,e[this.opposite(this.placement)]="-="+c,b.animate(e,350,d)}var f=this.placement,g=this.opposite(f);b.each(function(){"auto"!==a(this).css(f)&&a(this).css(f,(parseInt(a(this).css(f),10)||0)+c),"auto"!==a(this).css(g)&&a(this).css(g,(parseInt(a(this).css(g),10)||0)-c)}),this.$element.one(a.support.transition.end,d).emulateTransitionEnd(350)},c.prototype.disableScrolling=function(){var c=a("body").width(),d="padding-right";if(void 0===a("body").data("offcanvas-style")&&a("body").data("offcanvas-style",a("body").attr("style")||""),a("body").css("overflow","hidden"),b&&a("body").addClass("lockIphone"),a("body").width()>c){var e=parseInt(a("body").css(d),10)+a("body").width()-c;setTimeout(function(){a("body").css(d,e)},1)}a("body").on("touchmove.bs",function(b){a(event.target).closest(".offcanvas").length||b.preventDefault()})},c.prototype.enableScrolling=function(){a("body").off("touchmove.bs"),a("body").removeClass("lockIphone")},c.prototype.show=function(){if(!this.state){var c=a.Event("show.bs.offcanvas");this.$element.trigger(c),c.isDefaultPrevented()||this.hideOthers(a.proxy(function(){this.state="slide-in",this.$element.css("width",""),this.calcPlacement(),this.setWidth();var c=this.getCanvasElements(),d=this.placement,e=this.opposite(d),f=this.offset();-1!==c.index(this.$element)&&(a(this.$element).data("offcanvas-style",a(this.$element).attr("style")||""),this.$element.css(d,-1*f),this.$element.css(d)),c.addClass("canvas-sliding").each(function(){var c=a(this);void 0===c.data("offcanvas-style")&&c.data("offcanvas-style",c.attr("style")||""),"static"!==c.css("position")||b||c.css("position","relative"),"auto"!==c.css(d)&&"0px"!==c.css(d)||"auto"!==c.css(e)&&"0px"!==c.css(e)||c.css(d,0)}),this.options.disableScrolling&&this.disableScrolling(),(this.options.modal||this.options.backdrop)&&this.toggleBackdrop();var g=function(){"slide-in"==this.state&&(this.state="slid",c.removeClass("canvas-sliding").addClass("canvas-slid"),this.$element.trigger("shown.bs.offcanvas"))};setTimeout(a.proxy(function(){this.$element.addClass("in"),this.slide(c,f,a.proxy(g,this))},this),1)},this))}},c.prototype.hideOthers=function(b){var c=!1,d=this.$element.attr("id"),e=a('.offcanvas-clone:not([data-id="'+d+'"])');if(!e.length)return b();e.each(function(d,e){var f=a(e).attr("data-id"),g=a("#"+f);(c=g.hasClass("canvas-slid"))&&(g.one("hidden.bs.offcanvas",b),g.offcanvas("hide"))}),c||b()},c.prototype.hide=function(){if("slid"===this.state){var b=a.Event("hide.bs.offcanvas");if(this.$element.trigger(b),!b.isDefaultPrevented()){this.state="slide-out";var c=a(".canvas-slid"),d=(this.placement,-1*this.offset()),e=function(){"slide-out"==this.state&&(this.state=null,this.placement=null,this.$element.removeClass("in"),c.removeClass("canvas-sliding"),c.add(this.$element).add("body").each(function(){a(this).attr("style",a(this).data("offcanvas-style")).removeData("offcanvas-style")}),this.$element.css("width",""),this.$element.trigger("hidden.bs.offcanvas"))};this.options.disableScrolling&&this.enableScrolling(),(this.options.modal||this.options.backdrop)&&this.toggleBackdrop(),c.removeClass("canvas-slid").addClass("canvas-sliding"),setTimeout(a.proxy(function(){this.slide(c,d,a.proxy(e,this))},this),1)}}},c.prototype.toggle=function(){"slide-in"!==this.state&&"slide-out"!==this.state&&this["slid"===this.state?"hide":"show"]()},c.prototype.toggleBackdrop=function(b){b=b||a.noop;var c=150;if("slide-in"==this.state){var d=a("body"),e=a.support.transition;this.$backdrop=a('