Start on new repo page
This commit is contained in:
Joseph Schorr
parent
9dc9e0c940
commit
70fd9afb2b
7 changed files with 204 additions and 3 deletions
|
|
@ -67,6 +67,11 @@ def signin():
|
|||
return index('')
|
||||
|
||||
|
||||
@app.route('/new/')
|
||||
def new():
|
||||
return index('')
|
||||
|
||||
|
||||
@app.route('/repository/')
|
||||
def repository():
|
||||
return index('')
|
||||
|
|
|
|||
|
|
@ -75,6 +75,57 @@
|
|||
text-decoration: none !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;
|
||||
}
|
||||
|
||||
.user-guide h3 {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
|
@ -1051,6 +1102,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. */
|
||||
|
|
|
|||
|
|
@ -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-lock icon-large" style="{{ !!(repo.is_public) ? 'visibility: hidden' : 'visibility: visible' }}" title="Private Repository"></i>
|
||||
<i class="icon-hdd icon-large"></i>
|
||||
|
|
|
|||
|
|
@ -155,6 +155,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}).
|
||||
|
||||
|
|
|
|||
|
|
@ -893,4 +893,42 @@ function V1Ctrl($scope, UserService) {
|
|||
$scope.browseRepos = function() {
|
||||
document.location = '/repository/';
|
||||
};
|
||||
}
|
||||
|
||||
function NewRepoCtrl($scope, UserService) {
|
||||
$scope.repo = {
|
||||
'is_public': 1,
|
||||
'description': '',
|
||||
'initialize': false
|
||||
};
|
||||
|
||||
$scope.$watch( function () { return UserService.currentUser(); }, function (currentUser) {
|
||||
$scope.user = currentUser;
|
||||
|
||||
if ($scope.user.anonymous) {
|
||||
document.location = '/signin/';
|
||||
}
|
||||
}, true);
|
||||
|
||||
$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;
|
||||
};
|
||||
}
|
||||
|
|
@ -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" ng-show="!user.anonymous">
|
||||
<i class="icon-plus-circle"></i>
|
||||
</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 }}
|
||||
|
|
|
|||
103
static/partials/new-repo.html
Normal file
103
static/partials/new-repo.html
Normal file
|
|
@ -0,0 +1,103 @@
|
|||
<div class="container new-repo" ng-show="!user.anonymous">
|
||||
<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="icon-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="icon-unlock icon-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="icon-lock icon-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>
|
||||
</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 ng-show="repo.initialize">
|
||||
Initialize
|
||||
</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">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">×</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 -->
|
||||
|
||||
Reference in a new issue