ambrose
/
simple-auction
mirror of https://github.com/serverwentdown/simple-auction.git
1
0
Fork 0
Code Releases Activity

Various additions

master
Ambrose Chua 2016-12-01 11:35:25 +08:00
parent 4f0ae0098d
commit d0bffca00a
9 changed files with 146 additions and 73 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/bid.js
View File

@ -40,7 +40,9 @@ $('#placeBid').click(function () {
var update = function update() { var update = function update() {
var success = function success(data) { var success = function success(data) {
$('#highest').text('$' + (data.bid.highest || data.bid.starting)); if (data.bid) {
$('#highest').text('$' + (data.bid.highest || data.bid.starting));
}
}; };
var error = function error(xhr) { var error = function error(xhr) {

4
assets/item.css
View File

@ -6,10 +6,10 @@
} }
.images { .images {
margin: -1em; margin: -1rem;
} }
.image { .image {
margin: 1em; margin: 1rem;
} }
@media (min-width: 768px) { @media (min-width: 768px) {

26
assets/items.css
View File

@ -1,10 +1,26 @@
.items { .items {
margin: -1em; margin: -1rem;
} }
.item { .item {
margin: 1em; margin: 1rem;
} }
.item {
position: relative;
}
.item:after {
content: '';
display: block;
width: 100%;
padding-top: calc(10 / 16 * 100%);
}
.item a {
display: block;
position: absolute;
top: 0;
}
@media (min-width: 768px) { @media (min-width: 768px) {
.items { .items {
display: flex; display: flex;
@ -12,6 +28,10 @@
} }
.item { .item {
flex: 1 0 auto; flex: 1 0 auto;
width: calc(50% - 4em); width: calc(50% - 4rem);
}
.item:after {
padding-top: calc(4 / 3 * 100%);
} }
} }

43
assets/main.css
View File

@ -1,3 +1,42 @@
main { body {
padding-top: 6vw; font-family: "Fira Sans",
-apple-system,
BlinkMacSystemFont,
"Segoe UI",
"Roboto",
"Helvetica Neue", Arial, sans-serif;
-webkit-font-smoothing: antialiased;
}
.navbar-brand {
/* font-weight: 600; */
}
main,
main.container-fluid {
padding: 1rem;
}
.navbar {
margin-bottom: 1rem;
}
@media (min-width: 768px) {
main,
main.container-fluid {
padding: 2rem;
}
.navbar {
margin-bottom: 2rem;
}
}
@media (max-width: 480px) {
.navbar-brand {
width: 100%;
}
} }

5
routes.js
View File

@ -32,6 +32,11 @@ routes.use(bodyparser.urlencoded({
const logic = new Logic(); const logic = new Logic();
const config = logic.getConfig(); const config = logic.getConfig();
routes.get('/*', (req, res, next) => {
res.set('Cache-Control', 'no-cache, no-store');
next();
});
routes.get('/', (req, res, next) => { routes.get('/', (req, res, next) => {
logic.getIndex().then((content) => { logic.getIndex().then((content) => {
res.render('index', { res.render('index', {

14
views/index.hbs
View File

@ -1,11 +1,9 @@
<main class="container-fluid"> <div class="row">
<div class="row"> <div class="col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3 col-xl-4 offset-xl-4">
<div class="col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3 col-xl-4 offset-xl-4"> {{{content}}}
{{{content}}}
<div> <div>
<a href="/items/" class="btn btn-primary">Go to auction</a> <a href="/items/" class="btn btn-primary">Browse items for auction</a>
</div>
</div> </div>
</div> </div>
</main> </div>

82
views/item.hbs
View File

@ -1,55 +1,51 @@
{{#if item}} {{#if item}}
{{#with item}} {{#with item}}
<main class="container-fluid"> <div class="row">
<div class="row"> <div class="col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3 col-xl-4 offset-xl-4">
<div class="col-sm-10 offset-sm-1 col-md-8 offset-md-2 col-lg-6 offset-lg-3 col-xl-4 offset-xl-4"> <div class="alert alert-success" role="alert" id="success" style="display: none;"></div>
<div class="alert alert-success" role="alert" id="success" style="display: none;"></div> <div class="alert alert-danger" role="alert" id="error" style="display: none;"></div>
<div class="alert alert-danger" role="alert" id="error" style="display: none;"></div>
</div>
</div> </div>
<div class="row"> </div>
<div class="col-xs-12 col-sm-8 offset-sm-2 col-md-6 offset-md-0 col-lg-4 offset-lg-2 mb-1"> <div class="row">
<div class="images"> <div class="col-xs-12 col-sm-8 offset-sm-2 col-md-6 offset-md-0 col-lg-4 offset-lg-2 mb-1">
{{#each images}} <div class="images">
<div class="image"> {{#each images}}
<a href="https://{{@root.config.imgix}}/{{src}}?w=2048"> <div class="image">
<img class="crop-wide img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{src}}?w=480&h=640&fit=crop&crop=edges" /> <a href="https://{{@root.config.imgix}}/{{src}}?w=2048">
<img class="crop-narrow img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{src}}?w=768&h=480&fit=crop&crop=edges" /> <img class="crop-wide img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{src}}?w=480&h=640&fit=crop&crop=edges" />
</a> <img class="crop-narrow img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{src}}?w=768&h=480&fit=crop&crop=edges" />
</div> </a>
{{/each}}
</div> </div>
</div> {{/each}}
<div class="col-xs-12 col-sm-8 offset-sm-2 col-md-6 offset-md-0 col-lg-4 offset-lg-0">
<h6 class="text-muted">Description</h6>
<p>{{description}}</p>
<h6 class="text-muted">{{#if bid.highest}}Highest{{else}}Starting{{/if}} bid</h6>
<h1 class="display-4" id="highest">${{#if bid.highest}}{{bid.highest}}{{else}}{{bid.starting}}{{/if}}</h1>
<form action="#" method="get">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">$</span>
<input class="form-control" type="number" id="amount" min="1" max="10000" placeholder="Amount" value="{{bid.next}}" />
<span class="input-group-btn">
<input class="btn btn-primary" type="button" value="Place bid" data-toggle="modal" data-target="#bidModal" />
</span>
</div>
</div>
</form>
</div> </div>
</div> </div>
</main> <div class="col-xs-12 col-sm-8 offset-sm-2 col-md-6 offset-md-0 col-lg-4 offset-lg-0">
<h6 class="text-muted">Description</h6>
<p>{{description}}</p>
<h6 class="text-muted">{{#if bid.highest}}Highest{{else}}Starting{{/if}} bid</h6>
<span class="h1 display-4" id="highest">${{#if bid.highest}}{{bid.highest}}{{else}}{{bid.starting}}{{/if}}</span>
<form action="#" method="get">
<div class="form-group">
<div class="input-group">
<span class="input-group-addon">$</span>
<input class="form-control" type="number" id="amount" min="1" max="10000" placeholder="Amount" value="{{bid.next}}" />
<span class="input-group-btn">
<input class="btn btn-primary" type="button" value="Place bid" data-toggle="modal" data-target="#bidModal" />
</span>
</div>
</div>
</form>
</div>
</div>
{{/with}} {{/with}}
{{else}} {{else}}
<main class="container-fluid"> <div class="row">
<div class="row"> <div class="col-sm-8 offset-sm-2 col-md-6 offset-md-3 col-lg-4 offset-lg-4">
<div class="col-sm-8 offset-sm-2 col-md-6 offset-md-3 col-lg-4 offset-lg-4"> <div class="alert alert-danger">
<div class="alert alert-danger"> <strong>Error! </strong>Item not found.
<strong>Error! </strong>Item not found.
</div>
</div> </div>
</div> </div>
</main> </div>
{{/if}} {{/if}}
@ -60,7 +56,7 @@
<button type="button" class="close" data-dismiss="modal" aria-label="Close"> <button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span> <span aria-hidden="true">&times;</span>
</button> </button>
<h4 class="modal-title">Place bid</h4> <h6 class="modal-title">Place bid</h6>
</div> </div>
<div class="modal-body"> <div class="modal-body">
<div class="form-group"> <div class="form-group">

24
views/items.hbs
View File

@ -1,16 +1,14 @@
<main class="container-fluid"> <div class="row">
<div class="row"> <div class="col-sm-8 offset-sm-2 col-md-12 offset-md-0 col-lg-8 offset-lg-2">
<div class="col-sm-8 offset-sm-2 col-md-12 offset-md-0 col-lg-8 offset-lg-2"> <div class="items">
<div class="items"> {{#each items}}
{{#each items}} <div class="item">
<div class="item"> <a href="/items/{{id}}">
<a href="/items/{{id}}"> <img class="crop-wide img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{images.0.src}}?w=480&h=640&fit=crop&crop=edges" />
<img class="crop-wide img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{images.0.src}}?w=480&h=640&fit=crop&crop=edges" /> <img class="crop-narrow img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{images.0.src}}?w=768&h=480&fit=crop&crop=edges" />
<img class="crop-narrow img-fluid rounded" ix-src="https://{{@root.config.imgix}}/{{images.0.src}}?w=768&h=480&fit=crop&crop=edges" /> </a>
</a>
</div>
{{/each}}
</div> </div>
{{/each}}
</div> </div>
</div> </div>
</main> </div>

17
views/layouts/default.hbs
View File

@ -4,13 +4,28 @@
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta name="viewport" content="width=device-width" /> <meta name="viewport" content="width=device-width" />
<title>{{#if title}}{{title}}{{else}}{{@root.config.title}}{{/if}}</title> <title>{{#if title}}{{title}}{{else}}{{@root.config.title}}{{/if}}</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Fira+Sans:300,400,500,700" />
<link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css" /> <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="/assets/main.css" /> <link rel="stylesheet" href="/assets/main.css" />
<link rel="stylesheet" href="/assets/items.css" /> <link rel="stylesheet" href="/assets/items.css" />
<link rel="stylesheet" href="/assets/item.css" /> <link rel="stylesheet" href="/assets/item.css" />
</head> </head>
<body> <body>
{{{body}}} <main class="container-fluid">
<div class="row">
<div class="col-sm-12 offset-sm-0 col-md-12 offset-md-0 col-lg-8 offset-lg-2">
<nav class="navbar navbar-light">
<a class="navbar-brand" href="/">{{@root.config.title}}</a>
<div class="nav navbar-nav">
<a class="nav-item nav-link" href="/">About</a>
<a class="nav-item nav-link" href="/items/">Browse</a>
</div>
</nav>
</div>
</div>
{{{body}}}
</main>
<script src="/jquery/jquery.min.js"></script> <script src="/jquery/jquery.min.js"></script>
<script src="/bootstrap/js/bootstrap.min.js"></script> <script src="/bootstrap/js/bootstrap.min.js"></script>
<script src="/imgix.js/imgix.min.js"></script> <script src="/imgix.js/imgix.min.js"></script>