link config comp to upload files to endpoint

config_app/js/components/load-config/load-config.component.ts

@@ -1,32 +1,47 @@
 import { Input, Component, Inject } from 'ng-metadata/core';
 const templateUrl = require('./load-config.html');
+const styleUrl = require('./load-config.css');
+
+declare let bootbox: any;
+declare let window: any;
 
 @Component({
     selector: 'load-config',
     templateUrl,
+    styleUrls: [ styleUrl ],
 })
 export class LoadConfigComponent {
-    private resetUpload: number = 0;
+    private isReady: boolean = false;
+    private uploadFunc: Function;
 
-    private handleTarballSelected(files, callback) {
-        console.log('hi world')
-        /*
-        $scope.certsUploading = true;
-        $upload.upload({
-            url: '/api/v1/superuser/customcerts/' + files[0].name,
-            method: 'POST',
-            data: {'_csrf_token': window.__token},
-            file: files[0]
-        }).success(function() {
-            callback(true);
-            $scope.resetUpload++;
-            loadCertificates();
-        }).error(function(r) {
-            bootbox.alert('Could not upload certificate')
-            callback(false);
-            $scope.resetUpload++;
-            loadCertificates();
-        });
-        */
+    private constructor(@Inject('ApiService') private apiService: any) {
     }
+
+    private handleTarballSelected(files: File[], callback: Function) {
+        this.isReady = true;
+        callback(true)
+    }
+
+    private handleTarballCleared() {
+        this.isReady = false;
+    }
+
+    private uploadTarball() {
+        this.uploadFunc(resp => {
+            console.log('hi')
+            console.log(resp)
+        });
+    }
+
+    /**
+     * When files are validated, this is called by the child to give us
+     * the callback function to upload
+     * @param files: files to upload
+     * @param uploadFiles: function to call to upload files
+     */
+    private filesValidated(files, uploadFiles) {
+        this.uploadFunc = uploadFiles;
+    }
+
+
 }

config_app/js/components/load-config/load-config.css

@@ -0,0 +1,4 @@
+
+
+.load-config__body strong {
+}

config_app/js/components/load-config/load-config.html

@@ -8,14 +8,20 @@
                     <h4 class="modal-title"><span>Load Config</span></h4>
                 </div>
                 <!-- Body -->
-                <div>
-                    Please upload a tarball
+                <div class="modal-body">
+                    <span>Please upload the previous configuration</span>
                     <div class="file-upload-box"
                          select-message="Select a previous configuration to modify. Must be in tar.gz format"
                          files-selected="$ctrl.handleTarballSelected(files, callback)"
-                         reset="$ctrl.resetUpload"
+                         files-cleared="$ctrl.handleFilesCleared()"
+                         files-validated="$ctrl.filesValidated(files, uploadFiles)"
                          extensions="['application/gzip', '.gz']"></div>
                 </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-primary" ng-click="$ctrl.uploadTarball()" ng-disabled="!$ctrl.isReady">
+                        Upload Configuration
+                    </button>
+                </div>
             </div><!-- /.modal-content -->
         </div><!-- /.modal-dialog -->
     </div>