vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Code cleanup part #1: move all the services and directive JS code in the app.js file into its own files

Browse source
This commit is contained in:
Joseph Schorr 2015-02-19 16:21:54 -05:00
parent 3cae6609a7
commit 9b87999c1c
97 changed files with 7076 additions and 6870 deletions
Download patch file Download diff file Expand all files Collapse all files

14
static/js/directives/fallback-src.js Normal file
View file

@ -0,0 +1,14 @@
/**
* Adds a fallback-src attribute, which is used as the source for an <img> tag if the main
* image fails to load.
*/
angular.module('quay').directive('fallbackSrc', function () {
return {
restrict: 'A',
link: function postLink(scope, element, attributes) {
element.bind('error', function() {
angular.element(this).attr("src", attributes.fallbackSrc);
});
}
};
});

18
static/js/directives/file-present.js Normal file
View file

@ -0,0 +1,18 @@
/**
* Sets the 'filePresent' value on the scope if a file on the marked <input type="file"> exists.
*/
angular.module('quay').directive("filePresent", [function () {
return {
restrict: 'A',
scope: {
'filePresent': "="
},
link: function (scope, element, attributes) {
element.bind("change", function (changeEvent) {
scope.$apply(function() {
scope.filePresent = changeEvent.target.files.length > 0;
});
});
}
}
}]);

12
static/js/directives/filters/bytes.js Normal file
View file

@ -0,0 +1,12 @@
/**
* Filter which displays bytes with suffixes.
*/
angular.module('quay').filter('bytes', function() {
return function(bytes, precision) {
if (!bytes || isNaN(parseFloat(bytes)) || !isFinite(bytes)) return 'Unknown';
if (typeof precision === 'undefined') precision = 1;
var units = ['bytes', 'kB', 'MB', 'GB', 'TB', 'PB'],
number = Math.floor(Math.log(bytes) / Math.log(1024));
return (bytes / Math.pow(1024, Math.floor(number))).toFixed(precision) + ' ' + units[number];
}
});

23
static/js/directives/filters/regex.js Normal file
View file

@ -0,0 +1,23 @@
/**
* Regular expression filter.
*/
angular.module('quay').filter('regex', function() {
return function(input, regex) {
if (!regex) { return []; }
try {
var patt = new RegExp(regex);
} catch (ex) {
return [];
}
var out = [];
for (var i = 0; i < input.length; ++i){
var m = input[i].match(patt);
if (m && m[0].length == input[i].length) {
out.push(input[i]);
}
}
return out;
};
});

8
static/js/directives/filters/reverse.js Normal file
View file

@ -0,0 +1,8 @@
/**
* Reversing filter.
*/
angular.module('quay').filter('reverse', function() {
return function(items) {
return items.slice().reverse();
};
});

19
static/js/directives/filters/visible-log-filter.js Normal file
View file

@ -0,0 +1,19 @@
/**
* Filter for hiding logs that don't meet the allowed predicate.
*/
angular.module('quay').filter('visibleLogFilter', function () {
return function (logs, allowed) {
if (!allowed) {
return logs;
}
var filtered = [];
angular.forEach(logs, function (log) {
if (allowed[log.kind]) {
filtered.push(log);
}
});
return filtered;
};
});

37
static/js/directives/focusable-popover-content.js Normal file
View file

@ -0,0 +1,37 @@
/**
* An element which, when used to display content inside a popover, hide the popover once
* the content loses focus.
*/
angular.module('quay').directive('focusablePopoverContent', ['$timeout', '$popover', function ($timeout, $popover) {
return {
restrict: "A",
link: function (scope, element, attrs) {
$body = $('body');
var hide = function() {
$body.off('click');
if (!scope) { return; }
scope.$apply(function() {
if (!scope || !$scope.$hide) { return; }
scope.$hide();
});
};
scope.$on('$destroy', function() {
$body.off('click');
});
$timeout(function() {
$body.on('click', function(evt) {
var target = evt.target;
var isPanelMember = $(element).has(target).length > 0 || target == element;
if (!isPanelMember) {
hide();
}
});
$(element).find('input').focus();
}, 100);
}
};
}]);

16
static/js/directives/match.js Normal file
View file

@ -0,0 +1,16 @@
/**
* Adds a 'match' attribute that ensures that a form field's value matches another field's
* value.
*/
angular.module('quay').directive('match', function($parse) {
return {
require: 'ngModel',
link: function(scope, elem, attrs, ctrl) {
scope.$watch(function() {
return $parse(attrs.match)(scope) === ctrl.$modelValue;
}, function(currentValue) {
ctrl.$setValidity('mismatch', currentValue);
});
}
};
});

7
static/js/directives/ng-blur.js Normal file
View file

@ -0,0 +1,7 @@
angular.module('quay').directive('ngBlur', function() {
return function( scope, elem, attrs ) {
elem.bind('blur', function() {
scope.$apply(attrs.ngBlur);
});
};
});

15
static/js/directives/ng-if-media.js Normal file
View file

@ -0,0 +1,15 @@
/**
* Adds an ng-if-media attribute that evaluates a media query and, if false, removes the element.
*/
angular.module('quay').directive('ngIfMedia', function ($animate, AngularHelper) {
return {
transclude: 'element',
priority: 600,
terminal: true,
restrict: 'A',
link: AngularHelper.buildConditionalLinker($animate, 'ngIfMedia', function(value) {
return window.matchMedia(value).matches;
})
};
});

10
static/js/directives/ng-visible.js Normal file
View file

@ -0,0 +1,10 @@
/**
* Adds an ng-visible attribute that hides an element if the expression evaluates to false.
*/
angular.module('quay').directive('ngVisible', function () {
return function (scope, element, attr) {
scope.$watch(attr.ngVisible, function (visible) {
element.css('visibility', visible ? 'visible' : 'hidden');
});
};
});

20
static/js/directives/onresize.js Normal file
View file

@ -0,0 +1,20 @@
/**
* Adds an onresize event attribtue that gets invokved when the size of the window changes.
*/
angular.module('quay').directive('onresize', function ($window, $parse) {
return function (scope, element, attr) {
var fn = $parse(attr.onresize);
var notifyResized = function() {
scope.$apply(function () {
fn(scope);
});
};
angular.element($window).on('resize', null, notifyResized);
scope.$on('$destroy', function() {
angular.element($window).off('resize', null, notifyResized);
});
};
});

170
static/js/directives/quay-layout.js Normal file
View file

@ -0,0 +1,170 @@
/**
* Directives which show, hide, include or otherwise mutate the DOM based on Features and Config.
*/
/**
* Adds a quay-require attribute includes an element in the DOM iff the features specified are true.
*/
angular.module('quay').directive('quayRequire', function ($animate, Features, AngularHelper) {
return {
transclude: 'element',
priority: 600,
terminal: true,
restrict: 'A',
link: AngularHelper.buildConditionalLinker($animate, 'quayRequire', function(value) {
return Features.matchesFeatures(value);
})
};
});
/**
* Adds a quay-show attribute that shows the element only if the attribute evaluates to true.
* The Features and Config services are added into the scope's context automatically.
*/
angular.module('quay').directive('quayShow', function($animate, Features, Config) {
return {
priority: 590,
restrict: 'A',
link: function($scope, $element, $attr, ctrl, $transclude) {
$scope.Features = Features;
$scope.Config = Config;
$scope.$watch($attr.quayShow, function(result) {
$animate[!!result ? 'removeClass' : 'addClass']($element, 'ng-hide');
});
}
};
});
/**
* Adds a quay-section attribute that adds an 'active' class to the element if the current URL
* matches the given section.
*/
angular.module('quay').directive('quaySection', function($animate, $location, $rootScope) {
return {
priority: 590,
restrict: 'A',
link: function($scope, $element, $attr, ctrl, $transclude) {
var update = function() {
var result = $location.path().indexOf('/' + $attr.quaySection) == 0;
$animate[!result ? 'removeClass' : 'addClass']($element, 'active');
};
$scope.$watch(function(){
return $location.path();
}, update);
$scope.$watch($attr.quaySection, update);
}
};
});
/**
* Adds a quay-classes attribute that performs like ng-class, but with Features and Config also
* available in the scope automatically.
*/
angular.module('quay').directive('quayClasses', function(Features, Config) {
return {
priority: 580,
restrict: 'A',
link: function($scope, $element, $attr, ctrl, $transclude) {
// Borrowed from ngClass.
function flattenClasses(classVal) {
if(angular.isArray(classVal)) {
return classVal.join(' ');
} else if (angular.isObject(classVal)) {
var classes = [], i = 0;
angular.forEach(classVal, function(v, k) {
if (v) {
classes.push(k);
}
});
return classes.join(' ');
}
return classVal;
}
function removeClass(classVal) {
$attr.$removeClass(flattenClasses(classVal));
}
function addClass(classVal) {
$attr.$addClass(flattenClasses(classVal));
}
$scope.$watch($attr.quayClasses, function(result) {
var scopeVals = {
'Features': Features,
'Config': Config
};
for (var expr in result) {
if (!result.hasOwnProperty(expr)) { continue; }
// Evaluate the expression with the entire features list added.
var value = $scope.$eval(expr, scopeVals);
if (value) {
addClass(result[expr]);
} else {
removeClass(result[expr]);
}
}
});
}
};
});
/**
* Adds a quay-include attribtue that adds a template solely if the expression evaluates to true.
* Automatically adds the Features and Config services to the scope.
*/
angular.module('quay').directive('quayInclude', function($compile, $templateCache, $http, Features, Config) {
return {
priority: 595,
restrict: 'A',
link: function($scope, $element, $attr, ctrl) {
var getTemplate = function(templateName) {
var templateUrl = '/static/partials/' + templateName;
return $http.get(templateUrl, {cache: $templateCache});
};
var result = $scope.$eval($attr.quayInclude);
if (!result) {
return;
}
var scopeVals = {
'Features': Features,
'Config': Config
};
var templatePath = null;
for (var expr in result) {
if (!result.hasOwnProperty(expr)) { continue; }
// Evaluate the expression with the entire features list added.
var value = $scope.$eval(expr, scopeVals);
if (value) {
templatePath = result[expr];
break;
}
}
if (!templatePath) {
return;
}
var promise = getTemplate(templatePath).success(function(html) {
$element.html(html);
}).then(function (response) {
$element.replaceWith($compile($element.html())($scope));
if ($attr.onload) {
$scope.$eval($attr.onload);
}
});
}
};
});

18
static/js/directives/ui/application-info.js Normal file
View file

@ -0,0 +1,18 @@
/**
* An element which shows information about a registered OAuth application.
*/
angular.module('quay').directive('applicationInfo', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/application-info.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'application': '=application'
},
controller: function($scope, $element, ApiService) {}
};
return directiveDefinitionObject;
});

56
static/js/directives/ui/application-manager.js Normal file
View file

@ -0,0 +1,56 @@
/**
* Element for managing the applications of an organization.
*/
angular.module('quay').directive('applicationManager', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/application-manager.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'organization': '=organization',
'makevisible': '=makevisible'
},
controller: function($scope, $element, ApiService) {
$scope.loading = false;
$scope.applications = [];
$scope.createApplication = function(appName) {
if (!appName) { return; }
var params = {
'orgname': $scope.organization.name
};
var data = {
'name': appName
};
ApiService.createOrganizationApplication(data, params).then(function(resp) {
$scope.applications.push(resp);
}, ApiService.errorDisplay('Cannot create application'));
};
var update = function() {
if (!$scope.organization || !$scope.makevisible) { return; }
if ($scope.loading) { return; }
$scope.loading = true;
var params = {
'orgname': $scope.organization.name
};
ApiService.getOrganizationApplications(null, params).then(function(resp) {
$scope.loading = false;
$scope.applications = resp['applications'] || [];
});
};
$scope.$watch('organization', update);
$scope.$watch('makevisible', update);
}
};
return directiveDefinitionObject;
});

36
static/js/directives/ui/application-reference.js Normal file
View file

@ -0,0 +1,36 @@
/**
* An element which shows information about an OAuth application and provides a clickable link
* for displaying a dialog with further information. Unlike application-info, this element is
* intended for the *owner* of the application (since it requires the client ID).
*/
angular.module('quay').directive('applicationReference', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/application-reference.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'title': '=title',
'clientId': '=clientId'
},
controller: function($scope, $element, ApiService, $modal) {
$scope.showAppDetails = function() {
var params = {
'client_id': $scope.clientId
};
ApiService.getApplicationInformation(null, params).then(function(resp) {
$scope.applicationInfo = resp;
$modal({
title: 'Application Information',
scope: $scope,
template: '/static/directives/application-reference-dialog.html',
show: true
});
}, ApiService.errorDisplay('Application could not be found'));
};
}
};
return directiveDefinitionObject;
});

34
static/js/directives/ui/avatar.js Normal file
View file

@ -0,0 +1,34 @@
/**
* An element which displays an avatar for the given {email,name} or hash.
*/
angular.module('quay').directive('avatar', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/avatar.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'hash': '=hash',
'email': '=email',
'name': '=name',
'size': '=size'
},
controller: function($scope, $element, AvatarService) {
$scope.AvatarService = AvatarService;
var refreshHash = function() {
if (!$scope.name && !$scope.email) { return; }
$scope._hash = AvatarService.computeHash($scope.email, $scope.name);
};
$scope.$watch('hash', function(hash) {
$scope._hash = hash;
});
$scope.$watch('name', refreshHash);
$scope.$watch('email', refreshHash);
}
};
return directiveDefinitionObject;
});

49
static/js/directives/ui/billing-invoice.js Normal file
View file

@ -0,0 +1,49 @@
/**
* Element for displaying the list of billing invoices for the user or organization.
*/
angular.module('quay').directive('billingInvoices', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/billing-invoices.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'organization': '=organization',
'user': '=user',
'makevisible': '=makevisible'
},
controller: function($scope, $element, $sce, ApiService) {
$scope.loading = false;
$scope.invoiceExpanded = {};
$scope.toggleInvoice = function(id) {
$scope.invoiceExpanded[id] = !$scope.invoiceExpanded[id];
};
var update = function() {
var hasValidUser = !!$scope.user;
var hasValidOrg = !!$scope.organization;
var isValid = hasValidUser || hasValidOrg;
if (!$scope.makevisible || !isValid) {
return;
}
$scope.loading = true;
ApiService.listInvoices($scope.organization).then(function(resp) {
$scope.invoices = resp.invoices;
$scope.loading = false;
});
};
$scope.$watch('organization', update);
$scope.$watch('user', update);
$scope.$watch('makevisible', update);
}
};
return directiveDefinitionObject;
});

