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

Add 404 page

Browse source 
Fixes coreos-inc/quay#677
This commit is contained in:
Quentin Machu 2015-10-21 15:28:45 -04:00
parent e008f48f36
commit adb744089e
6 changed files with 136 additions and 101 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
conf/server-base.conf
View file

@ -72,7 +72,8 @@ location /c1/ {
location /static/ { location /static/ {
# checks for static file, if not found proxy to app # checks for static file, if not found proxy to app
alias /static/; alias /static/;
error_page 404 /404;
} }
location /v1/_ping { location /v1/_ping {

4
endpoints/web.py
View file

@ -58,6 +58,10 @@ def index(path, **kwargs):
def internal_error_display(): def internal_error_display():
return render_page_template('500.html') return render_page_template('500.html')
@web.errorhandler(404)
@web.route('/404', methods=['GET'])
def not_found_error_display(e = None):
return render_page_template('404.html')
@web.route('/organization/<path:path>', methods=['GET']) @web.route('/organization/<path:path>', methods=['GET'])
@no_cache @no_cache

5
static/js/app.js
View file

@ -226,6 +226,11 @@ quayApp.run(['$location', '$rootScope', 'Restangular', 'UserService', 'PlanServi
return false; return false;
} }
if (response.status == 404) {
document.location = '/404';
return false;
}
return true; return true;
}); });

12
templates/404.html Normal file
View file

@ -0,0 +1,12 @@
{% extends "error.html" %}
{% block title %}
<title>Quay.io - Page Not Found!</title>
{% endblock %}
{% block content %}
<h3>The page doesn't exist !</h3>
<h4>
This is somewhat embarrassing, isn’t it ? It looks like nothing was found at this location. Please return to the <a href="/">main page</a>.
</h4>
{% endblock %}

121
templates/500.html
View file

@ -1,104 +1,25 @@
<html> {% extends "error.html" %}
{% block title %}
<title>Quay.io - Something went wrong!</title> <title>Quay.io - Something went wrong!</title>
<head> {% endblock %}
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.no-icons.min.css">
<link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
<style type="text/css">
.ship-header {
width: 100%;
height: 400px;
position: relative;
}
.ship-header div.layer { {% block content %}
position: absolute; <h3>Something went wrong on our end!</h3>
top: 0px; <h4>
bottom: 0px; We're currently working to fix the problem, but if its persists please feel free to <a href="/contact">contact us</a>. In the meantime, try a refreshing drink (or just refreshing).
left: 0px; </h4>
right: 0px;
}
.ship-header .background { <div style="margin-top: 20px">
background-size: cover; Current Service Status:
background-image: url(/static/img/500/background.svg); <span id="status-elem">(Loading)</span>
} </div>
.ship-header .ship { <script type="text/javascript" src="//statuspage-production.s3.amazonaws.com/se.js"></script>
background-size: cover; <script type="text/javascript">
background-image: url(/static/img/500/ship.svg); window.fetchStatusPage({
position: absolute; pageId: '8szqd6w4s277',
top: 0px; renderTo: '#status-elem'
bottom: 0px; });
right: 0px; </script>
width: 19%; {% endblock %}
}
.ship-header .water {
background-size: cover;
background-image: url(/static/img/500/water.svg);
}
@-webkit-keyframes steaming {
0% {
-webkit-transform: translateX(0px) scaleX(1);
}
50% {
-webkit-transform: translateX(-180%) scaleX(1);
}
51% {
-webkit-transform: translateX(-180%) scaleX(-1);
}
99% {
-webkit-transform: translateX(0px) scaleX(-1);
}
100% {
-webkit-transform: translateX(0px) scaleX(1);
}
}
.ship-header .ship {
-webkit-animation-name: steaming;
-webkit-animation-duration: 30s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
.information {
padding: 30px;
text-align: center;
}
.information h3 {
margin-bottom: 20px;
}
</style>
</head>
<body>
<div id="header" class="ship-header">
<div class="background layer"></div>
<div id="ship" class="ship"></div>
<div class="water layer"></div>
</div>
<div class="information">
<img src="/static/img/quay-logo.png">
<h3>Something went wrong on our end!</h3>
<h4>
We're currently working to fix the problem, but if its persists please feel free to <a href="/contact">contact us</a>. In the meantime, try a refreshing drink (or just refreshing).
</h4>
<div style="margin-top: 20px">
Current Service Status:
<span id="status-elem">(Loading)</span>
</div>
<script type="text/javascript" src="//statuspage-production.s3.amazonaws.com/se.js"></script>
<script type="text/javascript">
window.fetchStatusPage({
pageId: '8szqd6w4s277',
renderTo: '#status-elem'
});
</script>
</div>
</body>
</html>

92
templates/error.html Normal file
View file

@ -0,0 +1,92 @@
<html>
<head>
{% block title %}
{% endblock %}
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.no-icons.min.css">
<link href='//fonts.googleapis.com/css?family=Droid+Sans:400,700' rel='stylesheet' type='text/css'>
<style type="text/css">
.ship-header {
width: 100%;
height: 400px;
position: relative;
}
.ship-header div.layer {
position: absolute;
top: 0px;
bottom: 0px;
left: 0px;
right: 0px;
}
.ship-header .background {
background-size: cover;
background-image: url(/static/img/500/background.svg);
}
.ship-header .ship {
background-size: cover;
background-image: url(/static/img/500/ship.svg);
position: absolute;
top: 0px;
bottom: 0px;
right: 0px;
width: 19%;
}
.ship-header .water {
background-size: cover;
background-image: url(/static/img/500/water.svg);
}
@-webkit-keyframes steaming {
0% {
-webkit-transform: translateX(0px) scaleX(1);
}
50% {
-webkit-transform: translateX(-180%) scaleX(1);
}
51% {
-webkit-transform: translateX(-180%) scaleX(-1);
}
99% {
-webkit-transform: translateX(0px) scaleX(-1);
}
100% {
-webkit-transform: translateX(0px) scaleX(1);
}
}
.ship-header .ship {
-webkit-animation-name: steaming;
-webkit-animation-duration: 30s;
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
}
.information {
padding: 30px;
text-align: center;
}
.information h3 {
margin-bottom: 20px;
}
</style>
</head>
<body>
<div id="header" class="ship-header">
<div class="background layer"></div>
<div id="ship" class="ship"></div>
<div class="water layer"></div>
</div>
<div class="information">
<img src="/static/img/quay-logo.png">
{% block content %}
{% endblock %}
</div>
</body>
</html>