define(["exports", "shortcut", "core/pubsubhub", "deps/text!ui/ui.css", "core/utils", "core/jquery-enhanced"], function (exports, _shortcut, _pubsubhub, _ui, _utils) {
  "use strict";

  Object.defineProperty(exports, "__esModule", {
    value: true
  });
  exports.ui = exports.name = undefined;

  var _shortcut2 = _interopRequireDefault(_shortcut);

  var _ui2 = _interopRequireDefault(_ui);

  function _interopRequireDefault(obj) {
    return obj && obj.__esModule ? obj : {
      default: obj
    };
  }

  var name = exports.name = "core/ui";

  // Opportunistically inserts the style, with the chance to reduce some FOUC
  // Module core/ui
  // Handles the ReSpec UI
  /*jshint laxcomma:true*/
  // XXX TODO
  //  - look at other UI things to add
  //      - list issues
  //      - lint: validator, link checker, check WebIDL, ID references
  //      - save to GitHub
  //  - make a release candidate that people can test
  //  - once we have something decent, merge, ship as 3.2.0

  var styleElement = document.createElement("style");
  styleElement.id = "respec-ui-styles";
  styleElement.textContent = _ui2.default;
  styleElement.classList.add("removeOnSave");

  document.head.appendChild(styleElement);

  function ariaDecorate(elem, ariaMap) {
    if (!elem) {
      return;
    }
    Array.from(ariaMap.entries()).reduce(function (elem, nameValue) {
      var name = nameValue[0];
      var value = nameValue[1];
      elem.setAttribute("aria-" + name, value);
      return elem;
    }, elem);
  }

  var $respecUI = $("<div id='respec-ui' class='removeOnSave' hidden=true></div>");
  var $menu = $("<ul id=respec-menu role=menu aria-labelledby='respec-pill'></ul>");
  var $modal;
  var $overlay;
  var errors = [];
  var warnings = [];
  var buttons = {};

  (0, _pubsubhub.sub)("start-all", function () {
    document.body.insertAdjacentElement("afterbegin", $respecUI[0]);
  }, { once: true });
  (0, _pubsubhub.sub)("end-all", function () {
    document.body.insertAdjacentElement("afterbegin", $respecUI[0]);
  }, { once: true });

  var $respecPill = $("<button id='respec-pill' disabled>ReSpec</button>");
  $respecPill.click(function (e) {
    e.stopPropagation();
    var expand = this.getAttribute("aria-expanded") === "true" ? "false" : "true";
    this.setAttribute("aria-expanded", expand);
    $menu.toggle();
  }).appendTo($respecUI);
  document.documentElement.addEventListener("click", function () {
    if (window.getComputedStyle($menu[0]).display === "block") {
      $menu.fadeOut(200);
    }
  });
  $menu.appendTo($respecUI);

  var ariaMap = new Map([["controls", "respec-menu"], ["expanded", "false"], ["haspopup", "true"], ["label", "ReSpec Menu"]]);
  ariaDecorate($respecPill[0], ariaMap);

  function errWarn(msg, arr, butName, title) {
    arr.push(msg);
    if (buttons.hasOwnProperty(butName)) {
      buttons[butName].text(arr.length);
      return;
    }
    buttons[butName] = $("<button id='respec-pill-" + butName + "' class='respec-info-button'>" + arr.length + "</button>").appendTo($respecUI).click(function () {
      this.setAttribute("aria-expanded", "true");
      var $ul = $("<ol class='respec-" + butName + "-list'></ol>");
      for (var i = 0, n = arr.length; i < n; i++) {
        var err = arr[i];
        if (err instanceof Error) {
          $("<li><span></span> <a>\u229E</a><pre></pre></li>").appendTo($ul).find("span").text("[" + err.name + "] " + err.message).end().find("a").css({
            fontSize: "1.1em",
            color: "#999",
            cursor: "pointer"
          }).click(function () {
            var $a = $(this),
                state = $a.text(),
                $pre = $a.parent().find("pre");
            if (state === "\u229E") {
              $a.text("\u229F");
              $pre.show();
            } else {
              $a.text("\u229E");
              $pre.hide();
            }
          }).end().find("pre").text(err.stack).css({
            marginLeft: "0",
            maxWidth: "100%",
            overflowY: "hidden",
            overflowX: "scroll"
          }).hide().end();
        } else {
          var tmp = document.createElement("tmp");
          tmp.innerHTML = (0, _utils.markdownToHtml)(err);
          var li = document.createElement("li");
          // if it's only a single element, just copy the contents into li
          if (tmp.firstElementChild === tmp.lastElementChild) {
            while (tmp.firstElementChild && tmp.firstElementChild.hasChildNodes()) {
              li.appendChild(tmp.firstElementChild.firstChild);
            }
            // Otherwise, take everything.
          } else {
            li.innerHTML = tmp.innerHTML;
          }
          $ul[0].appendChild(li);
        }
      }
      ui.freshModal(title, $ul, this);
    });
    var ariaMap = new Map([["expanded", "false"], ["haspopup", "true"], ["controls", "respec-pill-" + butName + "-modal"], ["label", "Document " + title.toLowerCase()]]);
    ariaDecorate(buttons[butName][0], ariaMap);
  }
  var ui = exports.ui = {
    show: function show() {
      try {
        $respecUI[0].hidden = false;
      } catch (err) {
        console.error(err);
      }
    },
    hide: function hide() {
      $respecUI[0].hidden = true;
    },
    enable: function enable() {
      $respecPill[0].removeAttribute("disabled");
    },
    addCommand: function addCommand(label, module, keyShort, icon) {
      icon = icon || "";
      var handler = function handler() {
        $menu.hide();
        require([module], function (mod) {
          mod.show();
        });
      };
      var id = "respec-button-" + label.toLowerCase().replace(/\s+/, "-");
      var menuItem = $('<li role=menuitem><button id="' + id + '" class="respec-option" title="' + keyShort + '"><span class="respec-cmd-icon">' + icon + "</span> " + label + "… </button></li>").click(handler).appendTo($menu);
      if (keyShort) _shortcut2.default.add(keyShort, handler);
      return menuItem[0].querySelector("button");
    },
    error: function error(msg) {
      errWarn(msg, errors, "error", "Errors");
    },
    warning: function warning(msg) {
      errWarn(msg, warnings, "warning", "Warnings");
    },
    closeModal: function closeModal(owner) {
      if ($overlay) $overlay.fadeOut(200, function () {
        $overlay.remove();
        $overlay = null;
      });
      if (owner) {
        owner.setAttribute("aria-expanded", "false");
      }
      if (!$modal) return;
      $modal.remove();
      $modal = null;
    },
    freshModal: function freshModal(title, content, currentOwner) {
      if ($modal) $modal.remove();
      if ($overlay) $overlay.remove();
      $overlay = $("<div id='respec-overlay' class='removeOnSave'></div>").hide();
      var id = currentOwner.id + "-modal";
      var headingId = id + "-heading";
      $modal = $("<div id='" + id + "' class='respec-modal removeOnSave' role='dialog'><h3></h3><div class='inside'></div></div>").hide();
      $modal.find("h3").text(title);
      $modal.find("h3")[0].id = headingId;
      var ariaMap = new Map([["labelledby", headingId]]);
      ariaDecorate($modal[0], ariaMap);
      $modal.find(".inside").append(content);
      $("body").append($overlay).append($modal);
      $overlay.click(function () {
        this.closeModal(currentOwner);
      }.bind(this)).fadeTo(200, 0.5);
      $modal.fadeTo(200, 1);
    }
  };
  _shortcut2.default.add("Esc", function () {
    ui.closeModal();
  });
  _shortcut2.default.add("Ctrl+Alt+Shift+E", function () {
    if (buttons.error) buttons.error.click();
  });
  _shortcut2.default.add("Ctrl+Alt+Shift+W", function () {
    if (buttons.warning) buttons.warning.click();
  });
  window.respecUI = ui;
  (0, _pubsubhub.sub)("error", function (details) {
    ui.error(details);
  });
  (0, _pubsubhub.sub)("warn", function (details) {
    ui.warning(details);
  });
});
//# sourceMappingURL=ui.js.map