CommentDialog.js

"use strict";

/* exported logger */

var Promise = require("bluebird");

var AbstractGuiElement = require('./AbstractGuiElement');
var Alias = require('../map/data/Alias');
var Reaction = require('../map/data/Reaction');
var logger = require('../logger');
var Functions = require('../Functions');

function CommentDialog(params) {
  AbstractGuiElement.call(this, params);
  var self = this;
  self._createGui();
  $(self.getElement()).dialog({
    autoOpen : false,
    resizable : false,
    width : window.innerWidth / 2,
    height : window.innerHeight / 2,
  });
}

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

CommentDialog.GENERAL = "<General>";

function createRow(elements) {
  var row = document.createElement('tr');
  for (var i = 0; i < elements.length; i++) {
    var container = document.createElement('td');
    container.appendChild(elements[i]);
    row.appendChild(container);
  }
  return row;
}

CommentDialog.prototype.open = function(types) {
  var self = this;
  self.setTypes([ CommentDialog.GENERAL ]);

  var promises = [ CommentDialog.GENERAL ];
  for (var i = 0; i < types.length; i++) {
    var ie = types[i];
    if (ie.getType() === "ALIAS") {
      promises.push(self.getMap().getSubmapById(ie.getModelId()).getModel().getAliasById(ie.getId(), true));
    } else if (ie.getType() === "REACTION") {
      promises.push(self.getMap().getSubmapById(ie.getModelId()).getModel().getReactionById(ie.getId(), true));
    } else {
      throw new Error("Unknown element type: " + ie.getType());
    }
  }
  return Promise.all(promises).then(function(elements) {
    self.setTypes(elements);
    return ServerConnector.getLoggedUser();
  }).then(function(user) {
    if (user.getLogin() !== "anonymous") {
      self.setEmail(user.getEmail());
      self.setName(user.getName() + " " + user.getSurname());
    }

    $(self.getElement()).dialog("open");
  });
};

CommentDialog.prototype._createGui = function() {
  var self = this;

  var table = document.createElement('table');

  var typeLabel = document.createElement('label');
  typeLabel.innerHTML = "Type";
  var typeOptions = document.createElement("select");
  this.setTypeOptions(typeOptions);

  table.appendChild(createRow([ typeLabel, typeOptions ]));

  var detailDiv = document.createElement('div');

  table.appendChild(createRow([ document.createElement('div'), detailDiv ]));

  var pinnedLabel = document.createElement('label');
  pinnedLabel.innerHTML = "Pinned";
  var pinnedCheckbox = document.createElement('input');
  pinnedCheckbox.type = "checkbox";

  table.appendChild(createRow([ pinnedLabel, pinnedCheckbox ]));
  this.setPinnedCheckbox(pinnedCheckbox);

  var nameLabel = document.createElement('label');
  nameLabel.innerHTML = "Name:<br/>(Visible to moderators only)";
  var nameInput = document.createElement('input');
  nameInput.type = "text";

  table.appendChild(createRow([ nameLabel, nameInput ]));
  this.setNameInput(nameInput);

  var emailLabel = document.createElement('label');
  emailLabel.innerHTML = "Email:<br/>(Visible to moderators only)";
  var emailInput = document.createElement('input');
  emailInput.type = "text";

  table.appendChild(createRow([ emailLabel, emailInput ]));
  this.setEmailInput(emailInput);

  var contentLabel = document.createElement('label');
  contentLabel.innerHTML = "Content:";
  var contentInput = document.createElement('textarea');
  contentInput.cols = "80";
  contentInput.rows = "3";

  table.appendChild(createRow([ contentLabel, contentInput ]));
  this.setContentInput(contentInput);

  var sendButton = document.createElement('button');
  sendButton.innerHTML = "Send";
  sendButton.onclick = function() {
    return self.addComment().then(function() {
      $(self.getElement()).dialog("close");
    });
  };

  table.appendChild(createRow([ sendButton ]));

  self.getElement().appendChild(table);

  typeOptions.onchange = function() {
    var option = self.getSelectedType();
    var text = "";
    if (option instanceof Alias) {
      if (option.getFullName() !== undefined) {
        text = option.getFullName();
      }
    } else if (option instanceof Reaction) {
      text = "Reactants: ";
      var reactants = option.getReactants();
      var i;
      for (i = 0; i < reactants.length; i++) {
        text += reactants[i].getName() + ",";
      }
      text += "<br/>";
      text += "Modifiers: ";
      var modifiers = option.getModifiers();
      for (i = 0; i < modifiers.length; i++) {
        text += modifiers[i].getName() + ",";
      }
      text += "<br/>";
      text += "Products: ";
      var products = option.getProducts();
      for (i = 0; i < products.length; i++) {
        text += products[i].getName() + ",";
      }
      text += "<br/>";
    }
    detailDiv.innerHTML = text;
  };
};
CommentDialog.prototype.setTypes = function(types) {
  var typeOptions = this.getTypeOptions();
  while (typeOptions.firstChild) {
    typeOptions.removeChild(typeOptions.firstChild);
  }

  for (var i = 0; i < types.length; i++) {
    var option = document.createElement("option");
    option.value = i;
    var element = types[i];
    var text = element;
    if (element instanceof Alias) {
      text = element.getType() + ": " + element.getName();
    } else if (element instanceof Reaction) {
      text = "Reaction: " + element.getReactionId();
    }
    option.text = text;
    typeOptions.appendChild(option);
  }
  typeOptions.value = 0;

  this._types = types;
};

