zcy
/
svgedit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

#82 workarea related javascript convertion changes

master
Agriya Dev5 2021-03-12 17:59:17 +05:30
parent 835a345560
commit e572058d8a
2 changed files with 13 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/editor/extensions/ext-overview_window/ext-overview_window.js
View File

@ -46,10 +46,11 @@ export default {
// Define dynamic animation of the view box. // Define dynamic animation of the view box.
const updateViewBox = function () { const updateViewBox = function () {
const portHeight = Number.parseFloat($('#workarea').css('height')); const warea = document.getElementById('workarea');
const portWidth = Number.parseFloat($('#workarea').css('width')); const portHeight = parseFloat(getComputedStyle(warea, null).height.replace("px", ""));
const portX = $('#workarea').scrollLeft(); const portWidth = parseFloat(getComputedStyle(warea, null).width.replace("px", ""));
const portY = $('#workarea').scrollTop(); const portX = warea.scrollLeft;
const portY = warea.scrollTop;
const windowWidth = Number.parseFloat($('#svgcanvas').css('width')); const windowWidth = Number.parseFloat($('#svgcanvas').css('width'));
const windowHeight = Number.parseFloat($('#svgcanvas').css('height')); const windowHeight = Number.parseFloat($('#svgcanvas').css('height'));
const overviewWidth = $('#overviewMiniView').attr('width'); const overviewWidth = $('#overviewMiniView').attr('width');
@ -65,12 +66,12 @@ export default {
$('#overview_window_view_box').css('top', viewBoxY + 'px'); $('#overview_window_view_box').css('top', viewBoxY + 'px');
$('#overview_window_view_box').css('left', viewBoxX + 'px'); $('#overview_window_view_box').css('left', viewBoxX + 'px');
}; };
$('#workarea').scroll(function () { document.getElementById('workarea').addEventListener('scroll', () => {
if (!(overviewWindowGlobals.viewBoxDragging)) { if (!(overviewWindowGlobals.viewBoxDragging)) {
updateViewBox(); updateViewBox();
} }
}); });
$('#workarea').resize(updateViewBox); document.getElementById('workarea').addEventListener('resize', updateViewBox);
updateViewBox(); updateViewBox();
// Compensate for changes in zoom and canvas size. // Compensate for changes in zoom and canvas size.
@ -101,9 +102,8 @@ export default {
const portX = viewBoxX / overviewWidth * windowWidth; const portX = viewBoxX / overviewWidth * windowWidth;
const portY = viewBoxY / overviewHeight * windowHeight; const portY = viewBoxY / overviewHeight * windowHeight;
document.getElementById('workarea').scrollLeft = portX;
$('#workarea').scrollLeft(portX); document.getElementById('workarea').scrollTop = portY;
$('#workarea').scrollTop(portY);
}; };
const onStart = function () { const onStart = function () {
overviewWindowGlobals.viewBoxDragging = true; overviewWindowGlobals.viewBoxDragging = true;

7
src/editor/panels/LayersPanel.js
View File

@ -1,3 +1,4 @@
/* eslint-disable max-len */
/* eslint-disable no-alert */ /* eslint-disable no-alert */
/* globals $ */ /* globals $ */
import SvgCanvas from '../../svgcanvas/svgcanvas.js'; import SvgCanvas from '../../svgcanvas/svgcanvas.js';
@ -29,11 +30,11 @@ class LayersPanel {
* @returns {void} * @returns {void}
*/ */
changeSidePanelWidth (delta) { changeSidePanelWidth (delta) {
const rulerX = $('#ruler_x'); const rulerX = document.querySelector('#ruler_x');
$('#sidepanels').width('+=' + delta); $('#sidepanels').width('+=' + delta);
$('#layerpanel').width('+=' + delta); $('#layerpanel').width('+=' + delta);
rulerX.css('right', Number.parseInt(rulerX.css('right')) + delta); rulerX.style.right = (parseFloat(getComputedStyle(rulerX, null).right.replace("px", "")) + delta) + "px";
this.editor.workarea.css('right', Number.parseInt(this.editor.workarea.css('right')) + delta); this.editor.workarea.style.right = (parseFloat(getComputedStyle(this.editor.workarea, null).right.replace("px", "")) + delta) + "px";
this.svgCanvas.runExtensions('workareaResized'); this.svgCanvas.runExtensions('workareaResized');
} }