2020-09-04 20:34:30 +00:00
|
|
|
{"version":3,"file":"ext-arrows.js","sources":["../../../src/editor/extensions/ext-arrows.js"],"sourcesContent":["/**\n * @file ext-arrows.js\n *\n * @license MIT\n *\n * @copyright 2010 Alexis Deveria\n *\n */\n\nexport default {\n name: 'arrows',\n async init (S) {\n const strings = await S.importLocale();\n const svgEditor = this;\n const svgCanvas = svgEditor.canvas;\n const // {svgcontent} = S,\n addElem = svgCanvas.addSVGElementFromJson,\n {nonce, $} = S,\n prefix = 'se_arrow_';\n\n let selElems, arrowprefix, randomizeIds = S.randomize_ids;\n\n /**\n * @param {Window} win\n * @param {!(string|Integer)} n\n * @returns {void}\n */\n function setArrowNonce (win, n) {\n randomizeIds = true;\n arrowprefix = prefix + n + '_';\n pathdata.fw.id = arrowprefix + 'fw';\n pathdata.bk.id = arrowprefix + 'bk';\n }\n\n /**\n * @param {Window} win\n * @returns {void}\n */\n function unsetArrowNonce (win) {\n randomizeIds = false;\n arrowprefix = prefix;\n pathdata.fw.id = arrowprefix + 'fw';\n pathdata.bk.id = arrowprefix + 'bk';\n }\n\n svgCanvas.bind('setnonce', setArrowNonce);\n svgCanvas.bind('unsetnonce', unsetArrowNonce);\n\n if (randomizeIds) {\n arrowprefix = prefix + nonce + '_';\n } else {\n arrowprefix = prefix;\n }\n\n const pathdata = {\n fw: {d: 'm0,0l10,5l-10,5l5,-5l-5,-5z', refx: 8, id: arrowprefix + 'fw'},\n bk: {d: 'm10,0l-10,5l10,5l-5,-5l5,-5z', refx: 2, id: arrowprefix + 'bk'}\n };\n\n /**\n * Gets linked element.\n * @param {Element} elem\n * @param {string} attr\n * @returns {Element}\n */\n function getLinked (elem, attr) {\n const str = elem.getAttribute(attr);\n if (!str) { return null; }\n const m = str.match(/\\(#(.*)\\)/);\n // const m = str.match(/\\(#(?<id>.+)\\)/);\n // if (!m || !m.groups.id) {\n if (!m || m.length !== 2) {\n return null;\n }\n return svgCanvas.getElem(m[1]);\n // return svgCanvas.getElem(m.groups.id);\n }\n\n /**\n * @param {boolean} on\n * @returns {void}\n */\n function showPanel (on) {\n $('#arrow_panel').toggle(on);\n if (on) {\n const el = selElems[0];\n const end = el.getAttribute('marker-end');\n const start = el.getAttribute('marker-start');\n const mid = el.getAttribute('marker-mid');\n let val;\n if (end && start) {\n val = 'both';\n } else if (end) {\n val = 'end';\n } else if (start) {\n val = 'start';\n } else if (mid) {\n val = 'mid';\n if (mid.includes('bk')) {\n val = 'mid_bk';\n }\n }\n\n if (!start && !mid && !end) {\n val = 'none';\n }\n\n $('#arrow_list').val(val);\n }\n }\n\n /**\n *\n * @returns {void}\n */\n function resetMarker () {\n const el = selElems[0];\n el.removeAttribute('marker-start');\n el.removeAttribute('marker-mid');\n el.removeAttribute('marker-end');\n }\n\n /**\n * @param {\"bk\"|\"fw\"} dir\n * @param {\"both\"|\"mid\"|\"end\"|\"start\"} type\n * @param {string} id\n * @returns {Element}\n */\n function addMarker (dir, type, id) {\n // TODO: Make marker (or use?) per arrow type, since refX can be different\n id = id || arrowprefix + dir;\n\n const data = pathdata[dir];\n\n if (type === 'mid') {\n data.refx = 5;\n }\n\n let marker = svgCanvas.getElem(id);\n if (!marker) {\n marker = addElem({\n element: 'marker',\n attr: {\n viewBox: '0 0 10 10',\n id,\n refY: 5,\n markerUnits: 'strokeWidth',\n markerWidth: 5,\n markerHeight: 5,\n orient: 'auto',\n style: 'pointer-events:none' // Currently needed for Opera\n }\n });\n const arrow = addElem({\n element: 'path',\n attr:
|