temp_formatted_field.patch

diff --git a/ui/src/app/views/subviews/form_fields/formatted_field.js b/ui/src/app/views/subviews/form_fields/formatted_field.js
index 75e6fa0699..f8719669a1 100644
--- a/ui/src/app/views/subviews/form_fields/formatted_field.js
+++ b/ui/src/app/views/subviews/form_fields/formatted_field.js
@@ -1,378 +1,373 @@
 /* XXX: ES6 lint to fix (.mjs only): */
 /* eslint no-var: 0, import/no-unresolved: 0, prefer-rest-params: 0, prefer-arrow-callback: 0, object-shorthand: 0 */
-/* XXX: ES5 lint to fix: */
-/* eslint one-var: 0, no-unused-vars: 0, one-var-declaration-per-line: 0, quotes: 0, no-undef: 0, no-multi-assign: 0, no-use-before-define: 0, no-shadow: 0, comma-dangle: 0, object-curly-spacing: 0, comma-spacing: 0, no-redeclare: 0, no-param-reassign: 0, no-multiple-empty-lines: 0, no-else-return: 0, no-restricted-properties: 0, no-multi-spaces: 0, padded-blocks: 0 */
 
 
 /**
  * @exports FormattedField
  */
+var FormField = require('../form_field');
+var TextField = require('./text_field');
+var Select = require('./select');
+var Template = require('./templates/formatted_field');
+var exponents = require('../../../lib/utils/math/exponents.mjs').exponents;
+var generatePrefixNumeral = require('../../../lib/utils/math/generate-prefix-numeral.mjs').generatePrefixNumeral;
 
-var FormattedField, FormField, Template, Select;
+/**
+ * @author jp
+ * @extends module:FormField
+ * @constructor
+ */
+function FormattedField() {
+    FormattedField.__super__.constructor.apply(this, arguments);
+    return this;
+}
 
-FormField = require("../form_field");
-TextField = require("./text_field");
-Select = require("./select");
-Template = require("./templates/formatted_field");
+extend(FormattedField, FormField);
 
