@processmaker/modeler 1.43.5 → 1.43.6

package/dist/modeler.umd.js

@@ -13194,7 +13194,7 @@ ___CSS_LOADER_EXPORT___.push([module.id, ".crown-multiselect[data-v-bcd827ec]{to
 
 /***/ }),
 
-/***/ 71707:
+/***/ 37091:
 /***/ (function(module, __webpack_exports__, __webpack_require__) {
 
 "use strict";
@@ -13208,7 +13208,7 @@ __webpack_require__.r(__webpack_exports__);
 
 var ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));
 // Module
-___CSS_LOADER_EXPORT___.push([module.id, ".remote-cursor[data-v-4cd50df8]{position:absolute;width:auto;height:34px;z-index:2}.remote-cursor[data-v-4cd50df8],.remote-username[data-v-4cd50df8]{display:-webkit-box;display:-ms-flexbox;display:flex}.remote-username[data-v-4cd50df8]{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:12px;padding:4px 10px;gap:10px;border-radius:4px;background-color:#212529;color:#fff;font-size:12px;font-style:normal;font-weight:400;line-height:normal}", ""]);
+___CSS_LOADER_EXPORT___.push([module.id, ".remote-cursor[data-v-77208d93]{width:auto;height:34px;z-index:2}.remote-cursor[data-v-77208d93],.remote-username[data-v-77208d93]{position:absolute;display:-webkit-box;display:-ms-flexbox;display:flex}.remote-username[data-v-77208d93]{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin:17px 0 0 17px;padding:4px 10px;gap:10px;border-radius:4px;background-color:#212529;color:#fff;font-size:12px;font-style:normal;font-weight:400;line-height:normal;min-width:100px}", ""]);
 // Exports
 /* harmony default export */ __webpack_exports__["default"] = (___CSS_LOADER_EXPORT___);
 
@@ -26865,19 +26865,19 @@ var update = add("8c02cc8c", content, true, {"sourceMap":false,"shadowMode":fals
 
 /***/ }),
 
-/***/ 57896:
+/***/ 33806:
 /***/ (function(module, __unused_webpack_exports, __webpack_require__) {
 
 // style-loader: Adds some css to the DOM by adding a <style> tag
 
 // load the styles
-var content = __webpack_require__(71707);
+var content = __webpack_require__(37091);
 if(content.__esModule) content = content.default;
 if(typeof content === 'string') content = [[module.id, content, '']];
 if(content.locals) module.exports = content.locals;
 // add the styles to the DOM
 var add = (__webpack_require__(54402)/* ["default"] */ .Z)
-var update = add("697c93cd", content, true, {"sourceMap":false,"shadowMode":false});
+var update = add("86e9eea2", content, true, {"sourceMap":false,"shadowMode":false});
 
 /***/ }),
 
@@ -48352,10 +48352,10 @@ var ValidationStatus_component = normalizeComponent(
 )
 
 /* harmony default export */ var ValidationStatus = (ValidationStatus_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Modeler.vue?vue&type=template&id=6a9d9f5c&
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/modeler/Modeler.vue?vue&type=template&id=27bb3680&
 
 
-var Modelervue_type_template_id_6a9d9f5c_render = function render() {
+var Modelervue_type_template_id_27bb3680_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('span', {
@@ -48630,14 +48630,14 @@ var Modelervue_type_template_id_6a9d9f5c_render = function render() {
     return _c('RemoteCursor', {
       key: player.id,
       attrs: {
-        "data": player
+        "data": _vm.prepareCursorData(player)
       }
     });
   })], 2)], 1);
 };
-var Modelervue_type_template_id_6a9d9f5c_staticRenderFns = [];
+var Modelervue_type_template_id_27bb3680_staticRenderFns = [];
 
