FileInput: handle disabled option

source/Ox.UI/js/Form/FileInput.js

@@ -2,10 +2,16 @@
 
 /*@
 Ox.FileInput <f> File Input
+    options <o> Options
+        disabled <b|false> If true, the element is disabled
+        maxFiles <n|-1> Maximum number of files (or -1 for unlimited)
+        maxLines <n|-1> Maximum number of lines to display (or -1 for unlimited)
+        maxSize <n|-1> Maximum total file size in bytes (or -1 for unlimited)
+        value <a|[]> Value (array of file objects)
+        width <w|256> Width in px
+    self <o> Shared private variable
     ([options[, self]]) -> <o:Ox.Element> File Input
         change <!> change
-    options <o> Options
-    self <o> Shared private variable
 @*/
 
 Ox.FileInput = function(options, self) {
@@ -13,6 +19,7 @@ Ox.FileInput = function(options, self) {
     self = self || {};
     var that = Ox.Element({}, self)
         .defaults({
+            disabled: false,
             maxFiles: -1,
             maxLines: -1,
             maxSize: -1,
@@ -20,7 +27,14 @@ Ox.FileInput = function(options, self) {
             width: 256
         })
         .options(options || {})
-        .addClass('OxFileInput')
+        .update({
+            disabled: function() {
+                that[self.options.disabled ? 'addClass' : 'removeClass']('OxDisabled');
+                self.$button.options({disabled: self.options.disabled});
+                self.$input && self.$input[self.options.disabled ? 'hide' : 'show']();
+            }
+        })
+        .addClass('OxFileInput' + (self.options.disabled ? ' OxDisabled' : ''))
         .css({width: self.options.width + 'px'});
 
     self.multiple = self.options.maxFiles != 1;
@@ -60,6 +74,7 @@ Ox.FileInput = function(options, self) {
         .appendTo(self.$bar);
 
     self.$button = Ox.Button({
+            disabled: self.options.disabled,
             style: 'symbol',
             title: self.multiple || self.options.value.length == 0
                 ? 'add' : 'close',
@@ -80,6 +95,7 @@ Ox.FileInput = function(options, self) {
 
     if (self.multiple || self.options.value.length == 0) {
         self.$input = renderInput();
+        self.options.disabled && self.$input.hide();
     }
 
     if (self.multiple) {
@@ -158,7 +174,7 @@ Ox.FileInput = function(options, self) {
             b = b.name.toLowerCase();
             return a < b ? -1 : a > b ? 1 : 0;
         } : function(a, b) {
-            // if there's a max size,
+            // if there is a max size,
             // try to add small files first
             return a.size - b.size;
         }).forEach(function(file) {