27070
27070
27071
27071
var _error2 = _interopRequireDefault(_error);
27072
27072
27073
- var _panZoom = __webpack_require__(251 );
27073
+ var _panZoom = __webpack_require__(239 );
27074
27074
27075
27075
var _panZoom2 = _interopRequireDefault(_panZoom);
27076
27076
@@ -27955,7 +27955,150 @@
27955
27955
exports.default = Error;
27956
27956
27957
27957
/***/ },
27958
- /* 239 */,
27958
+ /* 239 */
27959
+ /***/ function(module, exports) {
27960
+
27961
+ 'use strict';
27962
+
27963
+ Object.defineProperty(exports, "__esModule", {
27964
+ value: true
27965
+ });
27966
+
27967
+ exports.default = function () {
27968
+ "use strict";
27969
+
27970
+ var panZoom = document.getElementById('panZoomContainer'),
27971
+ canvas = document.getElementById('jsplumbContainer');
27972
+ console.log(panZoom.offsetLeft);
27973
+ if (!canvas) {
27974
+ return;
27975
+ }
27976
+
27977
+ var params = { x: getQueryVariable('x'), y: getQueryVariable('y'), zoom: getQueryVariable('zoom') };
27978
+
27979
+ var current = {};
27980
+ current.x = params.x ? parseFloat(params.x) : $(canvas).data('x');
27981
+ current.y = params.y ? parseFloat(params.y) : $(canvas).data('y');
27982
+ current.zoom = params.zoom ? parseFloat(params.zoom) : $(canvas).data('zoom');
27983
+
27984
+ canvas.x = 0;canvas.y = 0;canvas.scale = 1;
27985
+ canvas.updateContainerPosition = function () {
27986
+ canvas.style.left = canvas.x + 'px';canvas.style.top = canvas.y + 'px';
27987
+ };
27988
+ canvas.updateContainerScale = function () {
27989
+ canvas.style.transform = 'scale(' + canvas.scale + ')';
27990
+ };
27991
+
27992
+ canvas.updateContainerPosition();
27993
+ canvas.updateContainerScale();
27994
+
27995
+ function updateTextPosition(e) {
27996
+ e.style.left = $(e).data("x") / current.zoom + 'px';
27997
+ e.style.top = $(e).data("y") / current.zoom + 'px';
27998
+ }
27999
+
28000
+ function newText(x, y, size, text) {
28001
+ var tb = document.createElement('div');
28002
+ tb.className = "text";
28003
+ tb.contentEditable = true;
28004
+ tb.innerHTML = text;
28005
+ $(tb).data("x", x).data("y", y).data("size", size);
28006
+ updateTextPosition(tb);
28007
+ canvas.appendChild(tb);
28008
+ return tb;
28009
+ }
28010
+
28011
+ var dragging = false,
28012
+ state = { click: false, pan: false },
28013
+ previousMousePosition;
28014
+
28015
+ panZoom.onmousedown = function (e) {
28016
+ console.log('mouse down');
28017
+ e.preventDefault();
28018
+ dragging = true;
28019
+ state.click = true;
28020
+ previousMousePosition = { x: e.pageX, y: e.pageY };
28021
+ };
28022
+
28023
+ window.onmouseup = function () {
28024
+ //panZoom.onmouseup = function() {
28025
+ console.log('mouse up');
28026
+ dragging = false;
28027
+ };
28028
+
28029
+ panZoom.ondragstart = function (e) {
28030
+ console.log('on drag start');
28031
+ e.preventDefault();
28032
+ };
28033
+
28034
+ panZoom.onmousemove = function (e) {
28035
+ console.log('on mouse move');
28036
+ if (state.click) {
28037
+ state.pan = true;
28038
+ }
28039
+ if (dragging && !e.shiftKey) {
28040
+ canvas.style.transitionDuration = "0s";
28041
+ canvas.x += e.pageX - previousMousePosition.x;
28042
+ canvas.y += e.pageY - previousMousePosition.y;
28043
+ canvas.updateContainerPosition();
28044
+ previousMousePosition = { x: e.pageX, y: e.pageY };
28045
+ //instance.repaintEverything();
28046
+ }
28047
+ };
28048
+
28049
+ panZoom.ondblclick = function (e) {
28050
+ e.preventDefault();
28051
+ onZoom(e.ctrlKey || e.metaKey ? current.zoom * 1.7 * 1.7 : current.zoom / 1.7 / 1.7, e.clientX - panZoom.offsetLeft, e.clientY - panZoom.offsetTop);
28052
+ };
28053
+
28054
+ function onZoom(zoom, cx, cy) {
28055
+ var dx = cx - canvas.x;
28056
+ var dy = cy - canvas.y;
28057
+ var newdx = dx * current.zoom / zoom;
28058
+ var newdy = dy * current.zoom / zoom;
28059
+ canvas.x = cx - newdx;
28060
+ canvas.y = cy - newdy;
28061
+ canvas.scale = 1 / zoom;
28062
+ canvas.style.transitionDuration = "0s";
28063
+ canvas.updateContainerPosition();
28064
+ canvas.updateContainerScale();
28065
+ current.zoom = zoom;
28066
+ instance.setZoom(canvas.scale);
28067
+ //instance.repaintEverything();
28068
+ }
28069
+
28070
+ var mousewheeldelta = 0,
28071
+ last_e,
28072
+ mousewheeltimer = null,
28073
+ mousewheel;
28074
+
28075
+ mousewheel = function mousewheel(e) {
28076
+ e.preventDefault();
28077
+ var delta = Math.max(-1, Math.min(1, e.wheelDelta || -e.detail));
28078
+ //onZoom((delta > 0) ? current.zoom / 1.7 : current.zoom * 1.7, e.clientX - panZoom.offsetLeft, e.clientY - panZoom.offsetTop);
28079
+ onZoom(delta > 0 ? current.zoom / 1.7 : current.zoom * 1.7, e.clientX - panZoom.getBoundingClientRect().left, e.clientY - panZoom.getBoundingClientRect().top);
28080
+ };
28081
+
28082
+ if ("onmousewheel" in document) {
28083
+ panZoom.onmousewheel = mousewheel;
28084
+ } else {
28085
+ panZoom.addEventListener('DOMMouseScroll', mousewheel, false);
28086
+ }
28087
+
28088
+ function getQueryVariable(id) {
28089
+ var params = window.location.search.substring(1).split("&");for (var i = 0; i < params.length; i++) {
28090
+ var p = params[i].split("=");if (p[0] == id) {
28091
+ return p[1];
28092
+ }
28093
+ }return false;
28094
+ }
28095
+
28096
+ return state;
28097
+ };
28098
+
28099
+ ;
28100
+
28101
+ /***/ },
27959
28102
/* 240 */
27960
28103
/***/ function(module, exports, __webpack_require__) {
27961
28104
@@ -29233,149 +29376,5 @@
29233
29376
}
29234
29377
29235
29378
29236
- /***/ },
29237
- /* 251 */
29238
- /***/ function(module, exports) {
29239
-
29240
- 'use strict';
29241
-
29242
- Object.defineProperty(exports, "__esModule", {
29243
- value: true
29244
- });
29245
-
29246
- exports.default = function () {
29247
- "use strict";
29248
-
29249
- var panZoom = document.getElementById('panZoomContainer'),
29250
- canvas = document.getElementById('jsplumbContainer');
29251
- console.log(panZoom.offsetLeft);
29252
- if (!canvas) {
29253
- return;
29254
- }
29255
-
29256
- var params = { x: getQueryVariable('x'), y: getQueryVariable('y'), zoom: getQueryVariable('zoom') };
29257
-
29258
- var current = {};
29259
- current.x = params.x ? parseFloat(params.x) : $(canvas).data('x');
29260
- current.y = params.y ? parseFloat(params.y) : $(canvas).data('y');
29261
- current.zoom = params.zoom ? parseFloat(params.zoom) : $(canvas).data('zoom');
29262
-
29263
- canvas.x = 0;canvas.y = 0;canvas.scale = 1;
29264
- canvas.updateContainerPosition = function () {
29265
- canvas.style.left = canvas.x + 'px';canvas.style.top = canvas.y + 'px';
29266
- };
29267
- canvas.updateContainerScale = function () {
29268
- canvas.style.transform = 'scale(' + canvas.scale + ')';
29269
- };
29270
-
29271
- canvas.updateContainerPosition();
29272
- canvas.updateContainerScale();
29273
-
29274
- function updateTextPosition(e) {
29275
- e.style.left = $(e).data("x") / current.zoom + 'px';
29276
- e.style.top = $(e).data("y") / current.zoom + 'px';
29277
- }
29278
-
29279
- function newText(x, y, size, text) {
29280
- var tb = document.createElement('div');
29281
- tb.className = "text";
29282
- tb.contentEditable = true;
29283
- tb.innerHTML = text;
29284
- $(tb).data("x", x).data("y", y).data("size", size);
29285
- updateTextPosition(tb);
29286
- canvas.appendChild(tb);
29287
- return tb;
29288
- }
29289
-
29290
- var dragging = false,
29291
- state = { click: false, pan: false },
29292
- previousMousePosition;
29293
-
29294
- panZoom.onmousedown = function (e) {
29295
- console.log('mouse down');
29296
- e.preventDefault();
29297
- dragging = true;
29298
- state.click = true;
29299
- previousMousePosition = { x: e.pageX, y: e.pageY };
29300
- };
29301
-
29302
- window.onmouseup = function () {
29303
- //panZoom.onmouseup = function() {
29304
- console.log('mouse up');
29305
- dragging = false;
29306
- };
29307
-
29308
- panZoom.ondragstart = function (e) {
29309
- console.log('on drag start');
29310
- e.preventDefault();
29311
- };
29312
-
29313
- panZoom.onmousemove = function (e) {
29314
- console.log('on mouse move');
29315
- if (state.click) {
29316
- state.pan = true;
29317
- }
29318
- if (dragging && !e.shiftKey) {
29319
- canvas.style.transitionDuration = "0s";
29320
- canvas.x += e.pageX - previousMousePosition.x;
29321
- canvas.y += e.pageY - previousMousePosition.y;
29322
- canvas.updateContainerPosition();
29323
- previousMousePosition = { x: e.pageX, y: e.pageY };
29324
- //instance.repaintEverything();
29325
- }
29326
- };
29327
-
29328
- panZoom.ondblclick = function (e) {
29329
- e.preventDefault();
29330
- onZoom(e.ctrlKey || e.metaKey ? current.zoom * 1.7 * 1.7 : current.zoom / 1.7 / 1.7, e.clientX - panZoom.offsetLeft, e.clientY - panZoom.offsetTop);
29331
- };
29332
-
29333
- function onZoom(zoom, cx, cy) {
29334
- var dx = cx - canvas.x;
29335
- var dy = cy - canvas.y;
29336
- var newdx = dx * current.zoom / zoom;
29337
- var newdy = dy * current.zoom / zoom;
29338
- canvas.x = cx - newdx;
29339
- canvas.y = cy - newdy;
29340
- canvas.scale = 1 / zoom;
29341
- canvas.style.transitionDuration = "0s";
29342
- canvas.updateContainerPosition();
29343
- canvas.updateContainerScale();
29344
- current.zoom = zoom;
29345
- instance.setZoom(canvas.scale);
29346
- //instance.repaintEverything();
29347
- }
29348
-
29349
- var mousewheeldelta = 0,
29350
- last_e,
29351
- mousewheeltimer = null,
29352
- mousewheel;
29353
-
29354
- mousewheel = function mousewheel(e) {
29355
- e.preventDefault();
29356
- var delta = Math.max(-1, Math.min(1, e.wheelDelta || -e.detail));
29357
- //onZoom((delta > 0) ? current.zoom / 1.7 : current.zoom * 1.7, e.clientX - panZoom.offsetLeft, e.clientY - panZoom.offsetTop);
29358
- onZoom(delta > 0 ? current.zoom / 1.7 : current.zoom * 1.7, e.clientX - panZoom.getBoundingClientRect().left, e.clientY - panZoom.getBoundingClientRect().top);
29359
- };
29360
-
29361
- if ("onmousewheel" in document) {
29362
- panZoom.onmousewheel = mousewheel;
29363
- } else {
29364
- panZoom.addEventListener('DOMMouseScroll', mousewheel, false);
29365
- }
29366
-
29367
- function getQueryVariable(id) {
29368
- var params = window.location.search.substring(1).split("&");for (var i = 0; i < params.length; i++) {
29369
- var p = params[i].split("=");if (p[0] == id) {
29370
- return p[1];
29371
- }
29372
- }return false;
29373
- }
29374
-
29375
- return state;
29376
- };
29377
-
29378
- ;
29379
-
29380
29379
/***/ }
29381
29380
/******/ ]);
0 commit comments