-;// CONCATENATED MODULE: ./src/components/modeler/Modeler.vue?vue&type=template&id=6a9d9f5c&
+;// CONCATENATED MODULE: ./src/components/modeler/Modeler.vue?vue&type=template&id=27bb3680&
 
 ;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/nodes/boundaryEvent/boundaryEvent.vue?vue&type=template&id=728530a2&
 var boundaryEventvue_type_template_id_728530a2_render = function render() {
@@ -58455,9 +58455,9 @@ var Selection_component = normalizeComponent(
 )
 
 /* harmony default export */ var Selection = (Selection_component.exports);
-;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=template&id=4cd50df8&scoped=true&
+;// CONCATENATED MODULE: ./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/templateLoader.js??ruleSet[1].rules[3]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=template&id=77208d93&scoped=true&
 
-var RemoteCursorvue_type_template_id_4cd50df8_scoped_true_render = function render() {
+var RemoteCursorvue_type_template_id_77208d93_scoped_true_render = function render() {
   var _vm = this,
     _c = _vm._self._c;
   return _c('div', {
@@ -58483,9 +58483,9 @@ var RemoteCursorvue_type_template_id_4cd50df8_scoped_true_render = function rend
     staticClass: "remote-username"
   }, [_vm._v(" " + _vm._s(_vm.data.name) + " ")])]);
 };
-var RemoteCursorvue_type_template_id_4cd50df8_scoped_true_staticRenderFns = [];
+var RemoteCursorvue_type_template_id_77208d93_scoped_true_staticRenderFns = [];
 
-;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=template&id=4cd50df8&scoped=true&
+;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=template&id=77208d93&scoped=true&
 
 ;// CONCATENATED MODULE: ./node_modules/thread-loader/dist/cjs.js!./node_modules/babel-loader/lib/index.js??clonedRuleSet-83.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=script&lang=js&
 /* harmony default export */ var RemoteCursorvue_type_script_lang_js_ = ({
@@ -58507,9 +58507,9 @@ var RemoteCursorvue_type_template_id_4cd50df8_scoped_true_staticRenderFns = [];
 });
 ;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=script&lang=js&
  /* harmony default export */ var remoteCursor_RemoteCursorvue_type_script_lang_js_ = (RemoteCursorvue_type_script_lang_js_); 
-// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-65.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-65.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[2]!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-65.use[4]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=style&index=0&id=4cd50df8&prod&scoped=true&lang=scss&
-var RemoteCursorvue_type_style_index_0_id_4cd50df8_prod_scoped_true_lang_scss_ = __webpack_require__(57896);
-;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=style&index=0&id=4cd50df8&prod&scoped=true&lang=scss&
+// EXTERNAL MODULE: ./node_modules/vue-style-loader/index.js??clonedRuleSet-65.use[0]!./node_modules/css-loader/dist/cjs.js??clonedRuleSet-65.use[1]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/loaders/stylePostLoader.js!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[2]!./node_modules/@vue/cli-service/node_modules/postcss-loader/dist/cjs.js??clonedRuleSet-65.use[3]!./node_modules/sass-loader/dist/cjs.js??clonedRuleSet-65.use[4]!./node_modules/@vue/cli-service/node_modules/@vue/vue-loader-v15/lib/index.js??vue-loader-options!./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=style&index=0&id=77208d93&prod&scoped=true&lang=scss&
+var RemoteCursorvue_type_style_index_0_id_77208d93_prod_scoped_true_lang_scss_ = __webpack_require__(33806);
+;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue?vue&type=style&index=0&id=77208d93&prod&scoped=true&lang=scss&
 
 ;// CONCATENATED MODULE: ./src/components/multiplayer/remoteCursor/RemoteCursor.vue
 
@@ -58522,11 +58522,11 @@ var RemoteCursorvue_type_style_index_0_id_4cd50df8_prod_scoped_true_lang_scss_ =
 
 var RemoteCursor_component = normalizeComponent(
   remoteCursor_RemoteCursorvue_type_script_lang_js_,
-  RemoteCursorvue_type_template_id_4cd50df8_scoped_true_render,
-  RemoteCursorvue_type_template_id_4cd50df8_scoped_true_staticRenderFns,
+  RemoteCursorvue_type_template_id_77208d93_scoped_true_render,
+  RemoteCursorvue_type_template_id_77208d93_scoped_true_staticRenderFns,
   false,
   null,
-  "4cd50df8",
+  "77208d93",
   null
   
 )
