Merge remote-tracking branch 'origin/touchdown'

Conflicts:
	static/css/quay.css
	static/js/controllers.js
	test/data/test.db
This commit is contained in:
Jake Moshenko 2014-07-07 15:33:51 -04:00
commit c338b7d621
33 changed files with 1296 additions and 242 deletions

View file

@ -1,5 +1,11 @@
<div class="landing-content">
<div class="jumbotron landing">
<div class="jumbotron landing">
<div class="landing-background" ng-class="user.anonymous ? 'landing': 'signedin'"></div>
<div class="landing-filter" ng-class="user.anonymous ? 'landing': 'signedin'"></div>
<div class="landing-content">
<img class="logo" src="/static/img/box-logo.png">
<div class="header-bar"></div>
<div class="container">
<div class="row messages">
<div class="col-md-7">
@ -9,19 +15,20 @@
</span>
<h1>Quay.io Enterprise Edition</h1>
</div>
<div ng-show="!user.anonymous">
<span class="namespace-selector" user="user" namespace="namespace" ng-show="user.organizations"></span>
<div class="resource-view" resource="my_repositories">
<!-- Repos -->
<div ng-show="my_repositories.value.length > 0">
<h2>Top Repositories</h2>
<h2>Top Repositories</h2>
<div class="repo-listing" ng-repeat="repository in my_repositories.value">
<span class="repo-circle no-background" repo="repository"></span>
<a ng-href="/repository/{{ repository.namespace }}/{{ repository.name }}">{{repository.namespace}}/{{repository.name}}</a>
<div class="markdown-view description" content="repository.description" first-line-only="true"></div>
</div>
<a href="/repository/?namespace={{ user.username }}">See All Repositories</a>
</div>
<!-- No Repos -->
@ -41,7 +48,6 @@
<div class="col-md-4 col-md-offset-1">
<div ng-show="user.anonymous">
<h3>Create Username</h3>
<div class="signup-form"></div>
</div>
<div ng-show="!user.anonymous" class="user-welcome">
@ -52,7 +58,6 @@
</div>
</div> <!-- col -->
</div> <!-- row -->
</div> <!-- container -->
</div> <!-- jumbotron -->
</div>
</div>
</div> <!-- jumbotron -->

View file

