From d227bdfc75dd5b07905130e68064b66c06e03d66 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Wed, 6 Jul 2016 17:42:56 +1200 Subject: [PATCH 1/9] refactor(ui): remove useless controller declarations --- app/components/networks/networks.html | 3 --- app/components/volumes/volumes.html | 2 -- 2 files changed, 5 deletions(-) diff --git a/app/components/networks/networks.html b/app/components/networks/networks.html index dc5f22f52..381fd500e 100644 --- a/app/components/networks/networks.html +++ b/app/components/networks/networks.html @@ -1,5 +1,3 @@ -
- @@ -9,7 +7,6 @@ Networks -
diff --git a/app/components/volumes/volumes.html b/app/components/volumes/volumes.html index 5919b014b..b4f55107e 100644 --- a/app/components/volumes/volumes.html +++ b/app/components/volumes/volumes.html @@ -1,5 +1,3 @@ -
- From 50391c87e2cc45bcd4623d0f944b359dc8268706 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Thu, 7 Jul 2016 13:17:44 +1200 Subject: [PATCH 2/9] feat(ui): replace ViewSpinner with JQuery animations (#43) --- app/components/container/container.html | 4 ++- .../container/containerController.js | 30 +++++++++---------- .../containerLogs/containerLogsController.js | 14 ++++----- .../containerLogs/containerlogs.html | 4 ++- app/components/containers/containers.html | 3 ++ .../containers/containersController.js | 14 ++++----- .../createContainerController.js | 20 ++++++------- .../createContainer/createcontainer.html | 3 ++ .../createNetwork/createNetworkController.js | 12 ++++---- .../createNetwork/createnetwork.html | 3 ++ .../createVolume/createVolumeController.js | 12 ++++---- app/components/createVolume/createvolume.html | 3 ++ app/components/images/images.html | 4 +++ app/components/images/imagesController.js | 22 +++++++------- app/components/network/network.html | 4 ++- app/components/network/networkController.js | 22 +++++++------- app/components/networks/networks.html | 3 ++ app/components/networks/networksController.js | 14 ++++----- app/components/volumes/volumes.html | 3 ++ app/components/volumes/volumesController.js | 14 ++++----- app/shared/services.js | 14 --------- bower.json | 3 +- gruntFile.js | 1 - 23 files changed, 119 insertions(+), 107 deletions(-) diff --git a/app/components/container/container.html b/app/components/container/container.html index 05803ca02..d3e334f28 100644 --- a/app/components/container/container.html +++ b/app/components/container/container.html @@ -1,5 +1,7 @@ - + + + Containers > {{ container.Name|trimcontainername }} diff --git a/app/components/container/containerController.js b/app/components/container/containerController.js index b33f1eea4..49248a161 100644 --- a/app/components/container/containerController.js +++ b/app/components/container/containerController.js @@ -1,6 +1,6 @@ angular.module('container', []) -.controller('ContainerController', ['$scope', '$stateParams', '$state', '$filter', 'Container', 'ContainerCommit', 'Image', 'Messages', 'ViewSpinner', '$timeout', -function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Image, Messages, ViewSpinner, $timeout) { +.controller('ContainerController', ['$scope', '$stateParams', '$state', '$filter', 'Container', 'ContainerCommit', 'Image', 'Messages', '$timeout', +function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Image, Messages, $timeout) { $scope.changes = []; $scope.editEnv = false; $scope.editPorts = false; @@ -11,7 +11,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; var update = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.get({id: $stateParams.id}, function (d) { $scope.container = d; $scope.container.edit = false; @@ -61,7 +61,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima $scope.newCfg.Binds.push(bind); }); - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }, function (e) { if (e.status === 404) { $('.detail').hide(); @@ -69,13 +69,13 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima } else { Messages.error("Failure", e.data); } - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }); }; $scope.start = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.start({ id: $scope.container.Id, HostConfig: $scope.container.HostConfig @@ -89,7 +89,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.stop = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.stop({id: $stateParams.id}, function (d) { update(); Messages.send("Container stopped", $stateParams.id); @@ -100,7 +100,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.kill = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.kill({id: $stateParams.id}, function (d) { update(); Messages.send("Container killed", $stateParams.id); @@ -111,7 +111,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.commit = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); ContainerCommit.commit({id: $stateParams.id, repo: $scope.container.Config.Image}, function (d) { update(); Messages.send("Container commited", $stateParams.id); @@ -121,7 +121,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }); }; $scope.pause = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.pause({id: $stateParams.id}, function (d) { update(); Messages.send("Container paused", $stateParams.id); @@ -132,7 +132,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.unpause = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.unpause({id: $stateParams.id}, function (d) { update(); Messages.send("Container unpaused", $stateParams.id); @@ -143,7 +143,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.remove = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.remove({id: $stateParams.id}, function (d) { update(); $state.go('containers', {}, {reload: true}); @@ -155,7 +155,7 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.restart = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.restart({id: $stateParams.id}, function (d) { update(); Messages.send("Container restarted", $stateParams.id); @@ -170,10 +170,10 @@ function ($scope, $stateParams, $state, $filter, Container, ContainerCommit, Ima }; $scope.getChanges = function () { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.changes({id: $stateParams.id}, function (d) { $scope.changes = d; - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }); }; diff --git a/app/components/containerLogs/containerLogsController.js b/app/components/containerLogs/containerLogsController.js index 0f1280792..56273ee0c 100644 --- a/app/components/containerLogs/containerLogsController.js +++ b/app/components/containerLogs/containerLogsController.js @@ -1,6 +1,6 @@ angular.module('containerLogs', []) -.controller('ContainerLogsController', ['$scope', '$stateParams', '$anchorScroll', 'ContainerLogs', 'Container', 'ViewSpinner', -function ($scope, $stateParams, $anchorScroll, ContainerLogs, Container, ViewSpinner) { +.controller('ContainerLogsController', ['$scope', '$stateParams', '$anchorScroll', 'ContainerLogs', 'Container', +function ($scope, $stateParams, $anchorScroll, ContainerLogs, Container) { $scope.state = {}; $scope.state.displayTimestampsOut = false; $scope.state.displayTimestampsErr = false; @@ -8,24 +8,24 @@ function ($scope, $stateParams, $anchorScroll, ContainerLogs, Container, ViewSpi $scope.stderr = ''; $scope.tailLines = 2000; - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Container.get({id: $stateParams.id}, function (d) { $scope.container = d; - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }, function (e) { if (e.status === 404) { Messages.error("Not found", "Container not found."); } else { Messages.error("Failure", e.data); } - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }); function getLogs() { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); getLogsStdout(); getLogsStderr(); - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); } function getLogsStderr() { diff --git a/app/components/containerLogs/containerlogs.html b/app/components/containerLogs/containerlogs.html index ab28e8c7d..fc4765891 100644 --- a/app/components/containerLogs/containerlogs.html +++ b/app/components/containerLogs/containerlogs.html @@ -1,5 +1,7 @@ - + + + Containers > {{ container.Name|trimcontainername }} > Logs diff --git a/app/components/containers/containers.html b/app/components/containers/containers.html index d24cf5549..c39a5ca84 100644 --- a/app/components/containers/containers.html +++ b/app/components/containers/containers.html @@ -10,6 +10,9 @@
+
+ +
diff --git a/app/components/containers/containersController.js b/app/components/containers/containersController.js index c22d1e51f..76fc50428 100644 --- a/app/components/containers/containersController.js +++ b/app/components/containers/containersController.js @@ -1,6 +1,6 @@ angular.module('containers', []) -.controller('ContainersController', ['$scope', 'Container', 'Settings', 'Messages', 'ViewSpinner', 'Config', 'errorMsgFilter', -function ($scope, Container, Settings, Messages, ViewSpinner, Config, errorMsgFilter) { +.controller('ContainersController', ['$scope', 'Container', 'Settings', 'Messages', 'Config', 'errorMsgFilter', +function ($scope, Container, Settings, Messages, Config, errorMsgFilter) { $scope.state = {}; $scope.state.displayAll = Settings.displayAll; @@ -14,7 +14,7 @@ function ($scope, Container, Settings, Messages, ViewSpinner, Config, errorMsgFi }; var update = function (data) { - ViewSpinner.spin(); + $('#loadContainersSpinner').show(); $scope.state.selectedItemCount = 0; Container.query(data, function (d) { var containers = d; @@ -24,17 +24,17 @@ function ($scope, Container, Settings, Messages, ViewSpinner, Config, errorMsgFi $scope.containers = containers.map(function (container) { return new ContainerViewModel(container); }); - ViewSpinner.stop(); + $('#loadContainersSpinner').hide(); }); }; var batch = function (items, action, msg) { - ViewSpinner.spin(); + $('#loadContainersSpinner').show(); var counter = 0; var complete = function () { counter = counter - 1; if (counter === 0) { - ViewSpinner.stop(); + $('#loadContainersSpinner').hide(); update({all: Settings.displayAll ? 1 : 0}); } }; @@ -89,7 +89,7 @@ function ($scope, Container, Settings, Messages, ViewSpinner, Config, errorMsgFi } }); if (counter === 0) { - ViewSpinner.stop(); + $('#loadContainersSpinner').hide(); } }; diff --git a/app/components/createContainer/createContainerController.js b/app/components/createContainer/createContainerController.js index ba4d929db..3581e6176 100644 --- a/app/components/createContainer/createContainerController.js +++ b/app/components/createContainer/createContainerController.js @@ -1,6 +1,6 @@ angular.module('createContainer', []) -.controller('CreateContainerController', ['$scope', '$state', 'Config', 'Container', 'Image', 'Volume', 'Network', 'Messages', 'ViewSpinner', 'errorMsgFilter', -function ($scope, $state, Config, Container, Image, Volume, Network, Messages, ViewSpinner, errorMsgFilter) { +.controller('CreateContainerController', ['$scope', '$state', 'Config', 'Container', 'Image', 'Volume', 'Network', 'Messages', 'errorMsgFilter', +function ($scope, $state, Config, Container, Image, Volume, Network, Messages, errorMsgFilter) { $scope.state = { alwaysPull: true @@ -80,25 +80,25 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, V }); function createContainer(config) { - ViewSpinner.spin(); + $('#createContainerSpinner').show(); Container.create(config, function (d) { if (d.Id) { var reqBody = config.HostConfig || {}; reqBody.id = d.Id; Container.start(reqBody, function (cd) { - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.send('Container Started', d.Id); $state.go('containers', {}, {reload: true}); }, function (e) { - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.error('Error', errorMsgFilter(e)); }); } else { - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.error('Error', errorMsgFilter(d)); } }, function (e) { - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.error('Error', errorMsgFilter(e)); }); } @@ -113,7 +113,7 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, V } function pullImageAndCreateContainer(config) { - ViewSpinner.spin(); + $('#createContainerSpinner').show(); var image = _.toLower(config.Image); var imageConfig = createImageConfig(image); @@ -122,13 +122,13 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, V var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); if (err) { var detail = data[data.length - 1]; - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.error('Error', detail.error); } else { createContainer(config); } }, function (e) { - ViewSpinner.stop(); + $('#createContainerSpinner').hide(); Messages.error('Error', 'Unable to pull image ' + image); }); } diff --git a/app/components/createContainer/createcontainer.html b/app/components/createContainer/createcontainer.html index b1b1f5a3f..444db30c3 100644 --- a/app/components/createContainer/createcontainer.html +++ b/app/components/createContainer/createcontainer.html @@ -306,6 +306,9 @@
+
+ +
Cancel
diff --git a/app/components/createNetwork/createNetworkController.js b/app/components/createNetwork/createNetworkController.js index 44a7bd858..f24622f07 100644 --- a/app/components/createNetwork/createNetworkController.js +++ b/app/components/createNetwork/createNetworkController.js @@ -1,6 +1,6 @@ angular.module('createNetwork', []) -.controller('CreateNetworkController', ['$scope', '$state', 'Messages', 'Network', 'ViewSpinner', 'errorMsgFilter', -function ($scope, $state, Messages, Network, ViewSpinner, errorMsgFilter) { +.controller('CreateNetworkController', ['$scope', '$state', 'Messages', 'Network', 'errorMsgFilter', +function ($scope, $state, Messages, Network, errorMsgFilter) { $scope.formValues = { DriverOptions: [] }; @@ -20,18 +20,18 @@ function ($scope, $state, Messages, Network, ViewSpinner, errorMsgFilter) { }; function createNetwork(config) { - ViewSpinner.spin(); + $('#createNetworkSpinner').show(); Network.create(config, function (d) { if (d.Id) { Messages.send("Network created", d.Id); - ViewSpinner.stop(); + $('#createNetworkSpinner').hide(); $state.go('networks', {}, {reload: true}); } else { - ViewSpinner.stop(); + $('#createNetworkSpinner').hide(); Messages.error('Unable to create network', errorMsgFilter(d)); } }, function (e) { - ViewSpinner.stop(); + $('#createNetworkSpinner').hide(); Messages.error('Unable to create network', e.data); }); } diff --git a/app/components/createNetwork/createnetwork.html b/app/components/createNetwork/createnetwork.html index f4ae1d756..f6f332270 100644 --- a/app/components/createNetwork/createnetwork.html +++ b/app/components/createNetwork/createnetwork.html @@ -74,6 +74,9 @@
+
+ +
Cancel
diff --git a/app/components/createVolume/createVolumeController.js b/app/components/createVolume/createVolumeController.js index d33d4c7e1..fb347adb1 100644 --- a/app/components/createVolume/createVolumeController.js +++ b/app/components/createVolume/createVolumeController.js @@ -1,6 +1,6 @@ angular.module('createVolume', []) -.controller('CreateVolumeController', ['$scope', '$state', 'Volume', 'Messages', 'ViewSpinner', 'errorMsgFilter', -function ($scope, $state, Volume, Messages, ViewSpinner, errorMsgFilter) { +.controller('CreateVolumeController', ['$scope', '$state', 'Volume', 'Messages', 'errorMsgFilter', +function ($scope, $state, Volume, Messages, errorMsgFilter) { $scope.formValues = { DriverOptions: [] @@ -19,18 +19,18 @@ function ($scope, $state, Volume, Messages, ViewSpinner, errorMsgFilter) { }; function createVolume(config) { - ViewSpinner.spin(); + $('#createVolumeSpinner').show(); Volume.create(config, function (d) { if (d.Name) { Messages.send("Volume created", d.Name); - ViewSpinner.stop(); + $('#createVolumeSpinner').hide(); $state.go('volumes', {}, {reload: true}); } else { - ViewSpinner.stop(); + $('#createVolumeSpinner').hide(); Messages.error('Unable to create volume', errorMsgFilter(d)); } }, function (e) { - ViewSpinner.stop(); + $('#createVolumeSpinner').hide(); Messages.error('Unable to create volume', e.data); }); } diff --git a/app/components/createVolume/createvolume.html b/app/components/createVolume/createvolume.html index d6fb53e5a..b60bc1a27 100644 --- a/app/components/createVolume/createvolume.html +++ b/app/components/createVolume/createvolume.html @@ -63,6 +63,9 @@
+
+ +
Cancel
diff --git a/app/components/images/images.html b/app/components/images/images.html index 0a539ee8a..3b060ebdc 100644 --- a/app/components/images/images.html +++ b/app/components/images/images.html @@ -33,6 +33,7 @@
+
@@ -45,6 +46,9 @@
+
+ +
diff --git a/app/components/images/imagesController.js b/app/components/images/imagesController.js index 20dbf294f..303673ee0 100644 --- a/app/components/images/imagesController.js +++ b/app/components/images/imagesController.js @@ -1,6 +1,6 @@ angular.module('images', []) -.controller('ImagesController', ['$scope', '$state', 'Image', 'ViewSpinner', 'Messages', -function ($scope, $state, Image, ViewSpinner, Messages) { +.controller('ImagesController', ['$scope', '$state', 'Image', 'Messages', +function ($scope, $state, Image, Messages) { $scope.state = {}; $scope.sortType = 'Created'; $scope.sortReverse = true; @@ -45,32 +45,32 @@ function ($scope, $state, Image, ViewSpinner, Messages) { } $scope.pullImage = function() { - ViewSpinner.spin(); + $('#pullImageSpinner').show(); var image = _.toLower($scope.config.Image); var imageConfig = createImageConfig(image); Image.create(imageConfig, function (data) { var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); if (err) { var detail = data[data.length - 1]; - ViewSpinner.stop(); + $('#pullImageSpinner').hide(); Messages.error('Error', detail.error); } else { - ViewSpinner.stop(); + $('#pullImageSpinner').hide(); $state.go('images', {}, {reload: true}); } }, function (e) { - ViewSpinner.stop(); + $('#pullImageSpinner').hide(); Messages.error('Error', 'Unable to pull image ' + image); }); }; $scope.removeAction = function () { - ViewSpinner.spin(); + $('#loadImagesSpinner').show(); var counter = 0; var complete = function () { counter = counter - 1; if (counter === 0) { - ViewSpinner.stop(); + $('#loadImagesSpinner').hide(); } }; angular.forEach($scope.images, function (i) { @@ -85,6 +85,7 @@ function ($scope, $state, Image, ViewSpinner, Messages) { complete(); }, function (e) { Messages.error("Failure", e.data); + $('#loadImagesSpinner').hide(); complete(); }); } @@ -92,15 +93,14 @@ function ($scope, $state, Image, ViewSpinner, Messages) { }; function fetchImages() { - ViewSpinner.spin(); Image.query({}, function (d) { $scope.images = d.map(function (item) { return new ImageViewModel(item); }); - ViewSpinner.stop(); + $('#loadImagesSpinner').hide(); }, function (e) { Messages.error("Failure", e.data); - ViewSpinner.stop(); + $('#loadImagesSpinner').hide(); }); } diff --git a/app/components/network/network.html b/app/components/network/network.html index 596dfc6bf..36bec67ec 100644 --- a/app/components/network/network.html +++ b/app/components/network/network.html @@ -1,5 +1,7 @@ - + + + Networks > {{ network.Name }} diff --git a/app/components/network/networkController.js b/app/components/network/networkController.js index cbfb7966c..a38c5474f 100644 --- a/app/components/network/networkController.js +++ b/app/components/network/networkController.js @@ -1,37 +1,37 @@ angular.module('network', []) -.controller('NetworkController', ['$scope', 'Network', 'ViewSpinner', 'Messages', '$state', '$stateParams', 'errorMsgFilter', -function ($scope, Network, ViewSpinner, Messages, $state, $stateParams, errorMsgFilter) { +.controller('NetworkController', ['$scope', 'Network', 'Messages', '$state', '$stateParams', 'errorMsgFilter', +function ($scope, Network, Messages, $state, $stateParams, errorMsgFilter) { $scope.disconnect = function disconnect(networkId, containerId) { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Network.disconnect({id: $stateParams.id}, {Container: containerId}, function (d) { - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); Messages.send("Container disconnected", containerId); $state.go('network', {id: $stateParams.id}, {reload: true}); }, function (e) { - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); Messages.error("Failure", e.data); }); }; $scope.remove = function remove(networkId) { - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Network.remove({id: $stateParams.id}, function (d) { - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); Messages.send("Network removed", ""); $state.go('networks', {}); }, function (e) { - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); Messages.error("Failure", e.data); }); }; - ViewSpinner.spin(); + $('#loadingViewSpinner').show(); Network.get({id: $stateParams.id}, function (d) { $scope.network = d; - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }, function (e) { Messages.error("Failure", e.data); - ViewSpinner.stop(); + $('#loadingViewSpinner').hide(); }); }]); diff --git a/app/components/networks/networks.html b/app/components/networks/networks.html index 381fd500e..38d6a6410 100644 --- a/app/components/networks/networks.html +++ b/app/components/networks/networks.html @@ -10,6 +10,9 @@
+
+ +
diff --git a/app/components/networks/networksController.js b/app/components/networks/networksController.js index c3e8dbc8b..124b18129 100644 --- a/app/components/networks/networksController.js +++ b/app/components/networks/networksController.js @@ -1,6 +1,6 @@ angular.module('networks', []) -.controller('NetworksController', ['$scope', 'Network', 'ViewSpinner', 'Messages', 'errorMsgFilter', -function ($scope, Network, ViewSpinner, Messages, errorMsgFilter) { +.controller('NetworksController', ['$scope', 'Network', 'Messages', 'errorMsgFilter', +function ($scope, Network, Messages, errorMsgFilter) { $scope.state = {}; $scope.state.toggle = false; @@ -33,12 +33,12 @@ function ($scope, Network, ViewSpinner, Messages, errorMsgFilter) { }; $scope.removeAction = function () { - ViewSpinner.spin(); + $('#loadNetworksSpinner').show(); var counter = 0; var complete = function () { counter = counter - 1; if (counter === 0) { - ViewSpinner.stop(); + $('#loadNetworksSpinner').hide(); } }; angular.forEach($scope.networks, function (network) { @@ -58,13 +58,13 @@ function ($scope, Network, ViewSpinner, Messages, errorMsgFilter) { }; function fetchNetworks() { - ViewSpinner.spin(); + $('#loadNetworksSpinner').show(); Network.query({}, function (d) { $scope.networks = d; - ViewSpinner.stop(); + $('#loadNetworksSpinner').hide(); }, function (e) { Messages.error("Failure", e.data); - ViewSpinner.stop(); + $('#loadNetworksSpinner').hide(); }); } fetchNetworks(); diff --git a/app/components/volumes/volumes.html b/app/components/volumes/volumes.html index b4f55107e..1d41c574e 100644 --- a/app/components/volumes/volumes.html +++ b/app/components/volumes/volumes.html @@ -10,6 +10,9 @@
+
+ +
diff --git a/app/components/volumes/volumesController.js b/app/components/volumes/volumesController.js index 750c683f7..4b684e60c 100644 --- a/app/components/volumes/volumesController.js +++ b/app/components/volumes/volumesController.js @@ -1,6 +1,6 @@ angular.module('volumes', []) -.controller('VolumesController', ['$scope', 'Volume', 'ViewSpinner', 'Messages', 'errorMsgFilter', -function ($scope, Volume, ViewSpinner, Messages, errorMsgFilter) { +.controller('VolumesController', ['$scope', 'Volume', 'Messages', 'errorMsgFilter', +function ($scope, Volume, Messages, errorMsgFilter) { $scope.state = {}; $scope.state.toggle = false; $scope.state.selectedItemCount = 0; @@ -32,12 +32,12 @@ function ($scope, Volume, ViewSpinner, Messages, errorMsgFilter) { }; $scope.removeAction = function () { - ViewSpinner.spin(); + $('#loadVolumesSpinner').show(); var counter = 0; var complete = function () { counter = counter - 1; if (counter === 0) { - ViewSpinner.stop(); + $('#loadVolumesSpinner').hide(); } }; angular.forEach($scope.volumes, function (volume) { @@ -57,13 +57,13 @@ function ($scope, Volume, ViewSpinner, Messages, errorMsgFilter) { }; function fetchVolumes() { - ViewSpinner.spin(); + $('#loadVolumesSpinner').show(); Volume.query({}, function (d) { $scope.volumes = d.Volumes; - ViewSpinner.stop(); + $('#loadVolumesSpinner').hide(); }, function (e) { Messages.error("Failure", e.data); - ViewSpinner.stop(); + $('#loadVolumesSpinner').hide(); }); } fetchVolumes(); diff --git a/app/shared/services.js b/app/shared/services.js index 102d011d4..376b820cd 100644 --- a/app/shared/services.js +++ b/app/shared/services.js @@ -160,20 +160,6 @@ angular.module('dockerui.services', ['ngResource', 'ngSanitize']) firstLoad: firstLoad }; }]) - .factory('ViewSpinner', function ViewSpinnerFactory() { - 'use strict'; - var spinner = new Spinner(); - var target = document.getElementById('view'); - - return { - spin: function () { - spinner.spin(target); - }, - stop: function () { - spinner.stop(); - } - }; - }) .factory('Messages', ['$rootScope', '$sanitize', function MessagesFactory($rootScope, $sanitize) { 'use strict'; return { diff --git a/bower.json b/bower.json index cb28dcf38..3938178e9 100644 --- a/bower.json +++ b/bower.json @@ -34,12 +34,11 @@ "angular-resource": "~1.5.0", "angular-ui-select": "~0.17.1", "bootstrap": "~3.3.6", - "font-awesome": "~4.5.0", + "font-awesome": "~4.6.3", "jquery": "1.11.1", "jquery.gritter": "1.7.4", "lodash": "4.12.0", "rdash-ui": "1.0.*", - "spin.js": "1.3" }, "resolutions": { "angular": "1.5.5" diff --git a/gruntFile.js b/gruntFile.js index 606b7fc73..b5e1a6c98 100644 --- a/gruntFile.js +++ b/gruntFile.js @@ -69,7 +69,6 @@ module.exports = function (grunt) { 'bower_components/jquery/dist/jquery.min.js', 'assets/js/jquery.gritter.js', // Using custom version to fix error in minified build due to "use strict" 'bower_components/bootstrap/dist/js/bootstrap.min.js', - 'bower_components/spin.js/spin.js', 'bower_components/Chart.js/Chart.min.js', 'bower_components/lodash/dist/lodash.min.js', 'bower_components/oboe/dist/oboe-browser.js', From 092d866c730d8f42ae648ae35ea503dd5f2457f7 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Thu, 7 Jul 2016 13:22:31 +1200 Subject: [PATCH 3/9] fix(ui): fix display issue with multiple nodes in Swarm view (#44) --- app/components/swarm/swarmController.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/components/swarm/swarmController.js b/app/components/swarm/swarmController.js index a12b238bf..840c6281d 100644 --- a/app/components/swarm/swarmController.js +++ b/app/components/swarm/swarmController.js @@ -42,7 +42,7 @@ angular.module('swarm', []) var node_offset = 4; for (i = 0; i < node_count; i++) { extractNodeInfo(info, node_offset); - node_offset += 10; + node_offset += 9; } } From 21c17788225b65e43e42e3f1dfc4766635589c70 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Thu, 7 Jul 2016 14:31:16 +1200 Subject: [PATCH 4/9] feat(ui): default to display all containers (#45) --- app/components/containers/containers.html | 2 +- app/shared/services.js | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/containers/containers.html b/app/components/containers/containers.html index c39a5ca84..36b26fa8f 100644 --- a/app/components/containers/containers.html +++ b/app/components/containers/containers.html @@ -28,7 +28,7 @@ Add container
- +
diff --git a/app/shared/services.js b/app/shared/services.js index 376b820cd..75d979db1 100644 --- a/app/shared/services.js +++ b/app/shared/services.js @@ -153,7 +153,7 @@ angular.module('dockerui.services', ['ngResource', 'ngSanitize']) } var firstLoad = (localStorage.getItem('firstLoad') || 'true') === 'true'; return { - displayAll: false, + displayAll: true, endpoint: DOCKER_ENDPOINT, uiVersion: UI_VERSION, url: url, From 06f54e300cfcf78710a781ee800250af37ce8c5e Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Thu, 7 Jul 2016 15:37:09 +1200 Subject: [PATCH 5/9] fix(ui): hidden containers (using label) are now removed from dashboard and swarm view (#46) --- .../dashboard/dashboardController.js | 69 ++++++++++++------- app/components/swarm/swarm.html | 12 ---- 2 files changed, 46 insertions(+), 35 deletions(-) diff --git a/app/components/dashboard/dashboardController.js b/app/components/dashboard/dashboardController.js index 642ccc1aa..5c348d8fb 100644 --- a/app/components/dashboard/dashboardController.js +++ b/app/components/dashboard/dashboardController.js @@ -1,5 +1,6 @@ angular.module('dashboard', []) - .controller('DashboardController', ['$scope', 'Container', 'Image', 'Settings', 'LineChart', function ($scope, Container, Image, Settings, LineChart) { +.controller('DashboardController', ['$scope', 'Config', 'Container', 'Image', 'Settings', 'LineChart', +function ($scope, Config, Container, Image, Settings, LineChart) { $scope.containerData = {}; @@ -17,30 +18,52 @@ angular.module('dashboard', []) }); }; - Container.query({all: 1}, function (d) { - var running = 0; - var ghost = 0; - var stopped = 0; + function fetchDashboardData() { + Container.query({all: 1}, function (d) { + var running = 0; + var ghost = 0; + var stopped = 0; - // TODO: centralize that - var containers = d.filter(function (container) { - return container.Image !== 'swarm'; - }); - - for (var i = 0; i < containers.length; i++) { - var item = containers[i]; - if (item.Status === "Ghost") { - ghost += 1; - } else if (item.Status.indexOf('Exit') !== -1) { - stopped += 1; - } else { - running += 1; + var containers = d; + if (hiddenLabels) { + containers = hideContainers(d); } - } - $scope.containerData.running = running; - $scope.containerData.stopped = stopped; - $scope.containerData.ghost = ghost; - buildCharts(containers); + for (var i = 0; i < containers.length; i++) { + var item = containers[i]; + if (item.Status === "Ghost") { + ghost += 1; + } else if (item.Status.indexOf('Exit') !== -1) { + stopped += 1; + } else { + running += 1; + } + } + $scope.containerData.running = running; + $scope.containerData.stopped = stopped; + $scope.containerData.ghost = ghost; + + buildCharts(containers); + }); + } + + var hideContainers = function (containers) { + return containers.filter(function (container) { + var filterContainer = false; + hiddenLabels.forEach(function(label, index) { + if (_.has(container.Labels, label.name) && + container.Labels[label.name] === label.value) { + filterContainer = true; + } + }); + if (!filterContainer) { + return container; + } + }); + }; + + Config.$promise.then(function (c) { + hiddenLabels = c.hiddenLabels; + fetchDashboardData(); }); }]); diff --git a/app/components/swarm/swarm.html b/app/components/swarm/swarm.html index cf4a186fe..35e3ca6af 100644 --- a/app/components/swarm/swarm.html +++ b/app/components/swarm/swarm.html @@ -54,10 +54,6 @@ Nodes {{ swarm.Nodes }} - - Containers - {{ info.Containers }} - Images {{ info.Images }} @@ -108,13 +104,6 @@ - - - Containers - - - - Engine @@ -135,7 +124,6 @@ {{ node.name }} {{ node.ip }} - {{ node.containers }} {{ node.version }} {{ node.status }} From d2fb2cb8630f0c783a04176f5d779e5f91d4bba0 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Fri, 8 Jul 2016 11:57:24 +1200 Subject: [PATCH 6/9] feat(ui): add the ability to pull an image from a private registry (#47) --- app/components/images/images.html | 11 +++++++---- app/components/images/imagesController.js | 14 ++++++++++---- 2 files changed, 17 insertions(+), 8 deletions(-) diff --git a/app/components/images/images.html b/app/components/images/images.html index 3b060ebdc..362ee65f1 100644 --- a/app/components/images/images.html +++ b/app/components/images/images.html @@ -4,7 +4,6 @@ - Images @@ -15,14 +14,18 @@
- +
-
+
+ +
+ +
- +
diff --git a/app/components/images/imagesController.js b/app/components/images/imagesController.js index 303673ee0..d53ab25fc 100644 --- a/app/components/images/imagesController.js +++ b/app/components/images/imagesController.js @@ -8,7 +8,8 @@ function ($scope, $state, Image, Messages) { $scope.state.selectedItemCount = 0; $scope.config = { - Image: '' + Image: '', + Registry: '', }; $scope.order = function(sortType) { @@ -35,10 +36,14 @@ function ($scope, $state, Image, Messages) { } }; - function createImageConfig(imageName) { + function createImageConfig(imageName, registry) { var imageNameAndTag = imageName.split(':'); + var image = imageNameAndTag[0]; + if (registry) { + image = registry + '/' + imageNameAndTag[0]; + } var imageConfig = { - fromImage: imageNameAndTag[0], + fromImage: image, tag: imageNameAndTag[1] ? imageNameAndTag[1] : 'latest' }; return imageConfig; @@ -47,7 +52,8 @@ function ($scope, $state, Image, Messages) { $scope.pullImage = function() { $('#pullImageSpinner').show(); var image = _.toLower($scope.config.Image); - var imageConfig = createImageConfig(image); + var registry = _.toLower($scope.config.Registry); + var imageConfig = createImageConfig(image, registry); Image.create(imageConfig, function (data) { var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); if (err) { From d124c21d1bebdf401db130b14230f91f9593f2e5 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Fri, 8 Jul 2016 12:52:26 +1200 Subject: [PATCH 7/9] feat(ui): add the ability to create a container from an image in a custom registry (#49) --- .../createContainer/createContainerController.js | 15 +++++++++++---- .../createContainer/createcontainer.html | 14 +++++++++----- 2 files changed, 20 insertions(+), 9 deletions(-) diff --git a/app/components/createContainer/createContainerController.js b/app/components/createContainer/createContainerController.js index 3581e6176..d70676c89 100644 --- a/app/components/createContainer/createContainerController.js +++ b/app/components/createContainer/createContainerController.js @@ -8,7 +8,8 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e $scope.formValues = { Console: 'none', - Volumes: [] + Volumes: [], + Registry: '' }; $scope.config = { @@ -103,10 +104,14 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e }); } - function createImageConfig(imageName) { + function createImageConfig(imageName, registry) { var imageNameAndTag = imageName.split(':'); + var image = imageNameAndTag[0]; + if (registry) { + image = registry + '/' + imageNameAndTag[0]; + } var imageConfig = { - fromImage: imageNameAndTag[0], + fromImage: image, tag: imageNameAndTag[1] ? imageNameAndTag[1] : 'latest' }; return imageConfig; @@ -116,7 +121,9 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e $('#createContainerSpinner').show(); var image = _.toLower(config.Image); - var imageConfig = createImageConfig(image); + var registry = _.toLower($scope.formValues.Registry); + var imageConfig = createImageConfig(image, registry); + config.Image = imageConfig.fromImage + ':' + imageConfig.tag; Image.create(imageConfig, function (data) { var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); diff --git a/app/components/createContainer/createcontainer.html b/app/components/createContainer/createcontainer.html index 444db30c3..75d60d8ba 100644 --- a/app/components/createContainer/createcontainer.html +++ b/app/components/createContainer/createcontainer.html @@ -18,11 +18,15 @@
- +
- -
- + +
+ +
+ +
+
@@ -32,7 +36,7 @@
- +
From ca27e7f27a3d2debff73ec9d4f0867b0ba3f3aa8 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Fri, 8 Jul 2016 15:40:13 +1200 Subject: [PATCH 8/9] fix(containerCreation): fix an issue when creating an image from a custom registry without automatic pulling (#50) --- .../createContainerController.js | 41 +++++++++++-------- 1 file changed, 23 insertions(+), 18 deletions(-) diff --git a/app/components/createContainer/createContainerController.js b/app/components/createContainer/createContainerController.js index d70676c89..7a761c04d 100644 --- a/app/components/createContainer/createContainerController.js +++ b/app/components/createContainer/createContainerController.js @@ -12,6 +12,8 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e Registry: '' }; + $scope.imageConfig = {}; + $scope.config = { Env: [], HostConfig: { @@ -104,6 +106,23 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e }); } + function pullImageAndCreateContainer(config) { + $('#createContainerSpinner').show(); + Image.create($scope.imageConfig, function (data) { + var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); + if (err) { + var detail = data[data.length - 1]; + $('#createContainerSpinner').hide(); + Messages.error('Error', detail.error); + } else { + createContainer(config); + } + }, function (e) { + $('#createContainerSpinner').hide(); + Messages.error('Error', 'Unable to pull image ' + image); + }); + } + function createImageConfig(imageName, registry) { var imageNameAndTag = imageName.split(':'); var image = imageNameAndTag[0]; @@ -117,27 +136,12 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e return imageConfig; } - function pullImageAndCreateContainer(config) { - $('#createContainerSpinner').show(); - + function prepareImageConfig(config) { var image = _.toLower(config.Image); - var registry = _.toLower($scope.formValues.Registry); + var registry = $scope.formValues.Registry; var imageConfig = createImageConfig(image, registry); config.Image = imageConfig.fromImage + ':' + imageConfig.tag; - - Image.create(imageConfig, function (data) { - var err = data.length > 0 && data[data.length - 1].hasOwnProperty('error'); - if (err) { - var detail = data[data.length - 1]; - $('#createContainerSpinner').hide(); - Messages.error('Error', detail.error); - } else { - createContainer(config); - } - }, function (e) { - $('#createContainerSpinner').hide(); - Messages.error('Error', 'Unable to pull image ' + image); - }); + $scope.imageConfig = imageConfig; } function preparePortBindings(config) { @@ -199,6 +203,7 @@ function ($scope, $state, Config, Container, Image, Volume, Network, Messages, e function prepareConfiguration() { var config = angular.copy($scope.config); + prepareImageConfig(config); preparePortBindings(config); prepareConsole(config); prepareEnvironmentVariables(config); From afaa1433ffbaa5b5ad97dd245e8461d6d1286364 Mon Sep 17 00:00:00 2001 From: Anthony Lapenna Date: Fri, 8 Jul 2016 16:06:46 +1200 Subject: [PATCH 9/9] chore(version): bump version number --- app/app.js | 2 +- bower.json | 2 +- dockerui.go | 2 +- package.json | 2 +- 4 files changed, 4 insertions(+), 4 deletions(-) diff --git a/app/app.js b/app/app.js index 9c98988a7..42126a588 100644 --- a/app/app.js +++ b/app/app.js @@ -144,4 +144,4 @@ angular.module('uifordocker', [ .constant('DOCKER_ENDPOINT', 'dockerapi') .constant('DOCKER_PORT', '') // Docker port, leave as an empty string if no port is requred. If you have a port, prefix it with a ':' i.e. :4243 .constant('CONFIG_ENDPOINT', '/config') - .constant('UI_VERSION', 'v1.2.0'); + .constant('UI_VERSION', 'v1.3.0'); diff --git a/bower.json b/bower.json index 3938178e9..5526ed7db 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "uifordocker", - "version": "1.2.0", + "version": "1.3.0", "homepage": "https://github.com/kevana/ui-for-docker", "authors": [ "Michael Crosby ", diff --git a/dockerui.go b/dockerui.go index 7e29a73b9..b01a2f91a 100644 --- a/dockerui.go +++ b/dockerui.go @@ -173,7 +173,7 @@ func csrfWrapper(h http.Handler) http.Handler { } func main() { - kingpin.Version("1.2.0") + kingpin.Version("1.3.0") kingpin.Parse() configuration := Config{ diff --git a/package.json b/package.json index 577f9fb4a..86990bd32 100644 --- a/package.json +++ b/package.json @@ -2,7 +2,7 @@ "author": "Michael Crosby & Kevan Ahlquist", "name": "uifordocker", "homepage": "https://github.com/kevana/ui-for-docker", - "version": "1.2.0", + "version": "1.3.0", "repository": { "type": "git", "url": "git@github.com:kevana/ui-for-docker.git"