Merge pull request #32 from ajtack/update-to-sync-0.7
Update to Sync SDK v0.7
This commit is contained in:
@@ -44,7 +44,7 @@
|
|||||||
</section>
|
</section>
|
||||||
|
|
||||||
|
|
||||||
<script src="//media.twiliocdn.com/sdk/js/sync/v0.5/twilio-sync.min.js"></script>
|
<script src="//media.twiliocdn.com/sdk/js/sync/v0.7/twilio-sync.min.js"></script>
|
||||||
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
|
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
|
||||||
<script src="index.js"></script>
|
<script src="index.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|||||||
@@ -8,10 +8,6 @@ $(function () {
|
|||||||
//Our interface to the Sync service
|
//Our interface to the Sync service
|
||||||
var syncClient;
|
var syncClient;
|
||||||
|
|
||||||
//We're going to use a single Sync document, our simplest
|
|
||||||
//synchronisation primitive, for this demo
|
|
||||||
var syncDoc;
|
|
||||||
|
|
||||||
//Get an access token for the current user, passing a device ID
|
//Get an access token for the current user, passing a device ID
|
||||||
//In browser-based apps, every tab is like its own unique device
|
//In browser-based apps, every tab is like its own unique device
|
||||||
//synchronizing state -- so we'll use a random UUID to identify
|
//synchronizing state -- so we'll use a random UUID to identify
|
||||||
@@ -28,37 +24,34 @@ $(function () {
|
|||||||
|
|
||||||
//This code will create and/or open a Sync document
|
//This code will create and/or open a Sync document
|
||||||
//Note the use of promises
|
//Note the use of promises
|
||||||
syncClient.document('SyncGame').then(function(doc) {
|
syncClient.document('SyncGame').then(function(syncDoc) {
|
||||||
//Lets store it in our global variable
|
|
||||||
syncDoc = doc;
|
|
||||||
|
|
||||||
//Initialize game board UI to current state (if it exists)
|
//Initialize game board UI to current state (if it exists)
|
||||||
var data = syncDoc.get();
|
var data = syncDoc.value;
|
||||||
if (data.board) {
|
if (data.board) {
|
||||||
updateUserInterface(data);
|
updateUserInterface(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
//Let's subscribe to changes on this document, so when something
|
//Let's subscribe to changes on this document, so when something
|
||||||
//changes on this document, we can trigger our UI to update
|
//changes on this document, we can trigger our UI to update
|
||||||
syncDoc.on('updated', updateUserInterface);
|
syncDoc.on('updated', function(event) {
|
||||||
|
console.debug("Board was updated", event.isLocal? "locally." : "by the other guy.");
|
||||||
|
updateUserInterface(event.value);
|
||||||
});
|
});
|
||||||
|
|
||||||
});
|
//Whenever a board button is clicked, update that document.
|
||||||
|
|
||||||
//Whenever a board button is clicked:
|
|
||||||
$buttons.on('click', function (e) {
|
$buttons.on('click', function (e) {
|
||||||
//Toggle the value: X, O, or empty
|
//Toggle the value: X, O, or empty
|
||||||
toggleCellValue($(e.target));
|
toggleCellValue($(e.target));
|
||||||
|
|
||||||
//Update the document
|
|
||||||
var data = readGameBoardFromUserInterface();
|
|
||||||
|
|
||||||
//Send updated document to Sync
|
//Send updated document to Sync
|
||||||
//This should trigger "updated" events on other clients
|
//This should trigger "updated" events on other clients
|
||||||
|
var data = readGameBoardFromUserInterface();
|
||||||
syncDoc.set(data);
|
syncDoc.set(data);
|
||||||
|
|
||||||
});
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
//Toggle the value: X, O, or empty ( for UI)
|
//Toggle the value: X, O, or empty ( for UI)
|
||||||
function toggleCellValue($cell) {
|
function toggleCellValue($cell) {
|
||||||
|
|||||||
Reference in New Issue
Block a user