
Stmx.ui.menus = {
  isVisible: false,

  hide: function () {
    _loseAnyFocus();

    // TODO: Change reference from global variable to object
    this.isVisible = false;
    menuVisible = false;

    var els = document.querySelectorAll('.menu.visible');
    for (var i = 0, el; el = els[i]; i++) {
      el.classList.remove('visible');
    }
  }
};

Stmx.ui.Menu = function (opts) {

  this.trackActionMsg = opts.trackActionMsg || null;
  this.name = opts.name;
  this.alignment = opts.alignment || 'left'; // Set to 'right' if menu should be aligned to right of window
  this.onShowCallback = opts.onShowCallback || null; // Function to execute after menu open

  this.onClick = function () {
    var el = document.querySelector('#' + this.name + '-menu');

    if (!el.classList.contains('visible')) {
      this._show();
    } else {
      this._hide();
    }
  };

  this._show = function () {
    var el = document.querySelector('#' + this.name + '-menu');

    // Hide other UI
    _infoBubble.hide();
    _statusMessage.hide();
    Stmx.ui.menus.hide();

    // Positioning
    if (this.alignment === 'right') {
      // Note: this aligns to right edge of menu bar,
      // instead of the right side of the menu item.
      el.classList.add('align-right');
    } else {
      var pos = _getElAbsolutePos(document.querySelector('#' + this.name + '-menu-item'));
      el.style.left = pos[0] + 'px';
    }

    // Show menu
    el.classList.add('visible');
    Stmx.ui.menus.isVisible = true;
    menuVisible = true; // TODO: Deprecate this global

    // Tracking behavior
    if (this.trackActionMsg !== null) {
      _eventTracking.track(TRACK_CATEGORY_INTERACTION, this.trackActionMsg, null, null, false);
    }

    // Callback
    if (typeof this.onShowCallback === 'function') {
      this.onShowCallback();
    }
  };

  this._hide = function () {
    Stmx.ui.menus.hide();
  };
}


// TODO: Deprecate the following
var menuVisible = false;

function _hideMenus () {
  // Wrapper for object
  Stmx.ui.menus.hide();
}

@@ -379,24 +379,74 @@
 opts) %7B%0A
-%0A  this.
+  // Private%0A  var menus          = Stmx.ui.menus;%0A%0A  var 
 trackAct
@@ -485,21 +485,30 @@
 null
-;%0A  this.name
+,%0A      name          
  = o
@@ -519,17 +519,16 @@
 name
-;%0A  this.
+,%0A      
 alig
@@ -533,16 +533,21 @@
 ignment 
+     
 = opts.a
@@ -555,16 +555,21 @@
 ignment 
+     
 %7C%7C 'left
@@ -569,17 +569,17 @@
 %7C 'left'
-;
+,
  // Set 
@@ -636,21 +636,20 @@
 indow%0A  
-this.
+    
 onShowCa
@@ -685,16 +685,18 @@
 %7C%7C null;
+  
  // Func
@@ -734,305 +734,35 @@
 %0A%0A  
-this.onClick = function () %7B%0A    var el = document.querySelector('#' + this.name + '-menu');%0A%0A    if (!el.classList.contains('visible')) %7B%0A      this._show();%0A    %7D else %7B%0A      this._hide();%0A    %7D%0A  %7D;%0A%0A  this._show = function () %7B%0A    var el = document.querySelector('#' + this.name + '-menu');%0A
+var _show = function (el) %7B
 %0A   
@@ -830,32 +830,24 @@
 hide();%0A    
-Stmx.ui.
 menus.hide()
@@ -856,17 +856,27 @@
 %0A    // 
-P
+Determine p
 ositioni
@@ -886,21 +886,16 @@
     if (
-this.
 alignmen
@@ -1070,16 +1070,72 @@
  else %7B%0A
+      // Aligns menu to the left side of the menu item.%0A
       va
@@ -1189,21 +1189,16 @@
 r('#' + 
-this.
 name + '
@@ -1306,32 +1306,24 @@
 ible');%0A    
-Stmx.ui.
 menus.isVisi
@@ -1423,21 +1423,16 @@
     if (
-this.
 trackAct
@@ -1505,21 +1505,16 @@
 ACTION, 
-this.
 trackAct
@@ -1579,21 +1579,16 @@
 (typeof 
-this.
 onShowCa
@@ -1618,21 +1618,16 @@
 %7B%0A      
-this.
 onShowCa
@@ -1654,68 +1654,289 @@
 %0A%0A  
-thi
+var _hide = function () %7B%0A    menu
 s.
-_
 hide
- = function () %7B%0A    Stmx.ui.menus.hide();
+();%0A  %7D;%0A%0A  // Public%0A  return %7B%0A    onClick: function () %7B%0A      var el = document.querySelector('#' + name + '-menu');%0A%0A      if (!el.classList.contains('visible')) %7B%0A        _show(el);%0A      %7D else %7B%0A        _hide();%0A      %7D%0A    %7D
 %0A  %7D;%0A%7D
-%0A
+;
 %0A%0A//

Split Menu object into actual public/private vars