diff options
Diffstat (limited to 'vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest')
3 files changed, 193 insertions, 0 deletions
diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.controller.js b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.controller.js new file mode 100644 index 00000000..93024043 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.controller.js @@ -0,0 +1,58 @@ +(function () { + 'use strict'; + + appDS2.controller("attachTestEnvManifestController", ["$uibModalInstance", "$uibModal", "$log", "$scope", + attachTestEnvManifestController]); + + function attachTestEnvManifestController($uibModalInstance, $uibModal, $log, $scope) { + var vm = this; + + var init = function () { + vm.manifest = ""; + vm.error=""; + }; + + vm.close = function () { + $uibModalInstance.close(); + }; + + vm.submit = function () { + $uibModalInstance.close(vm.manifest); + }; + + vm.isSubmitDisabled = function () { + return !(vm.manifest); + }; + + + + /* + Must be $scope because we bind to the onchange of the html (cannot attached to vm variable). + We use scope because angular doesn't support ng-change on input file + https://github.com/angular/angular.js/issues/1375 + https://stackoverflow.com/questions/17922557/angularjs-how-to-check-for-changes-in-file-input-fields + */ + $scope.selectAttachmentManifest = function (fileInput) { + if (fileInput && fileInput.id) { + vm.manifest = ""; + vm.error=""; + var file = fileInput.files[0]; + vm.filename=file.name; + var fileReader = new FileReader(); + fileReader.onload = function (load) { + try { + var lines = load.target.result; + vm.manifest = JSON.parse(lines); + } catch (error) { + $log.error(error); + vm.error = "file: " + vm.filename + " is not a valid JSON" + } + $scope.$apply(); + }; + fileReader.readAsText(file); + } + }; + + init(); + } +})();
\ No newline at end of file diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.css b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.css new file mode 100644 index 00000000..ff06addb --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.css @@ -0,0 +1,109 @@ +.modal-header { + border: none!important; + padding: 10px 20px 0px 20px!important; + font-family: "OpenSans-Light"; + font-size: 22px; + color: #000000; +} + +.modal-header h3 { + font-family: "OpenSans-Light"; + color: #000000; + color: #000000; + font-size: 22px; + font-weight: 300; + line-height: 16px; + padding-bottom: 20px; + border-bottom: 3px solid #009fdb; + +} + +.control-label { + font-family: "OpenSans-Light"; + color: #5a5a5a; + font-size: 13px; + font-weight: 400; +} + +.modal-content { + width: 468px; + height: 242px; + border-radius: 8px; + background-color: #ffffff; +} + +body .modal-body { + padding-bottom: 0; + padding-top: 0; + padding-left: 20px; + padding-right: 20px; + width: 468px; + height: 91px; +} + +.modal-footer { + margin-top: 0; + background-color: #fff; +} + + +.modal-close { + margin: -60px 5px 0 0; + color: #5a5a5a; + font-size: 20px; + cursor: pointer; +} + +.inputfile { + width: 0.1px; + height: 0.1px; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: -1; +} + +.manifestName{ + font-family: OpenSans-Semibold; + font-size: 12px; + color: #191919; +} + +.manifestFileName { + width: 389px; + height: 37px; + background: #FFFFFF; + border: 1px solid #D2D2D2; + border-radius: 2px; + display: inline-block; + line-height: 37px; + font-weight: normal !important; + padding-left: 3px; + border-bottom-right-radius: 0; + border-top-right-radius: 0; +} + +.elipsisImg { + width: 37px; + padding: 10px; + background: #FFFFFF; + border: 1px solid #D2D2D2; + display: inline-block; + cursor: pointer; + vertical-align: top; + border-radius: 2px; + border-bottom-left-radius: 0; + border-top-left-radius: 0; +} + +.labelForImage { + vertical-align: top; +} + +.errorLabel { + color: red; +} + + + + diff --git a/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.html b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.html new file mode 100644 index 00000000..12e0ab33 --- /dev/null +++ b/vid-app-common/src/main/webapp/app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.html @@ -0,0 +1,26 @@ +<link rel="stylesheet" type="text/css" href="app/vid/styles/modal-buttons.css"> +<link rel="stylesheet" type="text/css" + href="app/vid/scripts/modals/attach-test-env-manifest/attach-test-env-manifest.css"/> +<div class="modal-header"> + <h3 id="modal-title">Attach Manifest</h3> + <span ng-click="vm.close()" class="pull-right modal-close" aria-hidden="true">×</span> +</div> +<form name="Attach Manifest" ng-submit="vm.submit()"> + <div class="modal-body"> + <label id="manifestName" class="manifestName">Manifest Name</label> + <input onchange="angular.element(this).scope().selectAttachmentManifest(this)" type="file" + id="testEnvManifestFileInput" class="inputfile" accept=".json"/> + <label id="manifestFileName" class="manifestFileName">{{vm.filename}}</label><label for="testEnvManifestFileInput" class="labelForImage" > + <span class="icon-browse"></span> + </label><label id="errorLabel" class="errorLabel">{{vm.error}}</label> + + </div> + <div class="modal-footer"> + <div class="pull-right"> + <button type="submit" id="submit" name="submit" class="btn btn-primary" + ng-disabled="vm.isSubmitDisabled()">Attach + </button> + <button type="button" id="cancel" name="cancel" class="btn btn-white" ng-click="vm.close()">Cancel</button> + </div> + </div> +</form> |