Add UI for managing repo notifications
This commit is contained in:
Joseph Schorr
parent
a84fe0681a
commit
de8e898ad0
11 changed files with 450 additions and 81 deletions
208
static/js/app.js
208
static/js/app.js
|
|
@ -969,6 +969,94 @@ quayApp = angular.module('quay', quayDependencies, function($provide, cfpLoading
|
|||
return userService;
|
||||
}]);
|
||||
|
||||
$provide.factory('ExternalNotificationData', [function() {
|
||||
var externalNotificationData = {};
|
||||
|
||||
var events = [
|
||||
{
|
||||
'id': 'repo_push',
|
||||
'title': 'Push to Repository',
|
||||
'icon': 'fa-upload'
|
||||
},
|
||||
{
|
||||
'id': 'build_start',
|
||||
'title': 'Dockerfile Build Started',
|
||||
'icon': 'fa-tasks'
|
||||
},
|
||||
{
|
||||
'id': 'build_success',
|
||||
'title': 'Dockerfile Build Successfully Completed',
|
||||
'icon': 'fa-check-circle-o'
|
||||
},
|
||||
{
|
||||
'id': 'build_failure',
|
||||
'title': 'Dockerfile Build Failed',
|
||||
'icon': 'fa-times-circle-o'
|
||||
}
|
||||
];
|
||||
|
||||
var methods = [
|
||||
{
|
||||
'id': 'quay_notification',
|
||||
'title': 'Quay.io notification',
|
||||
'icon': 'quay-icon'
|
||||
},
|
||||
{
|
||||
'id': 'email',
|
||||
'title': 'E-mail notification',
|
||||
'icon': 'fa-envelope',
|
||||
'fields': [
|
||||
{
|
||||
'name': 'email',
|
||||
'type': 'email',
|
||||
'title': 'E-mail address'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
'id': 'webhook',
|
||||
'title': 'Webhook invoke',
|
||||
'icon': 'fa-link',
|
||||
'fields': [
|
||||
{
|
||||
'name': 'url',
|
||||
'type': 'url',
|
||||
'title': 'Webhook URL'
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
||||
var methodMap = {};
|
||||
var eventMap = {};
|
||||
|
||||
for (var i = 0; i < methods.length; ++i) {
|
||||
methodMap[methods[i].id] = methods[i];
|
||||
}
|
||||
|
||||
for (var i = 0; i < events.length; ++i) {
|
||||
eventMap[events[i].id] = events[i];
|
||||
}
|
||||
|
||||
externalNotificationData.getSupportedEvents = function() {
|
||||
return events;
|
||||
};
|
||||
|
||||
externalNotificationData.getSupportedMethods = function() {
|
||||
return methods;
|
||||
};
|
||||
|
||||
externalNotificationData.getEventInfo = function(event) {
|
||||
return eventMap[event];
|
||||
};
|
||||
|
||||
externalNotificationData.getMethodInfo = function(method) {
|
||||
return methodMap[method];
|
||||
};
|
||||
|
||||
return externalNotificationData;
|
||||
}]);
|
||||
|
||||
$provide.factory('NotificationService', ['$rootScope', '$interval', 'UserService', 'ApiService', 'StringBuilderService', 'PlanService', 'UserService', 'Config',
|
||||
function($rootScope, $interval, UserService, ApiService, StringBuilderService, PlanService, UserService, Config) {
|
||||
var notificationService = {
|
||||
|
|
@ -4462,6 +4550,126 @@ quayApp.directive('buildProgress', function () {
|
|||
});
|
||||
|
||||
|
||||
quayApp.directive('externalNotificationView', function () {
|
||||
var directiveDefinitionObject = {
|
||||
priority: 0,
|
||||
templateUrl: '/static/directives/external-notification-view.html',
|
||||
replace: false,
|
||||
transclude: false,
|
||||
restrict: 'C',
|
||||
scope: {
|
||||
'repository': '=repository',
|
||||
'notification': '=notification',
|
||||
'notificationDeleted': '¬ificationDeleted'
|
||||
},
|
||||
controller: function($scope, $element, ExternalNotificationData, ApiService) {
|
||||
$scope.deleteNotification = function() {
|
||||
var params = {
|
||||
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
|
||||
'uuid': $scope.notification.uuid
|
||||
};
|
||||
|
||||
ApiService.deleteRepoNotification(null, params).then(function() {
|
||||
$scope.notificationDeleted({'notification': $scope.notification});
|
||||
});
|
||||
};
|
||||
|
||||
$scope.testNotification = function() {
|
||||
var params = {
|
||||
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
|
||||
'uuid': $scope.notification.uuid
|
||||
};
|
||||
|
||||
ApiService.testRepoNotification(null, params).then(function() {
|
||||
bootbox.dialog({
|
||||
"message": "Test Notification Sent",
|
||||
"buttons": {
|
||||
"close": {
|
||||
"label": "Close",
|
||||
"className": "btn-primary"
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
$scope.$watch('notification', function(notification) {
|
||||
if (notification) {
|
||||
$scope.eventInfo = ExternalNotificationData.getEventInfo(notification.event);
|
||||
$scope.methodInfo = ExternalNotificationData.getMethodInfo(notification.method);
|
||||
$scope.config = notification.config;
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
return directiveDefinitionObject;
|
||||
});
|
||||
|
||||
|
||||
quayApp.directive('createExternalNotificationDialog', function () {
|
||||
var directiveDefinitionObject = {
|
||||
priority: 0,
|
||||
templateUrl: '/static/directives/create-external-notification-dialog.html',
|
||||
replace: false,
|
||||
transclude: false,
|
||||
restrict: 'C',
|
||||
scope: {
|
||||
'repository': '=repository',
|
||||
'counter': '=counter',
|
||||
'notificationCreated': '¬ificationCreated'
|
||||
},
|
||||
controller: function($scope, $element, ExternalNotificationData, ApiService) {
|
||||
$scope.currentEvent = null;
|
||||
$scope.currentMethod = null;
|
||||
$scope.creating = false;
|
||||
$scope.currentConfig = {};
|
||||
|
||||
$scope.events = ExternalNotificationData.getSupportedEvents();
|
||||
$scope.methods = ExternalNotificationData.getSupportedMethods();
|
||||
|
||||
$scope.setEvent = function(event) {
|
||||
$scope.currentEvent = event;
|
||||
};
|
||||
|
||||
$scope.setMethod = function(method) {
|
||||
$scope.currentConfig = {};
|
||||
$scope.currentMethod = method;
|
||||
};
|
||||
|
||||
$scope.createNotification = function() {
|
||||
$scope.creating = true;
|
||||
var params = {
|
||||
'repository': $scope.repository.namespace + '/' + $scope.repository.name
|
||||
};
|
||||
|
||||
var data = {
|
||||
'event': $scope.currentEvent.id,
|
||||
'method': $scope.currentMethod.id,
|
||||
'config': $scope.currentConfig
|
||||
};
|
||||
|
||||
ApiService.createRepoNotification(data, params).then(function(resp) {
|
||||
$scope.creating = false;
|
||||
$scope.notificationCreated({'notification': resp});
|
||||
$('#createNotificationModal').modal('hide');
|
||||
});
|
||||
};
|
||||
|
||||
$scope.$watch('counter', function(counter) {
|
||||
if (counter) {
|
||||
$scope.creating = false;
|
||||
$scope.currentEvent = null;
|
||||
$scope.currentMethod = null;
|
||||
$('#createNotificationModal').modal({});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
return directiveDefinitionObject;
|
||||
});
|
||||
|
||||
|
||||
|
||||
quayApp.directive('twitterView', function () {
|
||||
var directiveDefinitionObject = {
|
||||
priority: 0,
|
||||
|
|
|
|||
|
|
@ -181,7 +181,7 @@ function TutorialCtrl($scope, AngularTour, AngularTourSignals, UserService, Conf
|
|||
},
|
||||
{
|
||||
'title': 'Repository Admin',
|
||||
'content': "The repository admin panel allows for modification of a repository's permissions, webhooks, visibility and other settings",
|
||||
'content': "The repository admin panel allows for modification of a repository's permissions, notifications, visibility and other settings",
|
||||
'overlayable': true,
|
||||
'mixpanelEvent': 'tutorial_view_admin'
|
||||
},
|
||||
|
|
@ -1246,7 +1246,7 @@ function RepoBuildCtrl($scope, Restangular, ApiService, $routeParams, $rootScope
|
|||
fetchRepository();
|
||||
}
|
||||
|
||||
function RepoAdminCtrl($scope, Restangular, ApiService, KeyService, $routeParams, $rootScope, $location, UserService, Config, Features) {
|
||||
function RepoAdminCtrl($scope, Restangular, ApiService, KeyService, $routeParams, $rootScope, $location, UserService, Config, Features, ExternalNotificationData) {
|
||||
var namespace = $routeParams.namespace;
|
||||
var name = $routeParams.name;
|
||||
|
||||
|
|
@ -1467,43 +1467,32 @@ function RepoAdminCtrl($scope, Restangular, ApiService, KeyService, $routeParams
|
|||
});
|
||||
};
|
||||
|
||||
$scope.loadWebhooks = function() {
|
||||
$scope.showNewNotificationCounter = 0;
|
||||
|
||||
$scope.showNewNotificationDialog = function() {
|
||||
$scope.showNewNotificationCounter++;
|
||||
};
|
||||
|
||||
$scope.handleNotificationCreated = function(notification) {
|
||||
$scope.notifications.push(notification);
|
||||
};
|
||||
|
||||
$scope.handleNotificationDeleted = function(notification) {
|
||||
var index = $.inArray(notification, $scope.notifications);
|
||||
if (index < 0) { return; }
|
||||
$scope.notifications.splice(index, 1);
|
||||
};
|
||||
|
||||
$scope.loadNotifications = function() {
|
||||
var params = {
|
||||
'repository': namespace + '/' + name
|
||||
};
|
||||
|
||||
$scope.newWebhook = {};
|
||||
$scope.webhooksResource = ApiService.listWebhooksAsResource(params).get(function(resp) {
|
||||
$scope.webhooks = resp.webhooks;
|
||||
return $scope.webhooks;
|
||||
});
|
||||
};
|
||||
|
||||
$scope.createWebhook = function() {
|
||||
if (!$scope.newWebhook.url) {
|
||||
return;
|
||||
}
|
||||
|
||||
var params = {
|
||||
'repository': namespace + '/' + name
|
||||
};
|
||||
|
||||
ApiService.createWebhook($scope.newWebhook, params).then(function(resp) {
|
||||
$scope.webhooks.push(resp);
|
||||
$scope.newWebhook.url = '';
|
||||
$scope.createWebhookForm.$setPristine();
|
||||
});
|
||||
};
|
||||
|
||||
$scope.deleteWebhook = function(webhook) {
|
||||
var params = {
|
||||
'repository': namespace + '/' + name,
|
||||
'public_id': webhook.public_id
|
||||
};
|
||||
|
||||
ApiService.deleteWebhook(null, params).then(function(resp) {
|
||||
$scope.webhooks.splice($scope.webhooks.indexOf(webhook), 1);
|
||||
});
|
||||
$scope.notificationsResource = ApiService.listRepoNotificationsAsResource(params).get(
|
||||
function(resp) {
|
||||
$scope.notifications = resp.notifications;
|
||||
return $scope.notifications;
|
||||
});
|
||||
};
|
||||
|
||||
$scope.showBuild = function(buildInfo) {
|
||||
|
|
@ -1635,7 +1624,7 @@ function RepoAdminCtrl($scope, Restangular, ApiService, KeyService, $routeParams
|
|||
$scope.repo = repo;
|
||||
$rootScope.title = 'Settings - ' + namespace + '/' + name;
|
||||
$rootScope.description = 'Administrator settings for ' + namespace + '/' + name +
|
||||
': Permissions, webhooks and other settings';
|
||||
': Permissions, notifications and other settings';
|
||||
|
||||
// Fetch all the permissions and token info for the repository.
|
||||
fetchPermissions('user');
|
||||
|
|
|
|||
Reference in a new issue