From ba3416784fd0718445ff248483ad4b21b1017b18 Mon Sep 17 00:00:00 2001
From: rolux <rolux@rolux.org>
Date: Sat, 14 Feb 2015 19:52:13 +0000
Subject: [PATCH] refactor array input

---
 source/UI/js/Form/ArrayInput.js | 49 ++++++++++++++++++++-------------
 1 file changed, 30 insertions(+), 19 deletions(-)

diff --git a/source/UI/js/Form/ArrayInput.js b/source/UI/js/Form/ArrayInput.js
index 4e4fb9b1..96e25f1b 100644
--- a/source/UI/js/Form/ArrayInput.js
+++ b/source/UI/js/Form/ArrayInput.js
@@ -3,10 +3,9 @@
 /*@
 Ox.ArrayInput <f> Array input
     options <o> Options object
-        getInput    <f> Optional function that returns input element
+        input       <o> Optional functions for complex input elements
         label       <s> string, ''
         max         <n> integer, maximum number of items, 0 for all
-        setWidth    <f> Optional function to set input element width
         sort        <b> fixme: this should probably be removed
         value       <[]>    value
         width       <n|256> width
@@ -20,13 +19,20 @@ Ox.ArrayInput = function(options, self) {
     self = self || {};
     var that = Ox.Element({}, self)
         .defaults({
-            getInput: Ox.Input,
-            isEmpty: function(value) {
-                return value === '';
+            input: {
+                get: Ox.Input,
+                getEmpty: function() {
+                    return '';
+                },
+                isEmpty: function(value) {
+                    return value === '';
+                },
+                setWidth: function($input, width) {
+                    $input.options({width: width});
+                }
             },
             label: '',
             max: 0,
-            setWidth: null,
             sort: false, // fixme: this should probably be removed
             value: [],
             width: 256
@@ -53,7 +59,9 @@ Ox.ArrayInput = function(options, self) {
     self.$addButton = [];
 
     (
-        self.options.value.length ? self.options.value : ['']
+        self.options.value.length
+        ? self.options.value
+        : [self.options.input.getEmpty()]
     ).forEach(function(value, i) {
         addInput(i, value);
     });
@@ -73,13 +81,18 @@ Ox.ArrayInput = function(options, self) {
             self.$element[index].insertAfter(self.$element[index - 1]);
         }
         self.$input.splice(
-            index, 0, self.options.getInput({
+            index, 0, self.options.input.get({
                 width: self.options.width - 48
             })
             .css({float: 'left'})
             .bindEvent({
                 change: function(data) {
-                    self.options.sort && data.value !== '' && sortInputs();
+                    if (
+                        self.options.sort
+                        && !self.options.input.isEmpty(data.value)
+                    ) {
+                        sortInputs();
+                    }
                     self.options.value = getValue();
                     that.triggerEvent('change', {
                         value: self.options.value
@@ -101,8 +114,8 @@ Ox.ArrayInput = function(options, self) {
             .on({
                 click: function() {
                     var index = $(this).parent().data('index');
-                    if (self.$input[index].value() !== '') {
-                        self.$input[index].value('');
+                    if (!self.options.input.isEmpty(self.$input[index])) {
+                        self.$input[index].value(self.options.input.getEmpty());
                         self.options.value = getValue();
                         that.triggerEvent('change', {
                             value: self.options.value
@@ -128,7 +141,7 @@ Ox.ArrayInput = function(options, self) {
             .on({
                 click: function() {
                     var index = $(this).parent().data('index');
-                    addInput(index + 1, '', true);
+                    addInput(index + 1, self.options.input.getEmpty(), true);
                     that.triggerEvent('add');
                 }
             })
@@ -140,7 +153,7 @@ Ox.ArrayInput = function(options, self) {
         return Ox.map(self.$input, function($input) {
             return $input.value();
         }).filter(function(value) {
-            return !self.options.isEmpty(value);
+            return !self.options.input.isEmpty(value);
         });
     };
 
@@ -161,7 +174,9 @@ Ox.ArrayInput = function(options, self) {
             removeInput(0);
         }
         (
-            self.options.value.length ? self.options.value : ['']
+            self.options.value.length
+            ? self.options.value
+            : [self.options.input.getEmpty()]
         ).forEach(function(value, i) {
             addInput(i, value);
         });
@@ -171,11 +186,7 @@ Ox.ArrayInput = function(options, self) {
         self.$label && self.$label.options({width: self.options.width});
         self.$element.forEach(function($element, i) {
             $element.css({width: self.options.width + 'px'});
-            if (self.options.setWidth) {
-                self.options.setWidth(self.options.width - 48);
-            } else {
-                self.$input[i].options({width: self.options.width - 48});
-            }
+            self.options.input.setWidth(self.$input[i], self.options.width - 48);
         });
     }