Add profile view and upgrade author view
This commit is contained in:
10
index.js
10
index.js
@ -5,10 +5,11 @@ const path = require('path')
|
|||||||
const router = require('koa-router')()
|
const router = require('koa-router')()
|
||||||
const views = require('koa-views')
|
const views = require('koa-views')
|
||||||
|
|
||||||
const home = require('./routes/home')
|
|
||||||
const thread = require('./routes/thread')
|
|
||||||
const author = require('./routes/author')
|
const author = require('./routes/author')
|
||||||
const hashtag = require('./routes/hashtag')
|
const hashtag = require('./routes/hashtag')
|
||||||
|
const home = require('./routes/home')
|
||||||
|
const profile = require('./routes/profile')
|
||||||
|
const thread = require('./routes/thread')
|
||||||
|
|
||||||
const app = module.exports = new Koa()
|
const app = module.exports = new Koa()
|
||||||
|
|
||||||
@ -16,13 +17,14 @@ app.use(views(path.join(__dirname, 'views'), {
|
|||||||
map: { html: 'ejs' }
|
map: { html: 'ejs' }
|
||||||
}))
|
}))
|
||||||
|
|
||||||
app.use(require('koa-static')('static'))
|
app.use(require('koa-static')('public'))
|
||||||
|
|
||||||
router
|
router
|
||||||
.get('/', home)
|
.get('/', home)
|
||||||
.get('/thread/:id', thread)
|
|
||||||
.get('/author/:id', author)
|
.get('/author/:id', author)
|
||||||
.get('/hashtag/:id', hashtag)
|
.get('/hashtag/:id', hashtag)
|
||||||
|
.get('/profile/', profile)
|
||||||
|
.get('/thread/:id', thread)
|
||||||
|
|
||||||
app.use(router.routes())
|
app.use(router.routes())
|
||||||
|
|
||||||
|
@ -33,6 +33,16 @@ h1, h2, h3, h4, h5, h6 {
|
|||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.message > :first-child {
|
||||||
|
margin-top: 0;
|
||||||
|
padding-top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.message > :last-child {
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
.message code {
|
.message code {
|
||||||
color: hsl(330, 75%, 50%)
|
color: hsl(330, 75%, 50%)
|
||||||
}
|
}
|
||||||
@ -51,7 +61,7 @@ h1, h2, h3, h4, h5, h6 {
|
|||||||
.message {
|
.message {
|
||||||
background: #fff;
|
background: #fff;
|
||||||
padding: 1.5rem;
|
padding: 1.5rem;
|
||||||
margin: 0.75rem 0;
|
margin: 1rem 0;
|
||||||
border-radius: 2px;
|
border-radius: 2px;
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
|
|
||||||
@ -75,7 +85,36 @@ h1, h2, h3, h4, h5, h6 {
|
|||||||
}
|
}
|
||||||
.message > footer > a {
|
.message > footer > a {
|
||||||
color: #888;
|
color: #888;
|
||||||
margin-right: 0.5rem;
|
margin-right: 1rem;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
nav a {
|
||||||
|
color: #888;
|
||||||
|
margin-right: 1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile {
|
||||||
|
margin-top: 1rem;
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile > img, .profile > h1 {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.profile > img {
|
||||||
|
width: 4rem;
|
||||||
|
height: 4rem;
|
||||||
|
margin-right: 1rem;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
ul {
|
||||||
|
padding-left: 1rem;
|
||||||
|
}
|
@ -22,6 +22,18 @@ module.exports = async function (ctx) {
|
|||||||
}
|
}
|
||||||
)
|
)
|
||||||
|
|
||||||
|
const avatarMsg = await cooler.get(
|
||||||
|
ssb.about.socialValue, { key: 'image',
|
||||||
|
dest: ctx.params.id
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
const avatarId = avatarMsg != null && typeof avatarMsg.link === 'string'
|
||||||
|
? avatarMsg.link
|
||||||
|
: avatarMsg
|
||||||
|
|
||||||
|
const avatarUrl = `http://localhost:8989/blobs/get/${avatarId}`
|
||||||
|
|
||||||
const description = renderMd(rawDescription)
|
const description = renderMd(rawDescription)
|
||||||
|
|
||||||
var msgSource = await cooler.read(
|
var msgSource = await cooler.read(
|
||||||
@ -50,5 +62,5 @@ module.exports = async function (ctx) {
|
|||||||
|
|
||||||
const msgs = await Promise.all(rawMsgs.map(renderMsg(ssb)))
|
const msgs = await Promise.all(rawMsgs.map(renderMsg(ssb)))
|
||||||
|
|
||||||
await ctx.render('author', { msgs, name, description })
|
await ctx.render('author', { msgs, name, description, avatarUrl })
|
||||||
}
|
}
|
||||||
|
9
routes/profile.js
Normal file
9
routes/profile.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
const cooler = require('../lib/cooler')
|
||||||
|
const author = require('./author')
|
||||||
|
|
||||||
|
module.exports = async function (ctx) {
|
||||||
|
const ssb = await cooler.connect()
|
||||||
|
const whoami = await cooler.get(ssb.whoami)
|
||||||
|
ctx.params.id = whoami.id
|
||||||
|
await author(ctx)
|
||||||
|
}
|
@ -1,8 +1,16 @@
|
|||||||
<%- include('partials/header.html'); %>
|
<%- include('partials/header.html'); %>
|
||||||
|
|
||||||
|
<header class="profile">
|
||||||
|
<img class="avatar" src="<%= avatarUrl %>">
|
||||||
<h1><%= name %></h1>
|
<h1><%= name %></h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- HACK: this shouldn't pass through ssb-markdown at all -->
|
||||||
|
<% if (description !== '<p>null</p>\n') { %>
|
||||||
|
<section class="message">
|
||||||
<%- description %>
|
<%- description %>
|
||||||
|
</section>
|
||||||
|
<% } %>
|
||||||
|
|
||||||
<%- include('feed.html', { msgs }); %>
|
<%- include('feed.html', { msgs }); %>
|
||||||
|
|
||||||
|
@ -5,5 +5,8 @@
|
|||||||
<link rel="stylesheet" href="/style.css">
|
<link rel="stylesheet" href="/style.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<nav>
|
||||||
<a href="/">home</a>
|
<a href="/">home</a>
|
||||||
|
<a href="/profile">profile</a>
|
||||||
|
</nav>
|
||||||
<section id="content">
|
<section id="content">
|
||||||
|
Reference in New Issue
Block a user