113
static/js/directives/ui/billing-options.js Normal file
View file

@ -0,0 +1,113 @@
/**
* An element which displays the billing options for a user or an organization.
*/
angular.module('quay').directive('billingOptions', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/billing-options.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'user': '=user',
'organization': '=organization'
},
controller: function($scope, $element, PlanService, ApiService) {
$scope.invoice_email = false;
$scope.currentCard = null;
// Listen to plan changes.
PlanService.registerListener(this, function(plan) {
if (plan && plan.price > 0) {
update();
}
});
$scope.$on('$destroy', function() {
PlanService.unregisterListener(this);
});
$scope.isExpiringSoon = function(cardInfo) {
var current = new Date();
var expires = new Date(cardInfo.exp_year, cardInfo.exp_month, 1);
var difference = expires - current;
return difference < (60 * 60 * 24 * 60 * 1000 /* 60 days */);
};
$scope.changeCard = function() {
var previousCard = $scope.currentCard;
$scope.changingCard = true;
var callbacks = {
'opened': function() { $scope.changingCard = true; },
'closed': function() { $scope.changingCard = false; },
'started': function() { $scope.currentCard = null; },
'success': function(resp) {
$scope.currentCard = resp.card;
$scope.changingCard = false;
},
'failure': function(resp) {
$scope.changingCard = false;
$scope.currentCard = previousCard;
if (!PlanService.isCardError(resp)) {
$('#cannotchangecardModal').modal({});
}
}
};
PlanService.changeCreditCard($scope, $scope.organization ? $scope.organization.name : null, callbacks);
};
$scope.getCreditImage = function(creditInfo) {
if (!creditInfo || !creditInfo.type) { return 'credit.png'; }
var kind = creditInfo.type.toLowerCase() || 'credit';
var supported = {
'american express': 'amex',
'credit': 'credit',
'diners club': 'diners',
'discover': 'discover',
'jcb': 'jcb',
'mastercard': 'mastercard',
'visa': 'visa'
};
kind = supported[kind] || 'credit';
return kind + '.png';
};
var update = function() {
if (!$scope.user && !$scope.organization) { return; }
$scope.obj = $scope.user ? $scope.user : $scope.organization;
$scope.invoice_email = $scope.obj.invoice_email;
// Load the credit card information.
PlanService.getCardInfo($scope.organization ? $scope.organization.name : null, function(card) {
$scope.currentCard = card;
});
};
var save = function() {
$scope.working = true;
var errorHandler = ApiService.errorDisplay('Could not change user details');
ApiService.changeDetails($scope.organization, $scope.obj).then(function(resp) {
$scope.working = false;
}, errorHandler);
};
var checkSave = function() {
if (!$scope.obj) { return; }
if ($scope.obj.invoice_email != $scope.invoice_email) {
$scope.obj.invoice_email = $scope.invoice_email;
save();
}
};
$scope.$watch('invoice_email', checkSave);
$scope.$watch('organization', update);
$scope.$watch('user', update);
}
};
return directiveDefinitionObject;
});

26
static/js/directives/ui/build-log-command.js Normal file
View file

@ -0,0 +1,26 @@
/**
* An element which displays a command in a build.
*/
angular.module('quay').directive('buildLogCommand', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-log-command.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'command': '=command'
},
controller: function($scope, $element) {
$scope.getWithoutStep = function(fullTitle) {
var colon = fullTitle.indexOf(':');
if (colon <= 0) {
return '';
}
return $.trim(fullTitle.substring(colon + 1));
};
}
};
return directiveDefinitionObject;
});

62
static/js/directives/ui/build-log-error.js Normal file
View file

@ -0,0 +1,62 @@
/**
* An element which displays a build error in a nice format.
*/
angular.module('quay').directive('buildLogError', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-log-error.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'error': '=error',
'entries': '=entries'
},
controller: function($scope, $element, Config) {
$scope.isInternalError = function() {
var entry = $scope.entries[$scope.entries.length - 1];
return entry && entry.data && entry.data['internal_error'];
};
$scope.getLocalPullInfo = function() {
if ($scope.entries.__localpull !== undefined) {
return $scope.entries.__localpull;
}
var localInfo = {
'isLocal': false
};
// Find the 'pulling' phase entry, and then extra any metadata found under
// it.
for (var i = 0; i < $scope.entries.length; ++i) {
var entry = $scope.entries[i];
if (entry.type == 'phase' && entry.message == 'pulling') {
for (var j = 0; j < entry.logs.length(); ++j) {
var log = entry.logs.get(j);
if (log.data && log.data.phasestep == 'login') {
localInfo['login'] = log.data;
}
if (log.data && log.data.phasestep == 'pull') {
var repo_url = log.data['repo_url'];
var repo_and_tag = repo_url.substring(Config.SERVER_HOSTNAME.length + 1);
var tagIndex = repo_and_tag.lastIndexOf(':');
var repo = repo_and_tag.substring(0, tagIndex);
localInfo['repo_url'] = repo_url;
localInfo['repo'] = repo;
localInfo['isLocal'] = repo_url.indexOf(Config.SERVER_HOSTNAME + '/') == 0;
}
}
break;
}
}
return $scope.entries.__localpull = localInfo;
};
}
};
return directiveDefinitionObject;
});

18
static/js/directives/ui/build-log-phase.js Normal file
View file

@ -0,0 +1,18 @@
/**
* An element which displays the phase of a build nicely.
*/
angular.module('quay').directive('buildLogPhase', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-log-phase.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'phase': '=phase'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

61
static/js/directives/ui/build-message.js Normal file
View file

@ -0,0 +1,61 @@
/**
* An element which displays a user-friendly message for the current phase of a build.
*/
angular.module('quay').directive('buildMessage', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-message.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'phase': '=phase'
},
controller: function($scope, $element) {
$scope.getBuildMessage = function (phase) {
switch (phase) {
case 'cannot_load':
return 'Cannot load build status - Please report this error';
case 'starting':
case 'initializing':
return 'Starting Dockerfile build';
case 'waiting':
return 'Waiting for available build worker';
case 'unpacking':
return 'Unpacking build package';
case 'pulling':
return 'Pulling base image';
case 'building':
return 'Building image from Dockerfile';
case 'checking-cache':
return 'Looking up cached images';
case 'priming-cache':
return 'Priming cache for build';
case 'build-scheduled':
return 'Preparing build node';
case 'pushing':
return 'Pushing image built from Dockerfile';
case 'complete':
return 'Dockerfile build completed and pushed';
case 'error':
return 'Dockerfile build failed';
case 'internalerror':
return 'An internal system error occurred while building; the build will be retried in the next few minutes.';
}
};
}
};
return directiveDefinitionObject;
});

53
static/js/directives/ui/build-progress.js Normal file
View file

@ -0,0 +1,53 @@
/**
* An element which displays a progressbar for the given build.
*/
angular.module('quay').directive('buildProgress', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-progress.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'build': '=build'
},
controller: function($scope, $element) {
$scope.getPercentage = function(buildInfo) {
switch (buildInfo.phase) {
case 'pulling':
return buildInfo.status.pull_completion * 100;
break;
case 'building':
return (buildInfo.status.current_command / buildInfo.status.total_commands) * 100;
break;
case 'pushing':
return buildInfo.status.push_completion * 100;
break;
case 'priming-cache':
return buildInfo.status.cache_completion * 100;
break;
case 'complete':
return 100;
break;
case 'initializing':
case 'checking-cache':
case 'starting':
case 'waiting':
case 'cannot_load':
case 'unpacking':
return 0;
break;
}
return -1;
};
}
};
return directiveDefinitionObject;
});

18
static/js/directives/ui/build-status.js Normal file
View file

@ -0,0 +1,18 @@
/**
* An element which displays the status of a build.
*/
angular.module('quay').directive('buildStatus', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/build-status.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'build': '=build'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

76
static/js/directives/ui/copy-box.js Normal file
View file

@ -0,0 +1,76 @@
$.fn.clipboardCopy = function() {
if (__zeroClipboardSupported) {
(new ZeroClipboard($(this)));
return true;
}
this.hide();
return false;
};
// Initialize the clipboard system.
(function () {
__zeroClipboardSupported = true;
ZeroClipboard.config({
'swfPath': 'static/lib/ZeroClipboard.swf'
});
ZeroClipboard.on("error", function(e) {
__zeroClipboardSupported = false;
});
ZeroClipboard.on('aftercopy', function(e) {
var container = e.target.parentNode.parentNode.parentNode;
var message = $(container).find('.clipboard-copied-message')[0];
// Resets the animation.
var elem = message;
elem.style.display = 'none';
elem.classList.remove('animated');
// Show the notification.
setTimeout(function() {
elem.style.display = 'inline-block';
elem.classList.add('animated');
}, 10);
// Reset the notification.
setTimeout(function() {
elem.style.display = 'none';
}, 5000);
});
})();
/**
* An element which displays a textfield with a "Copy to Clipboard" icon next to it. Note
* that this method depends on the clipboard copying library in the lib/ folder.
*/
angular.module('quay').directive('copyBox', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/copy-box.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'value': '=value',
'hoveringMessage': '=hoveringMessage',
},
controller: function($scope, $element, $rootScope) {
$scope.disabled = false;
var number = $rootScope.__copyBoxIdCounter || 0;
$rootScope.__copyBoxIdCounter = number + 1;
$scope.inputId = "copy-box-input-" + number;
var button = $($element).find('.copy-icon');
var input = $($element).find('input');
input.attr('id', $scope.inputId);
button.attr('data-clipboard-target', $scope.inputId);
$scope.disabled = !button.clipboardCopy();
}
};
return directiveDefinitionObject;
});

144
static/js/directives/ui/create-external-notification-dialog.js Normal file
View file

@ -0,0 +1,144 @@
/**
* An element which displays a dialog to register a new external notification on a repository.
*/
angular.module('quay').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': '&notificationCreated'
},
controller: function($scope, $element, ExternalNotificationData, ApiService, $timeout, StringBuilderService) {
$scope.currentEvent = null;
$scope.currentMethod = null;
$scope.status = '';
$scope.currentConfig = {};
$scope.clearCounter = 0;
$scope.unauthorizedEmail = false;
$scope.events = ExternalNotificationData.getSupportedEvents();
$scope.methods = ExternalNotificationData.getSupportedMethods();
$scope.getPattern = function(field) {
return new RegExp(field.regex);
};
$scope.setEvent = function(event) {
$scope.currentEvent = event;
};
$scope.setMethod = function(method) {
$scope.currentConfig = {};
$scope.currentMethod = method;
$scope.unauthorizedEmail = false;
};
$scope.createNotification = function() {
if (!$scope.currentConfig.email) {
$scope.performCreateNotification();
return;
}
$scope.status = 'checking-email';
$scope.checkEmailAuthorization();
};
$scope.checkEmailAuthorization = function() {
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'email': $scope.currentConfig.email
};
ApiService.checkRepoEmailAuthorized(null, params).then(function(resp) {
$scope.handleEmailCheck(resp.confirmed);
}, function(resp) {
$scope.handleEmailCheck(false);
});
};
$scope.performCreateNotification = function() {
$scope.status = 'creating';
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.status = '';
$scope.notificationCreated({'notification': resp});
$('#createNotificationModal').modal('hide');
});
};
$scope.handleEmailCheck = function(isAuthorized) {
if (isAuthorized) {
$scope.performCreateNotification();
return;
}
if ($scope.status == 'authorizing-email-sent') {
$scope.watchEmail();
} else {
$scope.status = 'unauthorized-email';
}
$scope.unauthorizedEmail = true;
};
$scope.sendAuthEmail = function() {
$scope.status = 'authorizing-email';
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'email': $scope.currentConfig.email
};
ApiService.sendAuthorizeRepoEmail(null, params).then(function(resp) {
$scope.status = 'authorizing-email-sent';
$scope.watchEmail();
});
};
$scope.watchEmail = function() {
// TODO: change this to SSE?
$timeout(function() {
$scope.checkEmailAuthorization();
}, 1000);
};
$scope.getHelpUrl = function(field, config) {
var helpUrl = field['help_url'];
if (!helpUrl) {
return null;
}
return StringBuilderService.buildUrl(helpUrl, config);
};
$scope.$watch('counter', function(counter) {
if (counter) {
$scope.clearCounter++;
$scope.status = '';
$scope.currentEvent = null;
$scope.currentMethod = null;
$scope.unauthorizedEmail = false;
$('#createNotificationModal').modal({});
}
});
}
};
return directiveDefinitionObject;
});

26
static/js/directives/ui/delete-ui.js Normal file
View file

@ -0,0 +1,26 @@
/**
* A two-step delete button that slides into view when clicked.
*/
angular.module('quay').directive('deleteUi', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/delete-ui.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'deleteTitle': '=deleteTitle',
'buttonTitle': '=buttonTitle',
'performDelete': '&performDelete'
},
controller: function($scope, $element) {
$scope.buttonTitleInternal = $scope.buttonTitle || 'Delete';
$element.children().attr('tabindex', 0);
$scope.focus = function() {
$element[0].firstChild.focus();
};
}
};
return directiveDefinitionObject;
});

86
static/js/directives/ui/docker-auth-dialog.js Normal file
View file

