Add profile view and upgrade author view

This commit is contained in:
Christian Bundy
2019-06-24 21:03:34 -07:00
parent adfb779439
commit 8ffea24cf5
6 changed files with 82 additions and 9 deletions

View File

@ -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())

View File

@ -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;
}

View File

@ -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
View 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)
}

View File

@ -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 }); %>

View File

@ -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">