pluto/website/pages/examples.html
2018-09-25 16:13:20 +02:00

55 lines
1.4 KiB
HTML

<html>
<head>
<style>
main {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
height: 100%
}
#selection {
padding: 10px;
}
#extension {
border: 40px solid #ddd;
border-width: 55px 7px;
border-radius: 40px;
margin: 50px auto;
width: 30vh;
height: 50vh;
overflow: hidden;
}
#extension iframe {
border: 0;
height: 100%;
width: 100%
}
</style>
</head>
<body>
<script>
function load(urn) {
pluto.examples.load_and_render(urn, document.getElementById("frame").contentWindow.document.body.firstChild, document.getElementById("errors"));
}
</script>
<main>
<div id="selection">
Load demo extension from
<button onclick="load('ipfs@QmUCnqKmH4vvd5oXyJUkBV1rRnkLMX29iVugoREsaNTWr5')">IPFS</button>
<button onclick="load('url@assets/extensions/demo')">HTTP</button>
<button onclick="load('gist@jeluard/1b41c8194c1658e1b6fc0bde4aa6db95')">Gist</button>
</div>
<div id="extension">
<iframe id="frame" srcdoc="<body><main></main></body>"></iframe>
</div>
<div id="errors"></div>
</main>
</body>
</html>
<script src="cljs-out/figwheel/dev-main.js"></script>