Slightly updated new repo view
This commit is contained in:
Joseph Schorr
parent
cafc96fe28
commit
85cff9bd9d
5 changed files with 517 additions and 253 deletions
92
static/css/pages/new-repo.css
Normal file
92
static/css/pages/new-repo.css
Normal file
|
|
@ -0,0 +1,92 @@
|
||||||
|
.new-repo .co-main-content-panel {
|
||||||
|
padding: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .namespace-selector-header .slash {
|
||||||
|
color: #444;
|
||||||
|
padding-left: 6px;
|
||||||
|
padding-right: 6px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .required-plan {
|
||||||
|
margin: 10px;
|
||||||
|
margin-top: 20px;
|
||||||
|
margin-left: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .required-plan .alert {
|
||||||
|
color: #444 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .new-header .popover {
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .new-header .repo-circle {
|
||||||
|
margin-right: 14px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .new-header .name-container {
|
||||||
|
display: inline-block;
|
||||||
|
width: 300px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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 .section-title {
|
||||||
|
float: right;
|
||||||
|
color: #aaa;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .repo-option {
|
||||||
|
margin: 6px;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.new-repo .repo-option label {
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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 .file-drop {
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
|
@ -970,89 +970,6 @@ i.toggle-icon:hover {
|
||||||
text-decoration: none !important;
|
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 .popover {
|
|
||||||
font-size: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.new-repo .new-header .repo-circle {
|
|
||||||
margin-right: 14px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.new-repo .new-header .name-container {
|
|
||||||
display: inline-block;
|
|
||||||
width: 300px;
|
|
||||||
vertical-align: middle;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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 .section-title {
|
|
||||||
float: right;
|
|
||||||
color: #aaa;
|
|
||||||
}
|
|
||||||
|
|
||||||
.new-repo .repo-option {
|
|
||||||
margin: 6px;
|
|
||||||
margin-top: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.new-repo .repo-option label {
|
|
||||||
font-weight: normal;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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 .file-drop {
|
|
||||||
margin: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.user-guide h3 {
|
.user-guide h3 {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -3,10 +3,16 @@
|
||||||
* Page to create a new repository.
|
* Page to create a new repository.
|
||||||
*/
|
*/
|
||||||
angular.module('quayPages').config(['pages', function(pages) {
|
angular.module('quayPages').config(['pages', function(pages) {
|
||||||
pages.create('new-repo', 'new-repo.html', NewRepoCtrl, {
|
pages.create('new-repo', 'new-repo.html', NewRepoCtrl, {
|
||||||
|
'newLayout': true,
|
||||||
'title': 'New Repository',
|
'title': 'New Repository',
|
||||||
'description': 'Create a new Docker repository'
|
'description': 'Create a new Docker repository'
|
||||||
});
|
}, ['layout'])
|
||||||
|
|
||||||
|
pages.create('new-repo', 'old-new-repo.html', NewRepoCtrl, {
|
||||||
|
'title': 'New Repository',
|
||||||
|
'description': 'Create a new Docker repository'
|
||||||
|
}, ['old-layout']);
|
||||||
}]);
|
}]);
|
||||||
|
|
||||||
function NewRepoCtrl($scope, $location, $http, $timeout, UserService, ApiService, PlanService, TriggerService, Features) {
|
function NewRepoCtrl($scope, $location, $http, $timeout, UserService, ApiService, PlanService, TriggerService, Features) {
|
||||||
|
|
|
||||||
|
|
@ -1,178 +1,190 @@
|
||||||
<div class="cor-container" ng-show="user.anonymous">
|
<div class="new-repo">
|
||||||
<div class="col-sm-6 col-sm-offset-3">
|
<div class="page-content">
|
||||||
<div class="user-setup" redirect-url="'/new/'"></div>
|
<div class="cor-title">
|
||||||
</div>
|
<span class="cor-title-link">
|
||||||
</div>
|
<a class="back-link" href="/repository">
|
||||||
|
Repositories
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
<span class="cor-title-content">
|
||||||
|
Create New Repository
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div class="cor-container" ng-show="!user.anonymous && building">
|
<div class="co-main-content-panel">
|
||||||
<div class="quay-spinner"></div>
|
<div class="" ng-show="user.anonymous">
|
||||||
</div>
|
<div class="col-sm-6 col-sm-offset-3">
|
||||||
|
<div class="user-setup" redirect-url="'/new/'"></div>
|
||||||
<div class="cor-container" ng-show="!user.anonymous && creating">
|
|
||||||
<div class="quay-spinner"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="cor-container new-repo" ng-show="!user.anonymous && !creating && !building">
|
|
||||||
<form method="post" name="newRepoForm" id="newRepoForm" ng-submit="createNewRepo()">
|
|
||||||
|
|
||||||
<!-- Header -->
|
|
||||||
<div class="row">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div class="section">
|
|
||||||
<div class="new-header">
|
|
||||||
<span style="color: #444;">
|
|
||||||
<span class="namespace-selector" user="user" namespace="repo.namespace" require-create="true"></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 data-trigger="manual" data-content="{{ createError }}" data-placement="right" ng-pattern="/^[.a-z0-9_-]+$/">
|
|
||||||
</span>
|
|
||||||
<span class="alert alert-warning" ng-show="!newRepoForm.repoName.$error.required && !newRepoForm.repoName.$valid" style="margin-left: 10px;">
|
|
||||||
Repository names must match [a-z0-9_-]+
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="section">
|
<div class="cor-loader" ng-show="!user.anonymous && building"></div>
|
||||||
<div class="section-title">Repository Description</div>
|
<div class="cor-loader" ng-show="!user.anonymous && creating"></div>
|
||||||
<br>
|
|
||||||
<div class="description markdown-input" content="repo.description" can-write="true"
|
<div class="new-repo" ng-show="!user.anonymous && !creating && !building">
|
||||||
field-title="'repository description'"></div>
|
<form method="post" name="newRepoForm" id="newRepoForm" ng-submit="createNewRepo()">
|
||||||
|
|
||||||
|
<!-- Header -->
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="new-header">
|
||||||
|
<span class="namespace-selector-header">
|
||||||
|
<span class="namespace-selector" user="user" namespace="repo.namespace" require-create="true"></span>
|
||||||
|
<span class="slash">/</span>
|
||||||
|
<span class="name-container">
|
||||||
|
<input id="repoName" name="repoName" type="text" class="form-control" placeholder="Repository Name" ng-model="repo.name"
|
||||||
|
required autofocus data-trigger="manual" data-content="{{ createError }}" data-placement="right" ng-pattern="/^[.a-z0-9_-]+$/">
|
||||||
|
</span>
|
||||||
|
<span class="co-alert co-alert-warning" ng-show="!newRepoForm.repoName.$error.required && !newRepoForm.repoName.$valid" style="margin-left: 10px;">
|
||||||
|
Repository names must match [a-z0-9_-]+
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Repository Description</div>
|
||||||
|
<br>
|
||||||
|
<div class="description markdown-input" content="repo.description" can-write="true"
|
||||||
|
field-title="'repository description'"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Private/public -->
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section-title">Repository Visibility</div>
|
||||||
|
<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" data-title="Public Repository"></i>
|
||||||
|
|
||||||
|
<div class="option-description">
|
||||||
|
<label for="publicrepo"><strong>Public</strong></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" data-title="Private Repository"></i>
|
||||||
|
|
||||||
|
<div class="option-description">
|
||||||
|
<label for="privaterepo"><strong>Private</strong></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 && planRequired.title">
|
||||||
|
<div class="co-alert co-alert-warning">
|
||||||
|
In order to make this repository private
|
||||||
|
<span ng-if="isUserNamespace">under your personal namespace</span>
|
||||||
|
<span ng-if="!isUserNamespace">under the organization <b>{{ repo.namespace }}</b></span>, you will need to upgrade your plan to
|
||||||
|
<b style="border-bottom: 1px dotted black;" data-html="true"
|
||||||
|
data-title="{{ '<b>' + planRequired.title + '</b><br>' + planRequired.privateRepos + ' private repositories' }}" bs-tooltip>
|
||||||
|
{{ 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>
|
||||||
|
<span ng-if="isUserNamespace && user.organizations.length == 1" style="margin-left: 6px; display: inline-block;">or did you mean to create this repository
|
||||||
|
under <a href="javascript:void(0)" ng-click="changeNamespace(user.organizations[0].name)"><b>{{ user.organizations[0].name }}</b></a>?</span>
|
||||||
|
<div class="quay-spinner" ng-show="planChanging"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="quay-spinner" ng-show="repo.is_public == '0' && checkingPlan"></div>
|
||||||
|
|
||||||
|
<div class="required-plan" ng-show="repo.is_public == '0' && planRequired && !isUserNamespace && !planRequired.title">
|
||||||
|
<div class="co-alert co-alert-warning">
|
||||||
|
This organization has reached its private repository limit. Please contact your administrator.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="Features.BUILD_SUPPORT">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Initialize repository</div>
|
||||||
|
|
||||||
|
<div style="padding-top: 10px;">
|
||||||
|
<!-- Empty -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initEmpty" name="initialize" ng-model="repo.initialize" value="">
|
||||||
|
<i class="fa fa-hdd-o fa-lg" style="padding: 6px; padding-left: 8px; padding-right: 6px;"></i>
|
||||||
|
<label for="initEmpty" style="color: #aaa;">(Empty repository)</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Dockerfile -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initDockerfile" name="initialize" ng-model="repo.initialize" value="dockerfile">
|
||||||
|
<i class="fa fa-file fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
||||||
|
<label for="initDockerfile">Initialize from a <b>Dockerfile</b></label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Zip/TarGz file -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initZipfile" name="initialize" ng-model="repo.initialize" value="zipfile">
|
||||||
|
<i class="fa fa-archive fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
||||||
|
<label for="initZipfile">Initialize from a <b>Dockerfile</b> inside a <code>.zip</code> or <code>.tar.gz</code> archive</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Github -->
|
||||||
|
<div class="repo-option" ng-show="Features.GITHUB_BUILD">
|
||||||
|
<input type="radio" id="initGithub" name="initialize" ng-model="repo.initialize" value="github">
|
||||||
|
<i class="fa fa-github fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 12px;"></i>
|
||||||
|
<label for="initGithub">Link to a GitHub Repository</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="repo.initialize == 'dockerfile' || repo.initialize == 'zipfile'">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Upload <span ng-if="repo.initialize == 'dockerfile'">Dockerfile</span><span ng-if="repo.initialize == 'zipfile'">Archive</span></div>
|
||||||
|
<div style="padding-top: 20px;">
|
||||||
|
<div class="initialize-repo">
|
||||||
|
<div class="dockerfile-build-form" repository="createdForBuild || repo" upload-failed="handleBuildFailed(message)"
|
||||||
|
build-started="handleBuildStarted()" build-failed="handleBuildFailed(message)" start-now="createdForBuild"
|
||||||
|
is-ready="hasDockerfile" uploading="uploading" building="building"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="repo.initialize == 'github'">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="co-alert co-alert-info">
|
||||||
|
You will be redirected to authorize via GitHub once the repository has been created
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<button class="btn btn-large btn-primary" type="submit"
|
||||||
|
ng-disabled="uploading || building || newRepoForm.$invalid || (repo.is_public == '0' && (planRequired || checkingPlan)) || ((repo.initialize == 'dockerfile' || repo.initialize == 'zipfile') && !hasDockerfile)">
|
||||||
|
<i class="fa fa-large" ng-class="repo.is_public == '1' ? 'fa-unlock' : 'fa-lock'" style="margin-right: 4px"></i>
|
||||||
|
Create {{ repo.is_public == '1' ? 'Public' : 'Private' }} Repository
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</form>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Private/public -->
|
|
||||||
<div class="row">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div class="section-title">Repository Visibility</div>
|
|
||||||
<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" data-title="Public Repository"></i>
|
|
||||||
|
|
||||||
<div class="option-description">
|
|
||||||
<label for="publicrepo"><strong>Public</strong></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" data-title="Private Repository"></i>
|
|
||||||
|
|
||||||
<div class="option-description">
|
|
||||||
<label for="privaterepo"><strong>Private</strong></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 && planRequired.title">
|
|
||||||
<div class="alert alert-warning">
|
|
||||||
In order to make this repository private
|
|
||||||
<span ng-if="isUserNamespace">under your personal namespace</span>
|
|
||||||
<span ng-if="!isUserNamespace">under the organization <b>{{ repo.namespace }}</b></span>, you will need to upgrade your plan to
|
|
||||||
<b style="border-bottom: 1px dotted black;" data-html="true"
|
|
||||||
data-title="{{ '<b>' + planRequired.title + '</b><br>' + planRequired.privateRepos + ' private repositories' }}" bs-tooltip>
|
|
||||||
{{ 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>
|
|
||||||
<span ng-if="isUserNamespace && user.organizations.length == 1">or did you mean to create this repository
|
|
||||||
under <a href="javascript:void(0)" ng-click="changeNamespace(user.organizations[0].name)"><b>{{ user.organizations[0].name }}</b></a>?</span>
|
|
||||||
<div class="quay-spinner" ng-show="planChanging"></div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="quay-spinner" ng-show="repo.is_public == '0' && checkingPlan"></div>
|
|
||||||
|
|
||||||
<div class="required-plan" ng-show="repo.is_public == '0' && planRequired && !isUserNamespace && !planRequired.title">
|
|
||||||
<div class="alert alert-warning">
|
|
||||||
This organization has reached its private repository limit. Please contact your administrator.
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row" ng-show="Features.BUILD_SUPPORT">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div class="section">
|
|
||||||
<div class="section-title">Initialize repository</div>
|
|
||||||
|
|
||||||
<div style="padding-top: 10px;">
|
|
||||||
<!-- Empty -->
|
|
||||||
<div class="repo-option">
|
|
||||||
<input type="radio" id="initEmpty" name="initialize" ng-model="repo.initialize" value="">
|
|
||||||
<i class="fa fa-hdd-o fa-lg" style="padding: 6px; padding-left: 8px; padding-right: 6px;"></i>
|
|
||||||
<label for="initEmpty" style="color: #aaa;">(Empty repository)</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Dockerfile -->
|
|
||||||
<div class="repo-option">
|
|
||||||
<input type="radio" id="initDockerfile" name="initialize" ng-model="repo.initialize" value="dockerfile">
|
|
||||||
<i class="fa fa-file fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
|
||||||
<label for="initDockerfile">Initialize from a <b>Dockerfile</b></label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Zip/TarGz file -->
|
|
||||||
<div class="repo-option">
|
|
||||||
<input type="radio" id="initZipfile" name="initialize" ng-model="repo.initialize" value="zipfile">
|
|
||||||
<i class="fa fa-archive fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
|
||||||
<label for="initZipfile">Initialize from a <b>Dockerfile</b> inside a <code>.zip</code> or <code>.tar.gz</code> archive</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Github -->
|
|
||||||
<div class="repo-option" ng-show="Features.GITHUB_BUILD">
|
|
||||||
<input type="radio" id="initGithub" name="initialize" ng-model="repo.initialize" value="github">
|
|
||||||
<i class="fa fa-github fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 12px;"></i>
|
|
||||||
<label for="initGithub">Link to a GitHub Repository</label>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row" ng-show="repo.initialize == 'dockerfile' || repo.initialize == 'zipfile'">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div class="section">
|
|
||||||
<div class="section-title">Upload <span ng-if="repo.initialize == 'dockerfile'">Dockerfile</span><span ng-if="repo.initialize == 'zipfile'">Archive</span></div>
|
|
||||||
<div style="padding-top: 20px;">
|
|
||||||
<div class="initialize-repo">
|
|
||||||
<div class="dockerfile-build-form" repository="createdForBuild || repo" upload-failed="handleBuildFailed(message)"
|
|
||||||
build-started="handleBuildStarted()" build-failed="handleBuildFailed(message)" start-now="createdForBuild"
|
|
||||||
is-ready="hasDockerfile" uploading="uploading" building="building"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row" ng-show="repo.initialize == 'github'">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<div class="alert alert-info">
|
|
||||||
You will be redirected to authorize via GitHub once the repository has been created
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="row">
|
|
||||||
|
|
||||||
<div class="col-md-12">
|
|
||||||
<button class="btn btn-large btn-success" type="submit"
|
|
||||||
ng-disabled="uploading || building || newRepoForm.$invalid || (repo.is_public == '0' && (planRequired || checkingPlan)) || ((repo.initialize == 'dockerfile' || repo.initialize == 'zipfile') && !hasDockerfile)">
|
|
||||||
<i class="fa fa-large" ng-class="repo.is_public == '1' ? 'fa-unlock' : 'fa-lock'" style="margin-right: 4px"></i>
|
|
||||||
Create {{ repo.is_public == '1' ? 'Public' : 'Private' }} Repository
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Modal edit for the description -->
|
<!-- Modal edit for the description -->
|
||||||
|
|
|
||||||
237
static/partials/old-new-repo.html
Normal file
237
static/partials/old-new-repo.html
Normal file
|
|
@ -0,0 +1,237 @@
|
||||||
|
<div class="cor-container" ng-show="user.anonymous">
|
||||||
|
<div class="col-sm-6 col-sm-offset-3">
|
||||||
|
<div class="user-setup" redirect-url="'/new/'"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cor-container" ng-show="!user.anonymous && building">
|
||||||
|
<div class="quay-spinner"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cor-container" ng-show="!user.anonymous && creating">
|
||||||
|
<div class="quay-spinner"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="cor-container new-repo" ng-show="!user.anonymous && !creating && !building">
|
||||||
|
<form method="post" name="newRepoForm" id="newRepoForm" ng-submit="createNewRepo()">
|
||||||
|
|
||||||
|
<!-- Header -->
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="new-header">
|
||||||
|
<span style="color: #444;">
|
||||||
|
<span class="namespace-selector" user="user" namespace="repo.namespace" require-create="true"></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 data-trigger="manual" data-content="{{ createError }}" data-placement="right" ng-pattern="/^[.a-z0-9_-]+$/">
|
||||||
|
</span>
|
||||||
|
<span class="alert alert-warning" ng-show="!newRepoForm.repoName.$error.required && !newRepoForm.repoName.$valid" style="margin-left: 10px;">
|
||||||
|
Repository names must match [a-z0-9_-]+
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Repository Description</div>
|
||||||
|
<br>
|
||||||
|
<div class="description markdown-input" content="repo.description" can-write="true"
|
||||||
|
field-title="'repository description'"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Private/public -->
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section-title">Repository Visibility</div>
|
||||||
|
<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" data-title="Public Repository"></i>
|
||||||
|
|
||||||
|
<div class="option-description">
|
||||||
|
<label for="publicrepo"><strong>Public</strong></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" data-title="Private Repository"></i>
|
||||||
|
|
||||||
|
<div class="option-description">
|
||||||
|
<label for="privaterepo"><strong>Private</strong></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 && planRequired.title">
|
||||||
|
<div class="alert alert-warning">
|
||||||
|
In order to make this repository private
|
||||||
|
<span ng-if="isUserNamespace">under your personal namespace</span>
|
||||||
|
<span ng-if="!isUserNamespace">under the organization <b>{{ repo.namespace }}</b></span>, you will need to upgrade your plan to
|
||||||
|
<b style="border-bottom: 1px dotted black;" data-html="true"
|
||||||
|
data-title="{{ '<b>' + planRequired.title + '</b><br>' + planRequired.privateRepos + ' private repositories' }}" bs-tooltip>
|
||||||
|
{{ 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>
|
||||||
|
<span ng-if="isUserNamespace && user.organizations.length == 1">or did you mean to create this repository
|
||||||
|
under <a href="javascript:void(0)" ng-click="changeNamespace(user.organizations[0].name)"><b>{{ user.organizations[0].name }}</b></a>?</span>
|
||||||
|
<div class="quay-spinner" ng-show="planChanging"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="quay-spinner" ng-show="repo.is_public == '0' && checkingPlan"></div>
|
||||||
|
|
||||||
|
<div class="required-plan" ng-show="repo.is_public == '0' && planRequired && !isUserNamespace && !planRequired.title">
|
||||||
|
<div class="alert alert-warning">
|
||||||
|
This organization has reached its private repository limit. Please contact your administrator.
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="Features.BUILD_SUPPORT">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Initialize repository</div>
|
||||||
|
|
||||||
|
<div style="padding-top: 10px;">
|
||||||
|
<!-- Empty -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initEmpty" name="initialize" ng-model="repo.initialize" value="">
|
||||||
|
<i class="fa fa-hdd-o fa-lg" style="padding: 6px; padding-left: 8px; padding-right: 6px;"></i>
|
||||||
|
<label for="initEmpty" style="color: #aaa;">(Empty repository)</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Dockerfile -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initDockerfile" name="initialize" ng-model="repo.initialize" value="dockerfile">
|
||||||
|
<i class="fa fa-file fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
||||||
|
<label for="initDockerfile">Initialize from a <b>Dockerfile</b></label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Zip/TarGz file -->
|
||||||
|
<div class="repo-option">
|
||||||
|
<input type="radio" id="initZipfile" name="initialize" ng-model="repo.initialize" value="zipfile">
|
||||||
|
<i class="fa fa-archive fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 8px;"></i>
|
||||||
|
<label for="initZipfile">Initialize from a <b>Dockerfile</b> inside a <code>.zip</code> or <code>.tar.gz</code> archive</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Github -->
|
||||||
|
<div class="repo-option" ng-show="Features.GITHUB_BUILD">
|
||||||
|
<input type="radio" id="initGithub" name="initialize" ng-model="repo.initialize" value="github">
|
||||||
|
<i class="fa fa-github fa-lg" style="padding: 6px; padding-left: 10px; padding-right: 12px;"></i>
|
||||||
|
<label for="initGithub">Link to a GitHub Repository</label>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="repo.initialize == 'dockerfile' || repo.initialize == 'zipfile'">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="section">
|
||||||
|
<div class="section-title">Upload <span ng-if="repo.initialize == 'dockerfile'">Dockerfile</span><span ng-if="repo.initialize == 'zipfile'">Archive</span></div>
|
||||||
|
<div style="padding-top: 20px;">
|
||||||
|
<div class="initialize-repo">
|
||||||
|
<div class="dockerfile-build-form" repository="createdForBuild || repo" upload-failed="handleBuildFailed(message)"
|
||||||
|
build-started="handleBuildStarted()" build-failed="handleBuildFailed(message)" start-now="createdForBuild"
|
||||||
|
is-ready="hasDockerfile" uploading="uploading" building="building"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row" ng-show="repo.initialize == 'github'">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<div class="alert alert-info">
|
||||||
|
You will be redirected to authorize via GitHub once the repository has been created
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row">
|
||||||
|
|
||||||
|
<div class="col-md-12">
|
||||||
|
<button class="btn btn-large btn-success" type="submit"
|
||||||
|
ng-disabled="uploading || building || newRepoForm.$invalid || (repo.is_public == '0' && (planRequired || checkingPlan)) || ((repo.initialize == 'dockerfile' || repo.initialize == 'zipfile') && !hasDockerfile)">
|
||||||
|
<i class="fa fa-large" ng-class="repo.is_public == '1' ? 'fa-unlock' : 'fa-lock'" style="margin-right: 4px"></i>
|
||||||
|
Create {{ repo.is_public == '1' ? 'Public' : 'Private' }} 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">×</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="cannotcreateModal">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</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="couldnotsubscribeModal">
|
||||||
|
<div class="modal-dialog">
|
||||||
|
<div class="modal-content">
|
||||||
|
<div class="modal-header">
|
||||||
|
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</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 -->
|
||||||
Reference in a new issue