CodeceptJS/test/data/app/view/form/dropzone.php at f208cabfb633e7431e591f9f93f0197022062913 · codeceptjs/CodeceptJS · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<html><body>
<div id="droparea" style="width:300px;height:200px;border:2px dashed #ccc;padding:20px;">
  <p id="status">Drop files here</p>
</div>
<div id="file-list"></div>
<script>
  var droparea = document.getElementById('droparea');
  droparea.addEventListener('dragenter', function(e) { e.preventDefault(); });
  droparea.addEventListener('dragover', function(e) { e.preventDefault(); });
  droparea.addEventListener('drop', function(e) {
    e.preventDefault();
    var files = e.dataTransfer.files;
    document.getElementById('status').textContent = 'Dropped ' + files.length + ' file(s)';
    var list = document.getElementById('file-list');
    list.innerHTML = '';
    for (var i = 0; i < files.length; i++) {
      var div = document.createElement('div');
      div.className = 'file-info';
      div.textContent = files[i].name + ' - ' + files[i].type + ' - ' + files[i].size;
      list.appendChild(div);
    }
  });
</script>
</body></html>