@ -0,0 +1,86 @@
/**
* An element which displays a dialog with docker auth credentials for an entity.
*/
angular.module('quay').directive('dockerAuthDialog', function (Config) {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/docker-auth-dialog.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'username': '=username',
'token': '=token',
'shown': '=shown',
'counter': '=counter',
'supportsRegenerate': '@supportsRegenerate',
'regenerate': '&regenerate'
},
controller: function($scope, $element) {
var updateCommand = function() {
var escape = function(v) {
if (!v) { return v; }
return v.replace('$', '\\$');
};
$scope.command = 'docker login -e="." -u="' + escape($scope.username) +
'" -p="' + $scope.token + '" ' + Config['SERVER_HOSTNAME'];
};
$scope.$watch('username', updateCommand);
$scope.$watch('token', updateCommand);
$scope.regenerating = true;
$scope.askRegenerate = function() {
bootbox.confirm('Are you sure you want to regenerate the token? All existing login credentials will become invalid', function(resp) {
if (resp) {
$scope.regenerating = true;
$scope.regenerate({'username': $scope.username, 'token': $scope.token});
}
});
};
$scope.isDownloadSupported = function() {
var isSafari = /^((?!chrome).)*safari/i.test(navigator.userAgent);
if (isSafari) {
// Doesn't work properly in Safari, sadly.
return false;
}
try { return !!new Blob(); } catch(e) {}
return false;
};
$scope.downloadCfg = function() {
var auth = $.base64.encode($scope.username + ":" + $scope.token);
config = {}
config[Config['SERVER_HOSTNAME']] = {
"auth": auth,
"email": ""
};
var file = JSON.stringify(config, null, ' ');
var blob = new Blob([file]);
saveAs(blob, '.dockercfg');
};
var show = function(r) {
$scope.regenerating = false;
if (!$scope.shown || !$scope.username || !$scope.token) {
$('#dockerauthmodal').modal('hide');
return;
}
$('#copyClipboard').clipboardCopy();
$('#dockerauthmodal').modal({});
};
$scope.$watch('counter', show);
$scope.$watch('shown', show);
$scope.$watch('username', show);
$scope.$watch('token', show);
}
};
return directiveDefinitionObject;
});

45
static/js/directives/ui/dockerfile-build-dialog.js Normal file
View file

@ -0,0 +1,45 @@
/**
* An element which displays a dialog for manually starting a dockerfile build.
*/
angular.module('quay').directive('dockerfileBuildDialog', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/dockerfile-build-dialog.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repository': '=repository',
'showNow': '=showNow',
'buildStarted': '&buildStarted'
},
controller: function($scope, $element) {
$scope.building = false;
$scope.uploading = false;
$scope.startCounter = 0;
$scope.handleBuildStarted = function(build) {
$('#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.$watch('showNow', function(sn) {
if (sn && $scope.repository) {
$('#dockerfilebuildModal').modal({});
}
});
}
};
return directiveDefinitionObject;
});

199
static/js/directives/ui/dockerfile-build-form.js Normal file
View file

@ -0,0 +1,199 @@
/**
* An element which displays a form for manually starting a dockerfile build.
*/
angular.module('quay').directive('dockerfileBuildForm', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/dockerfile-build-form.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repository': '=repository',
'startNow': '=startNow',
'isReady': '=isReady',
'uploadFailed': '&uploadFailed',
'uploadStarted': '&uploadStarted',
'buildStarted': '&buildStarted',
'buildFailed': '&buildFailed',
'missingFile': '&missingFile',
'uploading': '=uploading',
'building': '=building'
},
controller: function($scope, $element, ApiService) {
$scope.internal = {'hasDockerfile': false};
$scope.pull_entity = null;
$scope.is_public = true;
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"
}
}
});
}
};
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"
}
}
});
}
};
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"
}
}
});
}
};
var startBuild = function(fileId) {
$scope.building = true;
var repo = $scope.repository;
var data = {
'file_id': fileId
};
if (!$scope.is_public && $scope.pull_entity) {
data['pull_robot'] = $scope.pull_entity['name'];
}
var params = {
'repository': repo.namespace + '/' + repo.name,
};
ApiService.requestRepoBuild(data, params).then(function(resp) {
$scope.building = false;
$scope.uploading = false;
if ($scope.buildStarted) {
$scope.buildStarted({'build': resp});
}
}, function(resp) {
$scope.building = false;
$scope.uploading = false;
handleBuildFailed(resp.message);
});
};
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;
if (state == 4) {
$scope.$apply(function() {
startBuild(fileId);
$scope.uploading = false;
});
return;
}
};
request.send(file);
};
var startFileUpload = function(repo) {
$scope.uploading = true;
$scope.uploading_progress = 0;
var uploader = $('#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 checkIsReady = function() {
$scope.isReady = $scope.internal.hasDockerfile && ($scope.is_public || $scope.pull_entity);
};
$scope.$watch('pull_entity', checkIsReady);
$scope.$watch('is_public', checkIsReady);
$scope.$watch('internal.hasDockerfile', checkIsReady);
$scope.$watch('startNow', function() {
if ($scope.startNow && $scope.repository && !$scope.uploading && !$scope.building) {
startFileUpload();
}
});
}
};
return directiveDefinitionObject;
});

68
static/js/directives/ui/dockerfile-command.js Normal file
View file

@ -0,0 +1,68 @@
/**
* An element which displays a Dockerfile command nicely formatted, with optional link to the
* image (for FROM commands that link to us or to the DockerHub).
*/
angular.module('quay').directive('dockerfileCommand', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/dockerfile-command.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'command': '=command'
},
controller: function($scope, $element, UtilService, Config) {
var registryHandlers = {
'quay.io': function(pieces) {
var rnamespace = pieces[pieces.length - 2];
var rname = pieces[pieces.length - 1].split(':')[0];
return '/repository/' + rnamespace + '/' + rname + '/';
},
'': function(pieces) {
var rnamespace = pieces.length == 1 ? '_' : 'u/' + pieces[0];
var rname = pieces[pieces.length - 1].split(':')[0];
return 'https://registry.hub.docker.com/' + rnamespace + '/' + rname + '/';
}
};
registryHandlers[Config.getDomain()] = registryHandlers['quay.io'];
var kindHandlers = {
'FROM': function(title) {
var pieces = title.split('/');
var registry = pieces.length < 3 ? '' : pieces[0];
if (!registryHandlers[registry]) {
return title;
}
return '<i class="fa fa-hdd-o"></i> <a href="' + registryHandlers[registry](pieces) + '" target="_blank">' + title + '</a>';
}
};
$scope.getCommandKind = function(title) {
var space = title.indexOf(' ');
return title.substring(0, space);
};
$scope.getCommandTitleHtml = function(title) {
var space = title.indexOf(' ');
if (space <= 0) {
return UtilService.textToSafeHtml(title);
}
var kind = $scope.getCommandKind(title);
var sanitized = UtilService.textToSafeHtml(title.substring(space + 1));
var handler = kindHandlers[kind || ''];
if (handler) {
return handler(sanitized);
} else {
return sanitized;
}
};
}
};
return directiveDefinitionObject;
});

38
static/js/directives/ui/dockerfile-view.js Normal file
View file

@ -0,0 +1,38 @@
/**
* An element which displays the contents of a Dockerfile in a nicely formatted way.
*/
angular.module('quay').directive('dockerfileView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/dockerfile-view.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'contents': '=contents'
},
controller: function($scope, $element, UtilService) {
$scope.$watch('contents', function(contents) {
$scope.lines = [];
var lines = contents ? contents.split('\n') : [];
for (var i = 0; i < lines.length; ++i) {
var line = $.trim(lines[i]);
var kind = 'text';
if (line && line[0] == '#') {
kind = 'comment';
} else if (line.match(/^([A-Z]+\s)/)) {
kind = 'command';
}
var lineInfo = {
'text': line,
'kind': kind
};
$scope.lines.push(lineInfo);
}
});
}
};
return directiveDefinitionObject;
});

174
static/js/directives/ui/dropdown-select.js Normal file
View file

