Fix select file via MenuItem in Firefox

instead of an inline FileButton, just use an unattached input element to
trigger the select file dialog.

source/UI/js/Menu/Menu.js

@@ -463,10 +463,6 @@ Ox.Menu = function(options, self) {
             item = that.items[self.options.selected];
             if (item) {
                 item.removeClass('OxSelected');
-                if (item.options('file')) {
-                    item.$button.blurButton();
-                    that.bindEvent({key_enter: clickSelectedItem})
-                }
             }
             /* disabled
             that.triggerEvent('deselect', {
@@ -485,10 +481,6 @@ Ox.Menu = function(options, self) {
             });
             item.options('items').length && that.submenus[item.options('id')].showMenu();
             item.addClass('OxSelected');
-            if (item.options('file')) {
-                item.$button.focusButton();
-                that.unbindEvent('key_enter');
-            }
             that.triggerEvent('select', {
                 id: item.options('id'),
                 title: Ox.isString(item.options('title')[0])

source/UI/js/Menu/MenuItem.js

@@ -51,9 +51,6 @@ Ox.MenuItem = function(options, self) {
                     that[
                         self.options.disabled ? 'addClass' : 'removeClass'
                     ]('OxDisabled');
-                    self.options.file && that.$button.options({
-                        disabled: self.options.disabled
-                    });
                 },
                 keyboard: function() {
                     self.options.keyboard = parseKeyboard(self.options.keyboard);
@@ -77,6 +74,27 @@ Ox.MenuItem = function(options, self) {
         self.options.checked = false;
     }
 
+    if (self.options.file) {
+        self.$input = $('<input>')
+            .attr(
+                Ox.extend({
+                    type: 'file'
+                }, self.options.file.multiple ? {
+                    multiple: true
+                } : {})
+            )
+            .on({
+                change: function(event) {
+                    var filelist = this.files
+                    var files = [];
+                    Ox.loop(filelist.length, function(i) {
+                        files.push(filelist.item(i));
+                    });
+                    self.options.menu.clickItem(self.options.position, files);
+                }
+            })
+    }
+
     that.append(
             that.$status = Ox.$('<td>')
                 .addClass('OxCell OxStatus')
@@ -104,21 +122,17 @@ Ox.MenuItem = function(options, self) {
                     : {}
                 )
                 .html(
-                    self.options.file
+                    Ox.isString(self.options.title[0])
-                        ? that.$button = Ox.FileButton(Ox.extend({
+                        ? self.options.title[0]
-                                disabled: self.options.disabled,
+                        : Ox.$('<div>').html(self.options.title[0]).html()
-                                title: self.options.title[0]
+                ).on({
-                            }, self.options.file)).bindEvent({
+                    click: self.options.file ? function(event) {
-                                click: function(data) {
+                        !self.options.disabled && self.$input.click()
-                                    self.options.menu.clickItem(self.options.position, data.files);
+                        event.preventDefault()
-                                }
+                        event.stopPropagation()
-                            })
+                    } : null
-                        : (
+
-                            Ox.isString(self.options.title[0])
+                })
-                                ? self.options.title[0]
-                                : Ox.$('<div>').html(self.options.title[0]).html()
-                        )
-                )
         )
         .append(
             that.$modifiers = Ox.$('<td>')