Update home

This commit is contained in:
typicode
2017-03-03 13:24:33 +01:00
parent 1519e2c102
commit 0551bd027f
3 changed files with 45 additions and 32 deletions

View File

@ -2,22 +2,21 @@
<head>
<title>JSON Server</title>
<link rel="stylesheet" href="//cdn.rawgit.com/milligram/milligram/master/dist/milligram.min.css">
<link rel="stylesheet" href="stylesheets/style.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<main class="container">
<p>
<header class="container">
<h1>
<a href="https://github.com/typicode/json-server" class="logo">
<img src="images/json.png">
json-server
</a>
</p>
</h1>
</header>
<main class="container">
<hr>
<p>
<em>
Congrats! You're successfully running JSON Server.
</em>
Congrats! {😊}<br>
<em>You're successfully running JSON Server</em>
</p>
<hr>

View File

@ -1,45 +1,54 @@
/* global m */
// Resource list
var resources = []
var db = {}
m.request('db').then(function (data) {
resources = Object.keys(data)
db = data
})
m.mount(
document.getElementById('resources'),
{
view: function () {
return m('ul', resources.map(function (resource) {
return m('li',
m('a', { href: resource }, resource)
)
var keys = Object.keys(db)
console.log(keys, db)
return m('ul', keys.map(function (key) {
return m('li', [
m('a', { href: key }, key),
m('span', Array.isArray(db[key])
? '(' + db[key].length + ')'
: '(1)'
)
])
}))
}
}
)
// Custom routes
var rules = {}
var customRoutes = {}
m.request('__rules').then(function (data) {
rules = data
customRoutes = data
})
m.mount(
document.getElementById('custom-routes'),
{
view: function () {
return [
m('p', 'And the custom routes:'),
m('table', Object.keys(rules).map(function (rule) {
return m('tr', [
m('td', rule),
m('td', '⇢ ' + rules[rule])
])
}))
]
var rules = Object.keys(customRoutes)
if (rules.length) {
return [
m('p', 'And the custom routes:'),
m('table', rules.map(function (rule) {
return m('tr', [
m('td', rule),
m('td', '⇢ ' + rules[rule])
])
}))
]
}
}
}
)

View File

@ -8,16 +8,21 @@ body {
flex-direction: column;
}
main {
flex: 1;
padding: 2rem 0;
}
a, a:hover {
color: #1882BC;
text-decoration: underline;
}
header a {
color: inherit;
text-decoration: none;
}
main {
flex: 1;
padding: 2rem 0;
}
table {
margin-left: 30px;
}