const c = console
const http = require('axios')
let ctr = '{"contract":{"marriage":["Kristina Butkute","Francesco Canessa"]},"timestamp":"2016-10-29 1:30 PM UTC","location":"Tower Hamlets public hall, London, UK","signatures":["FC","KB"],"contract_scan_sha2":"WILL_PROVIDE","contract_scan":{"http":"WILL_UPLOAD","torrent":"WU","ipfs":"WU"},"location_coords":{"lat":"51.527952","lng":"-0.019323"},"image_files":["marriage_certificate.jpg"],"github_usernames":["makevoid","kristinab"],"eid_1":"CANESSA,FRANCESCO,38706040087","eid_sig_1":{"FC":"48ddf18e4ec4fbccf7403d01bd83abdd26f7afb4ff5"},"eid_2":"BUTKUTE,KRISTINA,48511110100","void_address":"14EUVdBzCnAqm872XyeCThzG4hsgjZ9NB9","eid_sig_2":{"KB":"5632e93da14fbe30580b0daae4c927878fd8337226c"}}'
// let ctr = require @runkit
ctr = JSON.parse(ctr)
c.log(ctr)
let firstKey = (obj) => {
return Object.keys(obj)[0]
}
let firstValue = (obj) => {
return obj[firstKey(obj)]
}
let capitalize = (str) => {
let tail = str.toString().substr(1)
return `${str[0].toUpperCase()}${tail}`
}
let ghLinks = (usernames) => {
return usernames.map((username) => {
return `<a href="https://github.com/${username}">${username}</a>`
}).join(", ")
}
let ghImages = (details) => {
return details.map((detail) => {
let image = detail.avatar_url
return `
<div class="column">
<img src="${image}" style="width: 200px" />
</div>
`
}).join(" ")
}
let arrPrint = (arr) => {
return arr.join(", ")
}
// ---------------------
// request data (inline using async)
let ghDetails = []
for (username of ctr.github_usernames) {
let url = `https://api.github.com/users/${username}`
let resp = await http.get(url)
ghDetails.push(resp.data)
}
//
// ---------------------
// view layer
const contractTitle = `
<h2 class="subtitle" style="margin-bottom: 25px;">${capitalize(firstKey(ctr.contract))}:</h2>
<h1 class="title">${arrPrint(firstValue(ctr.contract))}</h1>`
// cdn default bulma: https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.3/css/bulma.min.css
const view = `
<html><head>
<link rel="stylesheet" href="https://dl.dropbox.com/s/ey8p6kgsln720wp/bulma.css">
<style type="text/css">
.s10 { height: 10px; }
.s20 { height: 20px; }
.s30 { height: 30px; }
.s40 { height: 40px; }
.s50 { height: 50px; }
</style>
</head><body>
<div class="container is-fluid">
<section class="hero is-primary is-bold">
<div class="hero-body">
<div class="container">
<h1 class="title">
${contractTitle}
</h1>
<h2 class="subtitle">
Blockchain OP_RETURN Contract
</h2>
</div>
</div>
</section>
<div class="box">
<h3 class="title is-3">Details:</h3>
<h3 class="title is-5">Github usernames</h3>
<h3 class="title is-4">${ghLinks(ctr.github_usernames)}</h3>
<div class="columns">
${ghImages(ghDetails)}
</div>
</div>
</div>
</body>
`
view