From e85a1bce0a0ec2277a65670d1593ff59afde18df Mon Sep 17 00:00:00 2001 From: Joseph Schorr Date: Thu, 29 Sep 2016 15:19:21 +0200 Subject: [PATCH] Redo the UI for the run trigger dialog to be much cleaner Fixes #774 --- static/css/core-ui.css | 38 ++- .../directives/ui/dockerfile-build-dialog.css | 4 + .../directives/ui/dockerfile-build-form.css | 38 ++- static/css/directives/ui/file-upload-box.css | 117 ++++++++ .../directives/dockerfile-build-dialog.html | 65 ++-- static/directives/dockerfile-build-form.html | 70 ++--- static/directives/file-upload-box.html | 42 +++ .../repo-view/repo-panel-builds.html | 2 +- .../directives/ui/dockerfile-build-dialog.js | 38 ++- .../js/directives/ui/dockerfile-build-form.js | 281 ++++-------------- static/js/directives/ui/file-upload-box.js | 154 ++++++++++ static/js/pages/new-repo.js | 46 ++- static/partials/new-repo.html | 15 +- 13 files changed, 541 insertions(+), 369 deletions(-) create mode 100644 static/css/directives/ui/file-upload-box.css create mode 100644 static/directives/file-upload-box.html create mode 100644 static/js/directives/ui/file-upload-box.js diff --git a/static/css/core-ui.css b/static/css/core-ui.css index 1f256c9b2..a29a8c7ac 100644 --- a/static/css/core-ui.css +++ b/static/css/core-ui.css @@ -1659,4 +1659,40 @@ a:focus { .cor-confirm-dialog-element .progress-message { margin-bottom: 10px; font-size: 16px; -} \ No newline at end of file +} + +.co-top-tab-bar { + padding: 0px; + margin: 0px; + padding-left: 10px; + + margin-bottom: 10px; + border-bottom: 1px solid #eee; +} + +.co-top-tab-bar li { + display: inline-block; + list-style: none; + text-align: center; + padding: 6px; + padding-left: 10px; + padding-right: 10px; + border-bottom: 1px solid #eee; + font-size: 15px; + cursor: pointer; + color: #666; + + bottom: -2px; + position: relative; +} + +.co-top-tab-bar li.active { + color: #51a3d9; + border-bottom: 2px solid #51a3d9; + top: 2px; +} + +.modal-header.ahead-of-tabs { + border-bottom: 0px; + padding-bottom: 4px; +} diff --git a/static/css/directives/ui/dockerfile-build-dialog.css b/static/css/directives/ui/dockerfile-build-dialog.css index e79e9717b..1917b7f4f 100644 --- a/static/css/directives/ui/dockerfile-build-dialog.css +++ b/static/css/directives/ui/dockerfile-build-dialog.css @@ -20,3 +20,7 @@ font-size: 12px; } +.dockerfile-build-dialog-element .fa-exclamation-triangle { + margin-right: 4px; + color: #FCA657; +} \ No newline at end of file diff --git a/static/css/directives/ui/dockerfile-build-form.css b/static/css/directives/ui/dockerfile-build-form.css index 2b0b95299..77b68b30b 100644 --- a/static/css/directives/ui/dockerfile-build-form.css +++ b/static/css/directives/ui/dockerfile-build-form.css @@ -1,24 +1,20 @@ -.dockerfile-build-form table td { - vertical-align: top; - white-space: nowrap; -} - -.dockerfile-build-form .file-drop { - padding: 0px; -} - -.dockerfile-build-form input[type="file"] { - margin: 0px; -} - .dockerfile-build-form .help-text { - font-size: 13px; - color: #aaa; - margin-top: 10px; - margin-bottom: 16px; + font-size: 14px; + margin-bottom: 10px; } -.dockerfile-build-form dd { - padding-left: 20px; - padding-top: 14px; -} \ No newline at end of file +.dockerfile-build-form .robot-permission { + margin-top: 10px; + background: #fafafa; + padding: 20px; +} + +.dockerfile-build-form .co-alert { + margin-top: 10px; + margin-bottom: 0px; +} + +.dockerfile-build-form .starting-build { + text-align: center; + padding: 20px; +} diff --git a/static/css/directives/ui/file-upload-box.css b/static/css/directives/ui/file-upload-box.css new file mode 100644 index 000000000..e94fa2959 --- /dev/null +++ b/static/css/directives/ui/file-upload-box.css @@ -0,0 +1,117 @@ +/* Based off of http://tympanus.net/Tutorials/CustomFileInputs/ */ + +.file-upload-box-element .file-drop { + width: 0.1px; + height: 0.1px; + opacity: 0; + overflow: hidden; + position: absolute; + z-index: -1; +} + +.file-upload-box-element .file-input-container { + text-align: center; + padding: 20px; +} + +.file-upload-box-element .fa-times-circle { + margin-right: 4px; + color: #D64456; +} + +.file-upload-box-element .fa-check-circle { + margin-right: 4px; + color: #2FC98E; +} + +.file-upload-box-element .select-message { + color: #888; +} + +.file-upload-box-element .file-drop + label { + margin-top: 14px; + margin-bottom: 20px; + cursor: pointer; +} + +.file-upload-box-element .file-drop + label .chosen-file { + background: white; + display: inline-block; + height: 34px; + line-height: 34px; + padding-left: 10px; + padding-right: 10px; + font-weight: normal; + width: 250px; + + border: 1px solid #ccc; + border-radius: 4px; + border-top-right-radius: 0px; + border-bottom-right-radius: 0px; +} + +.file-upload-box-element .file-drop + label .choose-button { + text-overflow: ellipsis; + white-space: nowrap; + cursor: pointer; + display: inline-block; + overflow: hidden; + padding: 8px; + background-color: #51a3d9; + color: white; + font-weight: normal; + font-size: 16px; + height: 34px; + vertical-align: top; + padding-left: 16px; + padding-right: 16px; + line-height: 18px; + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; +} + +.file-upload-box-element .file-drop + label:hover .choose-button { + background-color: #3d769c; +} + +.file-upload-box-element .file-drop + label:hover .chosen-file { + border-color: #3d769c; +} + +.file-upload-box-element .file-drop + label.okay .choose-button { + background-color: #2FC98E; +} + +.file-upload-box-element .file-drop + label.okay .chosen-file { + border-color: #2FC98E; +} + +.file-upload-box-element .file-drop + label.error .choose-button { + background-color: #D64456; +} + +.file-upload-box-element .file-drop + label.error .chosen-file { + border-color: #D64456; +} + +.file-upload-box-element .file-drop + label.uploading .choose-button { + background-color: #666; +} + +.file-upload-box-element .file-drop + label.uploading .chosen-file { + border-color: #666; +} + + +.file-upload-box-element .file-drop + label .fa { + color: white; + margin-right: 6px; +} + +.file-upload-box-element .file-drop + label * { + pointer-events: none; +} + +.file-upload-box-element .status-message { + font-size: 16px; +} \ No newline at end of file diff --git a/static/directives/dockerfile-build-dialog.html b/static/directives/dockerfile-build-dialog.html index 6a8396f55..115cd1daa 100644 --- a/static/directives/dockerfile-build-dialog.html +++ b/static/directives/dockerfile-build-dialog.html @@ -1,55 +1,68 @@
-
+
-
- +
+