@ -1,5 +1,11 @@
<div class="landing-content">
<div class="jumbotron landing">
<div class="jumbotron landing">
<div class="landing-background" ng-class="user.anonymous ? 'landing': 'signedin'"></div>
<div class="landing-filter" ng-class="user.anonymous ? 'landing': 'signedin'"></div>
<div class="landing-content">
<img class="logo" src="/static/img/white_horizontal.png">
<div class="header-bar"></div>
<div class="container">
<div class="row messages">
<div class="col-md-7">
@ -15,12 +21,13 @@
<div class="resource-view" resource="my_repositories">
<!-- Repos -->
<div ng-show="my_repositories.value.length > 0">
<h2>Top Repositories</h2>
<h2>Top Repositories</h2>
<div class="repo-listing" ng-repeat="repository in my_repositories.value">
<span class="repo-circle no-background" repo="repository"></span>
<a ng-href="/repository/{{ repository.namespace }}/{{ repository.name }}">{{repository.namespace}}/{{repository.name}}</a>
<div class="markdown-view description" content="repository.description" first-line-only="true"></div>
</div>
<a href="/repository/?namespace={{ user.username }}">See All Repositories</a>
</div>
<!-- No Repos -->
@ -50,102 +57,217 @@
</div>
</div> <!-- col -->
</div> <!-- row -->
</div> <!-- container -->
</div>
</div> <!-- jumbotron -->
<div class="row" ng-show="user.anonymous">
<div class="rows" ng-show="user.anonymous">
<div class=" shoutout-row landing-section">
<div class="container">
<div class="row">
<div class="col-md-4 shoutout">
<i class="fa fa-lock"></i>
<b>Secure</b>
<b>Private Storage</b>
<span class="shoutout-expand">
Your data is transferred using <strong>SSL at all times</strong> and <strong>encrypted</strong> when at rest. More information available in our <a href="/security/">security guide</a>
Push and pull Docker images to a private registry, with a focus on user experience
for your developers.
</span>
<a class="shoutout-link" href="/tour/features">View Features</a>
</div>
<div class="col-md-4 shoutout">
<i class="fa fa-group"></i>
<b>Shareable</b>
<b>Teamwork Optimized</b>
<span class="shoutout-expand">
Have to share a repository? No problem! Share with anyone you choose
Specially designed for teams, organizations and businesses that use Docker.
</span>
<a class="shoutout-link" href="/tour/organizations">View Teams and Organizations</a>
</div>
<div class="col-md-4 shoutout">
<i class="fa fa-cloud"></i>
<b>Cloud Hosted</b>
<i class="fa fa-cogs"></i>
<b>Deployment Made Easy</b>
<span class="shoutout-expand">
Accessible from anywhere, anytime
Tools and Solutions that help make your application deployment simple and straightforward.
</span>
<a class="shoutout-link" href="http://docs.quay.io/solution">View Solutions</a>
</div>
</div>
</div>
</div> <!-- -->
<div class=" landing-section">
<h2>Trusted by companies who use Docker</h2>
<div class="container">
<div class="row">
<div class="trusted-logos">
<div class="col-md-3 trusted-logo">
<a href="http://www.modcloth.com" target="_blank" alt="ModCloth"><img src="/static/img/modcloth-logo.png"></a>
</div>
<div class="col-md-3 trusted-logo">
<a href="https://travis-ci.com" target="_blank" alt="Travis CI"><img src="/static/img/travisci-logo.png"></a>
</div>
<div class="col-md-3 trusted-logo apptentive">
<a href="http://www.apptentive.com" target="_blank" alt="Apptentive"><img src="/static/img/apptentive-logo.svg"></a>
</div>
<div class="col-md-3 trusted-logo">
<a href="http://bex.io" target="_blank" alt="Bex.io"><img src="/static/img/bexio-logo.png"></a>
</div>
</div>
</div>
</div>
</div> <!-- -->
<div class="landing-section">
<h2>Built with our users in mind</h2>
<div class="container">
<div class="row">
<div class="col-lg-8 feature-shoutout">
<img id="screenshot" ng-src="{{ '/static/img/' + currentScreenshot + '.png' }}" class="img-responsive">
</div>
<div class="col-lg-4">
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-view' ? 'active' : ''" ng-click="changeScreenshot('repo-view')">
<i class="fa fa-hdd-o"></i>
<span class="sf-title">Beautiful repository view</span>
<div class="sf-text">
Repository is presented with the maximum amount of useful information, including a visual tree of its image history, markdown-based description, and tags.
</div>
</div>
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-admin' ? 'active' : ''" ng-click="changeScreenshot('repo-admin')">
<i class="fa fa-group"></i>
<span class="sf-title">Share at your control</span>
<div class="sf-text">
Set up the exact permissions your team, organization or business needs. Need to grant external access? Create one or more robot accounts to restrict access.
</div>
</div>
<div class="screenshot-feature" ng-class="currentScreenshot == 'build-history' ? 'active' : ''" ng-click="changeScreenshot('build-history')">
<i class="fa fa-tasks"></i>
<span class="sf-title">Dockerfile Build</span>
<div class="sf-text">
Repositories can be linked to Github repositories, with automatic building of the Dockerfile(s) found on push.
</div>
</div>
<div class="screenshot-feature" ng-class="currentScreenshot == 'repo-changes' ? 'active' : ''" ng-click="changeScreenshot('repo-changes')">
<i class="fa fa-code-fork"></i>
<span class="sf-title">Repository Diff</span>
<div class="sf-text">
See exactly which files were added, changed, or removed for each image in a repository.
</div>
</div>
</div>
</div>
</div>
</div> <!-- -->
<div class="landing-section">
<h2>Seamlessly integrate into your Docker-based infrastructure</h2>
<div class="container">
<div class="row testimonial">
<div class="message">
Quay.io has become an essential part of our infrastructure as we move to Docker-based deploys.
The support and service that the Quay.io team provides is phenomenal. We couldn't do it without them!
</div>
<div class="speaker-info">
<img src="/static/img/testimonial-mike.png">
<span class="speaker-info-internal">
<span class="speaker">Mike Saffitz</span>
<span class="speaker-title"><a href="http://www.apptentive.com" target="_blank" alt="Apptentive">Apptentive</a> - CTO & Co-Founder</span>
</span>
</div>
</div> <!-- row -->
</div> <!-- container -->
</div> <!-- jumbotron -->
<div class="product-tour container" ng-show="user.anonymous">
<div class="tour-header row">
<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>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/user-home.png" title="User Home - Quay.io" data-screenshot-url="https://quay.io/" class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">Customized for you</div>
<div class="tour-section-description">
Your personal home screen shows those repositories most important to you, ordered by recent activity.
</div>
<div class="tour-section-description">Keep up to date on the status of those repositories you deem important.</div>
<a class="learn-more" href="/tour">Learn more</a>
</div>
</div>
</div> <!-- -->
<div class="tour-section row">
<div class="col-md-7 col-md-push-5"><img src="/static/img/repo-view.png" title="Repository View - Quay.io" data-screenshot-url="https://quay.io/repository/devtable/complex" class="img-responsive"></div>
<div class="col-md-5 col-md-pull-7">
<div class="tour-section-title">Useful views of respositories</div>
<div class="tour-section-description">
Each repository is presented with the maximum amount of useful information, including its image history, <b>markdown</b>-based description, and tags.
<div class="landing-section">
<h2>See what other people are saying about Quay.io</h2>
<div class="container">
<div class="row">
<div class="jcarousel-wrapper">
<div class="jcarousel">
<ul>
<li>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/3320588708/9237d8d056e9ce2fa737ea7ab2de345b_bigger.jpeg"
author-name="Ross Timson" author-user="rosstimson" message-url="https://twitter.com/rosstimson/statuses/451052618685882368"
message-date="April 1, 2014">
Pushing Dockerfile changes to Github and having <a href="https://twitter.com/quayio">@quayio</a> build the
<a href="https://twitter.com/docker">@docker</a> image/container for you is extremely awesome.
</div>
</li>
<li>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/2578175278/ykn3l9ktfdy1hia5odij_bigger.jpeg"
author-name="Frank Macreery" author-user="fancyremarker" message-url="https://twitter.com/fancyremarker/statuses/448528623692025857"
message-date="March 25, 2014">
<a href="https://twitter.com/quayio">@quayio</a> releases Docker build flair! <a href="http://t.co/72ULgveLj4">pic.twitter.com/72ULgveLj4</a>
</div>
</li>
<li>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/438406731660394496/UKGDY6xB_bigger.jpeg"
author-name="Joshua Goldie" author-user="jdgoldie" message-url="https://twitter.com/jdgoldie/statuses/446622958040408064"
message-date="March 20, 2014">
Just started playing with <a href="https://twitter.com/quayio">@quayio</a> builds tied to
<a href="https://twitter.com/search?q=%23github&amp;src=hash">#github</a> repo. Really liking it. My first experiment:
<a href="https://t.co/2LgyagwTEq">https://t.co/2LgyagwTEq</a>
</div>
</li>
<li>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/378800000731516813/e70eae6c4a2c25ae516660e958b3d36b_bigger.jpeg"
author-name="Evan Hazlett" author-user="ehazlett" message-url="https://twitter.com/ehazlett/statuses/442351806161510400"
message-date="March 8, 2014">
Great guys <a href="https://twitter.com/quayio">@quayio</a>. If you havent tried it, do.
</div>
</li>
<li>
<div class="twitter-view" avatar-url="https://pbs.twimg.com/profile_images/463168904320122880/lQG69Wqk_bigger.jpeg"
author-name="Jon Morehouse" author-user="JonMorehouse" message-url="https://twitter.com/JonMorehouse/statuses/441719785055739904"
message-date="March 6, 2014">
<a href="https://twitter.com/quayio">@quayio</a> has awesome support.
<a href="https://twitter.com/search?q=%23awesomeTool&amp;src=hash">#awesomeTool</a>
<a href="https://twitter.com/search?q=%23awesomeTeam&amp;src=hash">#awesomeTeam</a>
</div>
</li>
</ul>
</div>
<a href="#" class="jcarousel-control jcarousel-control-prev">&lsaquo;</a>
<a href="#" class="jcarousel-control jcarousel-control-next">&rsaquo;</a>
<p class="jcarousel-pagination"></p>
</div>
</div>
<div class="row">
<div class="col-md-12 follow-button">
<iframe allowtransparency="true" frameborder="0" scrolling="no"
src="//platform.twitter.com/widgets/follow_button.html?screen_name=quayio&show_count=false"
style="width:120px; height:20px;"></iframe>
</div>
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/build-history.png" title="View Image - Quay.io"
data-screenshot-url="https://quay.io/repository/devtable/building/build"
class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">Dockerfile Build in the cloud</div>
<div class="tour-section-description">
Like to use <b>Dockerfiles</b> to build your images? Simply upload your Dockerfile (and any additional files it needs) and we'll build your Dockerfile into an image and push it to your repository.
</div>
<div class="tour-section-description">
If you store your Dockerfile in <i class="fa fa-github fa-lg" style="margin: 6px;"></i><b>GitHub</b>, add a <b>Build Trigger</b> to your repository and we'll start a Dockerfile build for every change you make.
</div>
<div class="landing-section">
<h2>Start pushing to Quay.io in under a minute</h2>
<div class="container">
<div class="row landing-action">
<a href="/plans" class="btn btn-primary">Start Free Trial</a>
</div>
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7 col-md-push-5"><img src="/static/img/repo-admin.png" title="Repository Admin - Quay.io" data-screenshot-url="https://quay.io/repository/devtable/complex/admin" class="img-responsive"></div>
<div class="col-md-5 col-md-pull-7">
<div class="tour-section-title">Share at your control</div>
<div class="tour-section-description">
Share any repository with as many (or as few) users as you choose.
</div>
<div class="tour-section-description">Need a repository only for your team? Easily <b>share</b> with your team members.</div>
<div class="tour-section-description">Need finer grain control? Mark a user as <b>read-only</b> or <b>read/write</b>.</div>
<div class="tour-section-description">Have a build script or a deploy process that needs access? Generate an <b>access token</b> to grant revocable access for pushing or pulling.</div>
<div class="tour-section-description">Want to share with the world? Make your repository <b>fully public</b>.</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/repo-changes.png" title="View Image - Quay.io" data-screenshot-url="https://quay.io/repository/devtable/image/..." class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">Docker diff whenever you need it</div>
<div class="tour-section-description">
We wanted to know what was changing in each image of our repositories just as much as you do. So we added diffs. Now you can see exactly which files were <b>added</b>, <b>changed</b>, or <b>removed</b> for each image. We've also provided two awesome ways to view your changes, either in a filterable list, or in a drill down tree view.
</div>
</div>
</div>
<div style="border-top: 1px solid #eee; padding-top: 20px;">
<div class="container">
<div class="row">
<div style="border-top: 1px solid #eee; padding-top: 20px;" class="col-md-12">
<a href="https://mixpanel.com/f/partner"><img src="//cdn.mxpnl.com/site_media/images/partner/badge_light.png" alt="Mobile Analytics" /></a>
</div>
</div>