-module.exports = FormattedField = (function(superClass) {
-    extend(FormattedField, superClass);
+/**
+ * @overrides
+ * @ see module:FormField#initialize
+ */
+FormattedField.prototype.initialize = function() {
+    FormattedField.__super__.initialize.apply(this, arguments);
 
-    /**
-     * @author jp
-     * @extends module:FormField
-     * @constructor
-     */
-    function FormattedField() {
-        FormattedField.__super__.constructor.apply(this, arguments);
-        return this;
-    }
+    this.options.type = this.options.type || 'duration';
 
-    /**
-     * @overrides
-     * @ see module:FormField#initialize
-     */
-    FormattedField.prototype.initialize = function(type) {
-        FormattedField.__super__.initialize.apply(this, arguments);
-
-        this.options.type = this.options.type || 'duration';
-
-        this.options.units = this.options.units || '';
-        var units = this.options.units;
-
-        if (!this.options.prefixes) {
-            if (this.options.type === 'duration') {
-                this.options.prefixes = ['seconds', 'minutes', 'hours', 'days'];
-            } else if (this.options.type === 'rate') {
-                this.options.prefixes = _(['', 'K', 'M', 'G', 'T']).map(function(p) {
-                    return p + units;
-                });
-            }
+    this.options.units = this.options.units || '';
+    var units = this.options.units;
+
+    if (!this.options.prefixes) {
+        if (this.options.type === 'duration') {
+            this.options.prefixes = ['seconds', 'minutes', 'hours', 'days'];
+        } else if (this.options.type === 'rate') {
+            this.options.prefixes = _(['', 'K', 'M', 'G', 'T']).map(function(p) {
+                return p + units;
+            });
         }
+    }
 
-        this.options.label.text = this.options.label.text || _(this.options.type).humanize();
+    this.options.label.text = this.options.label.text || _(this.options.type).humanize();
 
-        this.options.value = this.options.value || {
-            raw: null,
-            prefix: null
-        };
+    this.options.value = this.options.value || {
+        raw: null,
+        prefix: null,
+    };
 
-        this._initialValue = _.extend({}, this.options.value);
+    if (!this.options.value.prefix) {
+        var prefixNumeral = generatePrefixNumeral(this.options.value.raw);
+        debugger;
+        this.options.value.prefix = prefixNumeral.prefix;
+        this.options.value.raw = prefixNumeral.val;
+    }
 
-        this.template = this.options.template || Template;
+    this._initialValue = _.extend({}, this.options.value);
 
-        this._fieldIds = [];
+    this.template = this.options.template || Template;
 
-        return this;
-    };
+    this._fieldIds = [];
 
+    return this;
+};
 
-    /**
-     * @overrides
-     * @see module:View#getTemplateData
-     */
-    FormattedField.prototype.getTemplateData = function() {
-        return this.options;
-    };
 
+/**
+ * @overrides
+ * @see module:View#getTemplateData
+ */
+FormattedField.prototype.getTemplateData = function() {
+    return this.options;
+};
 
-    /**
-     * @overrides
-     * @see module:View#getTemplateData
-     */
-    FormattedField.prototype.afterRender = function() {
-        this._renderTextField();
-        this._renderSelectField();
-    };
 
+/**
+ * @overrides
+ * @see module:View#getTemplateData
+ */
+FormattedField.prototype.afterRender = function() {
+    this._renderTextField();
+    this._renderSelectField();
+};
 
-    FormattedField.prototype.focus = function () {
-        this.subviews['formatted-text'].focus();
-    };
 
+FormattedField.prototype.focus = function () {
+    this.subviews['formatted-text'].focus();
+};
 
-    /**
-     * Render the text field subview
-     */
-    FormattedField.prototype._renderTextField = function() {
-        var value = _.extend({}, this._initialValue, this.options.value);
-        var computedValue = this._getFormattedValue(value.raw, value.prefix);
-
-        var textField = this.addSubview(TextField, {
-            id: 'formatted-text',
-            el: this.$el.find('.text'),
-            config: {
+
+/**
+ * Render the text field subview
+ */
+FormattedField.prototype._renderTextField = function() {
+    var value = _.extend({}, this._initialValue, this.options.value);
+    var computedValue = this._getFormattedValue(value.raw, value.prefix);
+
+    var textField = this.addSubview(TextField, {
+        id: 'formatted-text',
+        el: this.$el.find('.text'),
+        config: {
+            state: false,
+            type: 'number',
+            value: computedValue,
+            disabled: this.options.disabled,
+            required: this.options.required,
+            validators: ['int:min(1)'],
+        },
+    });
+    this.off(textField, 'change').on(textField, 'change', this._change);
+    textField.render();
+    this._fieldIds.push(textField.id);
+};
+
+
+/**
+ * Render the select field subview
+ */
+FormattedField.prototype._renderSelectField = function() {
+    var options = this.options.prefixes.map(function(prefix) {
+        return {label: prefix, value: prefix};
+    });
+
+    var selectField = this.addSubview(Select, {
+        id: 'formatted-select',
+        el: this.$el.find('.select'),
+        config: {
+            disabled: this.options.disabled,
+            options: {
                 state: false,
-                type: 'number',
-                value: computedValue,
-                disabled: this.options.disabled,
-                required: this.options.required,
-                validators: ["int:min(1)"]
-            }
-        });
-        this.off(textField, 'change').on(textField, 'change', this._change);
-        textField.render();
-        this._fieldIds.push(textField.id);
-    };
+                value: [this.options.value.prefix || options[0].value],
+                width: '90px',
+                options: options,
+                max: 1,
+                allowSingleDeselect: false,
+                allowEmptyStrings: false,
+            },
+        },
+    });
 
+    this.off(selectField, 'change').on(selectField, 'change', this._change);
+    selectField.render();
+    this._fieldIds.push(selectField.id);
+};
 
-    /**
-     * Render the select field subview
-     */
-    FormattedField.prototype._renderSelectField = function() {
-        var units = this.options.units;
-        var options = this.options.prefixes.map(function(prefix) {
-            return { label: prefix , value: prefix };
-        });
-
-        var selectField = this.addSubview(Select, {
-            id: 'formatted-select',
-            el: this.$el.find('.select'),
-            config: {
-                disabled: this.options.disabled,
-                options: {
-                    state: false,
-                    value: [this.options.value.prefix || options[0].value],
-                    width: "90px",
-                    options: options,
-                    max: 1,
-                    allowSingleDeselect: false,
-                    allowEmptyStrings: false
-                }
-            }
-        });
-
-        this.off(selectField, 'change').on(selectField, 'change', this._change);
-        selectField.render();
-        this._fieldIds.push(selectField.id);
-    };
 
+/*
+ * Change handler for both the text field and select field change events
+ * @listens module:FormField~event:change
+ */
+FormattedField.prototype._change = function() {
+    var prefix = this.subviews['formatted-select'].getValue()[0];
+    var number = this.subviews['formatted-text'].getValue();
+    var raw = null;
+    if (number) {
+        raw = this._getRawValue(number, prefix);
+    }
 
-    /*
-     * Change handler for both the text field and select field change events
-     * @listens module:FormField~event:change
-     */
-    FormattedField.prototype._change = function() {
-        var prefix = this.subviews['formatted-select'].getValue()[0];
-        var number = this.subviews['formatted-text'].getValue();
-        var raw = null;
-        if (number) {
-            raw = this._getRawValue(number, prefix);
-        }
+    this.setValue({
+        value: {
+            raw: raw,
+            prefix: prefix,
+        },
+        trigger: true,
+        change: true,
+    });
+};
 
-        this.setValue({
-            value: {
-                raw: raw,
-                prefix: prefix
-            },
-            trigger: true,
-            change: true
-        });
-    };
 
+/**
+ * @overrides
+ * @return {object} value - The value object for the formatted field with 'raw' and 'prefix' props
+ */
+FormattedField.prototype.getValue = function() {
+    return this.options.value;
+};
 
-    /**
-     * @overrides
-     * @return {object} value - The value object for the formatted field with 'raw' and 'prefix' props
-     */
-    FormattedField.prototype.getValue = function() {
-        return this.options.value;
-    };
 
+/**
+ * Format a raw value given a prefix
+ *
+ * @param {Number} value - The raw, expanded value to format
+ * @param {String} prefix - The units for formatting the value
+ * @return {Number}
+ */
+FormattedField.prototype._getFormattedValue = function(value, prefix) {
+    var formatted;
+    var val = value || this.options.value.raw;
+    var pfix = prefix || this.options.value.prefix;
 
-    /**
-     * Format a raw value given a prefix
-     *
-     * @param {Number} number - The raw, expanded value to format
-     * @param {String} prefix - The units for formatting the value
-     * @return {Number}
-     */
-    FormattedField.prototype._getFormattedValue = function(number, prefix) {
-        var formatted;
-        var number = number || this.options.value.raw;
-        var prefix = prefix || this.options.value.prefix;
+    if (val === null || val === undefined) return null;
 
-        if (number === null || number === undefined) {
-            return null;
-        }
+    val = Number(val);
 
-        number = Number(number);
+    if (this.options.type === 'duration') {
+        formatted = this._calculateFormattedDuration(val, pfix);
+    } else if (this.options.type === 'rate') {
+        formatted = this._calculateFormattedRate(val, pfix);
+    }
 
-        if (this.options.type === 'duration') {
-            formatted = this._calculateFormattedDuration(number, prefix);
-        } else if (this.options.type === 'rate') {
-            formatted = this._calculateFormattedRate(number, prefix);
-        }
+    return formatted;
+};
 
-        return formatted;
-    };
 
+/**
+ * Expand a formatted value given a prefix
+ *
+ * @param {Number} value - The formatted value to expand to a raw value
+ * @param {String} prefix - The units for expanding the value
+ * @return {Number}
+ */
+FormattedField.prototype._getRawValue = function(value, prefix) {
+    debugger;
+    var raw;
+    var val = _.isDefined(value) ? value : this.options.value.raw;
+    var pfix = prefix || this.options.value.prefix;
 
-    /**
-     * Expand a formatted value given a prefix
-     *
-     * @param {Number} number - The formatted value to expand to a raw value
-     * @param {String} prefix - The units for expanding the value
-     * @return {Number}
-     */
-    FormattedField.prototype._getRawValue = function(number, prefix) {
-        var raw;
-        var number = number || this.options.value.raw;
-        var prefix = prefix || this.options.value.prefix;
+    if (val === null || val === undefined) return null;
 
-        if (number === null || number === undefined) {
-            return null;
-        }
+    val = Number(val);
 
-        number = Number(number);
+    if (this.options.type === 'duration') {
+        raw = this._calculateDuration(val, pfix);
+    } else if (this.options.type === 'rate') {
+        raw = this._calculateRate(val, pfix);
+    }
 
-        if (this.options.type === 'duration') {
-            raw = this._calculateDuration(number, prefix);
-        } else if (this.options.type === 'rate') {
-            raw = this._calculateRate(number, prefix);
-        }
-        return raw;
-    };
+    return raw;
+};
 
 
+/*
+ * Convert the selected value to a duration in seconds
+ *
+ * @see module:FormattedField#_getRawValue
+ * @param {Number} number - The formatted time to format as seconds
+ * @param {String} prefix - The units for expanding the value
+ * @return {Integer} The duration in seconds
+ *
+ */
+FormattedField.prototype._calculateDuration = function(number, prefix) {
+    return moment.duration(number, prefix).asSeconds();
+};
+
+
+/*
+ * Convert the raw seconds of a duration to a formatted duration value
+ *
+ * @see module:FormattedField#_getFormattedValue
+ * @param {Number} number - The raw seconds to format
+ * @param {String} prefix - The units for formatting the value
+ * @return  {Integer}  The duration in of time formatted to the prefix provided
+ *
+ */
+FormattedField.prototype._calculateFormattedDuration = function(number, prefix) {
+    return moment.duration(number, 'seconds').as(prefix);
+};
 
-    /*
-     * Convert the selected value to a duration in seconds
-     *
-     * @see module:FormattedField#_getRawValue
-     * @param {Number} number - The formatted time to format as seconds
-     * @param {String} prefix - The units for expanding the value
-     * @return {Integer} The duration in seconds
-     *
-     */
-    FormattedField.prototype._calculateDuration = function(number, prefix) {
-        return moment.duration(number, prefix).asSeconds();
-    };
 
+/**
+ * Convert the selected value to a raw byte value
+ *
+ * @see module:FormattedField#_getRawValue
+ * @param {Number} value - The formatted rate to format as bytes
+ * @param {String} prefix - The units for expanding the value
+ * @return {Integer} The expanded value of the selected rate, i.e. 100Kbps => 100000
+ *
+ */
+FormattedField.prototype._calculateRate = function(value, prefix) {
+    if (!value) return null;
 
-    /*
-     * Convert the raw seconds of a duration to a formatted duration value
-     *
-     * @see module:FormattedField#_getFormattedValue
-     * @param {Number} number - The raw seconds to format
-     * @param {String} prefix - The units for formatting the value
-     * @return  {Integer}  The duration in of time formatted to the prefix provided
-     *
-     */
-    FormattedField.prototype._calculateFormattedDuration = function(number, prefix) {
-        return moment.duration(number, 'seconds').as(prefix);
-    };
+    var prefixValue = (prefix && prefix[0]) || undefined;
+    var exp = exponents[prefixValue] || 1;
 
+    if (prefixValue) {
+        return value * (10 ** exp);
+    }
 
-    /**
-     * Convert the selected value to a raw byte value
-     *
-     * @see module:FormattedField#_getRawValue
-     * @param {Number} number - The formatted rate to format as bytes
-     * @param {String} prefix - The units for expanding the value
-     * @return {Integer} The expanded value of the selected rate, i.e. 100Kbps => 100000
-     *
-     */
-    FormattedField.prototype._calculateRate = function(number, prefix) {
-        if (!number) {
-            return null;
-        }
-        var exp = DeepUI.exponents[prefix && prefix[0]] || 1;
-        if (exp === 1) {
-            return number;
-        } else {
-            return number * Math.pow(10, exp);
-        }
-    };
+    return value;
+};
 
 
+/*
+ * Convert the raw seconds of a duration to a formatted duration value
+ *
+ * @see module:FormattedField#_getFormattedValue
+ * @param {Number} number - The raw bytes to format
+ * @param {String} prefix - The units for formatting the value
+ * @return {Integer} The formatted value of the selected rate
+ *
+ */
+FormattedField.prototype._calculateFormattedRate = function(number, prefix) {
+    if (!number) {
+        return null;
+    }
+    var exp = DeepUI.exponents[prefix && prefix[0]] || 1;
+    if (exp === 1) {
+        return number;
+    }
+    return number / (10 ** exp);
+};
 
-    /*
-     * Convert the raw seconds of a duration to a formatted duration value
-     *
-     * @see module:FormattedField#_getFormattedValue
-     * @param {Number} number - The raw bytes to format
-     * @param {String} prefix - The units for formatting the value
-     * @return {Integer} The formatted value of the selected rate
-     *
-     */
-    FormattedField.prototype._calculateFormattedRate = function(number, prefix) {
-        if (!number) {
-            return null;
-        }
-        var exp = DeepUI.exponents[prefix && prefix[0]] || 1;
-        if (exp === 1) {
-            return number;
-        } else {
-            return number / Math.pow(10, exp);
-        }
-    };
 
+/**
+ * @overrides
+ * @see module:FormField#isEmtpy
+ *
+ * @param {object} value - The value for this field
+ * @param {number} value.raw - The raw, expanded value from the text field
+ * @param {string} value.prefix - The units with which to format the value
+ *
+ * @return {boolean}
+ */
+FormattedField.prototype.isEmpty = function(value) {
+    var emptyText = FormattedField.__super__.isEmpty.call(this, value.raw);
+    var emptySelect = FormattedField.__super__.isEmpty.call(this, value.prefix);
 
-    /**
-     * @overrides
-     * @see module:FormField#isEmtpy
-     *
-     * @param {object} value - The value for this field
-     * @param {number} value.raw - The raw, expanded value from the text field
-     * @param {string} value.prefix - The units with which to format the value
-     *
-     * @return {boolean}
-     */
-    FormattedField.prototype.isEmpty = function(value) {
-        var emptyText   = FormattedField.__super__.isEmpty.call(this, value.raw);
-        var emptySelect = FormattedField.__super__.isEmpty.call(this, value.prefix);
+    return emptyText || emptySelect;
+};
 
-        return emptyText || emptySelect;
-    };
 
+/**
+ * @overrides
+ * @see module:FormField#runValidators
+ *
+ * We rely on the validators for each subview owned by this subview for validation and errors
+ * Then bubble those errors up to this FormattedField
+ *
+ * @return {boolean}
+ */
+FormattedField.prototype.runValidators = function() {
+    var isValid = true;
+    var errors = [];
+
+    _(this._fieldIds).each(_(function(svId) {
+        if (!this.subviews[svId].isValid()) {
+            isValid = false;
+            errors = errors.concat(this.subviews[svId].errors);
+        }
+    }).bind(this));
 
-    /**
-     * @overrides
-     * @see module:FormField#runValidators
-     *
-     * We rely on the validators for each subview owned by this subview for validation and errors
-     * Then bubble those errors up to this FormattedField
-     *
-     * @return {boolean}
-     */
-    FormattedField.prototype.runValidators = function() {
-        var isValid = true;
-        var errors = [];
-
-        _(this._fieldIds).each(_(function(svId) {
-            if (!this.subviews[svId].isValid()) {
-                isValid = false;
-                errors = errors.concat(this.subviews[svId].errors);
-            }
-        }).bind(this));
-
-        this.errors = errors;
-        return isValid;
-    };
+    this.errors = errors;
+    return isValid;
+};
 
 
+/**
+ * @overrides
+ * @see module:FormField#clearErrors
+ *
+ * Because we override the runValidators method, we'll also override the clearErrors method
+ * so that we can clear the errors for each subview owned by this subview.
+ *
+ */
+FormattedField.prototype.clearErrors = function() {
+    // Clear errors for the two subviews managed by this subview
+    _(this._fieldIds).each(_(function(svId) {
+        this.subviews[svId].clearErrors();
+    }).bind(this));
+
     /**
-     * @overrides
-     * @see module:FormField#clearErrors
-     *
-     * Because we override the runValidators method, we'll also override the clearErrors method
-     * so that we can clear the errors for each subview owned by this subview.
-     *
+     * Once we clear the subviews individually, then we can use the inherited method from FormField
      */
-    FormattedField.prototype.clearErrors = function() {
-        // Clear errors for the two subviews managed by this subview
-        _(this._fieldIds).each(_(function(svId) {
-            this.subviews[svId].clearErrors();
-        }).bind(this));
-
-        /**
-         * Once we clear the subviews individually, then we can use the inherited method from FormField
-         */
-        FormattedField.__super__.clearErrors.apply(this, arguments);
-    };
-
-
-    return FormattedField;
+    FormattedField.__super__.clearErrors.apply(this, arguments);
+};
 
-})(FormField);
+module.exports = FormattedField;