{"version":3,"file":"ext-overview_window.js","sources":["../../../src/editor/extensions/ext-overview_window.js"],"sourcesContent":["/**\n * @file ext-overview_window.js\n *\n * @license MIT\n *\n * @copyright 2013 James Sacksteder\n *\n */\nexport default {\n  name: 'overview_window',\n  init ({$, isChrome, isIE}) {\n    const overviewWindowGlobals = {};\n    // Disabled in Chrome 48-, see https://github.com/SVG-Edit/svgedit/issues/26 and\n    // https://code.google.com/p/chromium/issues/detail?id=565120.\n    if (isChrome()) {\n      const verIndex = navigator.userAgent.indexOf('Chrome/') + 7;\n      const chromeVersion = Number.parseInt(navigator.userAgent.substring(verIndex));\n      if (chromeVersion < 49) {\n        return undefined;\n      }\n    }\n\n    // Define and insert the base html element.\n    const propsWindowHtml =\n      '<div id=\"overview_window_content_pane\" style=\"width:100%; ' +\n        'word-wrap:break-word;  display:inline-block; margin-top:20px;\">' +\n        '<div id=\"overview_window_content\" style=\"position:relative; ' +\n          'left:12px; top:0px;\">' +\n          '<div style=\"background-color:#A0A0A0; display:inline-block; ' +\n            'overflow:visible;\">' +\n            '<svg id=\"overviewMiniView\" width=\"150\" height=\"100\" x=\"0\" ' +\n              'y=\"0\" viewBox=\"0 0 4800 3600\" ' +\n                'xmlns=\"http://www.w3.org/2000/svg\" ' +\n                'xmlns:xlink=\"http://www.w3.org/1999/xlink\">' +\n              '<use x=\"0\" y=\"0\" xlink:href=\"#svgroot\"> </use>' +\n            '</svg>' +\n            '<div id=\"overview_window_view_box\" style=\"min-width:50px; ' +\n              'min-height:50px; position:absolute; top:30px; left:30px; ' +\n              'z-index:5; background-color:rgba(255,0,102,0.3);\">' +\n            '</div>' +\n          '</div>' +\n        '</div>' +\n      '</div>';\n    $('#sidepanels').append(propsWindowHtml);\n\n    // Define dynamic animation of the view box.\n    const updateViewBox = function () {\n      const portHeight = Number.parseFloat($('#workarea').css('height'));\n      const portWidth = Number.parseFloat($('#workarea').css('width'));\n      const portX = $('#workarea').scrollLeft();\n      const portY = $('#workarea').scrollTop();\n      const windowWidth = Number.parseFloat($('#svgcanvas').css('width'));\n      const windowHeight = Number.parseFloat($('#svgcanvas').css('height'));\n      const overviewWidth = $('#overviewMiniView').attr('width');\n      const overviewHeight = $('#overviewMiniView').attr('height');\n\n      const viewBoxX = portX / windowWidth * overviewWidth;\n      const viewBoxY = portY / windowHeight * overviewHeight;\n      const viewBoxWidth = portWidth / windowWidth * overviewWidth;\n      const viewBoxHeight = portHeight / windowHeight * overviewHeight;\n\n      $('#overview_window_view_box').css('min-width', viewBoxWidth + 'px');\n      $('#overview_window_view_box').css('min-height', viewBoxHeight + 'px');\n      $('#overview_window_view_box').css('top', viewBoxY + 'px');\n      $('#overview_window_view_box').css('left', viewBoxX + 'px');\n    };\n    $('#workarea').scroll(function () {\n      if (!(overviewWindowGlobals.viewBoxDragging)) {\n        updateViewBox();\n      }\n    });\n    $('#workarea').resize(updateViewBox);\n    updateViewBox();\n\n    // Compensate for changes in zoom and canvas size.\n    const updateViewDimensions = function () {\n      const viewWidth = $('#svgroot').attr('width');\n      const viewHeight = $('#svgroot').attr('height');\n\n      let viewX = 640;\n      let viewY = 480;\n      if (isIE()) {\n        // This has only been tested with Firefox 10 and IE 9 (without chrome frame).\n        // I am not sure if if is Firefox or IE that is being non compliant here.\n        // Either way the one that is noncompliant may become more compliant later.\n        // TAG:HACK\n        // TAG:VERSION_DEPENDENT\n        // TAG:BROWSER_SNIFFING\n        viewX = 0;\n        viewY = 0;\n      }\n\n      const svgWidthOld = $('#overviewMiniView').attr('width');\n      const svgHeightNew = viewHeight / viewWidth * svgWidthOld;\n      $('#overviewMiniView').attr('viewBox', viewX + ' ' + viewY + ' ' + viewWidth + ' ' + viewHeight);\n      $('#overviewMiniView').attr('height', svgHeightNew);\n      updateViewBox();\n    };\n    updateViewDimensions();\n\n    // Set up the overview window as a controller for the view port.\n    overviewWindowGlobals.viewBoxDragging = false;\n    const updateViewPortFromViewBox = function () {\n      const windowWidth = Number.parseFloat($('#svgcanvas').css('width'));\n      const windowHeight = Number.parseFloat($('#svgcanvas').css('height'));\n      const overviewWidth = $('#overviewMiniView').attr('width');\n      const overviewHeight = $('#overviewMiniView').attr('height');\n      const viewBoxX = Number.parseFloat($('#overview_window_view_box').css('left'));\n      const viewBoxY = Number.parseFloat($('#overview_window_view_box').css('top'));\n\n      const portX = viewBoxX / overviewWidth * windowWidth;\n      const portY = viewBoxY / overviewHeight * windowHeight;\n\n      $('#workarea').scrollLeft(portX);\n      $('#workarea').scrollTop(portY);\n    };\n    $('#overview_window_view_box').draggable({\n      containment: 'parent',\n      drag: updateViewPortFromViewBox,\n      start () { overviewWindowGlobals.viewBoxDragging = true; },\n      stop () { overviewWindowGlobals.viewBoxDragging = false; }\n    });\n    $('#overviewMiniView').click(function (evt) {\n      // Firefox doesn't support evt.offsetX and evt.offsetY.\n      const mouseX = (evt.offsetX || evt.originalEvent.layerX);\n      const mouseY = (evt.offsetY || evt.originalEvent.layerY);\n      const overviewWidth = $('#overviewMiniView').attr('width');\n      const overviewHeight = $('#overviewMiniView').attr('height');\n      const viewBoxWidth = Number.parseFloat($('#overview_window_view_box').css('min-width'));\n      const viewBoxHeight = Number.parseFloat($('#overview_window_view_box').css('min-height'));\n\n      let viewBoxX = mouseX - 0.5 * viewBoxWidth;\n      let viewBoxY = mouseY - 0.5 * viewBoxHeight;\n      // deal with constraints\n      if (viewBoxX < 0) {\n        viewBoxX = 0;\n      }\n      if (viewBoxY < 0) {\n        viewBoxY = 0;\n      }\n      if (viewBoxX + viewBoxWidth > overviewWidth) {\n        viewBoxX = overviewWidth - viewBoxWidth;\n      }\n      if (viewBoxY + viewBoxHeight > overviewHeight) {\n        viewBoxY = overviewHeight - viewBoxHeight;\n      }\n\n      $('#overview_window_view_box').css('top', viewBoxY + 'px');\n      $('#overview_window_view_box').css('left', viewBoxX + 'px');\n      updateViewPortFromViewBox();\n    });\n\n    return {\n      name: 'overview window',\n      canvasUpdated: updateViewDimensions,\n      workareaResized: updateViewBox\n    };\n  }\n};\n"],"names":["name","init","$","isChrome","isIE","overviewWindowGlobals","verIndex","navigator","userAgent","indexOf","Number","parseInt","substring","append","updateViewBox","portHeight","parseFloat","css","portWidth","portX","scrollLeft","portY","scrollTop","windowWidth","windowHeight","overviewWidth","attr","overviewHeight","viewBoxX","viewBoxY","viewBoxWidth","viewBoxHeight","scroll","viewBoxDragging","resize","updateViewDimensions","viewWidth","viewHeight","viewX","viewY","svgHeightNew","updateViewPortFromViewBox","draggable","containment","drag","start","stop","click","evt","mouseX","offsetX","originalEvent","layerX","mouseY","offsetY","layerY","canvasUpdated","workareaResized"],"mappings":"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"}