var selectedCell = '<div class="removeButton">✖</div>'
    + '<span class="nameLabel"></span><div class="spoilerPanel">'
    + '<input type="checkbox" class="spoilerCheckBox">Spoiler</div>';

var selectedFiles = [];
var selectedDiv;
var selectedDivQr;

function addSelectedFile(file) {
  // console.log('upload:::addSelectedFile - file', file)

  var cell = document.createElement('div');
  cell.setAttribute('class', 'selectedCell');

  cell.innerHTML = selectedCell;

  var nameLabel = cell.getElementsByClassName('nameLabel')[0];
  nameLabel.innerHTML = file.name;

  var removeButton = cell.getElementsByClassName('removeButton')[0];

  removeButton.onclick = function() {
    var index = selectedFiles.indexOf(file);

    // consider this optimization
    //selectedDiv.removeChild(cell);
    selectedDiv.removeChild(selectedDiv.childNodes[index]);

    if(selectedDivQr){
      selectedDivQr.removeChild(selectedDivQr.childNodes[index]);
    }

    selectedFiles.splice(selectedFiles.indexOf(file), 1);
  };


  selectedFiles.push(file);

  if(selectedDivQr){
    var clonedCell = cell.cloneNode(true);
    clonedCell.getElementsByClassName('removeButton')[0].onclick = removeButton.onclick;
    selectedDivQr.appendChild(clonedCell);
  }

  selectedDiv.appendChild(cell);

}

function clearSelectedFiles() {
  selectedFiles = [];

  while (selectedDiv.firstChild) {
    selectedDiv.removeChild(selectedDiv.firstChild);
  }

  if(selectedDivQr) {
    while (selectedDivQr.firstChild) {
      selectedDivQr.removeChild(selectedDivQr.firstChild);
    }
  }
}

function setDragAndDrop(qr) {

  var fileInput = document.getElementById('files')

  if(!qr){
    fileInput.style.display = 'none';
    document.getElementById('dragAndDropDiv').style.display = 'block';
  }

  var drop = document.getElementById(qr ? 'dropzoneQr'
                                        : 'dropzone');
  drop.onclick = function() {
    fileInput.click();
  };

  var iOS = /iPad|iPhone|iPod/.test(navigator.userAgent) && !window.MSStream;

  if (iOS) {
    console.log('iOS detected, enabling workaround')
    var lastFileCount = 0
    setInterval(function() {
      // console.log('scanning for file selection', fileInput.files.length, 'files')
      if (fileInput.files.length > lastFileCount) {
        console.log('detected new file')
        for (var i = 0; i < fileInput.files.length; i++) {
          addSelectedFile(fileInput.files[i]);
        }
      }
      lastFileCount = fileInput.files.length
    }, 1000)
  } else {
    fileInput.onchange = function() {

      for (var i = 0; i < fileInput.files.length; i++) {
        addSelectedFile(fileInput.files[i]);
      }

      // what's this about?
      fileInput.type = "text";
      fileInput.type = "file";
    };
  }

  if(!qr){
    selectedDiv = document.getElementById('selectedDiv');
  } else {
    selectedDivQr = document.getElementById('selectedDivQr');
  }

  drop.addEventListener('dragover', function handleDragOver(event) {

    event.stopPropagation();
    event.preventDefault();
    event.dataTransfer.dropEffect = 'copy';

  }, false);

  drop.addEventListener('drop', function handleFileSelect(evt) {
    evt.stopPropagation();
    evt.preventDefault();

    for (var i = 0; i < evt.dataTransfer.files.length; i++) {
      addSelectedFile(evt.dataTransfer.files[i])
    }

  }, false);

}

function checkExistance(file, callback) {
  // console.log('upload:::checkExistance - file', file)
  var reader = new FileReader();

  reader.onloadend = function(e) {

    var mime = file.type;
    var md5 = SparkMD5.ArrayBuffer.hash(reader.result);

    var identifier = md5 + '-' + mime.replace('/', '');

    localRequest('/checkFileIdentifier.js?identifier=' + identifier,
        function requested(error, response) {

          if (error) {
            console.log(error);
            callback();
          } else {

            var exists = JSON.parse(response);

            if (exists) {
              callback(md5, mime);
            } else {
              callback(null, reader.result);
            }

          }

        });

  };

  reader.readAsArrayBuffer(file);

}

function getFilestToUpload(callback, currentIndex, files) {
  // console.log('upload:::getFilestToUpload - files', files, 'currentIndex', currentIndex)

  currentIndex = currentIndex || 0;
  files = files || [];

  // console.log('upload:::getFilestToUpload - files', files.length, 'currentIndex', currentIndex)

  if (currentIndex < selectedFiles.length) {

    var spoiled = selectedDiv.getElementsByClassName('spoilerCheckBox')[currentIndex].checked;

    var file = selectedFiles[currentIndex];

    checkExistance(file, function checked(md5, mime) {

      if (md5) {

        files.push({
          name : selectedFiles[currentIndex].name,
          spoiler : spoiled,
          md5 : md5,
          mime : mime
        });

        getFilestToUpload(callback, ++currentIndex, files)

      } else {
        // the c version is going to be faster than JS
        var reader = new FileReader();

        reader.onloadend = function(e) {

          files.push({
            name : selectedFiles[currentIndex].name,
            content : reader.result,
            spoiler : spoiled
          });

          getFilestToUpload(callback, ++currentIndex, files)

        };

        reader.readAsDataURL(selectedFiles[currentIndex]);

      }

    });

  } else {
    callback(files);
  }

}