@ -0,0 +1,174 @@
/**
* An element which displays a dropdown select box which is (optionally) editable. This box
* is displayed with an <input> and a menu on the right.
*/
angular.module('quay').directive('dropdownSelect', function ($compile) {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/dropdown-select.html',
replace: true,
transclude: true,
restrict: 'C',
scope: {
'selectedItem': '=selectedItem',
'placeholder': '=placeholder',
'lookaheadItems': '=lookaheadItems',
'allowCustomInput': '@allowCustomInput',
'handleItemSelected': '&handleItemSelected',
'handleInput': '&handleInput',
'clearValue': '=clearValue'
},
controller: function($scope, $element, $rootScope) {
if (!$rootScope.__dropdownSelectCounter) {
$rootScope.__dropdownSelectCounter = 1;
}
$scope.placeholder = $scope.placeholder || '';
$scope.internalItem = null;
// Setup lookahead.
var input = $($element).find('.lookahead-input');
$scope.$watch('clearValue', function(cv) {
if (cv) {
$scope.selectedItem = null;
$(input).val('');
}
});
$scope.$watch('selectedItem', function(item) {
if ($scope.selectedItem == $scope.internalItem) {
// The item has already been set due to an internal action.
return;
}
if ($scope.selectedItem != null) {
$(input).val(item.toString());
} else {
$(input).val('');
}
});
$scope.$watch('lookaheadItems', function(items) {
$(input).off();
if (!items) {
return;
}
var formattedItems = [];
for (var i = 0; i < items.length; ++i) {
var formattedItem = items[i];
if (typeof formattedItem == 'string') {
formattedItem = {
'value': formattedItem
};
}
formattedItems.push(formattedItem);
}
var dropdownHound = new Bloodhound({
name: 'dropdown-items-' + $rootScope.__dropdownSelectCounter,
local: formattedItems,
datumTokenizer: function(d) {
return Bloodhound.tokenizers.whitespace(d.val || d.value || '');
},
queryTokenizer: Bloodhound.tokenizers.whitespace
});
dropdownHound.initialize();
$(input).typeahead({}, {
source: dropdownHound.ttAdapter(),
templates: {
'suggestion': function (datum) {
template = datum['template'] ? datum['template'](datum) : datum['value'];
return template;
}
}
});
$(input).on('input', function(e) {
$scope.$apply(function() {
$scope.internalItem = null;
$scope.selectedItem = null;
if ($scope.handleInput) {
$scope.handleInput({'input': $(input).val()});
}
});
});
$(input).on('typeahead:selected', function(e, datum) {
$scope.$apply(function() {
$scope.internalItem = datum['item'] || datum['value'];
$scope.selectedItem = datum['item'] || datum['value'];
if ($scope.handleItemSelected) {
$scope.handleItemSelected({'datum': datum});
}
});
});
$rootScope.__dropdownSelectCounter++;
});
},
link: function(scope, element, attrs) {
var transcludedBlock = element.find('div.transcluded');
var transcludedElements = transcludedBlock.children();
var iconContainer = element.find('div.dropdown-select-icon-transclude');
var menuContainer = element.find('div.dropdown-select-menu-transclude');
angular.forEach(transcludedElements, function(elem) {
if (angular.element(elem).hasClass('dropdown-select-icon')) {
iconContainer.append(elem);
} else if (angular.element(elem).hasClass('dropdown-select-menu')) {
menuContainer.replaceWith(elem);
}
});
transcludedBlock.remove();
}
};
return directiveDefinitionObject;
});
/**
* An icon in the dropdown select. Only one icon will be displayed at a time.
*/
angular.module('quay').directive('dropdownSelectIcon', function () {
var directiveDefinitionObject = {
priority: 1,
require: '^dropdownSelect',
templateUrl: '/static/directives/dropdown-select-icon.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});
/**
* The menu for the dropdown select.
*/
angular.module('quay').directive('dropdownSelectMenu', function () {
var directiveDefinitionObject = {
priority: 1,
require: '^dropdownSelect',
templateUrl: '/static/directives/dropdown-select-menu.html',
replace: true,
transclude: true,
restrict: 'C',
scope: {
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

56
static/js/directives/ui/entity-reference.js Normal file
View file

@ -0,0 +1,56 @@
/**
* An element which shows an icon and a name/title for an entity (user, org, robot, team),
* optionally linking to that entity if applicable.
*/
angular.module('quay').directive('entityReference', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/entity-reference.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'entity': '=entity',
'namespace': '=namespace',
'showAvatar': '@showAvatar',
'avatarSize': '@avatarSize'
},
controller: function($scope, $element, UserService, UtilService) {
$scope.getIsAdmin = function(namespace) {
return UserService.isNamespaceAdmin(namespace);
};
$scope.getRobotUrl = function(name) {
var namespace = $scope.getPrefix(name);
if (!namespace) {
return '';
}
if (!$scope.getIsAdmin(namespace)) {
return '';
}
var org = UserService.getOrganization(namespace);
if (!org) {
// This robot is owned by the user.
return '/user/?tab=robots&showRobot=' + UtilService.textToSafeHtml(name);
}
return '/organization/' + org['name'] + '/admin?tab=robots&showRobot=' + UtilService.textToSafeHtml(name);
};
$scope.getPrefix = function(name) {
if (!name) { return ''; }
var plus = name.indexOf('+');
return name.substr(0, plus);
};
$scope.getShortenedName = function(name) {
if (!name) { return ''; }
var plus = name.indexOf('+');
return name.substr(plus + 1);
};
}
};
return directiveDefinitionObject;
});

361
static/js/directives/ui/entity-search.js Normal file
View file

@ -0,0 +1,361 @@
/**
* An element which displays a box to search for an entity (org, user, robot, team). This control
* allows for filtering of the entities found and whether to allow selection by e-mail.
*/
angular.module('quay').directive('entitySearch', function () {
var number = 0;
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/entity-search.html',
replace: false,
transclude: false,
restrict: 'C',
require: '?ngModel',
link: function(scope, element, attr, ctrl) {
scope.ngModel = ctrl;
},
scope: {
'namespace': '=namespace',
'placeholder': '=placeholder',
// Default: ['user', 'team', 'robot']
'allowedEntities': '=allowedEntities',
'currentEntity': '=currentEntity',
'entitySelected': '&entitySelected',
'emailSelected': '&emailSelected',
// When set to true, the contents of the control will be cleared as soon
// as an entity is selected.
'autoClear': '=autoClear',
// Set this property to immediately clear the contents of the control.
'clearValue': '=clearValue',
// Whether e-mail addresses are allowed.
'allowEmails': '=allowEmails',
'emailMessage': '@emailMessage',
// True if the menu should pull right.
'pullRight': '@pullRight'
},
controller: function($rootScope, $scope, $element, Restangular, UserService, ApiService, UtilService, Config, CreateService) {
$scope.lazyLoading = true;
$scope.teams = null;
$scope.robots = null;
$scope.isAdmin = false;
$scope.isOrganization = false;
$scope.includeTeams = true;
$scope.includeRobots = true;
$scope.includeOrgs = false;
$scope.currentEntityInternal = $scope.currentEntity;
var isSupported = function(kind, opt_array) {
return $.inArray(kind, opt_array || $scope.allowedEntities || ['user', 'team', 'robot']) >= 0;
};
$scope.lazyLoad = function() {
if (!$scope.namespace || !$scope.lazyLoading) { return; }
// Reset the cached teams and robots.
$scope.teams = null;
$scope.robots = null;
// Load the organization's teams (if applicable).
if ($scope.isOrganization && isSupported('team')) {
// Note: We load the org here again so that we always have the fully up-to-date
// teams list.
ApiService.getOrganization(null, {'orgname': $scope.namespace}).then(function(resp) {
$scope.teams = resp.teams;
});
}
// Load the user/organization's robots (if applicable).
if ($scope.isAdmin && isSupported('robot')) {
ApiService.getRobots($scope.isOrganization ? $scope.namespace : null).then(function(resp) {
$scope.robots = resp.robots;
$scope.lazyLoading = false;
}, function() {
$scope.lazyLoading = false;
});
} else {
$scope.lazyLoading = false;
}
};
$scope.createTeam = function() {
if (!$scope.isAdmin) { return; }
bootbox.prompt('Enter the name of the new team', function(teamname) {
if (!teamname) { return; }
var regex = new RegExp(TEAM_PATTERN);
if (!regex.test(teamname)) {
bootbox.alert('Invalid team name');
return;
}
CreateService.createOrganizationTeam(ApiService, $scope.namespace, teamname, function(created) {
$scope.setEntity(created.name, 'team', false);
$scope.teams[teamname] = created;
});
});
};
$scope.createRobot = function() {
if (!$scope.isAdmin) { return; }
bootbox.prompt('Enter the name of the new robot account', function(robotname) {
if (!robotname) { return; }
var regex = new RegExp(ROBOT_PATTERN);
if (!regex.test(robotname)) {
bootbox.alert('Invalid robot account name');
return;
}
CreateService.createRobotAccount(ApiService, $scope.isOrganization, $scope.namespace, robotname, function(created) {
$scope.setEntity(created.name, 'user', true);
$scope.robots.push(created);
});
});
};
$scope.setEntity = function(name, kind, is_robot) {
var entity = {
'name': name,
'kind': kind,
'is_robot': is_robot
};
if ($scope.isOrganization) {
entity['is_org_member'] = true;
}
$scope.setEntityInternal(entity, false);
};
$scope.clearEntityInternal = function() {
$scope.currentEntityInternal = null;
$scope.currentEntity = null;
$scope.entitySelected({'entity': null});
if ($scope.ngModel) {
$scope.ngModel.$setValidity('entity', false);
}
};
$scope.setEntityInternal = function(entity, updateTypeahead) {
if (updateTypeahead) {
$(input).typeahead('val', $scope.autoClear ? '' : entity.name);
} else {
$(input).val($scope.autoClear ? '' : entity.name);
}
if (!$scope.autoClear) {
$scope.currentEntityInternal = entity;
$scope.currentEntity = entity;
}
$scope.entitySelected({'entity': entity});
if ($scope.ngModel) {
$scope.ngModel.$setValidity('entity', !!entity);
}
};
// Setup the typeahead.
var input = $element[0].firstChild.firstChild;
(function() {
// Create the bloodhound search query system.
$rootScope.__entity_search_counter = (($rootScope.__entity_search_counter || 0) + 1);
var entitySearchB = new Bloodhound({
name: 'entities' + $rootScope.__entity_search_counter,
remote: {
url: '/api/v1/entities/%QUERY',
replace: function (url, uriEncodedQuery) {
var namespace = $scope.namespace || '';
url = url.replace('%QUERY', uriEncodedQuery);
url += '?namespace=' + encodeURIComponent(namespace);
if ($scope.isOrganization && isSupported('team')) {
url += '&includeTeams=true'
}
if (isSupported('org')) {
url += '&includeOrgs=true'
}
return url;
},
filter: function(data) {
var datums = [];
for (var i = 0; i < data.results.length; ++i) {
var entity = data.results[i];
var found = 'user';
if (entity.kind == 'user') {
found = entity.is_robot ? 'robot' : 'user';
} else if (entity.kind == 'team') {
found = 'team';
} else if (entity.kind == 'org') {
found = 'org';
}
if (!isSupported(found)) {
continue;
}
datums.push({
'value': entity.name,
'tokens': [entity.name],
'entity': entity
});
}
return datums;
}
},
datumTokenizer: function(d) {
return Bloodhound.tokenizers.whitespace(d.val);
},
queryTokenizer: Bloodhound.tokenizers.whitespace
});
entitySearchB.initialize();
// Setup the typeahead.
$(input).typeahead({
'highlight': true
}, {
source: entitySearchB.ttAdapter(),
templates: {
'empty': function(info) {
// Only display the empty dialog if the server load has finished.
if (info.resultKind == 'remote') {
var val = $(input).val();
if (!val) {
return null;
}
if (UtilService.isEmailAddress(val)) {
if ($scope.allowEmails) {
return '<div class="tt-message">' + $scope.emailMessage + '</div>';
} else {
return '<div class="tt-empty">A ' + Config.REGISTRY_TITLE_SHORT + ' username (not an e-mail address) must be specified</div>';
}
}
var classes = [];
if (isSupported('user')) { classes.push('users'); }
if (isSupported('org')) { classes.push('organizations'); }
if ($scope.isAdmin && isSupported('robot')) { classes.push('robot accounts'); }
if ($scope.isOrganization && isSupported('team')) { classes.push('teams'); }
if (classes.length > 1) {
classes[classes.length - 1] = 'or ' + classes[classes.length - 1];
} else if (classes.length == 0) {
return '<div class="tt-empty">No matching entities found</div>';
}
var class_string = '';
for (var i = 0; i < classes.length; ++i) {
if (i > 0) {
if (i == classes.length - 1) {
class_string += ' or ';
} else {
class_string += ', ';
}
}
class_string += classes[i];
}
return '<div class="tt-empty">No matching ' + Config.REGISTRY_TITLE_SHORT + ' ' + class_string + ' found</div>';
}
return null;
},
'suggestion': function (datum) {
template = '<div class="entity-mini-listing">';
if (datum.entity.kind == 'user' && !datum.entity.is_robot) {
template += '<i class="fa fa-user fa-lg"></i>';
} else if (datum.entity.kind == 'user' && datum.entity.is_robot) {
template += '<i class="fa fa-wrench fa-lg"></i>';
} else if (datum.entity.kind == 'team') {
template += '<i class="fa fa-group fa-lg"></i>';
} else if (datum.entity.kind == 'org') {
template += '<i class="fa">' + AvatarService.getAvatar(datum.entity.avatar, 16) + '</i>';
}
template += '<span class="name">' + datum.value + '</span>';
if (datum.entity.is_org_member === false && datum.entity.kind == 'user') {
template += '<i class="fa fa-exclamation-triangle" title="User is outside the organization"></i>';
}
template += '</div>';
return template;
}}
});
$(input).on('keypress', function(e) {
var val = $(input).val();
var code = e.keyCode || e.which;
if (code == 13 && $scope.allowEmails && UtilService.isEmailAddress(val)) {
$scope.$apply(function() {
$scope.emailSelected({'email': val});
});
}
});
$(input).on('input', function(e) {
$scope.$apply(function() {
$scope.clearEntityInternal();
});
});
$(input).on('typeahead:selected', function(e, datum) {
$scope.$apply(function() {
$scope.setEntityInternal(datum.entity, true);
});
});
})();
$scope.$watch('clearValue', function() {
if (!input) { return; }
$(input).typeahead('val', '');
$scope.clearEntityInternal();
});
$scope.$watch('placeholder', function(title) {
input.setAttribute('placeholder', title);
});
$scope.$watch('allowedEntities', function(allowed) {
if (!allowed) { return; }
$scope.includeTeams = isSupported('team', allowed);
$scope.includeRobots = isSupported('robot', allowed);
});
$scope.$watch('namespace', function(namespace) {
if (!namespace) { return; }
$scope.isAdmin = UserService.isNamespaceAdmin(namespace);
$scope.isOrganization = !!UserService.getOrganization(namespace);
});
$scope.$watch('currentEntity', function(entity) {
if ($scope.currentEntityInternal != entity) {
if (entity) {
$scope.setEntityInternal(entity, false);
} else {
$scope.clearEntityInternal();
}
}
});
}
};
return directiveDefinitionObject;
});

40
static/js/directives/ui/external-login-button.js Normal file
View file

@ -0,0 +1,40 @@
/**
* An element which displays a button for logging into the application via an external service.
*/
angular.module('quay').directive('externalLoginButton', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/external-login-button.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'signInStarted': '&signInStarted',
'redirectUrl': '=redirectUrl',
'provider': '@provider',
'action': '@action'
},
controller: function($scope, $timeout, $interval, ApiService, KeyService, CookieService, Features, Config) {
$scope.signingIn = false;
$scope.isEnterprise = KeyService.isEnterprise;
$scope.startSignin = function(service) {
$scope.signInStarted({'service': service});
var url = KeyService.getExternalLoginUrl(service, $scope.action || 'login');
// Save the redirect URL in a cookie so that we can redirect back after the service returns to us.
var redirectURL = $scope.redirectUrl || window.location.toString();
CookieService.putPermanent('quay.redirectAfterLoad', redirectURL);
// Needed to ensure that UI work done by the started callback is finished before the location
// changes.
$scope.signingIn = true;
$timeout(function() {
document.location = url;
}, 250);
};
}
};
return directiveDefinitionObject;
});

59
static/js/directives/ui/external-notification-view.js Normal file
View file

@ -0,0 +1,59 @@
/**
* An element which displays controls and information about a defined external notification on
* a repository.
*/
angular.module('quay').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': '&notificationDeleted'
},
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({
"title": "Test Notification Queued",
"message": "A test version of this notification has been queued and should appear shortly",
"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;
});

45
static/js/directives/ui/header-bar.js Normal file
View file

@ -0,0 +1,45 @@
/**
* The application header bar.
*/
angular.module('quay').directive('headerBar', function () {
var number = 0;
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/header-bar.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
},
controller: function($scope, $element, $location, UserService, PlanService, ApiService, NotificationService, Config) {
$scope.notificationService = NotificationService;
// Monitor any user changes and place the current user into the scope.
UserService.updateUserIn($scope);
$scope.signout = function() {
ApiService.logout().then(function() {
UserService.load();
$location.path('/');
});
};
$scope.appLinkTarget = function() {
if ($("div[ng-view]").length === 0) {
return "_self";
}
return "";
};
$scope.getEnterpriseLogo = function() {
if (!Config.ENTERPRISE_LOGO_URL) {
return '/static/img/quay-logo.png';
}
return Config.ENTERPRISE_LOGO_URL;
};
}
};
return directiveDefinitionObject;
});

106
static/js/directives/ui/location-view.js Normal file
View file

@ -0,0 +1,106 @@
/**
* An element which displays a small flag representing the given location, as well as a ping
* latency gauge for that location.
*/
angular.module('quay').directive('locationView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/location-view.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'location': '=location'
},
controller: function($rootScope, $scope, $element, $http, PingService) {
var LOCATIONS = {
'local_us': { 'country': 'US', 'data': 'quay-registry.s3.amazonaws.com', 'title': 'United States' },
'local_eu': { 'country': 'EU', 'data': 'quay-registry-eu.s3-eu-west-1.amazonaws.com', 'title': 'Europe' },
's3_us_east_1': { 'country': 'US', 'data': 'quay-registry.s3.amazonaws.com', 'title': 'United States (East)' },
's3_us_west_1': { 'country': 'US', 'data': 'quay-registry-cali.s3.amazonaws.com', 'title': 'United States (West)' },
's3_eu_west_1': { 'country': 'EU', 'data': 'quay-registry-eu.s3-eu-west-1.amazonaws.com', 'title': 'Europe' },
's3_ap_southeast_1': { 'country': 'SG', 'data': 'quay-registry-singapore.s3-ap-southeast-1.amazonaws.com', 'title': 'Singapore' },
's3_ap_southeast_2': { 'country': 'AU', 'data': 'quay-registry-sydney.s3-ap-southeast-2.amazonaws.com', 'title': 'Australia' },
// 's3_ap_northeast-1': { 'country': 'JP', 'data': 's3-ap-northeast-1.amazonaws.com', 'title': 'Japan' },
// 's3_sa_east1': { 'country': 'BR', 'data': 's3-east-1.amazonaws.com', 'title': 'Sao Paulo' }
};
$scope.locationPing = null;
$scope.locationPingClass = null;
$scope.getLocationTooltip = function(location, ping) {
var tip = $scope.getLocationTitle(location) + '<br>';
if (ping == null) {
tip += '(Loading)';
} else if (ping < 0) {
tip += '<br><b>Note: Could not contact server</b>';
} else {
tip += 'Estimated Ping: ' + (ping ? ping + 'ms' : '(Loading)');
}
return tip;
};
$scope.getLocationTitle = function(location) {
if (!LOCATIONS[location]) {
return '(Unknown)';
}
return 'Image data is located in ' + LOCATIONS[location]['title'];
};
$scope.getLocationImage = function(location) {
if (!LOCATIONS[location]) {
return 'unknown.png';
}
return LOCATIONS[location]['country'] + '.png';
};
$scope.getLocationPing = function(location) {
var url = 'https://' + LOCATIONS[location]['data'] + '/okay.txt';
PingService.pingUrl($scope, url, function(ping, success, count) {
if (count == 3 || !success) {
$scope.locationPing = success ? ping : -1;
}
});
};
$scope.$watch('location', function(location) {
if (!location) { return; }
$scope.getLocationPing(location);
});
$scope.$watch('locationPing', function(locationPing) {
if (locationPing == null) {
$scope.locationPingClass = null;
return;
}
if (locationPing < 0) {
$scope.locationPingClass = 'error';
return;
}
if (locationPing < 100) {
$scope.locationPingClass = 'good';
return;
}
if (locationPing < 250) {
$scope.locationPingClass = 'fair';
return;
}
if (locationPing < 500) {
$scope.locationPingClass = 'barely';
return;
}
$scope.locationPingClass = 'poor';
});
}
};
return directiveDefinitionObject;
});

336
static/js/directives/ui/logs-view.js Normal file
View file

