Element.prototype.toggle = function() {
  if (this.state != "shown") {
    this.show();
  } else {
    this.hide();
  }
}

Element.prototype.show = function() {
  if (this.state == "empty") {
    this.load();
  }
  this.tag.show();
  this.state = "shown";
}

Element.prototype.hide = function() {
  if (this.state == "empty") {
    this.load();
  }
  this.tag.hide();
  this.state = "hidden";
}

Element.prototype.showHTML = function() {
  this.tag.html(this.data.results);

  if (this.id in Element.visualisers) {
    var visual = new Element.visualisers[this.id](this.data.results);
  }

  var elems = this.tag.find("a[type='lexp']"),
      _this = this;

  elems.attr("source",_this.id);
  elems.click(this.lexp.localHref);
  this.tag.find(".can-collapse").hide();

  this.tag.find("a[href^='#']").click(function(e) {
    var id = $(this).attr("href").substr(1);
    var target = $("div.can-collapse[id='" + id + "']", _this.tag);
    target.toggle();
    target.parent(".can-collapse").show();
  });
}

Element.prototype.showJSON = function() {
  if (this.id != 'walenty') {
    if (this.id in Element.visualisers) {
      var visual = new Element.visualisers[this.id](this.data.results);
      if(!visual.showHTML(this.tag)) {
        return;
      }
    }
  }

  this.tag.width("90%");
  this.tag.height(300);
  var editor = ace.edit(this.tag.get(0).id);

  editor.getSession().setMode("ace/mode/json");
  editor.setOptions({
    wrap: true,
    readOnly: true,
    highlightActiveLine: false,
    highlightGutterLine: false
  });
  editor.$blockScrolling = Infinity;
  editor.setShowPrintMargin(false);
  editor.renderer.$cursorLayer.element.style.opacity = 0;
  editor.setValue(JSON.stringify(this.data.results, null, 2), 1);

  if (this.id == 'walenty') {
    if (this.id in Element.visualisers) {
      var visual = new Element.visualisers[this.id](this.data.results);
      if(!visual.showHTML(this.tag)) {
        return;
      }
    }
  }
}

Element.prototype.showElement = function() {
  if (typeof this.data.results === 'string' || this.data.results instanceof String) {
    this.showHTML();
  } else {
    this.showJSON();
  }
}

Element.prototype.load = function() {
  var loading = '<img src="/img/loading.gif" height="40" width="40"></img>';
  this.tag.html(loading);
  var _what = "/lexp/";
  var _this = this;
  //console.log(this.lexp);
  var _task = {"function":"get","element":this.lexp.element,"resource":this.id};
  // console.log(_what);
  // console.log(_this);
  // console.log(_task);
  console.log(JSON.stringify(_task));
  $.ajax({
    type: "POST",
    contentType: 'application/json',
    data: JSON.stringify(_task),
    url: _what,
    cache: false,
    processData: false,
    dataType: "json",
    success: function(res) {
      console.log(res);
      _this.data = res;
      _this.showElement();
    },
    error: function(jqXHR, exception) {
      nlp_error(jqXHR, exception);
      return;
    }
  });
}

Element.prototype.setTag = function(tag) {
  this.tag = tag;
}

function Element(tag, id, infoData, lexp) {
  // console.log(tag);
  // console.log(id);
  // console.log(infoData);
  // console.log(lexp);
  this.tag = tag;
  this.id = id;
  this.formats = infoData.formats;
  this.state = "empty";
  this.lexp = lexp;
}

Element.addVisualizer = function(name, callback) {
  /*console.log("dodałem: " + name);
  console.log("CALLBACK");
  console.log(callback);*/
  Element.visualisers[name] = callback;
}

Element.visualisers = new Object();