Connection to the dropbox datastore api

-> this is the first attempt, improvements welcome :)

index.html

@@ -17,6 +17,7 @@
 	<link rel="shortcut icon" href="favicon.ico" />
 	<link rel="image_src" href="img/adr.png" />
 	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
+    <script src="https://www.dropbox.com/static/api/dropbox-datastores-1.1-latest.js" type="text/javascript"></script>
 	<script>
 		if(!window.jQuery) {
 			document.write('<script src="lib/jquery.min.js"><\/script>')
@@ -48,6 +49,7 @@
 	
 	<script src="script/Button.js"></script>
 	<script src="script/engine.js"></script>
+    <script src="script/dropbox.js"></script>
 	<script src="script/state_manager.js"></script>
 	<script src="script/header.js"></script>
 	<script src="script/notifications.js"></script>
@@ -85,13 +87,13 @@
 	<script src="script/localization.js"></script>
 	<!-- Google Analytics -->
 	<script>
-		(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+//		(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
-		(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+//		(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
-		m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+//		m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
-		})(window,document,'script','http://www.google-analytics.com/analytics.js','ga');
+//		})(window,document,'script','http://www.google-analytics.com/analytics.js','ga');
-		
+//
-		ga('create', 'UA-41314886-1', 'doublespeakgames.com');
+//		ga('create', 'UA-41314886-1', 'doublespeakgames.com');
-		ga('send', 'pageview');
+//		ga('send', 'pageview');
 	</script>
 	
 </head>

script/dropbox.js

@@ -0,0 +1,308 @@
+(function (Engine, Dropbox) {
+
+  if (!Engine) return false;  // Game Engine not available
+  if (!Dropbox) return false; // Dropbox Connector not available
+
+  var DropboxConnector = window.Engine.Dropbox = {
+
+    options: {
+      log: false,
+      key: 'YOUR_DROPBOX_APP_KEY',   // get one at https://www.dropbox.com/developers/apps
+      table: 'adarkroom'             //
+    },
+
+    client: false,
+    table: false,
+    dropboxAccount: false,
+    savegameKey: false,
+    savegames: {0: null, 1: null, 2: null, 3: null, 4: null},
+
+    init: function (options) {
+      this.options = $.extend(
+          this.options,
+          options
+      );
+
+      this._log = this.options.log;
+
+      this.client = new Dropbox.Client({key: DropboxConnector.options.key});
+      this.connectToDropbox(false);
+
+      return this;
+    },
+
+
+    startDropbox: function () {
+      if (!DropboxConnector.client || !DropboxConnector.table) {
+        DropboxConnector.startDropboxConnectEvent();
+      } else {
+        DropboxConnector.startDropboxImportEvent();
+      }
+    },
+
+    startDropboxConnectEvent: function () {
+      Events.startEvent({
+        title: _('Dropbox connection'),
+        scenes: {
+          start: {
+            text: [_('connect game to dropbox local storage')],
+            buttons: {
+              'connect': {
+                text: _('connect'),
+                nextScene: 'end',
+                onChoose: function () {
+                  DropboxConnector.connectToDropbox(DropboxConnector.startDropboxImportEvent)
+                }
+              },
+              'cancel': {
+                text: _('cancel'),
+                nextScene: 'end'
+              }
+            }
+          }
+        }
+      });
+    },
+
+    startDropboxImportEvent: function () {
+      Events.startEvent({
+        title: _('Dropbox Export / Import'),
+        scenes: {
+          start: {
+            text: [_('export or import save data to dropbox datastorage'),
+                  _('your are connected to dropbox with account / email ') + DropboxConnector.dropboxAccount],
+            buttons: {
+              'save': {
+                text: _('save'),
+                nextScene: {1: 'saveToSlot'}
+              },
+              'load': {
+                text: _('load'),
+                nextScene: {1: 'loadFromSlot'},
+                onChoose: DropboxConnector.loadGamesFromDropbox
+              },
+              'signout': {
+                text: _('signout'),
+                nextScene: 'end',
+                onChoose: DropboxConnector.signout
+              },
+              'cancel': {
+                text: _('cancel'),
+                nextScene: 'end'
+              }
+            }
+          },
+          saveToSlot: {
+            text: [_('choose one slot to save to')],
+            buttons: function () {
+              var buttons = {};
+
+              $.each(DropboxConnector.savegames, function (n, savegame) {
+                buttons['savegame' + n] = {
+                  text: _('save to slot') + n + ' ' + (savegame ? DropboxConnector.prepareSaveDate(savegame.get('timestamp')) : 'empty'),
+                  nextScene: 'end',
+                  onChoose: function () {
+                    DropboxConnector.log('Save to slot ' + n + ' initiated');
+                    // timeout prevents error due to fade out animation of the previous event
+                    window.setTimeout(function () {
+                      DropboxConnector.log('Save to slot ' + n);
+                      DropboxConnector.saveGameToDropbox(n, DropboxConnector.savedtoDropboxEvent)
+                    }, 1000);
+                  }
+                };
+              });
+
+              buttons['cancel'] = {
+                text: _('cancel'),
+                nextScene: 'end'
+              };
+
+              return buttons;
+            }()
+          },
+          loadFromSlot: {
+            text: [_('choose one slot to load from')],
+            buttons: function () {
+              var buttons = {};
+
+              $.each(DropboxConnector.savegames, function (n, savegame) {
+                if (savegame) {
+                  buttons['savegame' + n] = {
+                    text: _('load from slot') + n + ' ' + DropboxConnector.prepareSaveDate(savegame.get('timestamp')),
+                    nextScene: 'end',
+                    onChoose: function () {
+                      DropboxConnector.log('Load from slot ' + n + ' initiated');
+                      // timeout prevents error due to fade out animation of the previous event
+                      window.setTimeout(function () {
+                        DropboxConnector.log('Load from slot ' + n);
+                        DropboxConnector.loadGameFromDropbox(n)
+                      }, 1000);
+                    }
+                  };
+                }
+              });
+
+              buttons['cancel'] = {
+                text: _('cancel'),
+                nextScene: 'end'
+              };
+
+              return buttons;
+            }()
+          }
+        }
+      });
+    },
+
+    savedtoDropboxEvent: function (success) {
+      Events.startEvent({
+        title: _('Dropbox Export / Import'),
+        scenes: {
+          start: {
+            text: success ? [_('successfully saved to dropbox datastorage')] :
+                [_('error while saving to dropbox datastorage')],
+            buttons: {
+              'ok': {
+                text: _('ok'),
+                nextScene: 'end'
+              }
+            }
+          }
+        }
+      });
+    },
+
+    connectToDropbox: function (interactive, callback) {
+
+      DropboxConnector.log('start dropbox');
+
+      var client = this.client;
+
+      client.authenticate({interactive: interactive}, function (error) {
+        if (error) {
+          DropboxConnector.log('Dropbox Authentication error: ' + error);
+        }
+      });
+
+      if (client.isAuthenticated()) {
+
+        var datastoreManager = client.getDatastoreManager();
+        datastoreManager.openDefaultDatastore(function (error, datastore) {
+          if (error) {
+            DropboxConnector.log('Error opening default datastore: ' + error);
+          } else {
+            DropboxConnector.table = datastore.getTable(DropboxConnector.options.table);
+            DropboxConnector.loadGamesFromDropbox();
+
+            DropboxConnector.log(DropboxConnector.client.credentials());
+
+            DropboxConnector.client.getAccountInfo({}, function (error, info) {
+              if (!error) {
+                DropboxConnector.dropboxAccount = info.email;
+              }
+            });
+
+            DropboxConnector.log("Got savegames", DropboxConnector.savegames);
+
+            if (typeof callback == "function") {
+              callback.call(DropboxConnector.table);
+            }
+          }
+        });
+      } else {
+        DropboxConnector.log('Not connected to dropbox.');
+      }
+    },
+
+    loadGamesFromDropbox: function () {
+
+      var savegames = DropboxConnector.savegames;
+
+      $.each(savegames, function (n) {
+        var results = DropboxConnector.table.query({savegameId: DropboxConnector.prepareSavegameID(n)});
+        savegames[n] = results[0];
+      });
+
+      return savegames;
+    },
+
+    loadGameFromDropbox: function (slotnumber) {
+
+      var table = DropboxConnector.table;
+      var id = DropboxConnector.prepareSavegameID(slotnumber);
+
+      var results = table.query({savegameId: id});
+      var record = results[0];
+
+      if (record && record.get('gameState')) {
+        Engine.import64(record.get('gameState'));
+      }
+    },
+
+    saveGameToDropbox: function (slotnumber, callback) {
+
+      var table = DropboxConnector.table;
+      var record = null;
+      var success = false;
+      var id = DropboxConnector.prepareSavegameID(slotnumber);
+
+      var saveGame = {
+        gameState: Engine.generateExport64(),
+        timestamp: new Date().getTime()
+      };
+
+      if (DropboxConnector.savegames[slotnumber]) { // slot aleady user -> overwrite
+        record = DropboxConnector.savegames[slotnumber];
+        try {
+          record.update(saveGame);
+          DropboxConnector.log("Updated savegame ", slotnumber);
+          success = true;
+        } catch (e) {
+          success = false;
+        }
+
+      } else {
+        saveGame.savegameId = id;
+        try {
+          record = table.insert(saveGame);
+          DropboxConnector.log("Inserted savegame ", record.getId());
+          success = true;
+        } catch (e) {
+          success = false;
+        }
+      }
+      if (typeof callback == "function") {
+        callback(success);
+      }
+    },
+
+    prepareSavegameID: function (slotnumber) {
+      return 'adarkroom_savegame_' + slotnumber;
+    },
+
+    prepareSaveDate: function (timestamp) {
+      var date = new Date(timestamp);
+      return date.toLocaleDateString() + ' ' + date.toLocaleTimeString();
+    },
+
+    signout: function () {
+      DropboxConnector.client.signOut({}, function (error) {
+        if (error) {
+          alert('Error while logout from dropbox');
+        } else {
+          alert('Successfully signed out.');
+          DropboxConnector.client = null;
+          DropboxConnector.savegames = null;
+          DropboxConnector.dropboxAccount = null;
+        }
+      });
+    },
+
+    log: function () {
+      if (this._log) {
+        console.log(arguments);
+      }
+    }
+  }
+
+})(window.Engine, window.Dropbox);

script/engine.js

@@ -77,7 +77,8 @@
 		options: {
 			state: null,
 			debug: false,
-			log: false
+			log: false,
+      dropbox: true
 		},
 			
 		init: function(options) {
@@ -158,7 +159,15 @@
 				.click(function() { window.open('https://itunes.apple.com/us/app/a-dark-room/id736683061'); })
 				.appendTo(menu);
 
+      if(this.options.dropbox && Engine.Dropbox) {
+        this.dropbox = Engine.Dropbox.init();
 
+        $('<span>')
+            .addClass('menuBtn')
+            .text(_('dropbox.'))
+            .click(Engine.Dropbox.startDropbox)
+            .appendTo(menu);
+      }
 			
 			// Register keypress handlers
 			$('body').off('keydown').keydown(Engine.keyDown);
@@ -290,12 +299,18 @@
 		});
 	  },
 
+    generateExport64: function(){
+      var string64 = Base64.encode(localStorage.gameState);
+      string64 = string64.replace(/\s/g, '');
+      string64 = string64.replace(/\./g, '');
+      string64 = string64.replace(/\n/g, '');
+
+      return string64;
+    },
+	  
 	  export64: function() {
 	    Engine.saveGame();
-	    var string64 = Base64.encode(localStorage.gameState);
+	    var string64 = Engine.generateExport64();
-	    string64 = string64.replace(/\s/g, '');
-	    string64 = string64.replace(/\./g, '');
-	    string64 = string64.replace(/\n/g, '');
 	    Engine.enableSelection();
 	    Events.startEvent({
 	    	title: _('Export'),