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

Merge remote-tracking branch 'origin/dockerbuild'

Browse source 
Conflicts:
	static/css/quay.css
This commit is contained in:
yackob03 2013-10-30 18:42:17 -04:00
commit 65aad1a2d9
52 changed files with 2117 additions and 204 deletions
Download patch file Download diff file Expand all files Collapse all files

234
static/css/quay.css
View file

@ -36,13 +36,57 @@
100% { -webkit-transform: scale(1); }
}
@keyframes scaleup {
0% { transform: scale(0); }
100% { transform: scale(1); }
}
.user-tools .user-tool {
font-size: 24px;
margin-top: 14px;
color: #aaa;
}
.user-tools i.user-tool:hover {
cursor: pointer;
color: #428bca;
}
.status-boxes .popover {
margin-right: 20px;
}
.status-boxes .popover-content {
width: 260px;
}
.build-statuses {
}
.build-status-container {
padding: 4px;
margin-bottom: 10px;
border-bottom: 1px solid #eee;
width: 230px;
}
.build-status-container .build-message {
display: block;
white-space: nowrap;
font-size: 12px;
}
.build-status-container .progress {
height: 12px;
margin: 0px;
margin-top: 10px;
width: 230px;
}
.build-status-container:last-child {
margin-bottom: 0px;
border-bottom: 0px solid white;
}
.repo-circle {
position: relative;
@ -57,15 +101,23 @@
.repo-circle.no-background {
background: transparent;
position: relative;
height: 40px;
width: 40px;
}
.repo-circle .icon-lock {
font-size: 50%;
.repo-circle .fa-hdd {
font-size: 36px;
}
.repo-circle.no-background .fa-hdd {
font-size: 30px;
}
.repo-circle .fa-lock {
position: absolute;
bottom: -6px;
right: 0px;
bottom: -2px;
right: -4px;
background: rgb(253, 191, 191);
width: 20px;
display: inline-block;
@ -73,11 +125,11 @@
text-align: center;
height: 20px;
line-height: 21px;
font-size: 12px;
font-size: 16px !important;
}
.repo-circle.no-background .icon-lock {
bottom: -4px;
.repo-circle.no-background .fa-lock {
bottom: -2px;
right: -6px;
color: #444;
}
@ -117,6 +169,85 @@
text-decoration: none !important;
}
.new-repo .required-plan {
margin: 10px;
margin-top: 20px;
margin-left: 50px;
}
.new-repo .required-plan .alert {
color: #444 !important;
}
.new-repo .new-header {
font-size: 22px;
}
.new-repo .new-header .repo-circle {
margin-right: 14px;
}
.new-repo .new-header .name-container {
display: inline-block;
width: 300px;
}
.new-repo .description {
margin-left: 10px;
margin-top: 10px;
}
.new-repo .section {
padding-bottom: 20px;
border-bottom: 1px solid #eee;
margin-bottom: 16px;
}
.new-repo .repo-option {
margin: 6px;
margin-top: 16px;
}
.new-repo .repo-option i {
font-size: 18px;
padding-left: 10px;
padding-right: 10px;
width: 42px;
display: inline-block;
text-align: center;
}
.new-repo .option-description {
display: inline-block;
vertical-align: top;
}
.new-repo .option-description label {
display: block;
}
.new-repo .cbox {
margin: 10px;
}
.new-repo .initialize-repo {
margin: 10px;
margin-top: 16px;
margin-left: 20px;
padding: 10px;
border: 1px dashed #ccc;
}
.new-repo .initialize-repo .init-description {
color: #444;
font-size: 12px;
text-align: center;
}
.new-repo .initialize-repo .file-drop {
margin: 10px;
}
.user-guide h3 {
margin-bottom: 20px;
}
@ -532,6 +663,7 @@ p.editable:hover i {
}
.repo .description {
margin-top: 10px;
margin-bottom: 40px;
}
@ -561,22 +693,70 @@ p.editable:hover i {
display: inline-block;
}
.repo .status-boxes {
float: right;
margin-bottom: 20px;
}
.repo .status-boxes .status-box {
cursor: pointer;
display: inline-block;
border: 1px solid #eee;
border-radius: 4px;
}
.repo .status-boxes .status-box .title {
padding: 4px;
display: inline-block;
padding-left: 10px;
padding-right: 10px;
}
.repo .status-boxes .status-box .title i {
margin-right: 6px;
}
.repo .status-boxes .status-box .count {
display: inline-block;
background-image: linear-gradient(to bottom,#e8e8e8 0,#f5f5f5 100%);
padding: 4px;
padding-left: 10px;
padding-right: 10px;
font-weight: bold;
transform: scaleX(0);
-webkit-transform: scaleX(0);
-moz-transform: scaleX(0);
transition: transform 500ms ease-in-out;
-webkit-transition: -webkit-transform 500ms ease-in-out;
-moz-transition: -moz-transform 500ms ease-in-out;
}
.repo .status-boxes .status-box .count.visible {
transform: scaleX(1);
-webkit-transform: scaleX(1);
-moz-transform: scaleX(1);
}
.repo .pull-command {
float: right;
display: inline-block;
font-size: 1.2em;
font-size: 0.8em;
position: relative;
margin-right: 10px;
margin-top: 30px;
margin-right: 26px;
}
.repo .pull-command .pull-container {
.repo .pull-container {
display: inline-block;
width: 300px;
margin-left: 10px;
margin-right: 10px;
vertical-align: middle;
}
.repo .pull-command input {
.repo .pull-container input {
cursor: default;
background: white;
color: #666;
@ -702,7 +882,6 @@ p.editable:hover i {
}
.repo-listing i {
font-size: 1.5em;
color: #999;
display: inline-block;
margin-right: 6px;
@ -742,8 +921,22 @@ p.editable:hover i {
cursor: pointer;
}
.repo .description p {
margin-bottom: 6px;
.repo .build-info {
padding: 10px;
margin: 0px;
}
.repo .build-info .progress {
margin: 0px;
margin-top: 10px;
}
.repo .section {
display: block;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #eee;
}
.repo .description p:last-child {
@ -793,15 +986,15 @@ p.editable:hover i {
margin-right: 10px;
}
.repo .changes-container i.icon-plus-sign-alt {
.repo .changes-container i.fa-plus-square {
color: rgb(73, 209, 73);
}
.repo .changes-container i.icon-minus-sign-alt {
.repo .changes-container i.fa-minus-square {
color: rgb(209, 73, 73);
}
.repo .changes-container i.icon-edit-sign {
.repo .changes-container i.fa-pencil-square {
color: rgb(73, 100, 209);
}
@ -929,11 +1122,11 @@ p.editable:hover i {
width: 580px;
}
.repo-admin .repo-access-state .state-icon i.icon-lock {
.repo-admin .repo-access-state .state-icon i.fa-lock {
background: rgb(253, 191, 191);
}
.repo-admin .repo-access-state .state-icon i.icon-unlock-alt {
.repo-admin .repo-access-state .state-icon i.fa-unlock {
background: rgb(170, 236, 170);
}
@ -1105,6 +1298,7 @@ p.editable:hover i {
border: 1px solid #eee;
margin-top: 10px;
padding: 10px;
min-height: 50px;
}
/* Overrides for typeahead to work with bootstrap 3. */

8
static/directives/build-status.html Normal file
View file

@ -0,0 +1,8 @@
<div id="build-status-container" class="build-status-container">
<span class="build-message">{{ getBuildMessage(build) }}</span>
<div class="progress" ng-class="getBuildProgress(build) < 100 ? 'active progress-striped' : ''" ng-show="getBuildProgress(build) >= 0">
<div class="progress-bar" role="progressbar" aria-valuenow="{{ getBuildProgress(build) }}" aria-valuemin="0" aria-valuemax="100" style="{{ 'width: ' + getBuildProgress(build) + '%' }}">
</div>
</div>
</div>

4
static/directives/repo-circle.html
View file

@ -1,2 +1,2 @@
<i class="icon-lock icon-large" style="{{ repo.is_public ? 'visibility: hidden' : 'visibility: visible' }}" title="Private Repository"></i>
<i class="icon-hdd icon-large"></i>
<i class="fa fa-lock fa-lg" style="{{ repo.is_public ? 'visibility: hidden' : 'visibility: visible' }}" title="Private Repository"></i>
<i class="fa fa-hdd"></i>

120
static/js/app.js
View file

@ -1,5 +1,5 @@
// Start the application code itself.
quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics', 'angulartics.mixpanel'], function($provide) {
quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics', 'angulartics.mixpanel', '$strap.directives'], function($provide) {
$provide.factory('UserService', ['Restangular', function(Restangular) {
var userResponse = {
verified: false,
@ -54,7 +54,7 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
return keyService;
}]);
$provide.factory('PlanService', [function() {
$provide.factory('PlanService', ['Restangular', 'KeyService', function(Restangular, KeyService) {
var plans = [
{
title: 'Open Source',
@ -96,11 +96,54 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
planService.planList = function() {
return plans;
}
};
planService.getPlan = function(planId) {
return planDict[planId];
}
};
planService.getMinimumPlan = function(privateCount) {
for (var i = 0; i < plans.length; i++) {
var plan = plans[i];
if (plan.privateRepos >= privateCount) {
return plan;
}
}
return null;
};
planService.showSubscribeDialog = function($scope, planId, started, success, failed) {
var submitToken = function(token) {
$scope.$apply(function() {
started();
});
mixpanel.track('plan_subscribe');
var subscriptionDetails = {
token: token.id,
plan: planId,
};
var createSubscriptionRequest = Restangular.one('user/plan');
$scope.$apply(function() {
createSubscriptionRequest.customPUT(subscriptionDetails).then(success, failed);
});
};
var planDetails = planService.getPlan(planId)
StripeCheckout.open({
key: KeyService.stripePublishableKey,
address: false, // TODO change to true
amount: planDetails.price,
currency: 'usd',
name: 'Quay ' + planDetails.title + ' Subscription',
description: 'Up to ' + planDetails.privateRepos + ' private repositories',
panelLabel: 'Subscribe',
token: submitToken
});
};
return planService;
}]);
@ -155,6 +198,7 @@ quayApp = angular.module('quay', ['restangular', 'angularMoment', 'angulartics',
when('/guide/', {title: 'User Guide', templateUrl: '/static/partials/guide.html', controller: GuideCtrl}).
when('/plans/', {title: 'Plans and Pricing', templateUrl: '/static/partials/plans.html', controller: PlansCtrl}).
when('/signin/', {title: 'Signin', templateUrl: '/static/partials/signin.html', controller: SigninCtrl}).
when('/new/', {title: 'Create new repository', templateUrl: '/static/partials/new-repo.html', controller: NewRepoCtrl}).
when('/v1/', {title: 'Activation information', templateUrl: '/static/partials/v1-page.html', controller: V1Ctrl}).
@ -176,7 +220,73 @@ quayApp.directive('repoCircle', function () {
'repo': '=repo'
},
controller: function($scope, $element) {
window.console.log($scope);
}
};
return directiveDefinitionObject;
});
quayApp.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) {
$scope.getBuildProgress = function(buildInfo) {
switch (buildInfo.status) {
case 'building':
return (buildInfo.current_command / buildInfo.total_commands) * 100;
break;
case 'pushing':
var imagePercentDecimal = (buildInfo.image_completion_percent / 100);
return ((buildInfo.current_image + imagePercentDecimal) / buildInfo.total_images) * 100;
break;
case 'complete':
return 100;
break;
case 'initializing':
case 'starting':
case 'waiting':
return 0;
break;
}
return -1;
};
$scope.getBuildMessage = function(buildInfo) {
switch (buildInfo.status) {
case 'initializing':
return 'Starting Dockerfile build';
break;
case 'starting':
case 'waiting':
case 'building':
return 'Building image from Dockerfile';
break;
case 'pushing':
return 'Pushing image built from Dockerfile';
break;
case 'complete':
return 'Dockerfile build completed and pushed';
break;
case 'error':
return 'Dockerfile build failed: ' + buildInfo.message;
break;
}
};
}
};
return directiveDefinitionObject;

324
static/js/controllers.js
View file

@ -92,7 +92,7 @@ function HeaderCtrl($scope, $location, UserService, Restangular) {
},
template: function (datum) {
template = '<div class="repo-mini-listing">';
template += '<i class="icon-hdd icon-large"></i>'
template += '<i class="fa fa-hdd fa-lg"></i>'
template += '<span class="name">' + datum.repo.namespace +'/' + datum.repo.name + '</span>'
if (datum.repo.description) {
template += '<span class="description">' + getFirstTextLine(datum.repo.description) + '</span>'
@ -211,7 +211,7 @@ function RepoListCtrl($scope, Restangular, UserService) {
});
}
function LandingCtrl($scope, $timeout, Restangular, UserService, KeyService) {
function LandingCtrl($scope, $timeout, $location, Restangular, UserService, KeyService) {
$('.form-signup').popover();
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
@ -236,10 +236,6 @@ function LandingCtrl($scope, $timeout, Restangular, UserService, KeyService) {
return getMarkedDown(getFirstTextLine(commentString));
};
$scope.browseRepos = function() {
document.location = '/repository/';
};
$scope.register = function() {
$('.form-signup').popover('hide');
$scope.registering = true;
@ -346,12 +342,83 @@ function RepoCtrl($scope, Restangular, $routeParams, $rootScope, $location, $tim
}
});
var listImages = function() {
if ($scope.imageHistory) { return; }
var fetchRepository = function() {
var repositoryFetch = Restangular.one('repository/' + namespace + '/' + name);
repositoryFetch.get().then(function(repo) {
$rootScope.title = namespace + '/' + name;
$scope.repo = repo;
$scope.setTag($routeParams.tag);
$('#copyClipboard').clipboardCopy();
$scope.loading = false;
if (repo.is_building) {
startBuildInfoTimer(repo);
}
}, function() {
$scope.repo = null;
$scope.loading = false;
$rootScope.title = 'Unknown Repository';
});
};
var startBuildInfoTimer = function(repo) {
if ($scope.interval) { return; }
getBuildInfo(repo);
$scope.interval = setInterval(function() {
$scope.$apply(function() { getBuildInfo(repo); });
}, 5000);
$scope.$on("$destroy", function() {
cancelBuildInfoTimer();
});
};
var cancelBuildInfoTimer = function() {
if ($scope.interval) {
clearInterval($scope.interval);
}
};
var getBuildInfo = function(repo) {
var buildInfo = Restangular.one('repository/' + repo.namespace + '/' + repo.name + '/build/');
buildInfo.get().then(function(resp) {
var runningBuilds = [];
for (var i = 0; i < resp.builds.length; ++i) {
var build = resp.builds[i];
if (build.status != 'complete') {
runningBuilds.push(build);
}
}
$scope.buildsInfo = runningBuilds;
if (!runningBuilds.length) {
// Cancel the build timer.
cancelBuildInfoTimer();
// Mark the repo as no longer building.
$scope.repo.is_building = false;
// Reload the repo information.
fetchRepository();
listImages();
}
});
};
var listImages = function() {
var imageFetch = Restangular.one('repository/' + namespace + '/' + name + '/image/');
imageFetch.get().then(function(resp) {
$scope.imageHistory = resp.images;
// Dispose of any existing tree.
if ($scope.tree) {
$scope.tree.dispose();
}
// Create the new tree.
$scope.tree = new ImageHistoryTree(namespace, name, resp.images,
$scope.getCommentFirstLine, $scope.getTimeSince);
@ -363,7 +430,7 @@ function RepoCtrl($scope, Restangular, $routeParams, $rootScope, $location, $tim
}
$($scope.tree).bind('tagChanged', function(e) {
$scope.$apply(function() { $scope.setTag(e.tag, true); });
$scope.$apply(function() { $scope.setTag(e.tag, true); });
});
$($scope.tree).bind('imageChanged', function(e) {
$scope.$apply(function() { $scope.setImage(e.image); });
@ -378,7 +445,7 @@ function RepoCtrl($scope, Restangular, $routeParams, $rootScope, $location, $tim
changesFetch.get().then(function(changeInfo) {
$scope.currentImageChanges = changeInfo;
}, function() {
$scope.currentImageChanges = {};
$scope.currentImageChanges = {'added': [], 'removed': [], 'changed': []};
});
};
@ -441,20 +508,7 @@ function RepoCtrl($scope, Restangular, $routeParams, $rootScope, $location, $tim
$scope.loading = true;
// Fetch the repo.
var repositoryFetch = Restangular.one('repository/' + namespace + '/' + name);
repositoryFetch.get().then(function(repo) {
$rootScope.title = namespace + '/' + name;
$scope.repo = repo;
$scope.setTag($routeParams.tag);
$('#copyClipboard').clipboardCopy();
$scope.loading = false;
}, function() {
$scope.repo = null;
$scope.loading = false;
$rootScope.title = 'Unknown Repository';
});
fetchRepository();
// Fetch the image history.
listImages();
@ -492,7 +546,7 @@ function RepoAdminCtrl($scope, Restangular, $routeParams, $rootScope) {
},
template: function (datum) {
template = '<div class="user-mini-listing">';
template += '<i class="icon-user icon-large"></i>'
template += '<i class="fa fa-user fa-lg"></i>'
template += '<span class="name">' + datum.username + '</span>'
template += '</div>'
return template;
@ -702,6 +756,8 @@ function UserAdminCtrl($scope, $timeout, Restangular, PlanService, UserService,
if (sub.usedPrivateRepos > $scope.subscribedPlan.privateRepos) {
$scope.errorMessage = 'You are using more private repositories than your plan allows, please upgrate your subscription to avoid disruptions in your service.';
} else {
$scope.errorMessage = null;
}
$scope.planLoading = false;
@ -710,7 +766,7 @@ function UserAdminCtrl($scope, $timeout, Restangular, PlanService, UserService,
mixpanel.people.set({
'plan': sub.plan
});
}
};
$scope.planLoading = true;
var getSubscription = Restangular.one('user/plan');
@ -721,36 +777,16 @@ function UserAdminCtrl($scope, $timeout, Restangular, PlanService, UserService,
$scope.planChanging = false;
$scope.subscribe = function(planId) {
var submitToken = function(token) {
$scope.$apply(function() {
mixpanel.track('plan_subscribe');
$scope.planChanging = true;
$scope.errorMessage = undefined;
var subscriptionDetails = {
token: token.id,
plan: planId,
};
var createSubscriptionRequest = Restangular.one('user/plan');
createSubscriptionRequest.customPUT(subscriptionDetails).then(subscribedToPlan, function() {
// Failure
$scope.errorMessage = 'Unable to subscribe.';
});
});
};
var planDetails = PlanService.getPlan(planId)
StripeCheckout.open({
key: KeyService.stripePublishableKey,
address: false, // TODO change to true
amount: planDetails.price,
currency: 'usd',
name: 'Quay ' + planDetails.title + ' Subscription',
description: 'Up to ' + planDetails.privateRepos + ' private repositories',
panelLabel: 'Subscribe',
token: submitToken
PlanService.showSubscribeDialog($scope, planId, function() {
// Subscribing.
$scope.planChanging = true;
}, function(plan) {
// Subscribed.
subscribedToPlan(plan);
}, function() {
// Failure.
$scope.errorMessage = 'Unable to subscribe.';
$scope.planChanging = false;
});
};
@ -911,12 +947,182 @@ function ImageViewCtrl($scope, $routeParams, $rootScope, Restangular) {
});
}
function V1Ctrl($scope, UserService) {
function V1Ctrl($scope, $location, UserService) {
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
}, true);
}
function NewRepoCtrl($scope, $location, $http, UserService, Restangular, PlanService) {
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
$scope.user = currentUser;
}, true);
$scope.browseRepos = function() {
document.location = '/repository/';
$scope.repo = {
'is_public': 1,
'description': '',
'initialize': false
};
$('#couldnotbuildModal').on('hidden.bs.modal', function() {
$scope.$apply(function() {
$location.path('/repository/' + $scope.created.namespace + '/' + $scope.created.name);
});
});
var startBuild = function(repo, fileId) {
$scope.building = true;
var data = {
'file_id': fileId
};
var startBuildCall = Restangular.one('repository/' + repo.namespace + '/' + repo.name + '/build/');
startBuildCall.customPOST(data).then(function(resp) {
$location.path('/repository/' + repo.namespace + '/' + repo.name);
}, function() {
$('#couldnotbuildModal').modal();
});
};
var conductUpload = function(repo, file, url, fileId, mimeType) {
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() {
$('#couldnotbuildModal').modal();
});
};
request.onreadystatechange = function() {
var state = request.readyState;
if (state == 4) {
$scope.$apply(function() {
$scope.uploading = false;
startBuild(repo, fileId);
});
return;
}
};
request.send(file);
};
var startFileUpload = function(repo) {
$scope.uploading = true;
$scope.uploading_progress = 0;
var uploader = $('#file-drop')[0];
var file = uploader.files[0];
$scope.upload_file = file.name;
var mimeType = file.type || 'application/octet-stream';
var data = {
'mimeType': mimeType
};
var getUploadUrl = Restangular.one('filedrop/');
getUploadUrl.customPOST(data).then(function(resp) {
conductUpload(repo, file, resp.url, resp.file_id, mimeType);
}, function() {
$('#couldnotbuildModal').modal();
});
};
var subscribedToPlan = function(sub) {
$scope.planChanging = false;
$scope.subscription = sub;
$scope.subscribedPlan = PlanService.getPlan(sub.plan);
$scope.planRequired = null;
if ($scope.subscription.usedPrivateRepos >= $scope.subscribedPlan.privateRepos) {
$scope.planRequired = PlanService.getMinimumPlan($scope.subscription.usedPrivateRepos);
}
};
$scope.editDescription = function() {
if (!$scope.markdownDescriptionEditor) {
var converter = Markdown.getSanitizingConverter();
var editor = new Markdown.Editor(converter, '-description');
editor.run();
$scope.markdownDescriptionEditor = editor;
}
$('#wmd-input-description')[0].value = $scope.repo.description;
$('#editModal').modal({});
};
$scope.getMarkedDown = function(string) {
if (!string) { return ''; }
return getMarkedDown(string);
};
$scope.saveDescription = function() {
$('#editModal').modal('hide');
$scope.repo.description = $('#wmd-input-description')[0].value;
};
$scope.createNewRepo = function() {
var uploader = $('#file-drop')[0];
if ($scope.repo.initialize && uploader.files.length < 1) {
$('#missingfileModal').modal();
return;
}
$scope.creating = true;
var repo = $scope.repo;
var data = {
'repository': repo.name,
'visibility': repo.is_public == '1' ? 'public' : 'private',
'description': repo.description
};
var createPost = Restangular.one('repository');
createPost.customPOST(data).then(function(created) {
$scope.creating = false;
$scope.created = created;
// Repository created. Start the upload process if applicable.
if ($scope.repo.initialize) {
startFileUpload(created);
return;
}
// Otherwise, redirect to the repo page.
$location.path('/repository/' + created.namespace + '/' + created.name);
}, function() {
$('#cannotcreateModal').modal();
$scope.creating = false;
});
};
$scope.upgradePlan = function() {
PlanService.showSubscribeDialog($scope, $scope.planRequired.stripeId, function() {
// Subscribing.
$scope.planChanging = true;
}, function(plan) {
// Subscribed.
subscribedToPlan(plan);
}, function() {
// Failure.
$('#couldnotsubscribeModal').modal();
$scope.planChanging = false;
});
};
$scope.plans = PlanService.planList();
// Load the user's subscription information in case they want to create a private
// repository.
var getSubscription = Restangular.one('user/plan');
getSubscription.get().then(subscribedToPlan, function() {
// User has no subscription
$scope.planRequired = PlanService.getMinimumPlan(1);
});
}

31
static/js/graphing.js
View file

@ -715,7 +715,17 @@ ImageHistoryTree.prototype.toggle_ = function(d) {
}
};
/////////////////////////////////////////////////////////////////////////////////////////
/**
* Disposes of the tree.
*/
ImageHistoryTree.prototype.dispose = function() {
var container = this.container_ ;
$('#' + container).removeOverscroll();
document.getElementById(container).innerHTML = '';
};
////////////////////////////////////////////////////////////////////////////////
/**
* Based off of http://bl.ocks.org/mbostock/1093025 by Mike Bostock (@mbostock)
@ -809,6 +819,15 @@ ImageFileChangeTree.prototype.notifyResized = function() {
};
/**
* Disposes of the tree.
*/
ImageFileChangeTree.prototype.dispose = function() {
var container = this.container_ ;
document.getElementById(container).innerHTML = '';
};
/**
* Draws the tree.
*/
@ -1039,17 +1058,17 @@ ImageFileChangeTree.prototype.update_ = function(source) {
node.select('.node-icon')
.html(function(d) {
if (!d.kind) {
var folder = d._children ? 'icon-folder-close' : 'icon-folder-open';
var folder = d._children ? 'fa fa-folder' : 'fa fa-folder-open';
return '<i class="' + folder + '"></i>';
}
var icon = {
'added': 'plus-sign-alt',
'removed': 'minus-sign-alt',
'changed': 'edit-sign'
'added': 'plus-square',
'removed': 'minus-square',
'changed': 'pencil-square'
};
return '<i class="change-icon icon-' + icon[d.kind] + '"></i>';
return '<i class="change-icon fa fa-' + icon[d.kind] + '"></i>';
});
// Transition exiting nodes to the parent's new position.

8
static/lib/angular-strap.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

2
static/lib/browser-chrome.js
View file

@ -1,5 +1,5 @@
(function(browserchrome, $) {
var htmlTemplate = '<div class="browser-chrome-container"><div class="browser-chrome-header"><i class="icon-remove-sign"></i> <i class="icon-minus-sign"></i> <i class="icon-plus-sign"></i><div class="browser-chrome-tab"><div class="browser-chrome-tab-wrapper"><div class="browser-chrome-tab-content"><i class="icon-file-alt icon-large"></i> <span class="tab-title">Tab Title</span></div></div></div><div class="user-icon-container"><i class="icon-user icon-2x"></i></div></div><div class="browser-chrome-url-bar"><div class="left-controls"><i class="icon-arrow-left icon-large"></i> <i class="icon-arrow-right icon-large"></i> <i class="icon-rotate-right icon-large"></i> </div><div class="right-controls"> <i class="icon-reorder icon-large"></i></div><div class="browser-chrome-url"><span class="protocol-https" style="display: none"><i class="icon-lock"></i>https</span><span class="protocol-http"><i class="icon-file-alt"></i>http</span><span class="url-text">://google.com/</span></div></div></div>'
var htmlTemplate = '<div class="browser-chrome-container"><div class="browser-chrome-header"><i class="fa fa-times-circle"></i> <i class="fa fa-minus-circle"></i> <i class="fa fa-plus-circle"></i><div class="browser-chrome-tab"><div class="browser-chrome-tab-wrapper"><div class="browser-chrome-tab-content"><i class="fa fa-file-alt fa-lg"></i> <span class="tab-title">Tab Title</span></div></div></div><div class="user-icon-container"><i class="fa fa-user fa-2x"></i></div></div><div class="browser-chrome-url-bar"><div class="left-controls"><i class="fa fa-arrow-left fa-lg"></i> <i class="fa fa-arrow-right fa-lg"></i> <i class="fa fa-rotate-right fa-lg"></i> </div><div class="right-controls"> <i class="fa fa-reorder fa-lg"></i></div><div class="browser-chrome-url"><span class="protocol-https" style="display: none"><i class="fa fa-lock"></i>https</span><span class="protocol-http"><i class="fa fa-file-alt"></i>http</span><span class="url-text">://google.com/</span></div></div></div>'
browserchrome.update = function() {
$('[data-screenshot-url]').each(function(index, element) {

26
static/lib/pagedown/Markdown.Editor.js
View file

@ -1359,42 +1359,42 @@
}
group1 = makeGroup(1);
buttons.bold = makeButton("wmd-bold-button", "Bold - Ctrl+B", "icon-bold", bindCommand("doBold"), group1);
buttons.italic = makeButton("wmd-italic-button", "Italic - Ctrl+I", "icon-italic", bindCommand("doItalic"), group1);
buttons.bold = makeButton("wmd-bold-button", "Bold - Ctrl+B", "fa fa-bold", bindCommand("doBold"), group1);
buttons.italic = makeButton("wmd-italic-button", "Italic - Ctrl+I", "fa fa-italic", bindCommand("doItalic"), group1);
group2 = makeGroup(2);
/*
buttons.link = makeButton("wmd-link-button", "Link - Ctrl+L", "icon-link", bindCommand(function (chunk, postProcessing) {
buttons.link = makeButton("wmd-link-button", "Link - Ctrl+L", "fa fa-link", bindCommand(function (chunk, postProcessing) {
return this.doLinkOrImage(chunk, postProcessing, false);
}), group2);
*/
buttons.quote = makeButton("wmd-quote-button", "Blockquote - Ctrl+Q", "icon-quote-left", bindCommand("doBlockquote"), group2);
buttons.code = makeButton("wmd-code-button", "Code Sample - Ctrl+K", "icon-code", bindCommand("doCode"), group2);
buttons.quote = makeButton("wmd-quote-button", "Blockquote - Ctrl+Q", "fa fa-quote-left", bindCommand("doBlockquote"), group2);
buttons.code = makeButton("wmd-code-button", "Code Sample - Ctrl+K", "fa fa-code", bindCommand("doCode"), group2);
/*
buttons.image = makeButton("wmd-image-button", "Image - Ctrl+G", "icon-picture", bindCommand(function (chunk, postProcessing) {
buttons.image = makeButton("wmd-image-button", "Image - Ctrl+G", "fa fa-picture", bindCommand(function (chunk, postProcessing) {
return this.doLinkOrImage(chunk, postProcessing, true);
}), group2);
*/
group3 = makeGroup(3);
buttons.olist = makeButton("wmd-olist-button", "Numbered List - Ctrl+O", "icon-list", bindCommand(function (chunk, postProcessing) {
buttons.olist = makeButton("wmd-olist-button", "Numbered List - Ctrl+O", "fa fa-list", bindCommand(function (chunk, postProcessing) {
this.doList(chunk, postProcessing, true);
}), group3);
buttons.ulist = makeButton("wmd-ulist-button", "Bulleted List - Ctrl+U", "icon-list-ul", bindCommand(function (chunk, postProcessing) {
buttons.ulist = makeButton("wmd-ulist-button", "Bulleted List - Ctrl+U", "fa fa-list-ul", bindCommand(function (chunk, postProcessing) {
this.doList(chunk, postProcessing, false);
}), group3);
buttons.heading = makeButton("wmd-heading-button", "Heading - Ctrl+H", "icon-tasks", bindCommand("doHeading"), group3);
buttons.hr = makeButton("wmd-hr-button", "Horizontal Rule - Ctrl+R", "icon-minus", bindCommand("doHorizontalRule"), group3);
buttons.heading = makeButton("wmd-heading-button", "Heading - Ctrl+H", "fa fa-tasks", bindCommand("doHeading"), group3);
buttons.hr = makeButton("wmd-hr-button", "Horizontal Rule - Ctrl+R", "fa fa-minus", bindCommand("doHorizontalRule"), group3);
group4 = makeGroup(4);
buttons.undo = makeButton("wmd-undo-button", "Undo - Ctrl+Z", "icon-undo", null, group4);
buttons.undo = makeButton("wmd-undo-button", "Undo - Ctrl+Z", "fa fa-undo", null, group4);
buttons.undo.execute = function (manager) { if (manager) manager.undo(); };
var redoTitle = /win/.test(nav.platform.toLowerCase()) ?
"Redo - Ctrl+Y" :
"Redo - Ctrl+Shift+Z"; // mac and other non-Windows platforms
buttons.redo = makeButton("wmd-redo-button", redoTitle, "icon-share-alt", null, group4);
buttons.redo = makeButton("wmd-redo-button", redoTitle, "fa fa-share", null, group4);
buttons.redo.execute = function (manager) { if (manager) manager.redo(); };
if (helpOptions) {
@ -1402,7 +1402,7 @@
group5.className = group5.className + " pull-right";
var helpButton = document.createElement("button");
var helpButtonImage = document.createElement("i");
helpButtonImage.className = "icon-question-sign";
helpButtonImage.className = "fa fa-question-sign";
helpButton.appendChild(helpButtonImage);
helpButton.className = "btn";
helpButton.id = "wmd-help-button" + postfix;

9
static/partials/build-status-item.html Normal file
View file

@ -0,0 +1,9 @@
<div class="build-statuses">
<div ng-repeat="build in buildsInfo">
<div class="build-status" build="build"></div>
</div>
<div ng-show="buildsInfo.length == 0">
All Dockerfile builds complete
</div>
</div>

12
static/partials/header.html
View file

@ -2,9 +2,9 @@
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="fa-bar"></span>
<span class="fa-bar"></span>
<span class="fa-bar"></span>
</button>
<a class="navbar-brand" href="/" target="{{ appLinkTarget() }}">
<img src="/static/img/quay-logo.png">
@ -27,9 +27,11 @@
</div>
</form>
<li class="dropdown" ng-switch-when="false">
<!--<button type="button" class="btn btn-default navbar-btn">Sign in</button>-->
<span class="navbar-left user-tools" ng-show="!user.anonymous">
<a href="/new/"><i class="fa fa-upload user-tool" title="Create new repository"></i></a>
</span>
<li class="dropdown" ng-switch-when="false">
<a href="javascript:void(0)" class="dropdown-toggle user-dropdown" data-toggle="dropdown">
<img src="//www.gravatar.com/avatar/{{ user.gravatar }}?s=32&d=identicon" />
{{ user.username }}

10
static/partials/image-view.html
View file

@ -3,14 +3,14 @@
</div>
<div class="loading" ng-show="loading">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container repo repo-image-view" ng-show="!loading && image">
<div class="header">
<a href="{{ '/repository/' + repo.namespace + '/' + repo.name }}" class="back"><i class="icon-chevron-left"></i></a>
<a href="{{ '/repository/' + repo.namespace + '/' + repo.name }}" class="back"><i class="fa fa-chevron-left"></i></a>
<h3>
<i class="icon-archive icon-large" style="color: #aaa; margin-right: 10px;"></i>
<i class="fa fa-archive fa-lg" style="color: #aaa; margin-right: 10px;"></i>
<span style="color: #aaa;"> {{repo.namespace}}</span>
<span style="color: #ccc">/</span>
<span style="color: #666;">{{repo.name}}</span>
@ -31,7 +31,7 @@
<div class="input-group">
<input id="full-id" type="text" class="form-control" value="{{ image.id }}" readonly>
<span id="copyClipboard" class="input-group-addon" title="Copy to Clipboard" data-clipboard-target="full-id">
<i class="icon-copy"></i>
<i class="fa fa-copy"></i>
</span>
</div>
</div>
@ -75,7 +75,7 @@
No matching changes
</div>
<div class="change" ng-repeat="change in combinedChanges | filter:search | limitTo:50">
<i ng-class="{'added': 'icon-plus-sign-alt', 'removed': 'icon-minus-sign-alt', 'changed': 'icon-edit-sign'}[change.kind]"></i>
<i ng-class="{'added': 'fa fa-plus-square', 'removed': 'fa fa-minus-square', 'changed': 'fa fa-pencil-square'}[change.kind]"></i>
<span title="{{change.file}}">
<span style="color: #888;">
<span ng-repeat="folder in getFolders(change.file)"><a href="javascript:void(0)" ng-click="setFolderFilter(getFolder(change.file), $index)">{{folder}}</a>/</span></span><span>{{getFilename(change.file)}}</span>

17
static/partials/landing.html
View file

@ -10,7 +10,7 @@
<div ng-show="!user.anonymous">
<div ng-show="loadingmyrepos">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div ng-show="!loadingmyrepos && myrepos.length > 0">
<h2>Your Top Repositories</h2>
@ -44,10 +44,10 @@
<div class="form-group signin-buttons">
<button class="btn btn-primary btn-block landing-signup-button" ng-disabled="signupForm.$invalid" type="submit" analytics-on analytics-event="register">Sign Up for Free!</button>
<span class="landing-social-alternate">
<i class="icon-circle"></i>
<i class="fa fa-circle"></i>
<span class="inner-text">OR</span>
</span>
<a href="https://github.com/login/oauth/authorize?client_id={{ githubClientId }}&scope=user:email{{ github_state_clause }}" class="btn btn-primary btn-block"><i class="icon-github icon-large"></i> Sign In with GitHub</a>
<a href="https://github.com/login/oauth/authorize?client_id={{ githubClientId }}&scope=user:email{{ github_state_clause }}" class="btn btn-primary btn-block"><i class="fa fa-github fa-lg"></i> Sign In with GitHub</a>
<p class="help-block">No credit card required.</p>
</div>
</form>
@ -61,14 +61,15 @@
<div ng-show="!user.anonymous" class="user-welcome">
<img class="gravatar" src="//www.gravatar.com/avatar/{{ user.gravatar }}?s=128&d=identicon" />
<div class="sub-message">Welcome <b>{{ user.username }}</b>!</div>
<button ng-show="myrepos" class="btn btn-lg btn-primary btn-block" ng-click="browseRepos()">Browse all repositories</button>
<a ng-show="myrepos" class="btn btn-primary" href="/repository/">Browse all repositories</a>
<a ng-show="myrepos" class="btn btn-success" href="/new/">Create a new repository</a>
</div>
</div> <!-- col -->
</div> <!-- row -->
<div class="row" ng-show="user.anonymous">
<div class="col-md-4 shoutout">
<i class="icon-lock"></i>
<i class="fa fa-lock"></i>
<b>Secure</b>
<span class="shoutout-expand">
Store your private docker containers where only you and your team
@ -77,7 +78,7 @@
</div>
<div class="col-md-4 shoutout">
<i class="icon-user"></i>
<i class="fa fa-user"></i>
<b>Shareable</b>
<span class="shoutout-expand">
Have to share a repository? No problem! Share with anyone you choose
@ -85,7 +86,7 @@
</div>
<div class="col-md-4 shoutout">
<i class="icon-cloud"></i>
<i class="fa fa-cloud"></i>
<b>Cloud Hosted</b>
<span class="shoutout-expand">
Accessible from anywhere, anytime
@ -97,7 +98,7 @@
<div class="product-tour container" ng-show="user.anonymous">
<div class="tour-header row">
<div class="tour-shoutout-header"><i class="icon-chevron-sign-down"></i></div>
<div class="tour-shoutout-header"><i class="fa fa-chevron-circle-down"></i></div>
<div class="tour-shoutout">Take a tour of Quay</div>
</div>

213
static/partials/new-repo.html Normal file
View file

@ -0,0 +1,213 @@
<div class="container" ng-show="user.anonymous">
<h3>Please <a href="/signin/">sign in</a></h3>
</div>
<div class="container" ng-show="!user.anonymous && building">
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container" ng-show="!user.anonymous && creating">
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container" ng-show="!user.anonymous && uploading">
<span class="message">Uploading file {{ upload_file }}</span>
<div class="progress progress-striped active">
<div class="progress-bar" role="progressbar" aria-valuenow="{{ upload_progress }}" aria-valuemin="0" aria-valuemax="100" style="{{ 'width: ' + upload_progress + '%' }}">
</div>
</div>
</div>
<div class="container new-repo" ng-show="!user.anonymous && !creating && !uploading && !building">
<form method="post" name="newRepoForm" ng-submit="createNewRepo()">
<!-- Header -->
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-8">
<div class="section">
<div class="new-header">
<span class="repo-circle no-background" repo="repo"></span>
<span style="color: #444;"> {{user.username}}</span> <span style="color: #ccc">/</span> <span class="name-container"><input id="repoName" name="repoName" type="text" class="form-control" placeholder="Repository Name" ng-model="repo.name" required autofocus></span>
</div>
</div>
<div class="section">
<strong>Description:</strong><br>
<p class="description lead editable" ng-click="editDescription()">
<span class="content" ng-bind-html-unsafe="getMarkedDown(repo.description)"></span>
<i class="fa fa-edit"></i>
</p>
</div>
</div>
</div>
<!-- Private/public -->
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-8">
<div class="section">
<div class="repo-option">
<input type="radio" id="publicrepo" name="publicorprivate" ng-model="repo.is_public" value="1">
<i class="fa fa-unlock fa-large" title="Public Repository"></i>
<div class="option-description">
<label for="publicrepo">Public</label>
<span class="description-text">Anyone can see and pull from this repository. You choose who can push.</span>
</div>
</div>
<div class="repo-option">
<input type="radio" id="privaterepo" name="publicorprivate" ng-model="repo.is_public" value="0">
<i class="fa fa-lock fa-large" title="Private Repository"></i>
<div class="option-description">
<label for="privaterepo">Private</label>
<span class="description-text">You choose who can see, pull and push from/to this repository.</span>
</div>
</div>
<!-- Payment -->
<div class="required-plan" ng-show="repo.is_public == '0' && planRequired">
<div class="alert alert-warning">
In order to make this repository private, you’ll need to upgrade your plan from <b>{{ subscribedPlan.title }}</b> to <b>{{ planRequired.title }}</b>. This will cost $<span>{{ planRequired.price / 100 }}</span>/month.
</div>
<a class="btn btn-primary" ng-click="upgradePlan()" ng-show="!planChanging">Upgrade now</a>
<i class="fa fa-spinner fa-spin fa-3x" ng-show="planChanging"></i>
</div>
</div>
</div>
</div>
<!-- Initialize repository -->
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-8">
<div class="section">
<input type="checkbox" class="cbox" id="initialize" name="initialize" ng-model="repo.initialize">
<div class="option-description">
<label for="initialize">Initialize Repository from <a href="http://www.docker.io/learn/dockerfile/" target="_new">Dockerfile</a></label>
<span class="description-text">Automatically populate your repository with a new image constructed from a Dockerfile</span>
</div>
<div class="initialize-repo" ng-show="repo.initialize">
<div class="init-description">
Upload a Dockerfile or a zip file containing a Dockerfile <b>in the root directory</b>
</div>
<input id="file-drop" class="file-drop" type="file">
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-1"></div>
<div class="col-md-8">
<button class="btn btn-large btn-success" type="submit" ng-disabled="newRepoForm.$invalid || (repo.is_public == '0' && planRequired)">Create Repository</button>
</div>
</div>
</form>
</div>
<!-- Modal edit for the description -->
<div class="modal fade" id="editModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Edit Repository Description</h4>
</div>
<div class="modal-body">
<div class="wmd-panel">
<div id="wmd-button-bar-description"></div>
<textarea class="wmd-input" id="wmd-input-description" placeholder="Enter description">{{ repo.description }}</textarea>
</div>
<div id="wmd-preview-description" class="wmd-panel wmd-preview"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" ng-click="saveDescription()">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Modal message dialog -->
<div class="modal fade" id="missingfileModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">File required</h4>
</div>
<div class="modal-body">
A file is required in order to initialize a repository.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Modal message dialog -->
<div class="modal fade" id="cannotcreateModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Cannot create repository</h4>
</div>
<div class="modal-body">
The repository could not be created.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Modal message dialog -->
<div class="modal fade" id="couldnotbuildModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Cannot initialize repository</h4>
</div>
<div class="modal-body">
The repository could not be initialized with the selected Dockerfile. Please try again later.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<!-- Modal message dialog -->
<div class="modal fade" id="couldnotsubscribeModal">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title">Cannot upgrade plan</h4>
</div>
<div class="modal-body">
Your current plan could not be upgraded. Please try again.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

22
static/partials/repo-admin.html
View file

@ -3,7 +3,7 @@
<script src="static/lib/jquery.base64.min.js"></script>
<div class="loading" ng-show="loading">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container" ng-show="!loading && (!repo || !permissions)">
@ -12,7 +12,7 @@
<div class="container repo repo-admin" ng-show="!loading && repo && permissions">
<div class="header">
<a href="{{ '/repository/' + repo.namespace + '/' + repo.name }}" class="back"><i class="icon-chevron-left"></i></a>
<a href="{{ '/repository/' + repo.namespace + '/' + repo.name }}" class="back"><i class="fa fa-chevron-left"></i></a>
<h3>
<span class="repo-circle no-background" repo="repo"></span> <span style="color: #aaa;"> {{repo.namespace}}</span> <span style="color: #ccc">/</span> {{repo.name}}
</h3>
@ -22,7 +22,7 @@
<div class="panel panel-default">
<div class="panel-heading">User Access Permissions
<i class="info-icon icon-info-sign" data-placement="left" data-content="Allow any number of users to read, write or administer this repository"></i>
<i class="info-icon fa fa-info-circle" data-placement="left" data-content="Allow any number of users to read, write or administer this repository"></i>
</div>
<div class="panel-body">
@ -37,7 +37,7 @@
<tr ng-repeat="(username, permission) in permissions">
<td class="user">
<i class="icon-user"></i>
<i class="fa fa-user"></i>
<span>{{username}}</span>
</td>
<td class="user-permissions">
@ -50,7 +50,7 @@
<td>
<span class="delete-ui" tabindex="0" title="Delete Permission">
<span class="delete-ui-button" ng-click="deleteRole(username)"><button class="btn btn-danger">Delete</button></span>
<i class="icon-remove"></i>
<i class="fa fa-remove"></i>
</span>
</td>
</tr>
@ -68,7 +68,7 @@
<div class="panel panel-default">
<div class="panel-heading">Access Token Permissions
<i class="info-icon icon-info-sign" data-placement="left" data-content="Grant permissions to this repository by creating unique tokens that can be used without entering account passwords<br><br>To use in docker:<br><dl class='dl-horizontal'><dt>Username</dt><dd>$token</dd><dt>Password</dt><dd>(token value)</dd><dt>Email</dt><dd>(any value)</dd></dl>"></i>
<i class="info-icon fa fa-info-circle" data-placement="left" data-content="Grant permissions to this repository by creating unique tokens that can be used without entering account passwords<br><br>To use in docker:<br><dl class='dl-horizontal'><dt>Username</dt><dd>$token</dd><dt>Password</dt><dd>(token value)</dd><dt>Email</dt><dd>(any value)</dd></dl>"></i>
</div>
<div class="panel-body">
<form name="createTokenForm" ng-submit="createToken()">
@ -83,7 +83,7 @@
<tr ng-repeat="(code, token) in tokens">
<td class="user token">
<i class="icon-key"></i>
<i class="fa fa-key"></i>
<a ng-click="showToken(token.code)">{{ token.friendlyName }}</a>
</td>
<td class="user-permissions">
@ -95,7 +95,7 @@
<td>
<span class="delete-ui" tabindex="0" title="Delete Token">
<span class="delete-ui-button" ng-click="deleteToken(token.code)"><button class="btn btn-danger" type="button">Delete</button></span>
<i class="icon-remove"></i>
<i class="fa fa-remove"></i>
</span>
</td>
</tr>
@ -118,7 +118,7 @@
<div class="panel-heading">Repository Settings</div>
<div class="panel-body">
<div class="repo-access-state" ng-show="!repo.is_public">
<div class="state-icon"><i class="icon-lock"></i></div>
<div class="state-icon"><i class="fa fa-lock"></i></div>
This repository is currently <b>private</b>. Only users on the above access list may view and interact with it.
@ -128,7 +128,7 @@
</div>
<div class="repo-access-state" ng-show="repo.is_public">
<div class="state-icon"><i class="icon-unlock-alt"></i></div>
<div class="state-icon"><i class="fa fa-unlock"></i></div>
This repository is currently <b>public</b> and is visible to all users, and may be pulled by all users.
@ -175,7 +175,7 @@
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
<h4 class="modal-title"><i class="icon-key"></i> {{ shownToken.friendlyName }}</h4>
<h4 class="modal-title"><i class="fa fa-key"></i> {{ shownToken.friendlyName }}</h4>
</div>
<div class="modal-body token-dialog-body">
<div class="alert alert-info">The docker <u>username</u> is <b>$token</b> and the <u>password</u> is the token. You may use any value for email.</div>

9
static/partials/repo-list.html
View file

@ -1,9 +1,16 @@
<div class="loading" ng-show="loading">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container ready-indicator" ng-show="!loading" data-status="{{ loading ? '' : 'ready' }}">
<div class="repo-list" ng-show="!user.anonymous">
<a href="/new/">
<button class="btn btn-success" style="float: right">
<i class="fa fa-upload user-tool" title="Create new repository"></i>
Create Repository
</button>
</a>
<h3>Your Repositories</h3>
<div ng-show="private_repositories.length > 0">
<div class="repo-listing" ng-repeat="repository in private_repositories">

4
static/partials/signin.html
View file

@ -18,11 +18,11 @@
<button class="btn btn-lg btn-primary btn-block" type="submit">Sign In</button>
<span class="social-alternate">
<i class="icon-circle"></i>
<i class="fa fa-circle"></i>
<span class="inner-text">OR</span>
</span>
<a id='github-signin-link' href="https://github.com/login/oauth/authorize?client_id={{ githubClientId }}&scope=user:email{{ mixpanelDistinctIdClause }}" class="btn btn-primary btn-lg btn-block"><i class="icon-github icon-large"></i> Sign In with GitHub</a>
<a id='github-signin-link' href="https://github.com/login/oauth/authorize?client_id={{ githubClientId }}&scope=user:email{{ mixpanelDistinctIdClause }}" class="btn btn-primary btn-lg btn-block"><i class="fa fa-github fa-lg"></i> Sign In with GitHub</a>
</form>
<div class="alert alert-danger" ng-show="invalidCredentials">Invalid username or password.</div>

6
static/partials/user-admin.html
View file

@ -1,6 +1,6 @@
<div class="container user-admin">
<div class="loading" ng-show="planLoading || planChanging">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="row" ng-show="errorMessage">
<div class="col-md-12">
@ -18,7 +18,7 @@
<div class="panel-heading">
{{ plan.title }}
<span class="pull-right" ng-show="subscription.plan == plan.stripeId">
<i class="icon-ok"></i>
<i class="fa fa-ok"></i>
Subscribed
</span>
</div>
@ -59,7 +59,7 @@
</div>
<div class="row">
<div class="loading" ng-show="updatingUser">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="col-md-3">
<div class="panel panel-default">

2
static/partials/v1-page.html
View file

@ -3,7 +3,7 @@
<h3>Welcome <b>{{ user.username }}</b>. Your account is fully activated!</h3>
<div style="margin-top: 20px;">
<button class="btn btn-lg btn-primary" ng-click="browseRepos()">Browse all repositories</button>
<a class="btn btn-lg btn-primary" hred="/repository/">Browse all repositories</a>
</div>
</div>
<div ng-show="!user.anonymous && !user.verified">

70
static/partials/view-repo.html
View file

@ -3,7 +3,7 @@
</div>
<div class="loading" ng-show="loading">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="container repo" ng-show="!loading && repo">
@ -16,20 +16,19 @@
<span class="settings-cog" ng-show="repo.can_admin" title="Repository Settings">
<a href="{{ '/repository/' + repo.namespace + '/' + repo.name + '/admin' }}">
<i class="icon-cog icon-large"></i>
<i class="fa fa-cog fa-lg"></i>
</a>
</span>
</h3>
<!-- Pull command -->
<div class="pull-command">
Get this repository:
<div class="pull-command visible-md visible-lg" style="display: none;">
<span class="pull-command-title">Pull repository:</span>
<div class="pull-container">
<div class="input-group">
<input id="pull-text" type="text" class="form-control" value="{{ 'docker pull quay.io/' + repo.namespace + '/' + repo.name }}" readonly>
<span id="copyClipboard" class="input-group-addon" title="Copy to Clipboard" data-clipboard-target="pull-text">
<i class="icon-copy"></i>
<i class="fa fa-copy"></i>
</span>
</div>
</div>
@ -40,17 +39,36 @@
</div>
</div>
<!-- Status boxes -->
<div class="status-boxes">
<div id="buildInfoBox" class="status-box" ng-show="repo.is_building"
bs-popover="'static/partials/build-status-item.html'" data-placement="bottom">
<span class="title">
<i class="fa fa-spinner fa-spin"></i>
<b>Building Images</b>
</span>
<span class="count" ng-class="buildsInfo ? 'visible' : ''"><span>{{ buildsInfo ? buildsInfo.length : '-' }}</span></span>
</div>
</div>
<!-- Description -->
<p ng-class="'description lead ' + (repo.can_write ? 'editable' : 'noteditable')" ng-click="editDescription()">
<span class="content" ng-bind-html-unsafe="getMarkedDown(repo.description)"></span>
<i class="icon-edit"></i>
</p>
<div class="description">
<p ng-class="'lead ' + (repo.can_write ? 'editable' : 'noteditable')" ng-click="editDescription()">
<span class="content" ng-bind-html-unsafe="getMarkedDown(repo.description)"></span>
<i class="fa fa-edit"></i>
</p>
</div>
<div class="repo-content" ng-show="!currentTag.image">
<!-- Empty message -->
<div class="repo-content" ng-show="!currentTag.image && !repo.is_building">
<div class="empty-message">(This repository is empty)</div>
</div>
<div class="repo-content" ng-show="!currentTag.image && repo.is_building">
<div class="empty-message">Your build is currently processing, if this takes longer than an hour, please contact <a href="mailto:support@quay.io">Quay.io support</a></div>
</div>
<!-- Content view -->
<div class="repo-content" ng-show="currentTag.image">
<!-- Image History -->
<div id="image-history">
@ -61,22 +79,22 @@
<div class="panel panel-default">
<div class="panel-heading">
<!-- Tag dropdown -->
<span class="tag-dropdown dropdown" title="Tags">
<i class="icon-tag"><span class="tag-count">{{getTagCount(repo)}}</span></i>
<div class="tag-dropdown dropdown" title="Tags">
<i class="fa fa-tag"><span class="tag-count">{{getTagCount(repo)}}</span></i>
<a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">{{currentTag.name}} <b class="caret"></b></a>
<ul class="dropdown-menu">
<li ng-repeat="tag in repo.tags">
<a href="javascript:void(0)" ng-click="setTag(tag.name)">{{tag.name}}</a>
</li>
</ul>
</span>
</div>
<span class="right-title">Tags</span>
</div>
<!-- Image history loading -->
<div ng-hide="imageHistory" style="padding: 10px; text-align: center;">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<!-- Tree View itself -->
@ -89,15 +107,15 @@
<div class="panel panel-default">
<div class="panel-heading">
<!-- Image dropdown -->
<span class="tag-dropdown dropdown" title="Images">
<i class="icon-archive"><span class="tag-count">{{imageHistory.length}}</span></i>
<div class="tag-dropdown dropdown" title="Images">
<i class="fa fa-archive"><span class="tag-count">{{imageHistory.length}}</span></i>
<a href="javascript:void(0)" class="dropdown-toggle" data-toggle="dropdown">{{currentImage.id.substr(0, 12)}} <b class="caret"></b></a>
<ul class="dropdown-menu">
<li ng-repeat="image in imageHistory">
<a href="javascript:void(0)" ng-click="setImage(image)">{{image.id.substr(0, 12)}}</a>
</li>
</ul>
</span>
</div>
<span class="right-title">Image</span>
</div>
@ -117,22 +135,22 @@
<!-- Image changes loading -->
<div ng-hide="currentImageChanges">
<i class="icon-spinner icon-spin icon-3x"></i>
<i class="fa fa-spinner fa-spin fa-3x"></i>
</div>
<div class="changes-container small-changes-container"
ng-show="currentImageChanges.changed.length || currentImageChanges.added.length || currentImageChanges.removed.length">
<div class="changes-count-container accordion-toggle" data-toggle="collapse" data-parent="#accordion" data-target="#collapseChanges">
<span class="change-count added" ng-show="currentImageChanges.added.length > 0" title="Files Added">
<i class="icon-plus-sign-alt"></i>
<i class="fa fa-plus-square"></i>
<b>{{currentImageChanges.added.length}}</b>
</span>
<span class="change-count removed" ng-show="currentImageChanges.removed.length > 0" title="Files Removed">
<i class="icon-minus-sign-alt"></i>
<i class="fa fa-minus-square"></i>
<b>{{currentImageChanges.removed.length}}</b>
</span>
<span class="change-count changed" ng-show="currentImageChanges.changed.length > 0" title="Files Changed">
<i class="icon-edit-sign"></i>
<i class="fa fa-pencil-square"></i>
<b>{{currentImageChanges.changed.length}}</b>
</span>
</div>
@ -140,15 +158,15 @@
<div id="collapseChanges" class="panel-collapse collapse in">
<div class="well well-sm">
<div class="change added" ng-repeat="file in currentImageChanges.added | limitTo:5">
<i class="icon-plus-sign-alt"></i>
<i class="fa fa-plus-square"></i>
<span title="{{file}}">{{file}}</span>
</div>
<div class="change removed" ng-repeat="file in currentImageChanges.removed | limitTo:5">
<i class="icon-minus-sign-alt"></i>
<i class="fa fa-minus-square"></i>
<span title="{{file}}">{{file}}</span>
</div>
<div class="change changed" ng-repeat="file in currentImageChanges.changed | limitTo:5">
<i class="icon-edit-sign"></i>
<i class="fa fa-pencil-square"></i>
<span title="{{file}}">{{file}}</span>
</div>
</div>