- Start new Dockerfile build + Start Repository Build

+
    +
  • Invoke Build Trigger
    • +
  • Upload Dockerfile
    • +
-
- - -
-
{{ errorMessage }}
-
+
- - - - - +

Manually running a build trigger provides the means for invoking a build trigger as-if + called from the underlying service for the latest commit to a particular branch or tag.

+ +
- - You do not have permission to run this trigger -
+ + + + + + + + + + + +
Trigger Description
+ Run Trigger Now + + No permission to run + +
- - + +
diff --git a/static/directives/dockerfile-build-form.html b/static/directives/dockerfile-build-form.html index 02253858c..e039532aa 100644 --- a/static/directives/dockerfile-build-form.html +++ b/static/directives/dockerfile-build-form.html @@ -1,48 +1,32 @@
-
-
- Uploading file {{ upload_file }} -
-
+
+
+
Please wait while starts the build
+
+
+
+ +
+
+

The selected Dockerfile contains a FROM that refers to private repository {{ privateBaseRepository }}.

+

+ A robot account with read access to that repository is required for the build: +

+
+
+
+ Robot account {{ pullEntity.name }} does not have + read permission on repository {{ privateBaseRepository }}.
- -
-
-
Dockerfile or .tar.gz or .zip:
-
-
- {{ dockerfileError }} -
- - -
Note: If an archive, the Dockerfile must be in the root directory.
-
- Reading Dockerfile: -
-
-
- -
-
Base Image Pull Credentials:
-
-
- Warning: Robot account {{ pullEntity.name }} does not have - read permission on repository {{ privateBaseRepository }}, so - this build will fail with an authorization error. -
-
-
- The selected Dockerfile contains a FROM that refers to the private - repository {{ privateBaseRepository }}. - A robot account with read access to that repository is required for the build. -
-
-
-
diff --git a/static/directives/file-upload-box.html b/static/directives/file-upload-box.html new file mode 100644 index 000000000..614e05ae9 --- /dev/null +++ b/static/directives/file-upload-box.html @@ -0,0 +1,42 @@ +
+
+
+ + +
+ +
+ +
+
+
+
+
+ + Uploading file {{ currentlyUploadingFile.name }}... +
+ +
{{ selectMessage }}
+
+ + {{ message }} +
+
+ + {{ message }} +
+
+
\ No newline at end of file diff --git a/static/directives/repo-view/repo-panel-builds.html b/static/directives/repo-view/repo-panel-builds.html index 6dbc8876d..a38d783b4 100644 --- a/static/directives/repo-view/repo-panel-builds.html +++ b/static/directives/repo-view/repo-panel-builds.html @@ -2,7 +2,7 @@

