1 /* global __ interface theme biblionumber */
3 $(document).ready(function(){
4 $("html").on("drop", function(e) {
9 $("#zipfile").on("click", function(){
10 $("biblionumber_entry").hide();
13 $("#image").on("click", function(){
14 $("#biblionumber_entry").show();
17 $("#uploadfile").validate({
18 submitHandler: function() {
24 $("#filedrag").on("click", ".cancel_image", function(){
25 $("#click_to_select").show();
26 $("#messages").html("");
27 $("#fileToUpload").prop( "disabled", false );
28 $("#process_images, #fileuploadstatus").hide();
30 }).on("click", ".save_image", function(e){
32 $("#processfile").submit();
35 $("html").on("drop", function(e) {
36 /* Prevent the default browser action when image is dropped */
37 /* i.e. don't navigate to a view of the local image */
42 $('#filedrag').on('dragenter dragover dragleave', function (e) {
43 /* Handle various drag and drop events in "Drop files" area */
44 /* If event type is "dragover," add the "hover" class */
45 /* otherwise set no class name */
48 e.target.className = (e.type == "dragover" ? "hover" : "");
51 $("#filedrag").on("click", function(){
52 /* Capture a click inside the drag and drop area */
53 /* Trigger the <input type="file"> action */
54 $("#fileToUpload").click();
58 $('#filedrag').on('drop', function (e) {
65 $("#fileToUpload").on("change", function(){
69 $('.thumbnails .remove').on("click", function(e) {
71 var result = confirm(__("Are you sure you want to delete this cover image?"));
72 var imagenumber = $(this).data("coverimg");
73 if ( result == true ) {
74 removeLocalImage(imagenumber);
79 function prepUpLoad( event ){
80 $("#click_to_select,#upload_results").hide();
81 $("#messages").html("");
84 file = event.originalEvent.dataTransfer.files[0];
86 file = $('#fileToUpload')[0].files[0];
89 $("#fileuploadstatus, #upload_options").show();
90 var fd = new FormData();
91 fd.append('file', file);
92 if( ParseFile( file ) ){
97 function StartUpload( fd ) {
98 $('#uploadform button.submit').prop('disabled',true);
99 $("#uploadedfileid").val('');
100 AjaxUpload( fd, $('#fileuploadprogress'), 'temp=1', cbUpload );
103 function cbUpload( status, fileid, errors ) {
104 if( status=='done' ) {
105 $("#uploadedfileid").val( fileid );
106 $('#fileToUpload').prop('disabled',true);
107 $("#process_images").show();
109 var errMsgs = [ __("Error code 0 not used"), __("File already exists"), __("Directory is not writeable"), __("Root directory for uploads not defined"), __("Temporary directory for uploads not defined") ];
110 var errCode = errors[$('#fileToUpload').prop('files')[0].name].code;
111 $("#fileuploadstatus").hide();
112 $("#fileuploadfailed").show();
113 $("#fileuploadfailed").text( __("Upload status: ") +
114 ( status=='failed'? __("Failed") + " - (" + errCode + ") " + errMsgs[errCode]:
115 ( status=='denied'? __("Denied"): status ))
117 $("#processfile").hide();
121 function AjaxUpload ( formData, progressbar, xtra, callback ) {
122 var xhr= new XMLHttpRequest();
123 var url= '/cgi-bin/koha/tools/upload-file.pl?' + xtra;
124 progressbar.val( 0 );
125 progressbar.next('.fileuploadpercent').text( '0' );
126 xhr.open('POST', url, true);
127 xhr.upload.onprogress = function (e) {
128 var p = Math.round( (e.loaded/e.total) * 100 );
129 progressbar.val( p );
130 progressbar.next('.fileuploadpercent').text( p );
132 xhr.onload = function () {
133 var data = JSON.parse( xhr.responseText );
134 if( data.status == 'done' ) {
135 progressbar.val( 100 );
136 progressbar.next('.fileuploadpercent').text( '100' );
138 callback( data.status, data.fileid, data.errors );
140 xhr.onerror = function () {
141 // Probably only fires for network failure
142 alert(__("An error occurred while uploading.") );
144 xhr.send( formData );
148 // output file information
149 function ParseFile(file) {
151 if (file.type.indexOf("image") == 0) {
152 /* If the uploaded file is an image, show it */
153 var reader = new FileReader();
154 reader.onload = function(e) {
156 '<p><img class="cover_preview" src="' + e.target.result + '" /></p>'
159 $("#biblionumber_entry").show().find("input,label").addClass("required").prop("required", true );
160 $("#image").prop("checked", true ).change();
161 $("#zipfile").prop("checked", false );
162 reader.readAsDataURL(file);
163 } else if( file.type.indexOf("zip") > 0) {
165 '<p><i class="fa-solid fa-zipper" aria-hidden="true"></i></p>'
167 $("#biblionumber_entry").hide();
168 $("#image").prop("checked", false );
169 $("#zipfile").prop("checked", true );
172 '<div class="dialog alert"><strong>' + __("Error:") + ' </strong> ' + __("This tool only accepts ZIP files or GIF, JPEG, PNG, or XPM images.") + '</div>'
179 "<p>" + __("File name:") + " <strong>" + file.name + "</strong><br />" +
180 __("File type:") + " <strong>" + file.type + "</strong><br />" +
181 __("File size:") + " <strong>" + convertSize( file.size ) + "</strong>"
186 // output information
187 function Output(msg) {
188 var m = document.getElementById("messages");
189 m.innerHTML = msg + m.innerHTML;
193 function convertSize(size) {
194 var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
195 if (size == 0) return '0 Byte';
196 var i = parseInt(Math.floor(Math.log(size) / Math.log(1024)));
197 return Math.round(size / Math.pow(1024, i), 2) + ' ' + sizes[i];
200 function removeLocalImage(imagenumber) {
201 var thumbnail = $("#imagenumber-" + imagenumber );
202 var copy = thumbnail.html();
203 thumbnail.find("img").css("opacity", ".2");
204 thumbnail.find("a.remove").html("<img style='display:inline-block' src='" + interface + "/" + theme + "/img/spinner-small.gif' alt='' />");
207 url: "/cgi-bin/koha/svc/cover_images?action=delete&biblionumber=" + biblionumber + "&imagenumber=" + imagenumber,
208 success: function(data) {
209 $(data).each( function() {
210 if ( this.deleted == 1 ) {
211 location.href="/cgi-bin/koha/tools/upload-cover-image.pl?biblionumber=" + biblionumber;
213 thumbnail.html( copy );
214 alert(__("An error occurred on deleting this image"));
219 thumbnail.html( copy );
220 alert(__("An error occurred on deleting this image"));
225 function resetForm(){
226 $("#uploadpanel,#upload_options,#process_images").hide();
227 $("#click_to_select").show();