'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); /*global document, FormData, CONFIG, XMLHttpRequest */

var _EditorUtils = require('../modules/EditorUtils');

var _EditorUtils2 = _interopRequireDefault(_EditorUtils);

var _iframe = require('../utils/iframe');

var _on = require('on');

var _on2 = _interopRequireDefault(_on);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }

var EditorFiles = function () {
  function EditorFiles() {
    _classCallCheck(this, EditorFiles);

    this._filePathEle = document.getElementById('file-path');
    this.onUpload = (0, _on2.default)(this);
    this._handleChangeFiles = this._changeFiles.bind(this);
    this.rebind();
  }

  _createClass(EditorFiles, [{
    key: 'rebind',
    value: function rebind() {
      var _this = this;

      var files = [].slice.call(document.querySelectorAll('.img-upload input[type="file"], .file-upload input[type="file"]'));

      Array.prototype.forEach.call(files, function (file) {
        file.removeEventListener('change', _this._handleChangeFiles);
        file.addEventListener('change', _this._handleChangeFiles);
      });
    }
  }, {
    key: '_changeFiles',
    value: function _changeFiles(e) {
      this._uploadFile(e.target);
    }
  }, {
    key: '_uploadFile',
    value: function _uploadFile(target) {
      var _this2 = this;

      var formData = new FormData();
      if (target.value == '') {
        console.log('Please choose file!');
        return false;
      }
      _EditorUtils2.default.scrollToInputElement(target);
      var parentTarget = target.parentNode.parentNode;
      var percent = parentTarget.querySelector('.percent');
      var percentHtml = percent.innerHTML;
      var file = target.files[0];
      var uploadError = parentTarget.nextElementSibling;

      uploadError.classList.remove('show');
      uploadError.textContent = '';

      formData.append('uploadfile', file);
      var xhr = new XMLHttpRequest();
      xhr.open('post', '/abe/upload/?baseUrl=' + CONFIG.FILEPATH + '&input=' + target.outerHTML, true);
      xhr.upload.onprogress = function (e) {
        if (e.lengthComputable) {
          var percentage = e.loaded / e.total * 100;
          percent.textContent = percentage.toFixed(0) + '%';
        }
      };
      xhr.onerror = function () {
        console.log('An error occurred while submitting the form. Maybe your file is too big');
      };
      xhr.onload = function () {
        var resp = JSON.parse(xhr.responseText);
        if (resp.error) {
          uploadError.textContent = resp.response;
          uploadError.classList.add('show');
          percent.innerHTML = percentHtml;
          return;
        }
        var input = parentTarget.querySelector('input.file-input');
        input.value = resp.filePath;
        if (resp.thumbs) {
          var parent = input.parentNode;
          var id = input.id;
          Array.prototype.forEach.call(resp.thumbs, function (thumb) {
            var thumdID = id + '_' + thumb.size;
            var inputThumbs = parent.querySelector('[data-id="' + thumdID + '"]');
            if (inputThumbs != null) inputThumbs.value = thumb.name;else {
              var inputThumbs = document.createElement('input');
              inputThumbs.classList.add('form-control');
              inputThumbs.classList.add('form-abe');
              inputThumbs.classList.add('file-input');
              inputThumbs.id = thumdID;
              inputThumbs.setAttribute('data-id', thumdID);
              inputThumbs.value = thumb.name;
              inputThumbs.type = 'hidden';
            }
            parent.appendChild(inputThumbs);
          });
        }
        input.focus();
        input.blur();

        var nodes = (0, _iframe.IframeNode)('#page-template', '[data-abe-' + input.id.replace(/\./g, '-') + ']');
        Array.prototype.forEach.call(nodes, function (node) {
          _EditorUtils2.default.formToHtml(node, input);
        });
        _this2.onUpload._fire(target);
        setTimeout(function () {
          percent.innerHTML = percentHtml;
        }, 1000);
      };
      percent.textContent = '0%';
      xhr.send(formData);
    }
  }]);

  return EditorFiles;
}();

exports.default = EditorFiles;