Update endgame to the newest firebase sdk.

README.md

@@ -5,7 +5,7 @@
      \___|_| |_|\__,_|\__, |\__,_|_| |_| |_|\___|
                       |___/
 
-A WebRTC-enabled 3D chess game. [endgame-chess.firebaseapp.com](https://endgame-chess.firebaseapp.com/)
+A WebRTC-enabled 3D chess game. [endgame-chess.web.app](https://endgame-chess.web.app/)
 
 ## Intro
 
@@ -21,7 +21,7 @@ learn about
 
 ## Development
 
-Get the code and install the Node packages.
+Get the code and install the Node packages. See package.json for the version of node required.
 
     git clone https://github.com/voithos/endgame.git
     cd endgame
@@ -41,7 +41,7 @@ isolate, concatenate, and minify endgame's source.
 
 endgame was made to be hosted on Firebase. See their docs for directions on how
 to set up Firebase hosting and DB. To use a custom Firebase DB, modify the
-`DB_BASE_URL` constant in `src/config.js`.
+`FIREBASE_CONFIG` constant in `src/config.js`.
 
 After configuring Firebase, simply run `gulp dist` to generate the
 distributable and then `firebase deploy` to deploy to hosting.

TODO.md

@@ -3,17 +3,17 @@
 ## Code
 - switch to Material lite
 - upgrade code to ES2015
-- upgrade to new Firebase sdk
 
 ## Game
 - animate tiles glow-in/out
 - look into adding background music (akin to Gratia Mundi)
 - improve move sound
 - add ability to disable sound
+- add support for touch gestures instead of tap and hold
+! persist state to server to allow re-connecting to games
 ? change board and pieces models
 ? add computer mode
 ? keep history of moves, perhaps display it somehow
-? persist state to server to allow re-connecting to games
 
 ## Bugs
 ! for browsers that don't support WebRTC (safari), have better error message

gulpfile.js

@@ -53,20 +53,12 @@ var WATCHIFY_CONFIG = {
     plugin: [watchify]
 };
 
-var BABELIFY_CONFIG = {
-    presets: ['es2015']
-};
+var BABELIFY_CONFIG = {presets: ['es2015']};
 
 var ESLINT_CONFIG = {
     extends: 'eslint:recommended',
-    parserOptions: {
-        ecmaVersion: 6,
-        sourceType: 'module'
-    },
-    env: {
-        browser: true,
-        es6: true
-    },
+    parserOptions: {ecmaVersion: 6, sourceType: 'module'},
+    env: {browser: true, es6: true},
     rules: {
         'no-var': 1,
         'no-unused-vars': ['error', {'argsIgnorePattern': '^unused'}]
@@ -87,13 +79,9 @@ var ESLINT_CONFIG = {
 
 var SRC_CONFIG = {
     misc: ['public/index.html', 'public/favicon.ico'],
-    css: [
-        'public/css/vendor/toastr.css',
-        'public/css/endgame.css'
-    ],
+    css: ['public/css/vendor/toastr.css', 'public/css/endgame.css'],
     js: [
         'public/js/vendor/mobile-detect.js',
-        'public/js/vendor/firebase.js',
         'public/js/vendor/vue.js',
         'public/js/vendor/jquery.js',
         'public/js/vendor/bootstrap.js',
@@ -133,10 +121,9 @@ var onError = function(e) {
     if (e && e.codeFrame) {
         // Babel error.
         gutil.log(
-                gutil.colors.red(e.filename) + ':' +
-                gutil.colors.cyan(e.loc.line + ',' + e.loc.column) + '\n' +
-                e.message + '\n' +
-                e.codeFrame);
+            gutil.colors.red(e.filename) + ':' +
+            gutil.colors.cyan(e.loc.line + ',' + e.loc.column) + '\n' +
+            e.message + '\n' + e.codeFrame);
     } else {
         gutil.log(gutil.colors.red(e));
     }
@@ -153,10 +140,11 @@ var bundler;
  */
 var getBundler = function(entries, opt_isWatcher) {
     if (!bundler) {
-        bundler = browserify(opt_isWatcher ?
-                extend({}, WATCHIFY_CONFIG, { entries: entries }) :
-                entries)
-            .transform(babelify, BABELIFY_CONFIG);
+        bundler = browserify(
+                      opt_isWatcher ?
+                          extend({}, WATCHIFY_CONFIG, {entries: entries}) :
+                          entries)
+                      .transform(babelify, BABELIFY_CONFIG);
     }
     return bundler;
 };
@@ -178,7 +166,7 @@ var build = function() {
         .pipe(sourcemaps.init())
         .pipe(gulp.dest(BUILD_PATH))
         .pipe(rename(VIRT_MIN_FILE))
-        .pipe(sourcemaps.init({ loadMaps: true }))
+        .pipe(sourcemaps.init({loadMaps: true}))
         .pipe(uglify())
         // Passing a relative path here forces the source maps to be
         // written externally.
@@ -192,11 +180,7 @@ var build = function() {
  * configured bundler.
  */
 var watch = function() {
-    browserSync.init({
-        server: {
-            baseDir: BASE_DIR
-        }
-    });
+    browserSync.init({server: {baseDir: BASE_DIR}});
 
     var bundler = getBundler([ENTRY_FILE], /* isWatcher */ true);
     bundler.on('update', function() {
@@ -223,8 +207,7 @@ var buildTests = function() {
  * Run built tests with jasmine.
  */
 var test = function() {
-    return gulp.src(path.join(TEST_DIR, VIRT_TEST_FILE))
-        .pipe(jasmine());
+    return gulp.src(path.join(TEST_DIR, VIRT_TEST_FILE)).pipe(jasmine());
 };
 
 
@@ -265,8 +248,7 @@ var distData = function() {
  * Minify and relocate misc files.
  */
 var distMisc = function() {
-    return gulp.src(SRC_CONFIG.misc)
-        .pipe(gulp.dest(DIST_DIR));
+    return gulp.src(SRC_CONFIG.misc).pipe(gulp.dest(DIST_DIR));
 };
 
 
@@ -296,7 +278,8 @@ var distCss = function() {
  * Add revision IDs.
  */
 var distRev = function() {
-    var sources = [path.join(DIST_DIR, '**/*.css'), path.join(DIST_DIR, '**/*.js')];
+    var sources =
+        [path.join(DIST_DIR, '**/*.css'), path.join(DIST_DIR, '**/*.js')];
     return gulp.src(sources, {base: DIST_DIR})
         .pipe(rev())
         .pipe(revdel())
@@ -308,11 +291,10 @@ var distRev = function() {
  * Rename the revision IDs in the html.
  */
 var distRename = function() {
-    var sources = [path.join(DIST_DIR, '**/*.css'), path.join(DIST_DIR, '**/*.js')];
+    var sources =
+        [path.join(DIST_DIR, '**/*.css'), path.join(DIST_DIR, '**/*.js')];
     return gulp.src(path.join(DIST_DIR, VIRT_HTML))
-        .pipe(inject(
-            gulp.src(sources, {read: false}),
-            {relative: true}))
+        .pipe(inject(gulp.src(sources, {read: false}), {relative: true}))
         .pipe(gulp.dest(DIST_DIR));
 };
 
@@ -321,20 +303,15 @@ var distRename = function() {
  * Clean dist directory.
  */
 var distClean = function() {
-    return gulp.src(DIST_DIR, {read: false})
-        .pipe(clean());
+    return gulp.src(DIST_DIR, {read: false}).pipe(clean());
 };
 
 
 /**
  * Starts a local server for the minified sources.
  */
 var distServe = function() {
-    browserSync.init({
-        server: {
-            baseDir: DIST_DIR
-        }
-    });
+    browserSync.init({server: {baseDir: DIST_DIR}});
 };
 
 

package.json

@@ -3,6 +3,9 @@
   "version": "0.0.1",
   "description": "A WebRTC-enabled 3D chess game",
   "main": "./src/endgame.js",
+  "engines": {
+      "node": "6.10.3"
+  },
   "dependencies": {
     "promise": "~6.1.0",
     "lodash": "~2.4.1"
@@ -41,6 +44,6 @@
     "type": "git",
     "url": "https://github.com/voithos/endgame.git"
   },
-  "author": "Zaven Muradyan <zaven@skepsi.me>",
+  "author": "Zaven Muradyan <zaven@voithos.io>",
   "license": "MIT"
 }

public/index.html

@@ -9,9 +9,14 @@
         <link rel="stylesheet" href="css/endgame.css">
         <!-- endinject -->
 
+
+        <!-- firebase cdn deps -->
+        <script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-app.js"></script>
+        <script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-database.js"></script>
+        <script src="https://www.gstatic.com/firebasejs/7.13.2/firebase-auth.js"></script>
+
         <!-- inject:js -->
         <script src="js/vendor/mobile-detect.js"></script>
-        <script src="js/vendor/firebase.js"></script>
         <script src="js/vendor/vue.js"></script>
         <script src="js/vendor/jquery.js"></script>
         <script src="js/vendor/bootstrap.js"></script>