Begin embeddable snowflake badge (issue #16)

This commit is contained in:
Serene Han 2016-02-03 20:28:31 -08:00
parent a915758275
commit 7677707249
4 changed files with 55 additions and 11 deletions

View file

@ -33,6 +33,12 @@ task 'test', 'snowflake unit tests', ->
throw err if err
console.log stdout + stderr
# task 'build:embed', 'build the snowflake badge', ->
# exec 'mkdir -p build'
# concatCoffeeFiles()
# copyStaticFiles()
# compileCoffee()
task 'build', 'build the snowflake proxy', ->
exec 'mkdir -p build'
concatCoffeeFiles()

View file

@ -59,7 +59,7 @@ class ProxyPair
channel.onopen = =>
log 'Data channel opened!'
snowflake.state = MODE.WEBRTC_READY
$msglog.className = 'active';
$msglog.className = 'active' if $msglog
# This is the point when the WebRTC datachannel is done, so the next step
# is to establish websocket to the server.
@connectRelay()
@ -67,7 +67,7 @@ class ProxyPair
log 'Data channel closed.'
Status.set 'disconnected.'
snowflake.state = MODE.INIT
$msglog.className = ''
$msglog.className = '' if $msglog
# Change this for multiplexing.
snowflake.reset()
channel.onerror = -> log 'Data channel error!'

View file

@ -232,9 +232,12 @@ log = (msg) -> # Log to the message window.
# Status bar
Status =
set: (msg) -> $status.innerHTML = 'Status: ' + msg
set: (msg) ->
$status.innerHTML = 'Status: ' + msg if $status
init = ->
$badge = document.getElementById('badge')
if !badge
$status = document.getElementById('status')
$msglog = document.getElementById('msglog')
$msglog.value = ''

35
proxy/static/embed.html Normal file
View file

@ -0,0 +1,35 @@
<!doctype html>
<html>
<head>
<meta content="text/html;charset=utf-8" http-equiv="Content-Type">
<script type="text/javascript" src="snowflake.js"></script>
<style>
* {
box-sizing: border-box;
-webkit-transition: all 0.3s;
-moz-transition: all 0.3s;
transition: all 0.3s;
}
body {
position: absolute;
width: 100%; height: 100%; top: 0; margin: 0 auto;
background-color: #424;
color: #000;
text-align: center;
font-size: 16px;
font-variant: small-caps;
}
#badge {
margin: auto;
width: 88px; height: 31px;
background-image: url('koch.jpg');
color: #fff;
}
</style>
</head>
<body>
<div id="badge">
Snowflake
</div>
</body>
</html>