feat: move to node v16 and adding a pan tool

helpers/importer.js

@@ -8,7 +8,8 @@ const path = require('path')
 const db = require('../models/db')
 const Sequelize = require('sequelize')
 const Op = Sequelize.Op
-const uuidv4 = require('uuid/v4')
+const { v4: uuidv4 } = require('uuid');
+
 
 require('../models/db')
 

locales/en.js

@@ -199,6 +199,7 @@
 	"tool_scribble": "Scribble",
 	"tool_line": "Line",
 	"tool_arrow": "Arrow",
+	"tool_pan": "Pan",
 	"search_media_placeholder": "Search web media…",
 	"add_zone": "New Zone",
 	"palette": "Palette",
@@ -329,4 +330,4 @@
 	"tool_space_help_part_one": "Use the toolbar to add content.",
 	"tool_space_help_part_two": "You can also drop images or sound and video files.",
 	"tool_delete_space": "Really delete \"%s\"?"
-}
+}

package.json

@@ -11,47 +11,47 @@
     "node": ">=10.0.0"
   },
   "dependencies": {
-    "archiver": "1.3.0",
-    "async": "2.3.0",
+    "archiver": "5.3.1",
+    "async": "3.2.4",
     "bcryptjs": "2.4.3",
     "body-parser": "^1.19.0",
-    "cheerio": "0.22.0",
-    "config": "1.25.1",
+    "cheerio": "1.0.0-rc.12",
+    "config": "3.3.9",
     "cookie-parser": "~1.4.3",
-    "ejs": "3.1.5",
+    "ejs": "3.1.9",
     "execSync": "latest",
     "express": "^4.16.4",
-    "file-type": "^7.6.0",
-    "glob": "7.1.1",
+    "file-type": "^16.5.0",
+    "glob": "10.3.3",
     "gm": "^1.23.1",
-    "helmet": "^3.5.0",
-    "i18n-2": "0.6.3",
+    "helmet": "^7.0.0",
+    "i18n-2": "0.7.3",
     "log-timestamp": "latest",
     "mock-aws-s3": "^4.0.2",
     "moment": "^2.19.3",
     "morgan": "^1.9.1",
     "nodemailer": "^6.6.0",
-    "puppeteer": "8.0.0",
-    "read-chunk": "^2.1.0",
+    "puppeteer": "^18",
+    "read-chunk": "^3",
     "request": "^2.88.0",
     "sanitize-html": "^2.3.3",
-    "sequelize": "^4.37.6",
-    "serve-favicon": "~2.4.2",
+    "sequelize": "^4",
+    "serve-favicon": "~2.5.0",
     "serve-static": "^1.13.1",
-    "slug": "^1.1.0",
-    "sqlite3": "^4.2.0",
-    "umzug": "^2.1.0",
+    "slug": "^8.2.2",
+    "sqlite3": "5.*",
+    "umzug": "^2",
     "underscore": "^1.13.1",
-    "uuid": "^3.2.1",
-    "validator": "7.0.0",
-    "ws": "5.2.3"
+    "uuid": "^9.0.0",
+    "validator": "13.9.0",
+    "ws": "8.13.0"
   },
   "devDependencies": {
     "gulp": "^4.0.2",
     "gulp-clean-css": "^4.3.0",
     "gulp-concat": "^2.6.1",
-    "gulp-sass": "^4.0.2",
-    "nodemon": "^2.0.6"
+    "gulp-sass": "^5",
+    "nodemon": "^3.0.1"
   },
   "main": "app.js",
   "description": "",

public/javascripts/spacedeck_sections.js

@@ -2562,6 +2562,17 @@ var SpacedeckSections = {
       this.opened_dialog = "none";
     },
 
+    start_pan: function(evt) {
+      this.deselect();
+      if (this.active_tool == "pan") {
+        this.active_tool = "pointer";
+      } else {
+        this.active_tool = "pan";
+      }
+      this.opened_dialog = "none";
+
+    },
+
     start_drawing_scribble: function(evt) {
       this.deselect();
       if (this.active_tool == "scribble") {

public/javascripts/spacedeck_whiteboard.js

@@ -733,7 +733,7 @@ function setup_whiteboard_directives() {
         return;
       }
 
-      if (_.include(["zoom", "scribble"], $scope.active_tool)) {
+      if (_.include(["zoom", "scribble", "pan"], $scope.active_tool)) {
         // tools that stay active after use
         this.mouse_state = "idle";
         $scope.mouse_state = this.mouse_state;

routes/api/memberships.js

@@ -14,7 +14,7 @@ var router = express.Router();
 const db = require('../../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 router.get('/:membership_id/accept', function(req, res, next) {
   if (req.user) {

routes/api/space_artifacts.js

@@ -6,7 +6,7 @@ const os = require('os');
 const db = require('../../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 var payloadConverter = require('../../helpers/artifact_converter');
 var redis = require('../../helpers/redis');

routes/api/space_memberships.js

@@ -3,7 +3,7 @@ var config = require('config');
 const db = require('../../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 var redis = require('../../helpers/redis');
 var mailer = require('../../helpers/mailer');

routes/api/space_messages.js

@@ -3,7 +3,7 @@ var config = require('config');
 const db = require('../../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 var redis = require('../../helpers/redis');
 var mailer = require('../../helpers/mailer');

routes/api/spaces.js

@@ -4,7 +4,7 @@ const os = require('os');
 const db = require('../../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 var redis = require('../../helpers/redis');
 var mailer = require('../../helpers/mailer');

routes/api/users.js

@@ -2,7 +2,8 @@
 
 var config = require('config');
 const db = require('../../models/db');
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
+
 const os = require('os');
 
 var mailer = require('../../helpers/mailer');

routes/root.js

@@ -12,7 +12,7 @@ const _ = require('underscore');
 const db = require('../models/db');
 const Sequelize = require('sequelize');
 const Op = Sequelize.Op;
-const uuidv4 = require('uuid/v4');
+const { v4: uuidv4 } = require('uuid');
 
 router.get('/', (req, res) => {
   res.render('index', { config:config, user:req.user });

views/partials/tool/toolbar-elements.html

@@ -18,6 +18,11 @@
 
     <button class="btn btn-divider"></button>
 
+    <button class="btn btn-icon-labeled btn-transparent" v-on:click="start_pan()" v-bind:class="{active:active_tool=='pan'}" title="<%=__("tool_pan")%>">
+      <span class="icon icon-move"></span>
+      <span class="icon-label"><%=__("tool_pan")%></span>
+    </button>
+
     <div class="dropdown top left light" v-bind:class="{open:opened_dialog=='shapes'}">
       <div class="btn-collapse in" title="<%=__("tool_shape")%>">
         <button class="btn btn-transparent btn-icon-labeled" v-bind:class="{open:opened_dialog=='shapes'}" v-on:click="open_dialog('shapes')">