Files
buuh/examples/mailbox/elements/mailbox.js
T
Yoshua Wuyts 6407188ee9 router: change order of arguments
fixup! freeze state & rename app ns to location
2016-07-02 22:54:35 +02:00

84 lines
2.1 KiB
JavaScript

const dateformat = require('dateformat')
const html = require('../../../html')
module.exports = function () {
return function (state, prev, send) {
const params = state.params
const mailbox = params.mailbox
const message = params.message
const messages = state[mailbox].messages
if (message) {
const email = state[mailbox].messages.filter(function (msg) {
return String(msg.id) === message
})[0]
return html`
<section class="fl mt4 w-80 db">
<div>
${createHeader()}
${messages.map(function (msg) {
return createMessage(msg, mailbox)
})}
</div>
<div>
${email ? createEmail(email) : 'error: no email found'}
</div
</section>
`
} else {
return html`
<section class="fl mt4 w-80 db">
${createHeader()}
${messages.map(function (msg) {
return createMessage(msg, mailbox)
})}
</section>
`
}
}
}
function createHeader () {
return html`
<div class="db cf w-100">
<div class="fl mb3 w-25 mt0 b">Date</th>
<div class="fl mb3 w-25 mt0 b">Subject</th>
<div class="fl mb3 w-25 mt0 b">From</th>
<div class="fl mb3 w-25 mt0 b">To</th>
</div>
`
}
function createMessage (message, mailbox) {
return html`
<div class="db cf w-100">
<a href="${'/' + mailbox + '/' + message.id}">
<div class="fl mb3 w-25 f6 link">
${dateformat(message.date, 'mmmm dS')}
</div>
<div class="fl mb3 w-25 f6 link">${message.subject}</div>
<div class="fl mb3 w-25 f6 link">${message.from}</div>
<div class="fl mb3 w-25 f6 link">${message.to}</div>
</a>
</div>
`
}
function createEmail (message) {
return html`
<div class="mail">
<dl>
<dt>From</dt>
<dd>${message.from}</dd>
<dt>To</dt>
<dd>${message.to}</dd>
<dt>Date</dt>
<dd>${message.date}</dd>
</dl>
<h4>${message.subject}</h4>
<p>${message.body}</p>
</div>
`
}