@@ -77317,8 +77317,12 @@ var Multiplayer = /*#__PURE__*/function () {
           clientAvatar: (_window$ProcessMaker$3 = window.ProcessMaker.user) === null || _window$ProcessMaker$3 === void 0 ? void 0 : _window$ProcessMaker$3.avatar,
           clientColor: ((_window$ProcessMaker$4 = window.ProcessMaker.user) === null || _window$ProcessMaker$4 === void 0 ? void 0 : _window$ProcessMaker$4.color) || _this.colorUtil.randomColor((_window$ProcessMaker$5 = window.ProcessMaker.user) === null || _window$ProcessMaker$5 === void 0 ? void 0 : _window$ProcessMaker$5.fullName),
           clientCursor: {
-            top: 300,
-            left: 300
+            coordinates: {
+              clientX: 300,
+              clientY: 300
+            },
+            paperTranslate: _this.modeler.paper.translate(),
+            paperScale: _this.modeler.paper.scale()
           }
         });
       });
@@ -80246,10 +80250,22 @@ var Multiplayer = /*#__PURE__*/function () {
     pointerMoveHandler: function pointerMoveHandler(event) {
       var x = event.clientX,
         y = event.clientY;
-      window.ProcessMaker.EventBus.$emit('multiplayer-updateMousePosition', {
-        top: y,
-        left: x
+      var paper = this.paperManager.paper;
+      var updateMousePosition = external_lodash_default().debounce(function () {
+        window.ProcessMaker.EventBus.$emit('multiplayer-updateMousePosition', {
+          coordinates: {
+            clientX: x,
+            clientY: y
+          },
+          paperTranslate: paper.translate(),
+          // add papper translate
+          paperScale: paper.scale() // add scale
+        });
+      }, 3000000, {
+        leading: true,
+        trailing: true
       });
+      updateMousePosition();
       if (store.getters.isReadOnly) {
         if (this.canvasDragPosition && !this.clientLeftPaper) {
           this.paperManager.translate(event.offsetX - this.canvasDragPosition.x, event.offsetY - this.canvasDragPosition.y);
@@ -80318,6 +80334,29 @@ var Multiplayer = /*#__PURE__*/function () {
         });
       }
     },
+    /**
+     * Prepare cursor data taking into account, paper translate and paper scale
+     * @param {Object} player
+     * @return {Object}
+     */
+    prepareCursorData: function prepareCursorData(player) {
+      var paper = this.paperManager.paper;
+      var localTranslate = paper.translate();
+      // calculate paper translated deltas
+      var deltaX = localTranslate.tx - player.cursor.paperTranslate.tx / player.cursor.paperScale.sx;
+      var deltaY = localTranslate.ty - player.cursor.paperTranslate.ty / player.cursor.paperScale.sy;
+      // get new cursor coordinates taking into consideration paper scale and paper translated
+      var left = player.cursor.coordinates.clientX / player.cursor.paperScale.sx + deltaX;
+      var top = player.cursor.coordinates.clientY / player.cursor.paperScale.sy + deltaY;
+      return {
+        cursor: {
+          left: left,
+          top: top
+        },
+        color: player.color,
+        name: player.name
+      };
+    },
     /**
      * Unhightligt selected Nodes
      * @param {String} clientId 
@@ -80799,8 +80838,8 @@ var modelervue_type_style_index_0_prod_lang_scss_ = __webpack_require__(26695);
 
 var Modeler_component = normalizeComponent(
   modeler_Modelervue_type_script_lang_js_,
-  Modelervue_type_template_id_6a9d9f5c_render,
-  Modelervue_type_template_id_6a9d9f5c_staticRenderFns,
+  Modelervue_type_template_id_27bb3680_render,
+  Modelervue_type_template_id_27bb3680_staticRenderFns,
   false,
   null,
   null,