Repository Builds

diff --git a/static/js/directives/ui/dockerfile-build-dialog.js b/static/js/directives/ui/dockerfile-build-dialog.js index fb6408914..c3afdff94 100644 --- a/static/js/directives/ui/dockerfile-build-dialog.js +++ b/static/js/directives/ui/dockerfile-build-dialog.js @@ -14,30 +14,12 @@ angular.module('quay').directive('dockerfileBuildDialog', function () { 'buildStarted': '&buildStarted' }, controller: function($scope, $element, ApiService) { - $scope.building = false; - $scope.uploading = false; - $scope.startCounter = 0; $scope.viewTriggers = false; $scope.triggers = null; + $scope.startTriggerCounter = 0; $scope.startTrigger = null; - $scope.handleBuildStarted = function(build) { - $element.find('.dockerfilebuildModal').modal('hide'); - if ($scope.buildStarted) { - $scope.buildStarted({'build': build}); - } - }; - - $scope.handleBuildFailed = function(message) { - $scope.errorMessage = message; - }; - - $scope.startBuild = function() { - $scope.errorMessage = null; - $scope.startCounter++; - }; - $scope.showTriggers = function(value) { $scope.viewTriggers = value; }; @@ -48,11 +30,27 @@ angular.module('quay').directive('dockerfileBuildDialog', function () { $scope.startTriggerCounter++; }; + $scope.startBuild = function() { + $scope.buildStarting = true; + $scope.startBuildCallback(function(status, messageOrBuild) { + $element.find('.dockerfilebuildModal').modal('hide'); + if (status) { + $scope.buildStarted({'build': messageOrBuild}); + } else { + bootbox.alert(messageOrBuild || 'Could not start build'); + } + }); + }; + + $scope.readyForBuild = function(startBuild) { + $scope.startBuildCallback = startBuild; + }; + $scope.$watch('showNow', function(sn) { if (sn && $scope.repository) { $scope.viewTriggers = false; $scope.startTrigger = null; - $scope.errorMessage = null; + $scope.buildStarting = false; $element.find('.dockerfilebuildModal').modal({}); diff --git a/static/js/directives/ui/dockerfile-build-form.js b/static/js/directives/ui/dockerfile-build-form.js index 28d1a26ed..958cef047 100644 --- a/static/js/directives/ui/dockerfile-build-form.js +++ b/static/js/directives/ui/dockerfile-build-form.js @@ -10,151 +10,69 @@ angular.module('quay').directive('dockerfileBuildForm', function () { restrict: 'C', scope: { 'repository': '=repository', - 'startNow': '=startNow', - 'isReady': '=isReady', - 'uploadFailed': '&uploadFailed', - 'uploadStarted': '&uploadStarted', - 'buildStarted': '&buildStarted', - 'buildFailed': '&buildFailed', - 'missingFile': '&missingFile', - 'uploading': '=uploading', - 'building': '=building' + + 'isReady': '=?isReady', + + 'readyForBuild': '&readyForBuild' }, controller: function($scope, $element, ApiService, DockerfileService, Config) { - var MEGABYTE = 1000000; - var MAX_FILE_SIZE = 100 * MEGABYTE; + $scope.state = 'empty'; - var resetState = function() { - $scope.hasDockerFile = false; - $scope.pullEntity = null; - $scope.dockerfileState = 'none'; - $scope.privateBaseRepository = null; - $scope.isReady = false; + var checkPrivateImage = function(baseImage) { + var params = { + 'repository': baseImage + }; + + $scope.state = 'checking-image'; + ApiService.getRepo(null, params).then(function(repository) { + $scope.privateBaseRepository = repository.is_public ? null : baseImage; + $scope.state = 'awaiting-bot'; + }, function() { + $scope.privateBaseRepository = baseImage; + $scope.state = 'awaiting-bot'; + }); }; - resetState(); - - $scope.handleFilesChanged = function(files) { - $scope.dockerfileError = ''; - $scope.privateBaseRepository = null; + $scope.handleFilesSelected = function(files, opt_callback) { $scope.pullEntity = null; + $scope.state = 'checking'; + $scope.selectedFiles = files; - $scope.dockerfileState = 'loading'; - $scope.hasDockerFile = files.length > 0; - - var checkPrivateImage = function(baseImage) { - var params = { - 'repository': baseImage - }; - - ApiService.getRepo(null, params).then(function(repository) { - $scope.privateBaseRepository = repository.is_public ? null : baseImage; - $scope.dockerfileState = 'ready'; - }, function() { - $scope.privateBaseRepository = baseImage; - $scope.dockerfileState = 'ready'; - }); - }; - - var loadError = function(msg) { - $scope.$apply(function() { - $scope.dockerfileError = msg || 'Could not read uploaded Dockerfile'; - $scope.dockerfileState = 'error'; - }); - }; - - var gotDockerfile = function(df) { - $scope.$apply(function() { - var baseImage = df.getRegistryBaseImage(); - if (baseImage) { - checkPrivateImage(baseImage); - } else { - $scope.dockerfileState = 'ready'; - } - }); - }; - - if (files.length > 0) { - if (files[0].size < MAX_FILE_SIZE) { - DockerfileService.getDockerfile(files[0], gotDockerfile, loadError); + DockerfileService.getDockerfile(files[0], function(df) { + var baseImage = df.getRegistryBaseImage(); + if (baseImage) { + checkPrivateImage(baseImage); } else { - $scope.dockerfileState = 'ready'; + $scope.state = 'ready'; } - } else { - $scope.dockerfileState = 'none'; - } - }; - var handleBuildFailed = function(message) { - message = message || 'Dockerfile build failed to start'; - - var result = false; - if ($scope.buildFailed) { - result = $scope.buildFailed({'message': message}); - } - - if (!result) { - bootbox.dialog({ - "message": message, - "title": "Cannot start Dockerfile build", - "buttons": { - "close": { - "label": "Close", - "className": "btn-primary" - } - } + $scope.$apply(function() { + opt_callback && opt_callback(true, 'Dockerfile found and valid') }); - } - }; + }, function(msg) { + $scope.state = 'empty'; + $scope.privateBaseRepository = null; - var handleUploadFailed = function(message) { - message = message || 'Error with file upload'; - - var result = false; - if ($scope.uploadFailed) { - result = $scope.uploadFailed({'message': message}); - } - - if (!result) { - bootbox.dialog({ - "message": message, - "title": "Cannot upload file for Dockerfile build", - "buttons": { - "close": { - "label": "Close", - "className": "btn-primary" - } - } + $scope.$apply(function() { + opt_callback && opt_callback(false, msg || 'Could not find valid Dockerfile'); }); - } + }); }; - var handleMissingFile = function() { - var result = false; - if ($scope.missingFile) { - result = $scope.missingFile({}); - } - - if (!result) { - bootbox.dialog({ - "message": 'A Dockerfile or an archive containing a Dockerfile is required', - "title": "Missing Dockerfile", - "buttons": { - "close": { - "label": "Close", - "className": "btn-primary" - } - } - }); - } + $scope.handleFilesCleared = function() { + $scope.state = 'empty'; + $scope.pullEntity = null; + $scope.privateBaseRepository = null; }; - var startBuild = function(fileId) { - $scope.building = true; + $scope.handleFilesValidated = function(uploadFiles) { + $scope.uploadFilesCallback = uploadFiles; + }; + var requestRepoBuild = function(buildPackId, opt_callback) { var repo = $scope.repository; var data = { - 'file_id': fileId + 'file_id': buildPackId }; if ($scope.pullEntity) { @@ -166,101 +84,25 @@ angular.module('quay').directive('dockerfileBuildForm', function () { }; ApiService.requestRepoBuild(data, params).then(function(resp) { - $scope.building = false; - $scope.uploading = false; - - if ($scope.buildStarted) { - $scope.buildStarted({'build': resp}); - } + opt_callback && opt_callback(true, resp); }, function(resp) { - $scope.building = false; - $scope.uploading = false; - - handleBuildFailed(resp.message); + opt_callback && opt_callback(false, 'Could not start build'); + $scope.handleFilesSelected($scope.selectedFiles); }); }; - var conductUpload = function(file, url, fileId, mimeType) { - if ($scope.uploadStarted) { - $scope.uploadStarted({}); - } - - var request = new XMLHttpRequest(); - request.open('PUT', url, true); - request.setRequestHeader('Content-Type', mimeType); - request.onprogress = function(e) { - $scope.$apply(function() { - var percentLoaded; - if (e.lengthComputable) { - $scope.upload_progress = (e.loaded / e.total) * 100; - } - }); - }; - - request.onerror = function() { - $scope.$apply(function() { - handleUploadFailed(); - }); - }; - - request.onreadystatechange = function() { - var state = request.readyState; - var status = request.status; - - if (state == 4) { - if (Math.floor(status / 100) == 2) { - $scope.$apply(function() { - startBuild(fileId); - $scope.uploading = false; - }); - } else { - var message = request.statusText; - if (status == 413) { - message = 'Selected file too large to upload'; - } - - $scope.$apply(function() { - handleUploadFailed(message); - }); - } - } - }; - - request.send(file); - }; - - var startFileUpload = function(repo) { - $scope.uploading = true; - $scope.uploading_progress = 0; - - var uploader = $element.find('#file-drop')[0]; - if (uploader.files.length == 0) { - handleMissingFile(); - $scope.uploading = false; - return; - } - - var file = uploader.files[0]; - $scope.upload_file = file.name; - - var mimeType = file.type || 'application/octet-stream'; - var data = { - 'mimeType': mimeType - }; - - var getUploadUrl = ApiService.getFiledropUrl(data).then(function(resp) { - conductUpload(file, resp.url, resp.file_id, mimeType); - }, function() { - handleUploadFailed('Could not retrieve upload URL'); + var startBuild = function(opt_callback) { + $scope.state = 'uploading-files'; + $scope.uploadFilesCallback(function(status, messageOrIds) { + $scope.state = 'starting-build'; + requestRepoBuild(messageOrIds[0], opt_callback); }); }; - var checkReady = function() { - $scope.isReady = ($scope.dockerfileState == 'ready' && - (!$scope.privateBaseRepository || $scope.pullEntity)); - }; - var checkEntity = function() { + if (!$scope.pullEntity) { return; } + + $scope.state = 'checking-bot'; $scope.currentRobotHasPermission = null; if (!$scope.pullEntity) { return; } @@ -271,18 +113,17 @@ angular.module('quay').directive('dockerfileBuildForm', function () { ApiService.getUserTransitivePermission(null, permParams).then(function(resp) { $scope.currentRobotHasPermission = resp['permissions'].length > 0; + $scope.state = $scope.currentRobotHasPermission ? 'ready' : 'perm-error'; }); }; $scope.$watch('pullEntity', checkEntity); - $scope.$watch('pullEntity', checkReady); - $scope.$watch('dockerfileState', checkReady); - - $scope.$watch('repository', resetState); - - $scope.$watch('startNow', function() { - if ($scope.startNow && $scope.repository && !$scope.uploading && !$scope.building) { - startFileUpload(); + $scope.$watch('state', function(state) { + $scope.isReady = state == 'ready'; + if ($scope.isReady) { + $scope.readyForBuild({ + 'startBuild': startBuild + }); } }); } diff --git a/static/js/directives/ui/file-upload-box.js b/static/js/directives/ui/file-upload-box.js new file mode 100644 index 000000000..c6e276ad8 --- /dev/null +++ b/static/js/directives/ui/file-upload-box.js @@ -0,0 +1,154 @@ +/** + * An element which adds a stylize box for uploading a file. + */ +angular.module('quay').directive('fileUploadBox', function () { + var directiveDefinitionObject = { + priority: 0, + templateUrl: '/static/directives/file-upload-box.html', + replace: false, + transclude: true, + restrict: 'C', + scope: { + 'allowMultiple': '@allowMultiple', + 'selectMessage': '@selectMessage', + + 'filesSelected': '&filesSelected', + 'filesCleared': '&filesCleared', + 'filesValidated': '&filesValidated' + }, + controller: function($rootScope, $scope, $element, ApiService) { + var MEGABYTE = 1000000; + var MAX_FILE_SIZE = MAX_FILE_SIZE_MB * MEGABYTE; + var MAX_FILE_SIZE_MB = 100; + + var number = $rootScope.__fileUploadBoxIdCounter || 0; + $rootScope.__fileUploadBoxIdCounter = number + 1; + + $scope.boxId = number; + $scope.state = 'clear'; + $scope.selectedFiles = []; + + var conductUpload = function(file, url, fileId, mimeType, progressCb, doneCb) { + var request = new XMLHttpRequest(); + request.open('PUT', url, true); + request.setRequestHeader('Content-Type', mimeType); + request.onprogress = function(e) { + $scope.$apply(function() { + if (e.lengthComputable) { progressCb((e.loaded / e.total) * 100); } + }); + }; + + request.onerror = function() { + $scope.$apply(function() { doneCb(false, 'Error when uploading'); }); + }; + + request.onreadystatechange = function() { + var state = request.readyState; + var status = request.status; + + if (state == 4) { + if (Math.floor(status / 100) == 2) { + $scope.$apply(function() { doneCb(true, fileId); }); + } else { + var message = request.statusText; + if (status == 413) { + message = 'Selected file too large to upload'; + } + + $scope.$apply(function() { doneCb(false, message); }); + } + } + }; + + request.send(file); + }; + + var uploadFiles = function(callback) { + var currentIndex = 0; + var fileIds = []; + + var progressCb = function(progress) { + $scope.uploadProgress = progress; + }; + + var doneCb = function(status, messageOrId) { + if (status) { + fileIds.push(messageOrId); + currentIndex++; + performFileUpload(); + } else { + callback(false, messageOrId); + } + }; + + var performFileUpload = function() { + // If we have finished uploading all of the files, invoke the overall callback + // with the list of file IDs. + if (currentIndex >= $scope.selectedFiles.length) { + callback(true, fileIds); + return; + } + + // For the current file, retrieve a file-drop URL from the API for the file. + var currentFile = $scope.selectedFiles[currentIndex]; + var mimeType = currentFile.type || 'application/octet-stream'; + var data = { + 'mimeType': mimeType + }; + + $scope.currentlyUploadingFile = currentFile; + $scope.uploadProgress = 0; + + ApiService.getFiledropUrl(data).then(function(resp) { + // Perform the upload. + conductUpload(currentFile, resp.url, resp.file_id, mimeType, progressCb, doneCb); + }, function() { + callback(false, 'Could not retrieve upload URL'); + }); + }; + + // Start the uploading. + $scope.state = 'uploading'; + performFileUpload(); + }; + + $scope.handleFilesChanged = function(files) { + if ($scope.state == 'uploading') { return; } + + $scope.message = null; + $scope.selectedFiles = files; + + if (files.length == 0) { + $scope.state = 'clear'; + $scope.filesCleared(); + } else { + for (var i = 0; i < files.length; ++i) { + if (files[i].size > MAX_FILE_SIZE) { + $scope.state = 'error'; + $scope.message = 'File ' + files[i].name + ' is larger than the maximum file ' + + 'size of ' + MAX_FILE_SIZE_MB + ' MB'; + return; + } + } + + $scope.state = 'checking'; + $scope.filesSelected({ + 'files': files, + 'callback': function(status, message) { + $scope.state = status ? 'okay' : 'error'; + $scope.message = message; + + if (status) { + $scope.filesValidated({ + 'files': files, + 'uploadFiles': uploadFiles + }); + } + } + }); + } + }; + } + }; + return directiveDefinitionObject; +}); \ No newline at end of file diff --git a/static/js/pages/new-repo.js b/static/js/pages/new-repo.js index ffd9806fe..355ee3854 100644 --- a/static/js/pages/new-repo.js +++ b/static/js/pages/new-repo.js @@ -27,37 +27,26 @@ $scope.repo.namespace = namespace; }; - $scope.handleBuildStarted = function() { - var repo = $scope.repo; - $location.path('/repository/' + repo.namespace + '/' + repo.name); - }; - - $scope.handleBuildFailed = function(message) { - var repo = $scope.repo; - - bootbox.dialog({ - "message": message, - "title": "Could not start Dockerfile build", - "buttons": { - "close": { - "label": "Close", - "className": "btn-primary", - "callback": function() { - $scope.$apply(function() { - $location.path('/repository/' + repo.namespace + '/' + repo.name); - }); - } - } - } - }); - - return true; - }; - $scope.$watch('repo.name', function() { $scope.createError = null; }); + $scope.startBuild = function() { + $scope.buildStarting = true; + $scope.startBuildCallback(function(status, messageOrBuild) { + if (status) { + $location.url('/repository/' + $scope.created.namespace + '/' + $scope.created.name + + '?tab=builds'); + } else { + bootbox.alert(messageOrBuild || 'Could not start build'); + } + }); + }; + + $scope.readyForBuild = function(startBuild) { + $scope.startBuildCallback = startBuild; + }; + $scope.createNewRepo = function() { $scope.creating = true; var repo = $scope.repo; @@ -72,9 +61,10 @@ $scope.creating = false; $scope.created = created; - // Start the upload process if applicable. + // Start the build if applicable. if ($scope.repo.initialize == 'dockerfile' || $scope.repo.initialize == 'zipfile') { $scope.createdForBuild = created; + $scope.startBuild(); return; } diff --git a/static/partials/new-repo.html b/static/partials/new-repo.html index 801b65b58..138f74ae4 100644 --- a/static/partials/new-repo.html +++ b/static/partials/new-repo.html @@ -133,18 +133,14 @@
-
Initialize from Dockerfile
-
+
@@ -165,8 +161,9 @@