CommentDialog.prototype.getTypes = function() {
  return this._types;
};

CommentDialog.prototype.getSelectedType = function() {
  return this._types[this.getTypeOptions().value];
};

CommentDialog.prototype.setSelectedType = function(value) {
  if (Functions.isInt(value)) {
    this.getTypeOptions().value = value;
    this.getTypeOptions().onchange();
  } else {
    throw new Error("Unknown value type: " + value);
  }
};

CommentDialog.prototype.getTypeOptions = function() {
  return this._typeOptions;
};
CommentDialog.prototype.setTypeOptions = function(typeOptions) {
  this._typeOptions = typeOptions;
};
CommentDialog.prototype.setContentInput = function(contentInput) {
  this._contentInput = contentInput;
};
CommentDialog.prototype.getContentInput = function() {
  return this._contentInput;
};
CommentDialog.prototype.setNameInput = function(nameInput) {
  this._nameInput = nameInput;
};
CommentDialog.prototype.getNameInput = function() {
  return this._nameInput;
};
CommentDialog.prototype.setEmailInput = function(emailInput) {
  this._emailInput = emailInput;
};
CommentDialog.prototype.getEmailInput = function() {
  return this._emailInput;
};
CommentDialog.prototype.setPinnedCheckbox = function(pinnedCheckbox) {
  this._pinnedCheckbox = pinnedCheckbox;
};

CommentDialog.prototype.getPinnedCheckbox = function() {
  return this._pinnedCheckbox;
};

CommentDialog.prototype.getTypes = function() {
  return this._types;
};

CommentDialog.prototype.setName = function(name) {
  this.getNameInput().value = name;
};

CommentDialog.prototype.getName = function() {
  return this.getNameInput().value;
};

CommentDialog.prototype.getEmail = function() {
  return this.getEmailInput().value;
};

CommentDialog.prototype.setEmail = function(email) {
  this.getEmailInput().value = email;
};

CommentDialog.prototype.getContent = function() {
  return this.getContentInput().value;
};

CommentDialog.prototype.isPinned = function() {
  return this.getPinnedCheckbox().checked;
};
CommentDialog.prototype.getSelectedTypeId = function() {
  var selected = this.getSelectedType();
  if (selected instanceof Alias) {
    return selected.getId();
  } else if (selected instanceof Reaction) {
    return selected.getId();
  } else {
    return "";
  }
};

CommentDialog.prototype.getSelectedTypeClass = function() {
  var selected = this.getSelectedType();
  if (selected instanceof Alias) {
    return "ALIAS";
  } else if (selected instanceof Reaction) {
    return "REACTION";
  } else {
    return "POINT";
  }
};

CommentDialog.prototype.addComment = function() {
  var self = this;
  var name = self.getName();
  return ServerConnector.addComment({
    modelId : self.getMap().getActiveSubmapId(),
    coordinates : self.getMap().getActiveSubmapClickCoordinates(),
    name : name,
    email : self.getEmail(),
    content : self.getContent(),
    pinned : self.isPinned(),
    elementId : self.getSelectedTypeId(),
    elementType : self.getSelectedTypeClass()

  }).then(function(comment){
    return self.getMap().getOverlayByName("comment").addComment(comment);
  });
};

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

module.exports = CommentDialog;