AddOverlayDialog.js

"use strict";

/* exported logger */

var AbstractGuiElement = require('./AbstractGuiElement');
var GuiConnector = require('../GuiConnector');
var GuiUtils = require('./leftPanel/GuiUtils');
var LayoutData = require('../map/data/LayoutData');
var NetworkError = require('../NetworkError');

var OverlayParser = require('../map/OverlayParser');

var Functions = require('../Functions');
var logger = require('../logger');
var HttpStatus = require('http-status-codes');

var Promise = require("bluebird");

function AddOverlayDialog(params) {
  AbstractGuiElement.call(this, params);
  var self = this;
  self.registerListenerType("onAddOverlay");
  self.createGui();
}

AddOverlayDialog.prototype = Object.create(AbstractGuiElement.prototype);
AddOverlayDialog.prototype.constructor = AddOverlayDialog;

AddOverlayDialog.prototype.createGui = function () {
  var self = this;
  var guiUtils = new GuiUtils();
  var content = document.createElement("div");
  content.style.width = "100%";
  content.style.height = "100%";
  content.appendChild(guiUtils.createLabel("Name: "));
  var nameInput = Functions.createElement({
    type: "input",
    inputType: "text",
    name: "overlay-name",
  });
  content.appendChild(nameInput);
  content.appendChild(guiUtils.createNewLine());

  content.appendChild(guiUtils.createLabel("Description: "));
  content.appendChild(guiUtils.createNewLine());
  var descriptionInput = Functions.createElement({
    type: "textarea",
    name: "overlay-description",
  });
  content.appendChild(descriptionInput);
  content.appendChild(guiUtils.createNewLine());

  content.appendChild(guiUtils.createLabel("Upload file: "));
  var fileInput = Functions.createElement({
    type: "input",
    inputType: "file",
    name: "overlay-file",
  });
  fileInput.addEventListener("change", function () {
    return self.processFile(fileInput.files[0]);
  }, false);
  content.appendChild(fileInput);
  content.appendChild(guiUtils.createNewLine());

  content.appendChild(guiUtils.createLabel("Or provide list of elements here (one per line): "));
  content.appendChild(guiUtils.createNewLine());
  var contentInput = Functions.createElement({
    type: "textarea",
    name: "overlay-content",
  });
  content.appendChild(contentInput);
  content.appendChild(guiUtils.createNewLine());

  self.getElement().appendChild(content);
};

AddOverlayDialog.prototype.processFile = function (file) {
  var self = this;
  self.setFileContent(null);
  if (file) {
    return new Promise(function (resolve, reject) {
      var reader = new FileReader();
      reader.readAsText(file, "UTF-8");
      reader.onload = function (evt) {
        try {
          var overlayParser = new OverlayParser();
          self.setFileContent(evt.target.result);
          var overlay = overlayParser.parse(evt.target.result);
          var nameInput = $("[name='overlay-name']", self.getElement())[0];
          var descriptionInput = $("[name='overlay-description']", self.getElement())[0];
          if (overlay.getName() !== undefined) {
            nameInput.value = overlay.getName();
          } else {
            var filename = $("[name='overlay-file']", self.getElement())[0].value;
            if (filename.indexOf(".") > 0) {
              filename = filename.substr(0, filename.indexOf("."));
            }
            if (filename.lastIndexOf("\\") >= 0) {
              filename = filename.substr(filename.lastIndexOf("\\") + 1);
            }

            nameInput.value = filename;
          }
          if (overlay.getDescription() !== undefined) {
            descriptionInput.value = overlay.getDescription();
          }
          resolve(self.getFileContent());
        } catch (error) {
          reject(error);
        }
      };
      reader.onerror = function () {
        reject(new Error("Problem reading file"));
      };
    });
  } else {
    return Promise.resolve(null);
  }
};

AddOverlayDialog.prototype.setFileContent = function (fileContent) {
  this._fileContent = fileContent;
};

AddOverlayDialog.prototype.getFileContent = function () {
  var self = this;
  var contentInput = $("[name='overlay-content']", self.getElement())[0];

  if (contentInput.value !== undefined && contentInput.value !== null) {
    contentInput.value = contentInput.value.trim();
    if (contentInput.value !== "") {
      self._fileContent = contentInput.value;
    }
  }
  if (self._fileContent === undefined) {
    return null;
  } else {
    return self._fileContent;
  }
};

AddOverlayDialog.prototype.init = function () {
  return Promise.resolve();
};

AddOverlayDialog.prototype.addOverlay = function () {
  var self = this;
  var nameInput = $("[name='overlay-name']", self.getElement())[0];
  var descriptionInput = $("[name='overlay-description']", self.getElement())[0];
  var filename = $("[name='overlay-file']", self.getElement())[0].value;
  var overlay = new LayoutData({
    name: nameInput.value,
    description: descriptionInput.value,
    content: self.getFileContent(),
    filename: filename,
  });
  GuiConnector.showProcessing();
  return ServerConnector.addOverlay({
    overlay: overlay,
    projectId: self.getProject().getProjectId(),
  }).then(function (result) {
    overlay = result;
    GuiConnector.hideProcessing();
    return self.callListeners("onAddOverlay", overlay);
  });
};

AddOverlayDialog.prototype.destroy = function () {
  $(this.getElement()).dialog("destroy");
};

AddOverlayDialog.prototype.open = function () {
  var self = this;
  var div = self.getElement();
  if (!$(div).hasClass("ui-dialog-content")) {
    var buttons = [{
      text: "UPLOAD",
      click: function () {
        var dialog = this;
        var fileContent = self.getFileContent();
        if (fileContent === null) {
          GuiConnector.alert("Neither file was selected nor data was entered");
        } else if (fileContent.length > 1024 * 256) {
          GuiConnector.alert("File to big.<br>Please reduce file size or contact administrators.");
        } else {
          return self.addOverlay().then(function (result) {
            $(dialog).dialog("close");
            return result;
          }, function (error) {
            GuiConnector.hideProcessing();
            if (error instanceof NetworkError && error.statusCode === HttpStatus.BAD_REQUEST) {
              var errorMessage = JSON.parse(error.content);
              GuiConnector.alert("Problematic input: <br/>" + errorMessage.reason);
            } else {
              GuiConnector.alert(error);
            }
          });
        }
      }
    }, {
      text: "CANCEL",
      click: function () {
        $(this).dialog("close");
      }
    }];

    $(div).dialog({
      title: "Add overlay",
      buttons: buttons,
      modal: true,
    });
  }

  $(div).dialog("open");
};

module.exports = AddOverlayDialog;