@ -0,0 +1,336 @@
/**
* Element which displays usage logs for the given entity.
*/
angular.module('quay').directive('logsView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/logs-view.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'organization': '=organization',
'user': '=user',
'makevisible': '=makevisible',
'repository': '=repository',
'performer': '=performer',
'allLogs': '@allLogs'
},
controller: function($scope, $element, $sce, Restangular, ApiService, TriggerService,
StringBuilderService, ExternalNotificationData, UtilService) {
$scope.loading = true;
$scope.logs = null;
$scope.kindsAllowed = null;
$scope.chartVisible = true;
$scope.logsPath = '';
var datetime = new Date();
$scope.logStartDate = new Date(datetime.getUTCFullYear(), datetime.getUTCMonth(), datetime.getUTCDate() - 7);
$scope.logEndDate = new Date(datetime.getUTCFullYear(), datetime.getUTCMonth(), datetime.getUTCDate());
var defaultPermSuffix = function(metadata) {
if (metadata.activating_username) {
return ', when creating user is {activating_username}';
}
return '';
};
var logDescriptions = {
'account_change_plan': 'Change plan',
'account_change_cc': 'Update credit card',
'account_change_password': 'Change password',
'account_convert': 'Convert account to organization',
'create_robot': 'Create Robot Account: {robot}',
'delete_robot': 'Delete Robot Account: {robot}',
'create_repo': 'Create Repository: {repo}',
'push_repo': 'Push to repository: {repo}',
'repo_verb': function(metadata) {
var prefix = '';
if (metadata.verb == 'squash') {
prefix = 'Pull of squashed tag {tag}'
}
if (metadata.token) {
if (metadata.token_type == 'build-worker') {
prefix += ' by <b>build worker</b>';
} else {
prefix += ' via token';
}
} else if (metadata.username) {
prefix += ' by {username}';
} else {
prefix += ' by {_ip}';
}
return prefix;
},
'pull_repo': function(metadata) {
if (metadata.token) {
var prefix = 'Pull of repository'
if (metadata.token_type == 'build-worker') {
prefix += ' by <b>build worker</b>';
} else {
prefix += ' via token';
}
return prefix;
} else if (metadata.username) {
return 'Pull repository {repo} by {username}';
} else {
return 'Public pull of repository {repo} by {_ip}';
}
},
'delete_repo': 'Delete repository: {repo}',
'change_repo_permission': function(metadata) {
if (metadata.username) {
return 'Change permission for user {username} in repository {repo} to {role}';
} else if (metadata.team) {
return 'Change permission for team {team} in repository {repo} to {role}';
} else if (metadata.token) {
return 'Change permission for token {token} in repository {repo} to {role}';
}
},
'delete_repo_permission': function(metadata) {
if (metadata.username) {
return 'Remove permission for user {username} from repository {repo}';
} else if (metadata.team) {
return 'Remove permission for team {team} from repository {repo}';
} else if (metadata.token) {
return 'Remove permission for token {token} from repository {repo}';
}
},
'delete_tag': 'Tag {tag} deleted in repository {repo} by user {username}',
'create_tag': 'Tag {tag} created in repository {repo} on image {image} by user {username}',
'move_tag': 'Tag {tag} moved from image {original_image} to image {image} in repository {repo} by user {username}',
'change_repo_visibility': 'Change visibility for repository {repo} to {visibility}',
'add_repo_accesstoken': 'Create access token {token} in repository {repo}',
'delete_repo_accesstoken': 'Delete access token {token} in repository {repo}',
'set_repo_description': 'Change description for repository {repo}: {description}',
'build_dockerfile': function(metadata) {
if (metadata.trigger_id) {
var triggerDescription = TriggerService.getDescription(
metadata['service'], metadata['config']);
return 'Build image from Dockerfile for repository {repo} triggered by ' + triggerDescription;
}
return 'Build image from Dockerfile for repository {repo}';
},
'org_create_team': 'Create team: {team}',
'org_delete_team': 'Delete team: {team}',
'org_add_team_member': 'Add member {member} to team {team}',
'org_remove_team_member': 'Remove member {member} from team {team}',
'org_invite_team_member': function(metadata) {
if (metadata.user) {
return 'Invite {user} to team {team}';
} else {
return 'Invite {email} to team {team}';
}
},
'org_delete_team_member_invite': function(metadata) {
if (metadata.user) {
return 'Rescind invite of {user} to team {team}';
} else {
return 'Rescind invite of {email} to team {team}';
}
},
'org_team_member_invite_accepted': 'User {member}, invited by {inviter}, joined team {team}',
'org_team_member_invite_declined': 'User {member}, invited by {inviter}, declined to join team {team}',
'org_set_team_description': 'Change description of team {team}: {description}',
'org_set_team_role': 'Change permission of team {team} to {role}',
'create_prototype_permission': function(metadata) {
if (metadata.delegate_user) {
return 'Create default permission: {role} for {delegate_user}' + defaultPermSuffix(metadata);
} else if (metadata.delegate_team) {
return 'Create default permission: {role} for {delegate_team}' + defaultPermSuffix(metadata);
}
},
'modify_prototype_permission': function(metadata) {
if (metadata.delegate_user) {
return 'Modify default permission: {role} (from {original_role}) for {delegate_user}' + defaultPermSuffix(metadata);
} else if (metadata.delegate_team) {
return 'Modify default permission: {role} (from {original_role}) for {delegate_team}' + defaultPermSuffix(metadata);
}
},
'delete_prototype_permission': function(metadata) {
if (metadata.delegate_user) {
return 'Delete default permission: {role} for {delegate_user}' + defaultPermSuffix(metadata);
} else if (metadata.delegate_team) {
return 'Delete default permission: {role} for {delegate_team}' + defaultPermSuffix(metadata);
}
},
'setup_repo_trigger': function(metadata) {
var triggerDescription = TriggerService.getDescription(
metadata['service'], metadata['config']);
return 'Setup build trigger - ' + triggerDescription;
},
'delete_repo_trigger': function(metadata) {
var triggerDescription = TriggerService.getDescription(
metadata['service'], metadata['config']);
return 'Delete build trigger - ' + triggerDescription;
},
'create_application': 'Create application {application_name} with client ID {client_id}',
'update_application': 'Update application to {application_name} for client ID {client_id}',
'delete_application': 'Delete application {application_name} with client ID {client_id}',
'reset_application_client_secret': 'Reset the Client Secret of application {application_name} ' +
'with client ID {client_id}',
'add_repo_notification': function(metadata) {
var eventData = ExternalNotificationData.getEventInfo(metadata.event);
return 'Add notification of event "' + eventData['title'] + '" for repository {repo}';
},
'delete_repo_notification': function(metadata) {
var eventData = ExternalNotificationData.getEventInfo(metadata.event);
return 'Delete notification of event "' + eventData['title'] + '" for repository {repo}';
},
'regenerate_robot_token': 'Regenerated token for robot {robot}',
// Note: These are deprecated.
'add_repo_webhook': 'Add webhook in repository {repo}',
'delete_repo_webhook': 'Delete webhook in repository {repo}'
};
var logKinds = {
'account_change_plan': 'Change plan',
'account_change_cc': 'Update credit card',
'account_change_password': 'Change password',
'account_convert': 'Convert account to organization',
'create_robot': 'Create Robot Account',
'delete_robot': 'Delete Robot Account',
'create_repo': 'Create Repository',
'push_repo': 'Push to repository',
'repo_verb': 'Pull Repo Verb',
'pull_repo': 'Pull repository',
'delete_repo': 'Delete repository',
'change_repo_permission': 'Change repository permission',
'delete_repo_permission': 'Remove user permission from repository',
'change_repo_visibility': 'Change repository visibility',
'add_repo_accesstoken': 'Create access token',
'delete_repo_accesstoken': 'Delete access token',
'set_repo_description': 'Change repository description',
'build_dockerfile': 'Build image from Dockerfile',
'delete_tag': 'Delete Tag',
'create_tag': 'Create Tag',
'move_tag': 'Move Tag',
'org_create_team': 'Create team',
'org_delete_team': 'Delete team',
'org_add_team_member': 'Add team member',
'org_invite_team_member': 'Invite team member',
'org_delete_team_member_invite': 'Rescind team member invitation',
'org_remove_team_member': 'Remove team member',
'org_team_member_invite_accepted': 'Team invite accepted',
'org_team_member_invite_declined': 'Team invite declined',
'org_set_team_description': 'Change team description',
'org_set_team_role': 'Change team permission',
'create_prototype_permission': 'Create default permission',
'modify_prototype_permission': 'Modify default permission',
'delete_prototype_permission': 'Delete default permission',
'setup_repo_trigger': 'Setup build trigger',
'delete_repo_trigger': 'Delete build trigger',
'create_application': 'Create Application',
'update_application': 'Update Application',
'delete_application': 'Delete Application',
'reset_application_client_secret': 'Reset Client Secret',
'add_repo_notification': 'Add repository notification',
'delete_repo_notification': 'Delete repository notification',
'regenerate_robot_token': 'Regenerate Robot Token',
// Note: these are deprecated.
'add_repo_webhook': 'Add webhook',
'delete_repo_webhook': 'Delete webhook'
};
var getDateString = function(date) {
return (date.getMonth() + 1) + '/' + date.getDate() + '/' + date.getFullYear();
};
var getOffsetDate = function(date, days) {
return new Date(date.getFullYear(), date.getMonth(), date.getDate() + days);
};
var update = function() {
var hasValidUser = !!$scope.user;
var hasValidOrg = !!$scope.organization;
var hasValidRepo = $scope.repository && $scope.repository.namespace;
var isValid = hasValidUser || hasValidOrg || hasValidRepo || $scope.allLogs;
if (!$scope.makevisible || !isValid) {
return;
}
var twoWeeksAgo = getOffsetDate($scope.logEndDate, -14);
if ($scope.logStartDate > $scope.logEndDate || $scope.logStartDate < twoWeeksAgo) {
$scope.logStartDate = twoWeeksAgo;
}
$scope.loading = true;
// Note: We construct the URLs here manually because we also use it for the download
// path.
var url = UtilService.getRestUrl('user/logs');
if ($scope.organization) {
url = UtilService.getRestUrl('organization', $scope.organization.name, 'logs');
}
if ($scope.repository) {
url = UtilService.getRestUrl('repository', $scope.repository.namespace, $scope.repository.name, 'logs');
}
if ($scope.allLogs) {
url = UtilService.getRestUrl('superuser', 'logs')
}
url += '?starttime=' + encodeURIComponent(getDateString($scope.logStartDate));
url += '&endtime=' + encodeURIComponent(getDateString($scope.logEndDate));
if ($scope.performer) {
url += '&performer=' + encodeURIComponent($scope.performer.name);
}
var loadLogs = Restangular.one(url);
loadLogs.customGET().then(function(resp) {
$scope.logsPath = '/api/v1/' + url;
if (!$scope.chart) {
$scope.chart = new LogUsageChart(logKinds);
$($scope.chart).bind('filteringChanged', function(e) {
$scope.$apply(function() { $scope.kindsAllowed = e.allowed; });
});
}
$scope.chart.draw('bar-chart', resp.logs, $scope.logStartDate, $scope.logEndDate);
$scope.kindsAllowed = null;
$scope.logs = resp.logs;
$scope.loading = false;
});
};
$scope.toggleChart = function() {
$scope.chartVisible = !$scope.chartVisible;
};
$scope.isVisible = function(allowed, kind) {
return allowed == null || allowed.hasOwnProperty(kind);
};
$scope.getColor = function(kind) {
return $scope.chart.getColor(kind);
};
$scope.getDescription = function(log) {
log.metadata['_ip'] = log.ip ? log.ip : null;
return StringBuilderService.buildString(logDescriptions[log.kind] || log.kind, log.metadata);
};
$scope.$watch('organization', update);
$scope.$watch('user', update);
$scope.$watch('repository', update);
$scope.$watch('makevisible', update);
$scope.$watch('performer', update);
$scope.$watch('logStartDate', update);
$scope.$watch('logEndDate', update);
}
};
return directiveDefinitionObject;
});

61
static/js/directives/ui/manual-trigger-build-dialog.js Normal file
View file

@ -0,0 +1,61 @@
/**
* An element which displays a dialog for manually trigger a build.
*/
angular.module('quay').directive('manualTriggerBuildDialog', function () {
var directiveDefinitionObject = {
templateUrl: '/static/directives/manual-trigger-build-dialog.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repository': '=repository',
'counter': '=counter',
'trigger': '=trigger',
'startBuild': '&startBuild'
},
controller: function($scope, $element, ApiService, TriggerService) {
$scope.parameters = {};
$scope.fieldOptions = {};
$scope.startTrigger = function() {
$('#startTriggerDialog').modal('hide');
$scope.startBuild({
'trigger': $scope.trigger,
'parameters': $scope.parameters
});
};
$scope.show = function() {
$scope.parameters = {};
$scope.fieldOptions = {};
var parameters = TriggerService.getRunParameters($scope.trigger.service);
for (var i = 0; i < parameters.length; ++i) {
var parameter = parameters[i];
if (parameter['type'] == 'option') {
// Load the values for this parameter.
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger.id,
'field_name': parameter['name']
};
ApiService.listTriggerFieldValues(null, params).then(function(resp) {
$scope.fieldOptions[parameter['name']] = resp['values'];
});
}
}
$scope.runParameters = parameters;
$('#startTriggerDialog').modal('show');
};
$scope.$watch('counter', function(counter) {
if (counter) {
$scope.show();
}
});
}
};
return directiveDefinitionObject;
});

49
static/js/directives/ui/markdown-input.js Normal file
View file

@ -0,0 +1,49 @@
/**
* An element which allows for entry of markdown content and previewing its rendering.
*/
angular.module('quay').directive('markdownInput', function () {
var counter = 0;
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/markdown-input.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'content': '=content',
'canWrite': '=canWrite',
'contentChanged': '=contentChanged',
'fieldTitle': '=fieldTitle'
},
controller: function($scope, $element) {
var elm = $element[0];
$scope.id = (counter++);
$scope.editContent = function() {
if (!$scope.canWrite) { return; }
if (!$scope.markdownDescriptionEditor) {
var converter = Markdown.getSanitizingConverter();
var editor = new Markdown.Editor(converter, '-description-' + $scope.id);
editor.run();
$scope.markdownDescriptionEditor = editor;
}
$('#wmd-input-description-' + $scope.id)[0].value = $scope.content;
$(elm).find('.modal').modal({});
};
$scope.saveContent = function() {
$scope.content = $('#wmd-input-description-' + $scope.id)[0].value;
$(elm).find('.modal').modal('hide');
if ($scope.contentChanged) {
$scope.contentChanged($scope.content);
}
};
}
};
return directiveDefinitionObject;
});

