Last active
May 23, 2017 06:10
-
-
Save ishiduca/329c5e2d13ea6f097f3cb148c2c71164 to your computer and use it in GitHub Desktop.
example of buoyancy with websocket
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
'use strict' | |
var path = require('path') | |
var http = require('http') | |
var ecstatic = require('ecstatic')(path.join(__dirname, 'static')) | |
var websocket = require('websocket-stream') | |
var miss = require('mississippi') | |
var port = 3003 | |
var app = http.createServer(ecstatic) | |
websocket.createServer({server: app}, s => { | |
s.pipe(miss.through((r, _, done) => { | |
done(null, String(r).toUpperCase()) | |
})).pipe(s) | |
}) | |
if (!module.parent) { | |
app.listen(port, () => console.log('listen on port "%s"', port)) | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!doctype html><body><script type="application/javascript" src="/js/bundle.js"></script></body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "buoyancy-with-websocket", | |
"version": "1.0.0", | |
"description": "", | |
"main": "app.js", | |
"scripts": { | |
"build": "browserify ./src/main.js > ./static/js/bundle.js" | |
}, | |
"browserify": { | |
"transform": [ | |
"yo-yoify" | |
] | |
}, | |
"author": "[email protected]", | |
"license": "MIT", | |
"devDependencies": { | |
"ecstatic": "^2.1.0", | |
"yo-yoify": "^3.7.3" | |
}, | |
"dependencies": { | |
"buoyancy": "0.0.3", | |
"global": "^4.3.2", | |
"mississippi": "^1.3.0", | |
"on-load": "^3.2.0", | |
"websocket-stream": "^5.0.0" | |
} | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var w = require('global/window') | |
var yo = require('buoyancy').html | |
var onload = require('on-load') | |
var websocket = require('websocket-stream') | |
var loc = w.location | |
var uri = [loc.protocol.replace('http', 'ws'), '//', loc.host].join('') | |
var missi = require('mississippi') | |
module.exports = function (state, dispatcher) { | |
var el = yo ` | |
<ol> | |
${state.map(c => yo `<li>${c}</li>`)} | |
</ol> | |
` | |
var ws = websocket(uri) | |
el.ws = ws | |
onload(el, e => { | |
console.log('onload websocket component') | |
missi.pipe( | |
ws, | |
missi.through((r, _, done) => { | |
dispatcher('change', String(r)) | |
done() | |
}), | |
onEnd | |
) | |
ws.once('connect', () => { | |
console.log('wsProxy connected - "%s"', uri) | |
missi.pipe( | |
arrayStream(('abcdefg').split('')), | |
missi.through((c, _, done) => { | |
ws.write(c) | |
done() | |
}), | |
onEnd | |
) | |
}) | |
ws.once('close', () => console.log('wsProxy closed')) | |
function onEnd (err) { | |
if (err) console.error(err) | |
} | |
}) | |
return el | |
} | |
function arrayStream (arry) { | |
return missi.from(function (size, done) { | |
if (arry.length <= 0) return done(null, null) | |
setTimeout(() => done(null, arry.shift()), 1000) | |
}) | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
var d = require('global/document') | |
var onload = require('on-load') | |
var buoyancy = require('buoyancy') | |
var yo = buoyancy.html | |
var websocket = require('./components/websocket/app') | |
var root = yo `<main></main>` | |
var app = buoyancy(root, [], (type, state, action) => { | |
return state.concat(String(action)) | |
}) | |
onload(root, () => app((state, dispatcher) => { | |
return yo ` | |
<main> | |
${websocket(state, dispatcher)} | |
</main> | |
` | |
})) | |
d.body.appendChild(root) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment