implement replaceMenu in MainMenu

source/Ox.UI/js/Menu/Ox.MainMenu.js

@@ -33,19 +33,7 @@ Ox.MainMenu = function(options, self) {
     that.layer = $('<div>').addClass('OxLayer');
 
     self.options.menus.forEach(function(menu, position) {
-        that.titles[position] = $('<div>')
+        addMenu(menu, position);
-            .addClass('OxTitle')
-            .html(menu.title)
-            .data('position', position)
-            .appendTo(that.$element);
-        that.menus[position] = Ox.Menu(Ox.extend(menu, {
-                element: that.titles[position],
-                mainmenu: that,
-                size: self.options.size
-            }))
-            .bindEvent({
-                hide: onHideMenu
-            });
     });
 
     if (self.options.extras.length) {
@@ -59,6 +47,30 @@ Ox.MainMenu = function(options, self) {
         });
     }
 
+    function addMenu(menu, position) {
+        that.titles[position] = $('<div>')
+            .addClass('OxTitle')
+            .html(menu.title)
+            .data('position', position);
+        if (position == 0) {
+            if (that.titles.length == 1) {
+                that.titles[position].appendTo(that.$element);
+            } else {
+                that.titles[position].insertBefore(that.titles[1]);
+            }
+        } else {
+            that.titles[position].insertAfter(that.titles[position - 1])
+        }
+        that.menus[position] = Ox.Menu(Ox.extend(menu, {
+                element: that.titles[position],
+                mainmenu: that,
+                size: self.options.size
+            }))
+            .bindEvent({
+                hide: onHideMenu
+            });
+    }
+
     function click(event) {
         var $target = $(event.target),
             position = typeof $target.data('position') != 'undefined'
@@ -105,6 +117,11 @@ Ox.MainMenu = function(options, self) {
         self.focused = false;
     }
 
+    function removeMenu(position) {
+        that.titles[position].remove();
+        that.menus[position].removeElement();
+    }
+
     self.setOption = function(key, value) {
 
     };
@@ -185,6 +202,13 @@ Ox.MainMenu = function(options, self) {
         
     };
 
+    that.replaceMenu = function(id, menu) {
+        var position = Ox.getPositionById(self.options.menus, id);
+        self.options.menus[position] = menu;
+        removeMenu(position);
+        addMenu(menu, position);
+    };
+
     /*@
     selectNextMenu <f> selectNextMenu
     @*/