25
static/js/directives/ui/markdown-view.js Normal file
View file

@ -0,0 +1,25 @@
/**
* An element which displays its content processed as markdown.
*/
angular.module('quay').directive('markdownView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/markdown-view.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'content': '=content',
'firstLineOnly': '=firstLineOnly'
},
controller: function($scope, $element, $sce, UtilService) {
$scope.getMarkedDown = function(content, firstLineOnly) {
if (firstLineOnly) {
return $sce.trustAsHtml(UtilService.getFirstMarkdownLineAsText(content));
}
return $sce.trustAsHtml(UtilService.getMarkedDown(content));
};
}
};
return directiveDefinitionObject;
});

74
static/js/directives/ui/namespace-selector.js Normal file
View file

@ -0,0 +1,74 @@
/**
* An element which displays a dropdown namespace selector or, if there is only a single namespace,
* that namespace.
*/
angular.module('quay').directive('namespaceSelector', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/namespace-selector.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'user': '=user',
'namespace': '=namespace',
'requireCreate': '=requireCreate'
},
controller: function($scope, $element, $routeParams, $location, CookieService) {
$scope.namespaces = {};
$scope.initialize = function(user) {
var preferredNamespace = user.username;
var namespaces = {};
namespaces[user.username] = user;
if (user.organizations) {
for (var i = 0; i < user.organizations.length; ++i) {
namespaces[user.organizations[i].name] = user.organizations[i];
if (user.organizations[i].preferred_namespace) {
preferredNamespace = user.organizations[i].name;
}
}
}
var initialNamespace = $routeParams['namespace'] || CookieService.get('quay.namespace') ||
preferredNamespace || $scope.user.username;
$scope.namespaces = namespaces;
$scope.setNamespace($scope.namespaces[initialNamespace]);
};
$scope.setNamespace = function(namespaceObj) {
if (!namespaceObj) {
namespaceObj = $scope.namespaces[$scope.user.username];
}
if ($scope.requireCreate && !namespaceObj.can_create_repo) {
namespaceObj = $scope.namespaces[$scope.user.username];
}
var newNamespace = namespaceObj.name || namespaceObj.username;
$scope.namespaceObj = namespaceObj;
$scope.namespace = newNamespace;
if (newNamespace) {
CookieService.putPermanent('quay.namespace', newNamespace);
if ($routeParams['namespace'] && $routeParams['namespace'] != newNamespace) {
$location.search({'namespace': newNamespace});
}
}
};
$scope.$watch('namespace', function(namespace) {
if ($scope.namespaceObj && namespace && namespace != $scope.namespaceObj.username) {
$scope.setNamespace($scope.namespaces[namespace]);
}
});
$scope.$watch('user', function(user) {
$scope.user = user;
$scope.initialize(user);
});
}
};
return directiveDefinitionObject;
});

69
static/js/directives/ui/notification-view.js Normal file
View file

@ -0,0 +1,69 @@
/**
* An element which displays an application notification's information.
*/
angular.module('quay').directive('notificationView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/notification-view.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'notification': '=notification',
'parent': '=parent'
},
controller: function($scope, $element, $window, $location, UserService, NotificationService, ApiService) {
var stringStartsWith = function (str, prefix) {
return str.slice(0, prefix.length) == prefix;
};
$scope.getMessage = function(notification) {
return NotificationService.getMessage(notification);
};
$scope.getAvatar = function(orgname) {
var organization = UserService.getOrganization(orgname);
return organization['avatar'] || '';
};
$scope.parseDate = function(dateString) {
return Date.parse(dateString);
};
$scope.showNotification = function() {
var url = NotificationService.getPage($scope.notification);
if (url) {
if (stringStartsWith(url, 'http://') || stringStartsWith(url, 'https://')) {
$window.location.href = url;
} else {
var parts = url.split('?')
$location.path(parts[0]);
if (parts.length > 1) {
$location.search(parts[1]);
}
$scope.parent.$hide();
}
}
};
$scope.dismissNotification = function(notification) {
NotificationService.dismissNotification(notification);
};
$scope.canDismiss = function(notification) {
return NotificationService.canDismiss(notification);
};
$scope.getClass = function(notification) {
return NotificationService.getClass(notification);
};
$scope.getActions = function(notification) {
return NotificationService.getActions(notification);
};
}
};
return directiveDefinitionObject;
});

19
static/js/directives/ui/notifications-bubble.js Normal file
View file

@ -0,0 +1,19 @@
/**
* An element which displays the number and kind of application notifications. If there are no
* notifications, then the element is hidden/empty.
*/
angular.module('quay').directive('notificationsBubble', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/notifications-bubble.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
},
controller: function($scope, UserService, NotificationService) {
$scope.notificationService = NotificationService;
}
};
return directiveDefinitionObject;
});

20
static/js/directives/ui/organization-header.js Normal file
View file

@ -0,0 +1,20 @@
/**
* An element which displays an organization header, optionally with trancluded content.
*/
angular.module('quay').directive('organizationHeader', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/organization-header.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'organization': '=organization',
'teamName': '=teamName',
'clickable': '=clickable'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

112
static/js/directives/ui/plan-manager.js Normal file
View file

@ -0,0 +1,112 @@
/**
* Element for managing subscriptions.
*/
angular.module('quay').directive('planManager', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/plan-manager.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'user': '=user',
'organization': '=organization',
'readyForPlan': '&readyForPlan',
'planChanged': '&planChanged'
},
controller: function($scope, $element, PlanService, ApiService) {
$scope.isExistingCustomer = false;
$scope.parseDate = function(timestamp) {
return new Date(timestamp * 1000);
};
$scope.isPlanVisible = function(plan, subscribedPlan) {
if (plan['deprecated']) {
return plan == subscribedPlan;
}
if ($scope.organization && !PlanService.isOrgCompatible(plan)) {
return false;
}
return true;
};
$scope.changeSubscription = function(planId, opt_async) {
if ($scope.planChanging) { return; }
var callbacks = {
'opening': function() { $scope.planChanging = true; },
'started': function() { $scope.planChanging = true; },
'opened': function() { $scope.planChanging = true; },
'closed': function() { $scope.planChanging = false; },
'success': subscribedToPlan,
'failure': function(resp) {
$scope.planChanging = false;
}
};
PlanService.changePlan($scope, $scope.organization, planId, callbacks, opt_async);
};
$scope.cancelSubscription = function() {
$scope.changeSubscription(PlanService.getFreePlan());
};
var subscribedToPlan = function(sub) {
$scope.subscription = sub;
$scope.isExistingCustomer = !!sub['isExistingCustomer'];
PlanService.getPlanIncludingDeprecated(sub.plan, function(subscribedPlan) {
$scope.subscribedPlan = subscribedPlan;
$scope.planUsagePercent = sub.usedPrivateRepos * 100 / $scope.subscribedPlan.privateRepos;
if ($scope.planChanged) {
$scope.planChanged({ 'plan': subscribedPlan });
}
$scope.planChanging = false;
$scope.planLoading = false;
});
};
var update = function() {
$scope.planLoading = true;
if (!$scope.plans) { return; }
PlanService.getSubscription($scope.organization, subscribedToPlan, function() {
$scope.isExistingCustomer = false;
subscribedToPlan({ 'plan': PlanService.getFreePlan() });
});
};
var loadPlans = function() {
if ($scope.plans || $scope.loadingPlans) { return; }
if (!$scope.user && !$scope.organization) { return; }
$scope.loadingPlans = true;
PlanService.verifyLoaded(function(plans) {
$scope.plans = plans;
update();
if ($scope.readyForPlan) {
var planRequested = $scope.readyForPlan();
if (planRequested && planRequested != PlanService.getFreePlan()) {
$scope.changeSubscription(planRequested, /* async */true);
}
}
});
};
// Start the initial download.
$scope.planLoading = true;
loadPlans();
$scope.$watch('organization', loadPlans);
$scope.$watch('user', loadPlans);
}
};
return directiveDefinitionObject;
});

23
static/js/directives/ui/plans-table.js Normal file
View file

@ -0,0 +1,23 @@
/**
* An element which shows a table of all the defined subscription plans and allows one to be
* highlighted.
*/
angular.module('quay').directive('plansTable', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/plans-table.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'plans': '=plans',
'currentPlan': '=currentPlan'
},
controller: function($scope, $element) {
$scope.setPlan = function(plan) {
$scope.currentPlan = plan;
};
}
};
return directiveDefinitionObject;
});

48
static/js/directives/ui/popup-input-button.js Normal file
View file

@ -0,0 +1,48 @@
/**
* An element which, when clicked, displays a popup input dialog to accept a text value.
*/
angular.module('quay').directive('popupInputButton', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/popup-input-button.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'placeholder': '=placeholder',
'pattern': '=pattern',
'submitted': '&submitted'
},
controller: function($scope, $element) {
$scope.popupShown = function() {
setTimeout(function() {
var box = $('#input-box');
box[0].value = '';
box.focus();
}, 40);
};
$scope.getRegexp = function(pattern) {
if (!pattern) {
pattern = '.*';
}
return new RegExp(pattern);
};
$scope.inputSubmit = function() {
var box = $('#input-box');
if (box.hasClass('ng-invalid')) { return; }
var entered = box[0].value;
if (!entered) {
return;
}
if ($scope.submitted) {
$scope.submitted({'value': entered});
}
};
}
};
return directiveDefinitionObject;
});

123
static/js/directives/ui/prototype-manager.js vendored Normal file
View file

@ -0,0 +1,123 @@
/**
* Element for managing the prototype permissions for an organization.
*/
angular.module('quay').directive('prototypeManager', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/prototype-manager.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'organization': '=organization'
},
controller: function($scope, $element, ApiService) {
$scope.loading = false;
$scope.activatingForNew = null;
$scope.delegateForNew = null;
$scope.clearCounter = 0;
$scope.newForWholeOrg = true;
$scope.roles = [
{ 'id': 'read', 'title': 'Read', 'kind': 'success' },
{ 'id': 'write', 'title': 'Write', 'kind': 'success' },
{ 'id': 'admin', 'title': 'Admin', 'kind': 'primary' }
];
$scope.setRole = function(role, prototype) {
var params = {
'orgname': $scope.organization.name,
'prototypeid': prototype.id
};
var data = {
'id': prototype.id,
'role': role
};
ApiService.updateOrganizationPrototypePermission(data, params).then(function(resp) {
prototype.role = role;
}, ApiService.errorDisplay('Cannot modify permission'));
};
$scope.comparePrototypes = function(p) {
return p.activating_user ? p.activating_user.name : ' ';
};
$scope.setRoleForNew = function(role) {
$scope.newRole = role;
};
$scope.setNewForWholeOrg = function(value) {
$scope.newForWholeOrg = value;
};
$scope.showAddDialog = function() {
$scope.activatingForNew = null;
$scope.delegateForNew = null;
$scope.newRole = 'read';
$scope.clearCounter++;
$scope.newForWholeOrg = true;
$('#addPermissionDialogModal').modal({});
};
$scope.createPrototype = function() {
$scope.loading = true;
var params = {
'orgname': $scope.organization.name
};
var data = {
'delegate': $scope.delegateForNew,
'role': $scope.newRole
};
if (!$scope.newForWholeOrg) {
data['activating_user'] = $scope.activatingForNew;
}
var errorHandler = ApiService.errorDisplay('Cannot create permission',
function(resp) {
$('#addPermissionDialogModal').modal('hide');
});
ApiService.createOrganizationPrototypePermission(data, params).then(function(resp) {
$scope.prototypes.push(resp);
$scope.loading = false;
$('#addPermissionDialogModal').modal('hide');
}, errorHandler);
};
$scope.deletePrototype = function(prototype) {
$scope.loading = true;
var params = {
'orgname': $scope.organization.name,
'prototypeid': prototype.id
};
ApiService.deleteOrganizationPrototypePermission(null, params).then(function(resp) {
$scope.prototypes.splice($scope.prototypes.indexOf(prototype), 1);
$scope.loading = false;
}, ApiService.errorDisplay('Cannot delete permission'));
};
var update = function() {
if (!$scope.organization) { return; }
if ($scope.loading) { return; }
var params = {'orgname': $scope.organization.name};
$scope.loading = true;
ApiService.getOrganizationPrototypePermissions(null, params).then(function(resp) {
$scope.prototypes = resp.prototypes;
$scope.loading = false;
});
};
$scope.$watch('organization', update);
}
};
return directiveDefinitionObject;
});

50
static/js/directives/ui/ps-usage-graph.js Normal file
View file

@ -0,0 +1,50 @@
/**
* An element which displays charts and graphs representing the current installation of the
* application. This control requires superuser access and *must be disabled when not visible*.
*/
angular.module('quay').directive('psUsageGraph', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/ps-usage-graph.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'isEnabled': '=isEnabled'
},
controller: function($scope, $element) {
$scope.counter = -1;
$scope.data = null;
var source = null;
var connect = function() {
if (source) { return; }
source = new EventSource('/realtime/ps');
source.onmessage = function(e) {
$scope.$apply(function() {
$scope.counter++;
$scope.data = JSON.parse(e.data);
});
};
};
var disconnect = function() {
if (!source) { return; }
source.close();
source = null;
};
$scope.$watch('isEnabled', function(value) {
if (value) {
connect();
} else {
disconnect();
}
});
$scope.$on("$destroy", disconnect);
}
};
return directiveDefinitionObject;
});

16
static/js/directives/ui/quay-spinner.js Normal file
View file

