var app = (function() {
  var width = window.innerWidth;
  var height = window.innerHeight;
  var layers = [];
  var _layer = [];

  var stage = new Konva.Stage({
    container: "container",
    width: width,
    height: height
  });

  var screen = {
    width: width,
    height: height
  };

  function createLayer() {
    var sequence = 0;
    if (layers == null || layers.length == 0) {
      sequence++;
    } else {
      sequence = layers.length + 1;
    }
    var layer = { sequence: sequence, layer: new Konva.Layer() };
    layers.push(layer);
    if (currentLayer() == undefined && _layer.length == 0) {
      _layer = [];
      _layer.push(layer);
    }
    return layer;
  }

  function bootstrap() {
    createLayer();
    configureDragAndDrop();
    layer = currentLayer();
  }

  function currentLayer() {
    if (_layer[0] == undefined) return undefined;
    return _layer[0].layer;
  }

  function configureDragAndDrop() {
    stage.on("click tap", function(e) {
      if (e.target === stage) {
        stage.find("Transformer").destroy();
        layer.draw();
        return;
      }

      stage.find("Transformer").destroy();

      var tr = new Konva.Transformer({
        anchorStrokeWidth: 2
      });
      layer.add(tr);
      tr.attachTo(e.target);
      layer.draw();
    });
  }

  return {
    stage: stage,
    currentLayer: currentLayer,
    createLayer: createLayer,
    screen: screen,
    bootstrap: bootstrap,
    layers: layers
  };
})();