frodovdr/node-red
1
0
Fork 0
mirror of https://github.com/node-red/node-red.git synced 2023-10-10 13:36:53 +02:00
Code Issues Releases Wiki Activity

Revealing node position needs to account for zoom level

Browse Source 
Fixes #2172
This commit is contained in:
Nick O'Leary 2019-05-25 22:11:05 +01:00
parent 749a080397
commit c514d988df
No known key found for this signature in database
GPG Key ID: 4F2157149161A6C9
1 changed files with 19 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
packages/node_modules/@node-red/editor-client/src/js/ui/view.js vendored
View File

@ -1367,24 +1367,31 @@ RED.view = (function() {
function zoomIn() { function zoomIn() {
if (scaleFactor < 2) { if (scaleFactor < 2) {
scaleFactor += 0.1; zoomView(scaleFactor+0.1);
RED.view.navigator.resize();
redraw();
} }
} }
function zoomOut() { function zoomOut() {
if (scaleFactor > 0.3) { if (scaleFactor > 0.3) {
scaleFactor -= 0.1; zoomView(scaleFactor-0.1);
RED.view.navigator.resize();
redraw();
} }
} }
function zoomZero() { function zoomZero() { zoomView(1); }
scaleFactor = 1;
function zoomView(factor) {
var screenSize = [chart.width(),chart.height()];
var scrollPos = [chart.scrollLeft(),chart.scrollTop()];
var center = [(scrollPos[0] + screenSize[0]/2)/scaleFactor,(scrollPos[1] + screenSize[1]/2)/scaleFactor];
scaleFactor = factor;
var newCenter = [(scrollPos[0] + screenSize[0]/2)/scaleFactor,(scrollPos[1] + screenSize[1]/2)/scaleFactor];
var delta = [(newCenter[0]-center[0])*scaleFactor,(newCenter[1]-center[1])*scaleFactor]
chart.scrollLeft(scrollPos[0]-delta[0]);
chart.scrollTop(scrollPos[1]-delta[1]);
RED.view.navigator.resize(); RED.view.navigator.resize();
redraw(); redraw();
} }
function selectAll() { function selectAll() {
if (mouse_mode === RED.state.SELECTING_NODE && selectNodesOptions.single) { if (mouse_mode === RED.state.SELECTING_NODE && selectNodesOptions.single) {
return; return;
@ -3632,12 +3639,12 @@ RED.view = (function() {
node.dirty = true; node.dirty = true;
RED.workspaces.show(node.z); RED.workspaces.show(node.z);
var screenSize = [chart.width(),chart.height()]; var screenSize = [chart.width()/scaleFactor,chart.height()/scaleFactor];
var scrollPos = [chart.scrollLeft(),chart.scrollTop()]; var scrollPos = [chart.scrollLeft()/scaleFactor,chart.scrollTop()/scaleFactor];
if (node.x < scrollPos[0] || node.y < scrollPos[1] || node.x > screenSize[0]+scrollPos[0] || node.y > screenSize[1]+scrollPos[1]) { if (node.x < scrollPos[0] || node.y < scrollPos[1] || node.x > screenSize[0]+scrollPos[0] || node.y > screenSize[1]+scrollPos[1]) {
var deltaX = '-='+((scrollPos[0] - node.x) + screenSize[0]/2); var deltaX = '-='+(((scrollPos[0] - node.x) + screenSize[0]/2)*scaleFactor);
var deltaY = '-='+((scrollPos[1] - node.y) + screenSize[1]/2); var deltaY = '-='+(((scrollPos[1] - node.y) + screenSize[1]/2)*scaleFactor);
chart.animate({ chart.animate({
scrollLeft: deltaX, scrollLeft: deltaX,
scrollTop: deltaY scrollTop: deltaY