@ -0,0 +1,16 @@
/**
* A spinner.
*/
angular.module('quay').directive('quaySpinner', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/spinner.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

20
static/js/directives/ui/registry-name.js Normal file
View file

@ -0,0 +1,20 @@
/**
* An element which displays the name of the registry (optionally the short name).
*/
angular.module('quay').directive('registryName', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/registry-name.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'isShort': '=isShort'
},
controller: function($scope, $element, Config) {
$scope.name = $scope.isShort ? Config.REGISTRY_TITLE_SHORT : Config.REGISTRY_TITLE;
}
};
return directiveDefinitionObject;
});

22
static/js/directives/ui/repo-breadcrumb.js Normal file
View file

@ -0,0 +1,22 @@
/**
* An element which shows the breadcrumbs for a repository, including subsections such as an
* an image or a generic subsection.
*/
angular.module('quay').directive('repoBreadcrumb', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/repo-breadcrumb.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repo': '=repo',
'image': '=image',
'subsection': '=subsection',
'subsectionIcon': '=subsectionIcon'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

18
static/js/directives/ui/repo-circle.js Normal file
View file

@ -0,0 +1,18 @@
/**
* An element which shows a repository icon (inside a circle).
*/
angular.module('quay').directive('repoCircle', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/repo-circle.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repo': '=repo'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

76
static/js/directives/ui/repo-search.js Normal file
View file

@ -0,0 +1,76 @@
/**
* An element which displays a repository search box.
*/
angular.module('quay').directive('repoSearch', function () {
var number = 0;
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/repo-search.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
},
controller: function($scope, $element, $location, UserService, Restangular, UtilService) {
var searchToken = 0;
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
++searchToken;
}, true);
var repoHound = new Bloodhound({
name: 'repositories',
remote: {
url: '/api/v1/find/repository?query=%QUERY',
replace: function (url, uriEncodedQuery) {
url = url.replace('%QUERY', uriEncodedQuery);
url += '&cb=' + searchToken;
return url;
},
filter: function(data) {
var datums = [];
for (var i = 0; i < data.repositories.length; ++i) {
var repo = data.repositories[i];
datums.push({
'value': repo.name,
'tokens': [repo.name, repo.namespace],
'repo': repo
});
}
return datums;
}
},
datumTokenizer: function(d) {
return Bloodhound.tokenizers.whitespace(d.val);
},
queryTokenizer: Bloodhound.tokenizers.whitespace
});
repoHound.initialize();
var element = $($element[0].childNodes[0]);
element.typeahead({ 'highlight': true }, {
source: repoHound.ttAdapter(),
templates: {
'suggestion': function (datum) {
template = '<div class="repo-mini-listing">';
template += '<i class="fa fa-hdd-o fa-lg"></i>'
template += '<span class="name">' + datum.repo.namespace +'/' + datum.repo.name + '</span>'
if (datum.repo.description) {
template += '<span class="description">' + UtilService.getFirstMarkdownLineAsText(datum.repo.description) + '</span>'
}
template += '</div>'
return template;
}
}
});
element.on('typeahead:selected', function (e, datum) {
element.typeahead('val', '');
$scope.$apply(function() {
$location.path('/repository/' + datum.repo.namespace + '/' + datum.repo.name);
});
});
}
};
return directiveDefinitionObject;
});

20
static/js/directives/ui/resource-view.js Normal file
View file

@ -0,0 +1,20 @@
/**
* An element which displays either a resource (if present) or an error message if the resource
* failed to load.
*/
angular.module('quay').directive('resourceView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/resource-view.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'resource': '=resource',
'errorMessage': '=errorMessage'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

102
static/js/directives/ui/robots-manager.js Normal file
View file

@ -0,0 +1,102 @@
/**
* Element for managing the robots owned by an organization or a user.
*/
angular.module('quay').directive('robotsManager', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/robots-manager.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'organization': '=organization',
'user': '=user'
},
controller: function($scope, $element, ApiService, $routeParams, CreateService) {
$scope.ROBOT_PATTERN = ROBOT_PATTERN;
$scope.robots = null;
$scope.loading = false;
$scope.shownRobot = null;
$scope.showRobotCounter = 0;
$scope.regenerateToken = function(username) {
if (!username) { return; }
var shortName = $scope.getShortenedName(username);
ApiService.regenerateRobotToken($scope.organization, null, {'robot_shortname': shortName}).then(function(updated) {
var index = $scope.findRobotIndexByName(username);
if (index >= 0) {
$scope.robots.splice(index, 1);
$scope.robots.push(updated);
}
$scope.shownRobot = updated;
}, ApiService.errorDisplay('Cannot regenerate robot account token'));
};
$scope.showRobot = function(info) {
$scope.shownRobot = info;
$scope.showRobotCounter++;
};
$scope.findRobotIndexByName = function(name) {
for (var i = 0; i < $scope.robots.length; ++i) {
if ($scope.robots[i].name == name) {
return i;
}
}
return -1;
};
$scope.getShortenedName = function(name) {
var plus = name.indexOf('+');
return name.substr(plus + 1);
};
$scope.getPrefix = function(name) {
var plus = name.indexOf('+');
return name.substr(0, plus);
};
$scope.createRobot = function(name) {
if (!name) { return; }
CreateService.createRobotAccount(ApiService, !!$scope.organization, $scope.organization ? $scope.organization.name : '', name,
function(created) {
$scope.robots.push(created);
});
};
$scope.deleteRobot = function(info) {
var shortName = $scope.getShortenedName(info.name);
ApiService.deleteRobot($scope.organization, null, {'robot_shortname': shortName}).then(function(resp) {
var index = $scope.findRobotIndexByName(info.name);
if (index >= 0) {
$scope.robots.splice(index, 1);
}
}, ApiService.errorDisplay('Cannot delete robot account'));
};
var update = function() {
if (!$scope.user && !$scope.organization) { return; }
if ($scope.loading) { return; }
$scope.loading = true;
ApiService.getRobots($scope.organization).then(function(resp) {
$scope.robots = resp.robots;
$scope.loading = false;
if ($routeParams.showRobot) {
var index = $scope.findRobotIndexByName($routeParams.showRobot);
if (index >= 0) {
$scope.showRobot($scope.robots[index]);
}
}
});
};
$scope.$watch('organization', update);
$scope.$watch('user', update);
}
};
return directiveDefinitionObject;
});

29
static/js/directives/ui/role-group.js Normal file
View file

@ -0,0 +1,29 @@
/**
* An element which displays a set of roles, and highlights the current role. This control also
* allows the current role to be changed.
*/
angular.module('quay').directive('roleGroup', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/role-group.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'roles': '=roles',
'currentRole': '=currentRole',
'roleChanged': '&roleChanged'
},
controller: function($scope, $element) {
$scope.setRole = function(role) {
if ($scope.currentRole == role) { return; }
if ($scope.roleChanged) {
$scope.roleChanged({'role': role});
} else {
$scope.currentRole = role;
}
};
}
};
return directiveDefinitionObject;
});

136
static/js/directives/ui/setup-trigger-dialog.js Normal file
View file

@ -0,0 +1,136 @@
/**
* An element which displays a dialog for setting up a build trigger.
*/
angular.module('quay').directive('setupTriggerDialog', function () {
var directiveDefinitionObject = {
templateUrl: '/static/directives/setup-trigger-dialog.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repository': '=repository',
'trigger': '=trigger',
'counter': '=counter',
'canceled': '&canceled',
'activated': '&activated'
},
controller: function($scope, $element, ApiService, UserService) {
var modalSetup = false;
$scope.state = {};
$scope.nextStepCounter = -1;
$scope.currentView = 'config';
$scope.show = function() {
if (!$scope.trigger || !$scope.repository) { return; }
$scope.currentView = 'config';
$('#setupTriggerModal').modal({});
if (!modalSetup) {
$('#setupTriggerModal').on('hidden.bs.modal', function () {
if (!$scope.trigger || $scope.trigger['is_active']) { return; }
$scope.nextStepCounter = -1;
$scope.$apply(function() {
$scope.cancelSetupTrigger();
});
});
modalSetup = true;
$scope.nextStepCounter = 0;
}
};
$scope.isNamespaceAdmin = function(namespace) {
return UserService.isNamespaceAdmin(namespace);
};
$scope.cancelSetupTrigger = function() {
$scope.canceled({'trigger': $scope.trigger});
};
$scope.hide = function() {
$('#setupTriggerModal').modal('hide');
};
$scope.checkAnalyze = function(isValid) {
$scope.currentView = 'analyzing';
$scope.pullInfo = {
'is_public': true
};
if (!isValid) {
$scope.currentView = 'analyzed';
return;
}
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger.id
};
var data = {
'config': $scope.trigger.config
};
ApiService.analyzeBuildTrigger(data, params).then(function(resp) {
$scope.currentView = 'analyzed';
if (resp['status'] == 'analyzed') {
if (resp['robots'] && resp['robots'].length > 0) {
$scope.pullInfo['pull_entity'] = resp['robots'][0];
} else {
$scope.pullInfo['pull_entity'] = null;
}
$scope.pullInfo['is_public'] = false;
}
$scope.pullInfo['analysis'] = resp;
}, ApiService.errorDisplay('Cannot load Dockerfile information'));
};
$scope.activate = function() {
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger.id
};
var data = {
'config': $scope.trigger['config']
};
if ($scope.pullInfo['pull_entity']) {
data['pull_robot'] = $scope.pullInfo['pull_entity']['name'];
}
$scope.currentView = 'activating';
var errorHandler = ApiService.errorDisplay('Cannot activate build trigger', function(resp) {
$scope.hide();
$scope.canceled({'trigger': $scope.trigger});
});
ApiService.activateBuildTrigger(data, params).then(function(resp) {
$scope.hide();
$scope.trigger['is_active'] = true;
$scope.trigger['pull_robot'] = resp['pull_robot'];
$scope.activated({'trigger': $scope.trigger});
}, errorHandler);
};
var check = function() {
if ($scope.counter && $scope.trigger && $scope.repository) {
$scope.show();
}
};
$scope.$watch('trigger', check);
$scope.$watch('counter', check);
$scope.$watch('repository', check);
}
};
return directiveDefinitionObject;
});

99
static/js/directives/ui/signin-form.js Normal file
View file

@ -0,0 +1,99 @@
/**
* An element which displays the sign in form.
*/
angular.module('quay').directive('signinForm', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/signin-form.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'redirectUrl': '=redirectUrl',
'signInStarted': '&signInStarted',
'signedIn': '&signedIn'
},
controller: function($scope, $location, $timeout, $interval, ApiService, KeyService, UserService, CookieService, Features, Config) {
$scope.tryAgainSoon = 0;
$scope.tryAgainInterval = null;
$scope.signingIn = false;
$scope.markStarted = function() {
$scope.signingIn = true;
if ($scope.signInStarted != null) {
$scope.signInStarted();
}
};
$scope.cancelInterval = function() {
$scope.tryAgainSoon = 0;
if ($scope.tryAgainInterval) {
$interval.cancel($scope.tryAgainInterval);
}
$scope.tryAgainInterval = null;
};
$scope.$watch('user.username', function() {
$scope.cancelInterval();
});
$scope.$on('$destroy', function() {
$scope.cancelInterval();
});
$scope.signin = function() {
if ($scope.tryAgainSoon > 0) { return; }
$scope.markStarted();
$scope.cancelInterval();
ApiService.signinUser($scope.user).then(function() {
$scope.signingIn = false;
$scope.needsEmailVerification = false;
$scope.invalidCredentials = false;
if ($scope.signedIn != null) {
$scope.signedIn();
}
// Load the newly created user.
UserService.load();
// Redirect to the specified page or the landing page
// Note: The timeout of 500ms is needed to ensure dialogs containing sign in
// forms get removed before the location changes.
$timeout(function() {
var redirectUrl = $scope.redirectUrl;
if (redirectUrl == $location.path() || redirectUrl == null) {
return;
}
window.location = (redirectUrl ? redirectUrl : '/');
}, 500);
}, function(result) {
$scope.signingIn = false;
if (result.status == 429 /* try again later */) {
$scope.needsEmailVerification = false;
$scope.invalidCredentials = false;
$scope.cancelInterval();
$scope.tryAgainSoon = result.headers('Retry-After');
$scope.tryAgainInterval = $interval(function() {
$scope.tryAgainSoon--;
if ($scope.tryAgainSoon <= 0) {
$scope.cancelInterval();
}
}, 1000, $scope.tryAgainSoon);
} else {
$scope.needsEmailVerification = result.data.needsEmailVerification;
$scope.invalidCredentials = result.data.invalidCredentials;
}
});
};
}
};
return directiveDefinitionObject;
});

51
static/js/directives/ui/signup-form.js Normal file
View file

@ -0,0 +1,51 @@
/**
* An element which displays the sign up form.
*/
angular.module('quay').directive('signupForm', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/signup-form.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'inviteCode': '=inviteCode',
'userRegistered': '&userRegistered'
},
controller: function($scope, $location, $timeout, ApiService, KeyService, UserService, Config, UIService) {
$('.form-signup').popover();
$scope.awaitingConfirmation = false;
$scope.registering = false;
$scope.register = function() {
UIService.hidePopover('#signupButton');
$scope.registering = true;
if ($scope.inviteCode) {
$scope.newUser['invite_code'] = $scope.inviteCode;
}
ApiService.createNewUser($scope.newUser).then(function(resp) {
$scope.registering = false;
$scope.awaitingConfirmation = !!resp['awaiting_verification'];
if (Config.MIXPANEL_KEY) {
mixpanel.alias($scope.newUser.username);
}
$scope.userRegistered({'username': $scope.newUser.username});
if (!$scope.awaitingConfirmation) {
document.location = '/';
}
}, function(result) {
$scope.registering = false;
UIService.showFormError('#signupButton', result);
});
};
}
};
return directiveDefinitionObject;
});

120
static/js/directives/ui/step-view.js Normal file
View file

