Widget:File upload: verschil tussen versies

Uit Dorpsbelang Den Hout
Ga naar:navigatie, zoeken
(Nieuwe pagina aangemaakt met '<noinclude>{{Managed |Version=1.0 |Version notes=1.0 - First managed version |Short description= }} This is the '''Widget:Multi upload''' page. It should be called...')
 
Regel 12: Regel 12:
  
 
</noinclude><includeonly>
 
</noinclude><includeonly>
−
<div id="imgTest" class="upload-preview"></div>
+
<div id="widget-file-upload-preview" ></div>
  
−
<label for="files" class="attachment"><i class="fa fa-edit"></i><input type="file" id="files" name="files[]" class="d-none" multiple /></label><script>
+
<label for="files" ><!--{if (isset($button) && $button!="")}--><!--{$button}--><!--{else}--><button>Upload</button><!--{/if}-->><input type="file" id="widget-file-upload-files" name="files[]" style="display:none" /></label>
 +
<script>
  
 
function uuidv4() {
 
function uuidv4() {
Regel 21: Regel 22:
 
   );
 
   );
 
}
 
}
 +
 +
var counter = 0;
  
 
var uuid = uuidv4();
 
var uuid = uuidv4();
Regel 30: Regel 33:
 
}
 
}
  
−
function uploadFiles(mode){
+
function uploadFiles(evt){
−
var files = document.getElementById('files').files;
+
var files = document.getElementById('widget-file-upload-files').files;
 
var proms = [];  
 
var proms = [];  
 
     for(i = 0; i < files.length; ++i){
 
     for(i = 0; i < files.length; ++i){
 
         file = files[i];
 
         file = files[i];
−
      if(mode == "logo"){
 
−
        var fileName = document.querySelector('input[name="Domein"]').value.replace('.','-')+'-logo.png';
 
−
      }else{
 
 
         var fileName = files[i].name;
 
         var fileName = files[i].name;
−
        }
+
var prom =  doApiCall(file, fileName);
−
var prom =  doApiCall(file, fileName, mode);
 
 
         proms.push(prom)
 
         proms.push(prom)
 
     }
 
     }
Regel 46: Regel 45:
 
       console.log(values);
 
       console.log(values);
 
           console.log('done');
 
           console.log('done');
−
      //  var codeid = document.createElement('input');
+
        var codeid = document.createElement('input');
−
      //  codeid.setAttribute('type','hidden')
+
        codeid.setAttribute('type','hidden')
−
      //  codeid.setAttribute('name','uuid')
+
        codeid.setAttribute('name','uuid')
−
    //    codeid.setAttribute('value', uuid)
+
        codeid.setAttribute('value', uuid)
−
    //    document.getElementById('files').closest('form').appendChild(codeid)
+
        document.getElementById('files').closest('form').appendChild(codeid)
−
    //  submitRealField()
+
        document.getElementById('form-save').click();
−
  document.getElementById('real-submit').click();
 
 
     });
 
     });
  
Regel 58: Regel 56:
  
  
−
function doApiCall(fileToUpload,fileName, mode){
+
function doApiCall(fileToUpload,fileName){
 
return new Promise(function(resolve, reject){
 
return new Promise(function(resolve, reject){
 
formdata = new FormData();  
 
formdata = new FormData();  
 
formdata.append("action", "upload");
 
formdata.append("action", "upload");
−
formdata.append("filename", fileName);
+
formdata.append("filename", filedate+fileName);
 
//formdata.append("filename", fileName);
 
//formdata.append("filename", fileName);
 
formdata.append("token", mw.user.tokens.get( 'editToken' ) );
 
formdata.append("token", mw.user.tokens.get( 'editToken' ) );
Regel 83: Regel 81:
 
                         resolve(data)
 
                         resolve(data)
 
                 //  setTimeout(function(){
 
                 //  setTimeout(function(){
−
                       editFilePage(fileName, mode);
+
                       editFilePage(fileName);
 
                 //  },100)
 
                 //  },100)
 
},
 
},
Regel 95: Regel 93:
  
 
function createPrevieuws(){
 
function createPrevieuws(){
−
   var filesSelected = document.getElementById("files").files;
+
   var filesSelected = document.getElementById("widget-file-upload-files").files;
 
     if (filesSelected.length > 0) {
 
     if (filesSelected.length > 0) {
  
Regel 102: Regel 100:
 
       var fileToLoad = filesSelected[i];
 
       var fileToLoad = filesSelected[i];
 
       var fname = fileToLoad.name;
 
       var fname = fileToLoad.name;
−
console.log(fname.substr( fname.length -3 ))
+
//counter = fname;
 +
console.log(fname);
 
       if(fname.substr( fname.length -3 ) === "pdf"){
 
       if(fname.substr( fname.length -3 ) === "pdf"){
  
−
         document.getElementById("imgTest").innerHTML = document.getElementById("imgTest").innerHTML+'<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="file-pdf" class="svg-inline--fa fa-file-pdf fa-w-12" role="img" viewBox="0 0 384 512"><path fill="currentColor" d="M181.9 256.1c-5-16-4.9-46.9-2-46.9 8.4 0 7.6 36.9 2 46.9zm-1.7 47.2c-7.7 20.2-17.3 43.3-28.4 62.7 18.3-7 39-17.2 62.9-21.9-12.7-9.6-24.9-23.4-34.5-40.8zM86.1 428.1c0 .8 13.2-5.4 34.9-40.2-6.7 6.3-29.1 24.5-34.9 40.2zM248 160h136v328c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V24C0 10.7 10.7 0 24 0h200v136c0 13.2 10.8 24 24 24zm-8 171.8c-20-12.2-33.3-29-42.7-53.8 4.5-18.5 11.6-46.6 6.2-64.2-4.7-29.4-42.4-26.5-47.8-6.8-5 18.3-.4 44.1 8.1 77-11.6 27.6-28.7 64.6-40.8 85.8-.1 0-.1.1-.2.1-27.1 13.9-73.6 44.5-54.5 68 5.6 6.9 16 10 21.5 10 17.9 0 35.7-18 61.1-61.8 25.8-8.5 54.1-19.1 79-23.2 21.7 11.8 47.1 19.5 64 19.5 29.2 0 31.2-32 19.7-43.4-13.9-13.6-54.3-9.7-73.6-7.2zM377 105L279 7c-4.5-4.5-10.6-7-17-7h-6v128h128v-6.1c0-6.3-2.5-12.4-7-16.9zm-74.1 255.3c4.1-2.7-2.5-11.9-42.8-9 37.1 15.8 42.8 9 42.8 9z"/></svg>';
+
         document.getElementById("widget-file-upload-preview").innerHTML = document.getElementById("widget-file-upload-preview").innerHTML+'<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" data-prefix="fas" data-icon="file-pdf" class="svg-inline--fa fa-file-pdf fa-w-12" role="img" viewBox="0 0 384 512"><path fill="currentColor" d="M181.9 256.1c-5-16-4.9-46.9-2-46.9 8.4 0 7.6 36.9 2 46.9zm-1.7 47.2c-7.7 20.2-17.3 43.3-28.4 62.7 18.3-7 39-17.2 62.9-21.9-12.7-9.6-24.9-23.4-34.5-40.8zM86.1 428.1c0 .8 13.2-5.4 34.9-40.2-6.7 6.3-29.1 24.5-34.9 40.2zM248 160h136v328c0 13.3-10.7 24-24 24H24c-13.3 0-24-10.7-24-24V24C0 10.7 10.7 0 24 0h200v136c0 13.2 10.8 24 24 24zm-8 171.8c-20-12.2-33.3-29-42.7-53.8 4.5-18.5 11.6-46.6 6.2-64.2-4.7-29.4-42.4-26.5-47.8-6.8-5 18.3-.4 44.1 8.1 77-11.6 27.6-28.7 64.6-40.8 85.8-.1 0-.1.1-.2.1-27.1 13.9-73.6 44.5-54.5 68 5.6 6.9 16 10 21.5 10 17.9 0 35.7-18 61.1-61.8 25.8-8.5 54.1-19.1 79-23.2 21.7 11.8 47.1 19.5 64 19.5 29.2 0 31.2-32 19.7-43.4-13.9-13.6-54.3-9.7-73.6-7.2zM377 105L279 7c-4.5-4.5-10.6-7-17-7h-6v128h128v-6.1c0-6.3-2.5-12.4-7-16.9zm-74.1 255.3c4.1-2.7-2.5-11.9-42.8-9 37.1 15.8 42.8 9 42.8 9z"/></svg>';
 
       }else{
 
       }else{
  
Regel 115: Regel 114:
 
         var newImage = document.createElement('img');
 
         var newImage = document.createElement('img');
 
         newImage.src = srcData;
 
         newImage.src = srcData;
 +
var dt = filesSelected[counter]
 +
counter = counter + 1;
  
−
         var logos = document.querySelectorAll('[alt="Logo.png"]'), i;
+
         document.getElementById("widget-file-upload-preview").innerHTML = document.getElementById("widget-file-upload-preview").innerHTML+'<div class="upload-group">'+newImage.outerHTML+'<input data="'+dt.name+'" type="text" placeholder="caption" class="form-control"  /></div>';
−
        for(i = 0; i < logos.length; ++i){
 
−
          logos[i].src = srcData;
 
−
          logos[i].srcset = '';
 
−
          logos[i].setAttribute('height', 'auto');
 
−
        }
 
−
      //  document.getElementById("imgTest").innerHTML = document.getElementById("imgTest").innerHTML+newImage.outerHTML;
 
 
       //  alert("Converted Base64 version is " + document.getElementById("imgTest").innerHTML);
 
       //  alert("Converted Base64 version is " + document.getElementById("imgTest").innerHTML);
 
     //  console.log("Converted Base64 version is " + document.getElementById("imgTest").innerHTML);
 
     //  console.log("Converted Base64 version is " + document.getElementById("imgTest").innerHTML);
Regel 133: Regel 128:
 
}
 
}
  
−
function editFilePage(file, mode){
+
function editFilePage(file){
 +
 
 +
console.log(file)
 +
 
 +
var caption = document.querySelector('[data="'+file+'"]').value;
 +
 
 +
console.log(caption)
 +
var taskidel = document.querySelector('[name="mwwrite"]').value;
 +
 
 +
  uuid = taskidel;
 +
 
 +
var newWikitextEdit = '{{File for task|Caption='+caption+'|Task='+uuid+'|File uploaded by=User:'+mw.user.getName()+'|type='+file.substr( file.length -3 )+'}}';
  
−
  if(mode == "logo"){
 
−
    var newWikitextEdit = '{{Domein logo|Domein='+document.querySelector('input[name="Domein"]').value+'|File uploaded by=User:'+mw.user.getName()+'|type='+file.substr( file.length -3 )+'}}';
 
−
  }else{
 
−
      var newWikitextEdit = '{{Bericht file|Bericht='+document.querySelector('input[name="Domein"]').value.replace('.','-')+'/'+document.querySelector('input[name="Titel"]').value.replace(' ','-')+'|Domein='+document.querySelector('input[name="Domein"]').value+'|File uploaded by=User:'+mw.user.getName()+'|type='+file.substr( file.length -3 )+'}}';
 
−
  }
 
  
 
     var params = {
 
     var params = {
 
         action: 'edit',
 
         action: 'edit',
−
         title: 'File:'+file,
+
         title: 'File:'+filedate+file,
 
         text: newWikitextEdit,
 
         text: newWikitextEdit,
 
         format: 'json'
 
         format: 'json'

Versie van 7 sep 2020 08:20

Sjabloon:Managed

This is the Widget:Multi upload page. It should be called in the following format: 

{{#widget:Multi upload }}


Overgenomen van "https://www.denhout.eu/index.php?title=Widget:File_upload&oldid=2215"