nightTab/js/edge.js

var edge = (function() {

  var _timer = null;
  var _currentEdge = null;

  var destroy = function() {
    var allEdge = helper.eA(".edge");
    if (allEdge[0]) {
      for (var i = 0; i < allEdge.length; i++) {
        allEdge[i].destroy();
      };
    };
  };

  var render = function(override) {
    var options = {
      element: null,
      delay: null
    };
    if (override) {
      options = helper.applyOptions(options, override);
    };
    var _resize = function() {
      var rect = options.element.getBoundingClientRect();
      _currentEdge.style.width = rect.width + "px";
      _currentEdge.style.height = rect.height + "px";
      _currentEdge.style.top = rect.top + "px";
      _currentEdge.style.left = rect.left + "px";
    };
    var _makeEdge = function() {
      helper.setObject({
        object: state.get(),
        path: "edge",
        newValue: true
      });
      var html = helper.e("html");
      var body = helper.e("body");
      var edgeElement = helper.node("div|class:edge is-transparent");
      edgeElement.destroy = function() {
        if (edgeElement.classList.contains("is-opaque")) {
          helper.removeClass(edgeElement, "is-opaque");
          helper.addClass(edgeElement, "is-transparent");
        } else {
          edgeElement.remove();
        };
        _currentEdge = null;
        helper.setObject({
          object: state.get(),
          path: "edge",
          newValue: false
        });
      };
      edgeElement.addEventListener("transitionend", function(event, elapsed) {
        if (event.propertyName === "opacity" && getComputedStyle(this).opacity == 0) {
          this.parentElement.removeChild(this);
          helper.removeClass(html, "is-edge");
        };
      }, false);
      if (options.delay) {
        clearTimeout(_timer);
        _timer = setTimeout(edgeElement.destroy, options.delay);
      };
      helper.addClass(html, "is-edge");
      body.appendChild(edgeElement);
      getComputedStyle(edgeElement).opacity;
      helper.removeClass(edgeElement, "is-transparent");
      helper.addClass(edgeElement, "is-opaque");
      _currentEdge = edgeElement;
    };
    if (options.element != null) {
      if (_currentEdge == null) {
        _makeEdge();
        _resize();
      } else {
        _resize();
      };
    };
  };

  // exposed methods
  return {
    render: render,
    destroy: destroy
  };

})();