View file

@ -19,7 +19,7 @@
</div>
<!-- Organizations -->
<div ng-show="user.organizations.length > 0">
<div ng-if="user.organizations.length > 0">
<h2>Organizations</h2>
<div class="organization-listing" ng-repeat="organization in user.organizations">
@ -29,122 +29,5 @@
</div>
<!-- Organization Help/Tour -->
<div class="product-tour" ng-show="!user.organizations || user.organizations.length == 0">
<div class="tour-section row">
<div class="col-md-12">
<div class="tour-section-title">Organizations</div>
<div class="tour-section-description">
Organizations in Quay provide unique features for businesses and other
groups, including team-based sharing and fine-grained permission controls.
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/org-repo-list.png" data-title="Repositories - Quay.io" data-screenshot-url="https://quay.io/repository/" class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">A central collection of repositories</div>
<div class="tour-section-description">
Your organization is the focal point for all activity that occurs within
your public or private repositories. Your repositories are centrally visible
and managed within the namespace of your organization. You may share
your repositories with as many users and teams as you like, without
any additional cost.
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7 col-md-push-5"><img src="/static/img/org-admin.png" data-title="buynlarge Admin - Quay.io" data-screenshot-url="https://quay.io/organization/buynlarge/admin" class="img-responsive"></div>
<div class="col-md-5 col-md-pull-7">
<div class="tour-section-title">Organization settings at a glance</div>
<div class="tour-section-description">
Your organization allows you to view your private repository count
and manage billing settings in a centralized place.
</div>
<div class="tour-section-description">
You can also see all of the users who have access to your organization
and the teams of which they are members. This allows you to audit the
access that has been granted in your organization.
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/org-logs.png" data-title="buynlarge Admin - Quay.io" data-screenshot-url="https://quay.io/organization/buynlarge" class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">Logging for comprehensive analysis</div>
<div class="tour-section-description">
Every time a user in your organization performs an action it is logged
and categorized in a way that allows for a complete understanding of
how your repositories have been accessed and modified. Each log entry
includes the action performed, the authorization which allowed the action
to occur, and additional relevant data such as the name of the item
which was modified or accessed.
</div>
<div class="tour-section-description">
For those times when you need full control when generating reports from
your logs, we also allow you to export your logs in JSON format. These
can be ingested by custom tooling solutions allowing you to visualize
reports in whatever format you require.
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7 col-md-push-5"><img src="/static/img/org-teams.png" data-title="buynlarge - Quay.io" data-screenshot-url="https://quay.io/organization/buynlarge" class="img-responsive"></div>
<div class="col-md-5 col-md-pull-7">
<div class="tour-section-title">Teams simplify access controls</div>
<div class="tour-section-description">
Teams allow your organization to delegate access to your namespace and
repositories in a controlled fashion. Each team has permissions that
apply across the entire org, and can also be given specific levels of
access to specific repositories. A user is switching roles? No problem,
change their team membership and their access will be adjusted accordingly.
</div>
<div class="tour-section-description">
Owners of your organization, and members of other teams with
administrator privileges, have full permissions to all repositories
in the organization, as well as permissions to view and adjust the
account settings for the organization. Add users to these teams with
caution.
</div>
</div>
</div>
<div class="tour-section row">
<div class="col-md-7"><img src="/static/img/org-repo-admin.png" data-title="buynlarge/orgrepo - Quay.io" data-screenshot-url="https://quay.io/repository/buynlarge/orgrepo" class="img-responsive"></div>
<div class="col-md-5">
<div class="tour-section-title">Fine-grained control of sharing</div>
<div class="tour-section-description">
Repositories that you create within your organization can be assigned
fine-grained permissions just like any other repository. You can also
add teams that exist in your organization, or individual users from
inside our outside your organization.
</div>
<div class="tour-section-description">
In order to protect your intellectual property, we warn you before
you share your repositories with anyone who is not currently a member
of a team in your organization.
</div>
</div>
</div>
<div class="button-bar-right button-bar-bottom">
<a href="/organizations/new/" data-title="Starts the process to create a new organization" bs-tooltip="tooltip.title">
<button class="btn btn-success">
<i class="fa fa-plus"></i>
Create New Organization
</button>
</a>
<a href="/user/?migrate" ng-show="!user.anonymous" data-title="Starts the process to convert this account into an organization" bs-tooltip="tooltip.title" quay-show="Config.AUTHENTICATION_TYPE == 'Database' && !user.anonymous">
<button class="btn btn-primary">
<i class="fa fa-caret-square-o-right"></i>
Convert account
</button>
</a>
</div>
</div>
<div class="tour-content" ng-if="!user.organizations || user.organizations.length == 0" kind="'organizations'"></div>
</div>

11
static/partials/tour.html Normal file
View file

@ -0,0 +1,11 @@
<div class="tour-section-container">
<ul class="tour-sections">
<li ng-class="kind == '' || kind == 'features' ? 'active' : ''"><a href="/tour/features">Features</a></li>
<li ng-class="kind == 'organizations' ? 'active' : ''"><a href="/tour/organizations">Teams and Organizations</a></li>
<li ng-class="kind == 'enterprise' ? 'active' : ''" quay-require="['BILLING']"><a href="/tour/enterprise">Enterprise</a></li>
</ul>
</div>
<div class="container">
<div class="tour-content" kind="kind"></div>
</div>