gd-bs 5.8.5 → 5.8.8

package/build/components/inputGroup/index.js

@@ -43,6 +43,7 @@ var _InputGroup = /** @class */ (function (_super) {
     function _InputGroup(props, template) {
         if (template === void 0) { template = templates_1.HTML; }
         var _this = _super.call(this, template, props) || this;
+        _this._fileValue = null;
         _this._initFl = false;
         // Configure the collapse
         _this.configure();
@@ -67,30 +68,13 @@ var _InputGroup = /** @class */ (function (_super) {
             var label = this.el.querySelector("label");
             if (label) {
                 this.props.id ? label.setAttribute("for", this.props.id) : null;
-                // See if this is a file
-                if (this.props.type == InputGroupTypes.File) {
-                    // Set the class
-                    label.classList.add("form-file-label");
-                    // Set the text
-                    var spanText = document.createElement("span");
-                    spanText.classList.add("form-file-text");
-                    spanText.innerHTML = this.props.label || "Choose a file...";
-                    label.appendChild(spanText);
-                    // Set the button
-                    var spanButton = document.createElement("span");
-                    spanButton.classList.add("form-file-button");
-                    spanButton.innerHTML = "Browse";
-                    label.appendChild(spanButton);
+                // Set the label if it exists
+                if (this.props.label) {
+                    label.innerHTML = this.props.label;
                 }
+                // Else, remove it
                 else {
-                    // Set the label if it exists
-                    if (this.props.label) {
-                        label.innerHTML = this.props.label;
-                    }
-                    // Else, remove it
-                    else {
-                        this.el.removeChild(label);
-                    }
+                    this.el.removeChild(label);
                 }
             }
             // See if the label exists
@@ -188,6 +172,31 @@ var _InputGroup = /** @class */ (function (_super) {
                     }, 1);
                 });
             }
+            // See if this is a file
+            if (this.props.type == InputGroupTypes.File) {
+                // Set the change event
+                elInput.addEventListener("onchange", function (ev) {
+                    // Get the source file
+                    var srcFile = ev.target["files"][0];
+                    if (srcFile) {
+                        var reader = new FileReader();
+                        // Set the file loaded event
+                        reader.onloadend = function (ev) {
+                            _this._fileValue = {
+                                data: ev.target.result,
+                                name: srcFile.name
+                            };
+                        };
+                        // Set the error
+                        reader.onerror = function (ev) {
+                            // Log
+                            console.log("Error reading the file", srcFile, ev.target.error);
+                        };
+                        // Read the file
+                        reader.readAsArrayBuffer(srcFile);
+                    }
+                });
+            }
         }
     };
     // Configures the text box
@@ -238,9 +247,6 @@ var _InputGroup = /** @class */ (function (_super) {
                         break;
                     // File
                     case InputGroupTypes.File:
-                        this.el.classList.add("form-file");
-                        input.classList.remove("form-control");
-                        input.classList.add("form-file-input");
                         input.type = "file";
                         break;
                     // Password
@@ -268,6 +274,7 @@ var _InputGroup = /** @class */ (function (_super) {
     /**
      * Public Interface
      */
+    _InputGroup.prototype.getFileInfo = function () { return this._fileValue; };
     _InputGroup.prototype.getValue = function () { return this.elTextbox.value; };
     // Sets the textbox value
     _InputGroup.prototype.setValue = function (value) {