@ -0,0 +1,120 @@
/**
* An element which displays the steps of the wizard-like dialog, changing them as each step
* is completed.
*/
angular.module('quay').directive('stepView', function ($compile) {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/step-view.html',
replace: true,
transclude: true,
restrict: 'C',
scope: {
'nextStepCounter': '=nextStepCounter',
'currentStepValid': '=currentStepValid',
'stepsCompleted': '&stepsCompleted'
},
controller: function($scope, $element, $rootScope) {
this.currentStepIndex = -1;
this.steps = [];
this.watcher = null;
this.getCurrentStep = function() {
return this.steps[this.currentStepIndex];
};
this.reset = function() {
this.currentStepIndex = -1;
for (var i = 0; i < this.steps.length; ++i) {
this.steps[i].element.hide();
}
$scope.currentStepValid = false;
};
this.next = function() {
if (this.currentStepIndex >= 0) {
var currentStep = this.getCurrentStep();
if (!currentStep || !currentStep.scope) { return; }
if (!currentStep.scope.completeCondition) {
return;
}
currentStep.element.hide();
if (this.unwatch) {
this.unwatch();
this.unwatch = null;
}
}
this.currentStepIndex++;
if (this.currentStepIndex < this.steps.length) {
var currentStep = this.getCurrentStep();
currentStep.element.show();
currentStep.scope.load()
this.unwatch = currentStep.scope.$watch('completeCondition', function(cc) {
$scope.currentStepValid = !!cc;
});
} else {
$scope.stepsCompleted();
}
};
this.register = function(scope, element) {
element.hide();
this.steps.push({
'scope': scope,
'element': element
});
};
var that = this;
$scope.$watch('nextStepCounter', function(nsc) {
if (nsc >= 0) {
that.next();
} else {
that.reset();
}
});
}
};
return directiveDefinitionObject;
});
/**
* A step in the step view.
*/
angular.module('quay').directive('stepViewStep', function () {
var directiveDefinitionObject = {
priority: 1,
require: '^stepView',
templateUrl: '/static/directives/step-view-step.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'completeCondition': '=completeCondition',
'loadCallback': '&loadCallback',
'loadMessage': '@loadMessage'
},
link: function(scope, element, attrs, controller) {
controller.register(scope, element);
},
controller: function($scope, $element) {
$scope.load = function() {
$scope.loading = true;
$scope.loadCallback({'callback': function() {
$scope.loading = false;
}});
};
}
};
return directiveDefinitionObject;
});

127
static/js/directives/ui/tag-specific-image-view.js Normal file
View file

@ -0,0 +1,127 @@
/**
* An element which displays those images which belong to the specified tag *only*. If an image
* is shared between more than a single tag in the repository, then it is not displayed.
*/
angular.module('quay').directive('tagSpecificImagesView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/tag-specific-images-view.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'repository': '=repository',
'tag': '=tag',
'images': '=images',
'imageCutoff': '=imageCutoff'
},
controller: function($scope, $element, UtilService) {
$scope.getFirstTextLine = UtilService.getFirstMarkdownLineAsText;
$scope.hasImages = false;
$scope.tagSpecificImages = [];
$scope.getImageListingClasses = function(image) {
var classes = '';
if (image.ancestors.length > 1) {
classes += 'child ';
}
var currentTag = $scope.repository.tags[$scope.tag];
if (image.id == currentTag.image_id) {
classes += 'tag-image ';
}
return classes;
};
var forAllTagImages = function(tag, callback, opt_cutoff) {
if (!tag) { return; }
if (!$scope.imageByDockerId) {
$scope.imageByDockerId = [];
for (var i = 0; i < $scope.images.length; ++i) {
var currentImage = $scope.images[i];
$scope.imageByDockerId[currentImage.id] = currentImage;
}
}
var tag_image = $scope.imageByDockerId[tag.image_id];
if (!tag_image) {
return;
}
callback(tag_image);
var ancestors = tag_image.ancestors.split('/').reverse();
for (var i = 0; i < ancestors.length; ++i) {
var image = $scope.imageByDockerId[ancestors[i]];
if (image) {
if (image == opt_cutoff) {
return;
}
callback(image);
}
}
};
var refresh = function() {
if (!$scope.repository || !$scope.tag || !$scope.images) {
$scope.tagSpecificImages = [];
return;
}
var tag = $scope.repository.tags[$scope.tag];
if (!tag) {
$scope.tagSpecificImages = [];
return;
}
var getIdsForTag = function(currentTag) {
var ids = {};
forAllTagImages(currentTag, function(image) {
ids[image.id] = true;
}, $scope.imageCutoff);
return ids;
};
// Remove any IDs that match other tags.
var toDelete = getIdsForTag(tag);
for (var currentTagName in $scope.repository.tags) {
var currentTag = $scope.repository.tags[currentTagName];
if (currentTag != tag) {
for (var id in getIdsForTag(currentTag)) {
delete toDelete[id];
}
}
}
// Return the matching list of images.
var images = [];
for (var i = 0; i < $scope.images.length; ++i) {
var image = $scope.images[i];
if (toDelete[image.id]) {
images.push(image);
}
}
images.sort(function(a, b) {
var result = new Date(b.created) - new Date(a.created);
if (result != 0) {
return result;
}
return b.sort_index - a.sort_index;
});
$scope.tagSpecificImages = images;
};
$scope.$watch('repository', refresh);
$scope.$watch('tag', refresh);
$scope.$watch('images', refresh);
}
};
return directiveDefinitionObject;
});

35
static/js/directives/ui/tour-content.js Normal file
View file

@ -0,0 +1,35 @@
/**
* An element which implements a frame for content in the application tour, making sure to
* chromify any marked elements found. Note that this directive relies on the browserchrome library
* in the lib/ folder.
*/
angular.module('quay').directive('tourContent', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/tour-content.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'kind': '=kind'
},
controller: function($scope, $element, $timeout, UserService) {
// Monitor any user changes and place the current user into the scope.
UserService.updateUserIn($scope);
$scope.chromify = function() {
browserchrome.update();
};
$scope.$watch('kind', function(kind) {
$timeout(function() {
$scope.chromify();
});
});
},
link: function($scope, $element, $attr, ctrl) {
$scope.chromify();
}
};
return directiveDefinitionObject;
});

21
static/js/directives/ui/trigger-description.js Normal file
View file

@ -0,0 +1,21 @@
/**
* An element which displays information about a build trigger.
*/
angular.module('quay').directive('triggerDescription', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/trigger-description.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'trigger': '=trigger',
'short': '=short'
},
controller: function($scope, $element, KeyService, TriggerService) {
$scope.KeyService = KeyService;
$scope.TriggerService = TriggerService;
}
};
return directiveDefinitionObject;
});

219
static/js/directives/ui/trigger-setup-github.js Normal file
View file

@ -0,0 +1,219 @@
/**
* An element which displays github-specific setup information for its build triggers.
*/
angular.module('quay').directive('triggerSetupGithub', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/trigger-setup-github.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'repository': '=repository',
'trigger': '=trigger',
'nextStepCounter': '=nextStepCounter',
'currentStepValid': '=currentStepValid',
'analyze': '&analyze'
},
controller: function($scope, $element, ApiService) {
$scope.analyzeCounter = 0;
$scope.setupReady = false;
$scope.refs = null;
$scope.branchNames = null;
$scope.tagNames = null;
$scope.state = {
'currentRepo': null,
'branchTagFilter': '',
'hasBranchTagFilter': false,
'isInvalidLocation': true,
'currentLocation': null
};
$scope.isMatching = function(kind, name, filter) {
try {
var patt = new RegExp(filter);
} catch (ex) {
return false;
}
var fullname = (kind + '/' + name);
var m = fullname.match(patt);
return m && m[0].length == fullname.length;
}
$scope.addRef = function(kind, name) {
if ($scope.isMatching(kind, name, $scope.state.branchTagFilter)) {
return;
}
var newFilter = kind + '/' + name;
var existing = $scope.state.branchTagFilter;
if (existing) {
$scope.state.branchTagFilter = '(' + existing + ')|(' + newFilter + ')';
} else {
$scope.state.branchTagFilter = newFilter;
}
}
$scope.stepsCompleted = function() {
$scope.analyze({'isValid': !$scope.state.isInvalidLocation});
};
$scope.loadRepositories = function(callback) {
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger.id
};
ApiService.listTriggerBuildSources(null, params).then(function(resp) {
$scope.orgs = resp['sources'];
setupTypeahead();
callback();
}, ApiService.errorDisplay('Cannot load repositories'));
};
$scope.loadBranchesAndTags = function(callback) {
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger['id'],
'field_name': 'refs'
};
ApiService.listTriggerFieldValues($scope.trigger['config'], params).then(function(resp) {
$scope.refs = resp['values'];
$scope.branchNames = [];
$scope.tagNames = [];
for (var i = 0; i < $scope.refs.length; ++i) {
var ref = $scope.refs[i];
if (ref.kind == 'branch') {
$scope.branchNames.push(ref.name);
} else {
$scope.tagNames.push(ref.name);
}
}
callback();
}, ApiService.errorDisplay('Cannot load branch and tag names'));
};
$scope.loadLocations = function(callback) {
$scope.locations = null;
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger.id
};
ApiService.listBuildTriggerSubdirs($scope.trigger['config'], params).then(function(resp) {
if (resp['status'] == 'error') {
callback(resp['message'] || 'Could not load Dockerfile locations');
return;
}
$scope.locations = resp['subdir'] || [];
// Select a default location (if any).
if ($scope.locations.length > 0) {
$scope.setLocation($scope.locations[0]);
} else {
$scope.state.currentLocation = null;
$scope.state.isInvalidLocation = resp['subdir'].indexOf('') < 0;
$scope.trigger.$ready = true;
}
callback();
}, ApiService.errorDisplay('Cannot load locations'));
}
$scope.handleLocationInput = function(location) {
$scope.state.isInvalidLocation = $scope.locations.indexOf(location) < 0;
$scope.trigger['config']['subdir'] = location || '';
$scope.trigger.$ready = true;
};
$scope.handleLocationSelected = function(datum) {
$scope.setLocation(datum['value']);
};
$scope.setLocation = function(location) {
$scope.state.currentLocation = location;
$scope.state.isInvalidLocation = false;
$scope.trigger['config']['subdir'] = location || '';
$scope.trigger.$ready = true;
};
$scope.selectRepo = function(repo, org) {
$scope.state.currentRepo = {
'repo': repo,
'avatar_url': org['info']['avatar_url'],
'toString': function() {
return this.repo;
}
};
};
$scope.selectRepoInternal = function(currentRepo) {
$scope.trigger.$ready = false;
var params = {
'repository': $scope.repository.namespace + '/' + $scope.repository.name,
'trigger_uuid': $scope.trigger['id']
};
var repo = currentRepo['repo'];
$scope.trigger['config'] = {
'build_source': repo,
'subdir': ''
};
};
var setupTypeahead = function() {
var repos = [];
for (var i = 0; i < $scope.orgs.length; ++i) {
var org = $scope.orgs[i];
var orepos = org['repos'];
for (var j = 0; j < orepos.length; ++j) {
var repoValue = {
'repo': orepos[j],
'avatar_url': org['info']['avatar_url'],
'toString': function() {
return this.repo;
}
};
var datum = {
'name': orepos[j],
'org': org,
'value': orepos[j],
'title': orepos[j],
'item': repoValue
};
repos.push(datum);
}
}
$scope.repoLookahead = repos;
};
$scope.$watch('state.currentRepo', function(repo) {
if (repo) {
$scope.selectRepoInternal(repo);
}
});
$scope.$watch('state.branchTagFilter', function(bf) {
if (!$scope.trigger) { return; }
if ($scope.state.hasBranchTagFilter) {
$scope.trigger['config']['branchtag_regex'] = bf;
} else {
delete $scope.trigger['config']['branchtag_regex'];
}
});
}
};
return directiveDefinitionObject;
});

22
static/js/directives/ui/twitter-view.js Normal file
View file

@ -0,0 +1,22 @@
/**
* An element which displays a twitter message and author information.
*/
angular.module('quay').directive('twitterView', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/twitter-view.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'avatarUrl': '@avatarUrl',
'authorName': '@authorName',
'authorUser': '@authorUser',
'messageUrl': '@messageUrl',
'messageDate': '@messageDate'
},
controller: function($scope, $element) {
}
};
return directiveDefinitionObject;
});

50
static/js/directives/ui/usage-chart.js Normal file
View file

@ -0,0 +1,50 @@
/**
* An element which displays a donut chart, along with warnings if the limit is close to being
* reached.
*/
angular.module('quay').directive('usageChart', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/usage-chart.html',
replace: false,
transclude: false,
restrict: 'C',
scope: {
'current': '=current',
'total': '=total',
'limit': '=limit',
'usageTitle': '@usageTitle'
},
controller: function($scope, $element) {
$scope.limit = "";
var chart = null;
var update = function() {
if ($scope.current == null || $scope.total == null) { return; }
if (!chart) {
chart = new UsageChart();
chart.draw('usage-chart-element');
}
var current = $scope.current || 0;
var total = $scope.total || 0;
if (current > total) {
$scope.limit = 'over';
} else if (current == total) {
$scope.limit = 'at';
} else if (current >= total * 0.7) {
$scope.limit = 'near';
} else {
$scope.limit = 'none';
}
chart.update($scope.current, $scope.total);
};
$scope.$watch('current', update);
$scope.$watch('total', update);
}
};
return directiveDefinitionObject;
});

47
static/js/directives/ui/user-setup.js Normal file
View file

@ -0,0 +1,47 @@
/**
* An element which displays a box for the user to sign in, sign up and recover their account.
*/
angular.module('quay').directive('userSetup', function () {
var directiveDefinitionObject = {
priority: 0,
templateUrl: '/static/directives/user-setup.html',
replace: false,
transclude: true,
restrict: 'C',
scope: {
'redirectUrl': '=redirectUrl',
'inviteCode': '=inviteCode',
'signInStarted': '&signInStarted',
'signedIn': '&signedIn',
'userRegistered': '&userRegistered'
},
controller: function($scope, $location, $timeout, ApiService, KeyService, UserService) {
$scope.sendRecovery = function() {
$scope.sendingRecovery = true;
ApiService.requestRecoveryEmail($scope.recovery).then(function() {
$scope.invalidRecovery = false;
$scope.errorMessage = '';
$scope.sent = true;
$scope.sendingRecovery = false;
}, function(resp) {
$scope.invalidRecovery = true;
$scope.errorMessage = ApiService.getErrorMessage(resp, 'Cannot send recovery email');
$scope.sent = false;
$scope.sendingRecovery = false;
});
};
$scope.handleUserRegistered = function(username) {
$scope.userRegistered({'username': username});
};
$scope.hasSignedIn = function() {
return UserService.hasEverLoggedIn();
};
}
};
return directiveDefinitionObject;
});