Synchronize AngularJS scope between clients
synchroscope makes it very easy in to share Angular.js scope variables across multiple clients. It can be used to make a real-time interactive web application that runs on multiple devices.
Symlink or copy
client/sync.js to your Angular project, and include it along with
If you include CryptoJS.MD5 on your page, synchroscope will generate revision IDs based on the cryptographic hash of the content instead of random string, which may help prevent editing conflicts a little bit.
<!-- recommended -->
Then, declare a dependency on
ask for the
$ync service, and just call it:
angularmodule'myApp' 'synchroscope'controller'MyController'$scopehello = 'initial data'$scopeworld = 'for synchroscope demo'$scopefoo = 'TRY IT!'var keys = 'hello' 'world' // keys that you want to sharevar room = 'test' // room namevar sync = $ync$scope keys room
As soon as you call
$ync, the keys
world will be
synchronized across all browser clients who are in the same server and same room.
When the initial synchronization is made, the
$scope.$ynchronized property will become true.
You can check that property to display loading screen or something.
The third argument for the $ync function can be in form of:
Let's assume that
io is a Socket.IO server object obtained by something like this:
var io = require('socket.io').listen(server). Just add this line to your server:
JSON.stringifyable (with the exception of undefined, which is handled specially).
node --eval 'require("synchroscope").listen(require("socket.io").listen(8008).of("/synchroscope"))'.