jquery removal, isolate svgcavas from svgedit, tests

This commit is contained in:
JFH
2020-12-26 00:08:54 +01:00
parent 9bf5f559bb
commit c0ca1dd621
58 changed files with 166 additions and 391 deletions

View File

@@ -6,9 +6,6 @@
* @copyright 2010 Jeff Schiller, 2010 Alexis Deveria
*/
// Dependencies:
// 1) jQuery (for $.alert())
import 'pathseg';
import {NS} from './namespaces.js';

View File

@@ -1,3 +1,4 @@
/* eslint-disable no-alert */
/* globals $ */
/**
@@ -27,17 +28,17 @@ class LayersPanel {
/**
* @returns {void}
*/
async newLayer () {
newLayer () {
let uniqName;
let i = this.svgCanvas.getCurrentDrawing().getNumLayers();
do {
uniqName = this.uiStrings.layers.layer + ' ' + (++i);
} while (this.svgCanvas.getCurrentDrawing().hasLayer(uniqName));
const newName = await $.prompt(this.uiStrings.notification.enterUniqueLayerName, uniqName);
const newName = prompt(this.uiStrings.notification.enterUniqueLayerName, uniqName);
if (!newName) { return; }
if (this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
/* await */ $.alert(this.uiStrings.notification.dupeLayerName);
alert(this.uiStrings.notification.dupeLayerName);
return;
}
this.svgCanvas.createLayer(newName);
@@ -63,15 +64,15 @@ class LayersPanel {
/**
*
* @returns {Promise<void>}
* @returns {void}
*/
async cloneLayer () {
cloneLayer () {
const name = this.svgCanvas.getCurrentDrawing().getCurrentLayerName() + ' copy';
const newName = await $.prompt(this.uiStrings.notification.enterUniqueLayerName, name);
const newName = prompt(this.uiStrings.notification.enterUniqueLayerName, name);
if (!newName) { return; }
if (this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
/* await */ $.alert(this.uiStrings.notification.dupeLayerName);
alert(this.uiStrings.notification.dupeLayerName);
return;
}
this.svgCanvas.cloneLayer(newName);
@@ -110,13 +111,13 @@ class LayersPanel {
/**
* @returns {void}
*/
async layerRename () {
layerRename () {
// const curIndex = $('#layerlist tr.layersel').prevAll().length; // Currently unused
const oldName = $('#layerlist tr.layersel td.layername').text();
const newName = await $.prompt(this.uiStrings.notification.enterNewLayerName, '');
const newName = prompt(this.uiStrings.notification.enterNewLayerName, '');
if (!newName) { return; }
if (oldName === newName || this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
/* await */ $.alert(this.uiStrings.notification.layerHasThatName);
alert(this.uiStrings.notification.layerHasThatName);
return;
}
this.svgCanvas.renameCurrentLayer(newName);

View File

@@ -138,22 +138,6 @@ class PaintBox {
this.setPaint(paint);
return (paint);
}
/**
* @returns {void}
*/
prep () {
const ptype = this.paint.type;
switch (ptype) {
case 'linearGradient':
case 'radialGradient': {
const paint = new $.jGraduate.Paint({copy: this.paint});
this.setPaint(this.type, paint);
break;
}
}
}
}
PaintBox.ctr = 0;

View File

@@ -283,7 +283,8 @@ export default function jQueryPluginJGraduate ($) {
const $wc = (selector) => $($shadowRoot.querySelectorAll(selector));
if (!idref) {
/* await */ $.alert('Container element must have an id attribute to maintain unique id strings for sub-elements.');
// eslint-disable-next-line no-alert
alert('Container element must have an id attribute to maintain unique id strings for sub-elements.');
return;
}

View File

@@ -8,7 +8,7 @@ template.innerHTML = `
</style>
<elix-menu-item>
<div style="display:inline-block;">
<img src="" alt="icon" style="display:none;" />
<img src="./images/logo.svg" alt="icon" style="display:none;" />
<span></span>
</div>
</elix-menu-item>

View File

@@ -18,7 +18,7 @@ template.innerHTML = `
padding: 0px;
}
</style>
<img src="./images/logo.svg" alt="icon" width="12" height="12" />
<img src="./images/logo.svg" alt="icon" width="12" height="12" aria-labelledby="label" />
<span id="label">label</span>
<elix-number-spin-box min="1" step="1"></elix-number-spin-box>
`;

View File

@@ -184,7 +184,7 @@ export class SeCMenuDialog extends HTMLElement {
});
break;
default:
super.attributeChangedCallback(name, oldValue, newValue);
// super.attributeChangedCallback(name, oldValue, newValue);
break;
}
}

View File

@@ -115,7 +115,7 @@ export class SeCMenuLayerDialog extends HTMLElement {
}
break;
default:
super.attributeChangedCallback(name, oldValue, newValue);
// super.attributeChangedCallback(name, oldValue, newValue);
break;
}
}

View File

@@ -194,11 +194,11 @@ template.innerHTML = `
</fieldset>
<fieldset id="change_grid">
<legend id="svginfo_grid_settings">Grid</legend>
<label>
<label for="svginfo_snap_onoff">
<span id="svginfo_snap_onoff">Snapping on/off</span>
<input type="checkbox" value="snapping_on" id="grid_snapping_on" />
</label>
<label>
<label for="grid_snapping_step">
<span id="svginfo_snap_step">Snapping Step-Size:</span>
<input type="text" id="grid_snapping_step" size="3" value="10" />
</label>

View File

@@ -3,3 +3,4 @@ import './editorPreferencesDialog.js';
import './svgSourceDialog.js';
import './cmenuDialog.js';
import './cmenuLayersDialog.js';
import './seSelectDialog.js';

View File

@@ -0,0 +1,13 @@
// eslint-disable-next-line node/no-unpublished-import
import AlertDialog from 'elix/define/AlertDialog.js';
const dialog = new AlertDialog();
const seSelect = async (text, choices) => {
dialog.textContent = text;
dialog.choices = choices;
dialog.open();
const response = await dialog.whenClosed();
return response.choice;
};
window.seSelect = seSelect;

View File

@@ -196,11 +196,12 @@ export default {
// Create source save/cancel buttons
/* const save = */ $('#tool_source_save').clone()
.hide().attr('id', 'foreign_save').unbind()
.appendTo('#tool_source_back').click(async function () {
.appendTo('#tool_source_back').click(function () {
if (!editingforeign) { return; }
if (!setForeignString($('#svg_source_textarea').val())) {
const ok = await $.confirm('Errors found. Revert to original?');
// eslint-disable-next-line no-alert
const ok = confirm('Errors found. Revert to original?');
if (!ok) { return; }
endChanges();
} else {

View File

@@ -78,7 +78,7 @@ export default {
});
// Show the text using the custom alert function
$.alert(text);
alert(text); // eslint-disable-line no-alert
}
}
};

View File

@@ -223,7 +223,7 @@ export default {
} else {
pending[id].entry.remove();
}
// await $.alert('Unexpected data was returned: ' + response, function() {
// await alert('Unexpected data was returned: ' + response, function() {
// if (mode !== 'm') {
// closeBrowser();
// } else {

View File

@@ -404,12 +404,13 @@ export default {
/**
* @param {"start"|"mid"|"end"} pos
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void} Resolves to `undefined`
*/
async function showTextPrompt (pos) {
function showTextPrompt (pos) {
let def = $('#' + pos + '_marker').val();
if (def.substr(0, 1) === '\\') { def = ''; }
const txt = await $.prompt('Enter text for ' + pos + ' marker', def);
// eslint-disable-next-line no-alert
const txt = prompt('Enter text for ' + pos + ' marker', def);
if (txt) {
triggerTextEntry(pos, txt);
}

View File

@@ -202,7 +202,8 @@ export default {
});
} catch (e) {
console.log('Failed loading MathJax.'); // eslint-disable-line no-console
$.alert('Failed loading MathJax. You will not be able to change the mathematics.');
// eslint-disable-next-line no-alert
alert('Failed loading MathJax. You will not be able to change the mathematics.');
}
}
}

View File

@@ -133,7 +133,7 @@ export default {
// Todo: Uncomment the setItexString() function above and handle ajaxEndpoint?
/*
if (!setItexString($('#svg_source_textarea').val())) {
const ok = await $.confirm('Errors found. Revert to original?', function (ok) {
const ok = confirm('Errors found. Revert to original?', function (ok) {
if (!ok) {
return false;
}

View File

@@ -64,7 +64,8 @@ export default {
<input type="hidden" name="contenttype" value="application/x-svgdraw">
`).appendTo('body')
.submit().remove();
$.alert(strings.saved);
// eslint-disable-next-line no-alert
alert(strings.saved);
top.window.location = '/' + name;
}
});

View File

@@ -146,7 +146,8 @@ export default {
}
if (note.length) {
await $.alert(note);
// eslint-disable-next-line no-alert
alert(note);
}
const filename = getFileNameFromTitle();

View File

@@ -1,3 +1,4 @@
/* globals seSelect */
/**
* @file ext-storage.js
*
@@ -181,9 +182,9 @@ export default {
const storagePrompt = new URL(top.location).searchParams.get('storagePrompt');
const strings = await loadExtensionTranslation(svgEditor.pref('lang'));
const {
message, storagePrefsAndContent, storagePrefsOnly,
message /* , storagePrefsAndContent, storagePrefsOnly,
storagePrefs, storageNoPrefsOrContent, storageNoPrefs,
rememberLabel, rememberTooltip
rememberLabel, rememberTooltip */
} = strings;
// No need to run this one-time dialog again just because the user
@@ -213,6 +214,7 @@ export default {
)
// ...then show the storage prompt.
)) {
/*
const options = [];
if (storage) {
options.unshift(
@@ -226,20 +228,13 @@ export default {
{value: 'noPrefsOrContent', text: storageNoPrefs}
);
}
// Hack to temporarily provide a wide and high enough dialog
const oldContainerWidth = $('#dialog_container')[0].style.width,
oldContainerMarginLeft = $('#dialog_container')[0].style.marginLeft,
oldContentHeight = $('#dialog_content')[0].style.height,
oldContainerHeight = $('#dialog_container')[0].style.height;
$('#dialog_content')[0].style.height = '120px';
$('#dialog_container')[0].style.height = '170px';
$('#dialog_container')[0].style.width = '800px';
$('#dialog_container')[0].style.marginLeft = '-400px';
*/
const options = storage ? ['prefsAndContent', 'prefsOnly', 'noPrefsOrContent'] : ['prefsOnly', 'noPrefsOrContent'];
// Open select-with-checkbox dialog
// From svg-editor.js
svgEditor.storagePromptState = 'waiting';
/* JFH !!!!!
const {response: pref, checked} = await $.select(
message,
options,
@@ -251,6 +246,8 @@ export default {
tooltip: rememberTooltip
}
);
*/
const pref = await seSelect(message, options);
if (pref && pref !== 'noPrefsOrContent') {
// Regardless of whether the user opted
// to remember the choice (and move to a URL which won't
@@ -263,7 +260,7 @@ export default {
// the user does indicate a wish to store their info, we
// don't want ask them again upon page refresh so move
// them instead to a URL which does not always prompt
if (storagePrompt === 'true' && checked) {
if (storagePrompt === 'true' /* && checked */) {
replaceStoragePrompt();
return;
}
@@ -274,19 +271,13 @@ export default {
) {
emptyStorage();
}
if (pref && checked) {
if (pref /* && checked */) {
// Open a URL which won't set storage and won't prompt user about storage
replaceStoragePrompt('false');
return;
}
}
// Reset width/height of dialog (e.g., for use by Export)
$('#dialog_container')[0].style.width = oldContainerWidth;
$('#dialog_container')[0].style.marginLeft = oldContainerMarginLeft;
$('#dialog_content')[0].style.height = oldContentHeight;
$('#dialog_container')[0].style.height = oldContainerHeight;
// It should be enough to (conditionally) add to storage on
// beforeunload, but if we wished to update immediately,
// we might wish to try setting:

View File

@@ -63,7 +63,8 @@ export default {
} */
break;
case 'save-end':
$.alert(`save complete for pathID ${pathID}!`);
// eslint-disable-next-line no-alert
alert(`save complete for pathID ${pathID}!`);
break;
default:
throw new Error('Unexpected WebAppFind event type');

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 20 KiB

View File

@@ -74,7 +74,7 @@
<div id="sidepanel_handle" title="Drag left/right to resize side panel [X]">L a y e r s
</div>
</div>
<se-menu id="main_button" label="SVG-Edit" src="./images/logo.svg">
<se-menu id="main_button" label="SVG-Edit" src="./images/logo.svg" alt="logo">
<!-- File-like buttons: New, Save, Source -->
<se-menu-item id="tool_clear" label="New Image" shortcut="N" src="./images/new.svg"></se-menu-item>
<se-menu-item id="tool_open" label="Open SVG" src="./images/open.svg"></se-menu-item>
@@ -86,7 +86,7 @@
<se-menu-item id="tool_editor_homepage" label="SVG-Edit Home Page" src="./images/svg-edit-home.svg"></se-menu-item>
<div style="width:50%;margin:auto;">
<a href="https://www.netlify.com">
<img style="height:25px;" src="https://www.netlify.com/img/global/badges/netlify-dark.svg"
<img style="height:25px;" src="./images/netlify-dark.svg"
alt="Deploys by Netlify" />
</a>
</div>

View File

@@ -1,4 +1,5 @@
/* globals jQuery */
/* eslint-disable no-alert */
/* globals jQuery seSelect */
/**
* The main module for the visual SVG Editor.
*
@@ -24,11 +25,7 @@ import {
} from './contextmenu.js';
import SvgCanvas from '../svgcanvas/svgcanvas.js';
import jQueryPluginJSHotkeys from './js-hotkeys/jquery.hotkeys.min.js';
import jQueryPluginContextMenu from './contextmenu/jQuery.contextMenu.js';
import jQueryPluginDBox from '../svgcanvas/dbox.js';
import ConfigObj from './ConfigObj.js';
import LayersPanel from './LayersPanel.js';
@@ -69,8 +66,8 @@ const editor = {
setStrings
};
const $ = [jQueryPluginJSHotkeys, jQueryPluginContextMenu].reduce((jq, func) => func(jq), jQuery);
// JFH hotkey is used for text input.
const $ = [jQueryPluginJSHotkeys].reduce((jq, func) => func(jq), jQuery);
const homePage = 'https://github.com/SVG-Edit/svgedit';
const callbacks = [];
@@ -97,7 +94,6 @@ let svgCanvas,
const loadSvgString = (str, {noAlert} = {}) => {
const success = svgCanvas.setSvgString(str) !== false;
if (success) return;
// eslint-disable-next-line no-alert
if (!noAlert) window.alert(uiStrings.notification.errorLoadingSVG);
throw new Error('Error loading SVG');
};
@@ -260,9 +256,6 @@ editor.init = () => {
const {langParam, langData} = await editor.putLocale(editor.pref('lang'), goodLangs);
await setLang(langParam, langData);
const {ok, cancel} = uiStrings.common;
jQueryPluginDBox($, {ok, cancel});
$id('svg_container').style.visibility = 'visible';
try {
@@ -718,7 +711,7 @@ editor.init = () => {
editor.pref('save_notice_done', 'all');
}
if (done !== 'part') {
$.alert(note);
alert(note);
}
}
};
@@ -735,7 +728,7 @@ editor.init = () => {
exportWindow = window.open(blankPageObjectURL || '', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
if (!exportWindow || exportWindow.closed) {
/* await */ $.alert(uiStrings.notification.popupWindowBlocked);
alert(uiStrings.notification.popupWindowBlocked);
return;
}
@@ -852,12 +845,12 @@ editor.init = () => {
/**
* @param {PlainObject} [opts={}]
* @param {boolean} [opts.cancelDeletes=false]
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void} Resolves to `undefined`
*/
async function promptImgURL ({cancelDeletes = false} = {}) {
function promptImgURL ({cancelDeletes = false} = {}) {
let curhref = svgCanvas.getHref(selectedElement);
curhref = curhref.startsWith('data:') ? '' : curhref;
const url = await $.prompt(uiStrings.notification.enterNewImgURL, curhref);
const url = prompt(uiStrings.notification.enterNewImgURL, curhref);
if (url) {
setImageURL(url);
} else if (cancelDeletes) {
@@ -1514,15 +1507,6 @@ editor.init = () => {
updateTitle();
};
/**
* Makes sure the current selected paint is available to work with.
* @returns {void}
*/
const prepPaints = () => {
$id('fill_color').prep();
$id('stroke_color').prep();
};
/**
* @param {external:Window} win
* @param {module:svgcanvas.SvgCanvas#event:extension_added} ext
@@ -1666,7 +1650,7 @@ editor.init = () => {
exportWindow = window.open('', exportWindowName); // A hack to get the window via JSON-able name without opening a new one
}
if (!exportWindow || exportWindow.closed) {
/* await */ $.alert(uiStrings.notification.popupWindowBlocked);
alert(uiStrings.notification.popupWindowBlocked);
return;
}
exportWindow.location.href = data.output;
@@ -1772,7 +1756,7 @@ editor.init = () => {
// fired when user wants to move elements to another layer
let promptMoveLayerOnce = false;
$('#selLayerNames').change(async (evt) => {
$('#selLayerNames').change((evt) => {
const destLayer = evt.currentTarget.options[evt.currentTarget.selectedIndex].value;
const confirmStr = uiStrings.notification.QmoveElemsToLayer.replace('%s', destLayer);
/**
@@ -1790,7 +1774,7 @@ editor.init = () => {
if (promptMoveLayerOnce) {
moveToLayer(true);
} else {
const ok = await $.confirm(confirmStr);
const ok = confirm(confirmStr);
if (!ok) {
return;
}
@@ -1834,7 +1818,7 @@ editor.init = () => {
if (!valid) {
e.target.value = selectedElement.getAttribute(attr);
/* await */ $.alert(uiStrings.notification.invalidAttrValGiven);
alert(uiStrings.notification.invalidAttrValGiven);
return false;
}
@@ -1872,7 +1856,7 @@ editor.init = () => {
if (!valid) {
evt.currentTarget.value = selectedElement.getAttribute(attr);
/* await */ $.alert(uiStrings.notification.invalidAttrValGiven);
alert(uiStrings.notification.invalidAttrValGiven);
return false;
}
@@ -2403,11 +2387,11 @@ editor.init = () => {
/**
*
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void} Resolves to `undefined`
*/
const makeHyperlink = async () => {
const makeHyperlink = () => {
if (!isNullish(selectedElement) || multiselected) {
const url = await $.prompt(uiStrings.notification.enterNewLinkURL, 'http://');
const url = prompt(uiStrings.notification.enterNewLinkURL, 'http://');
if (url) {
svgCanvas.makeHyperlink(url);
}
@@ -2512,11 +2496,11 @@ editor.init = () => {
/**
* @fires module:svgcanvas.SvgCanvas#event:ext_onNewDocument
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void}
*/
const clickClear = async () => {
const clickClear = () => {
const [x, y] = configObj.curConfig.dimensions;
const ok = await $.confirm(uiStrings.notification.QwantToClear);
const ok = confirm(uiStrings.notification.QwantToClear);
if (!ok) {
return;
}
@@ -2527,7 +2511,6 @@ editor.init = () => {
zoomImage();
layersPanel.populateLayers();
updateContextPanel();
prepPaints();
svgCanvas.runExtensions('onNewDocument');
};
@@ -2581,24 +2564,13 @@ editor.init = () => {
* @returns {Promise<void>} Resolves to `undefined`
*/
const clickExport = async () => {
const imgType = await $.select('Select an image type for export: ', [
const imgType = await seSelect('Select an image type for export: ', [
// See http://kangax.github.io/jstests/toDataUrl_mime_type_test/ for a useful list of MIME types and browser support
// 'ICO', // Todo: Find a way to preserve transparency in SVG-Edit if not working presently and do full packaging for x-icon; then switch back to position after 'PNG'
'PNG',
'JPEG', 'BMP', 'WEBP', 'PDF'
], () => {
const sel = $(this);
if (sel.val() === 'JPEG' || sel.val() === 'WEBP') {
if (!$('#image-slider').length) {
$(`<div><label>${uiStrings.ui.quality}
<input id="image-slider"
type="range" min="1" max="100" value="92" />
</label></div>`).appendTo(sel.parent());
}
} else {
$('#image-slider').parent().remove();
}
}); // todo: replace hard-coded msg with uiStrings.notification.
]);
if (!imgType) {
return;
}
@@ -2646,7 +2618,7 @@ editor.init = () => {
if (!customExportImage) {
openExportWindow();
}
const quality = Number.parseInt($('#image-slider').val()) / 100;
const quality = 1; // JFH !!! Number.parseInt($('#image-slider').val()) / 100;
/* const results = */ await svgCanvas.rasterExport(imgType, quality, exportWindowName);
}
};
@@ -2824,9 +2796,9 @@ editor.init = () => {
/**
* @param {Event} e
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void} Resolves to `undefined`
*/
const saveSourceEditor = async (e) => {
const saveSourceEditor = (e) => {
if (!editingsource) { return; }
const saveChanges = () => {
svgCanvas.clearSelection();
@@ -2834,11 +2806,10 @@ editor.init = () => {
zoomImage();
layersPanel.populateLayers();
updateTitle();
prepPaints();
};
if (!svgCanvas.setSvgString(e.detail.value)) {
const ok = await $.confirm(uiStrings.notification.QerrorsRevertToSource);
const ok = confirm(uiStrings.notification.QerrorsRevertToSource);
if (!ok) {
return;
}
@@ -2881,15 +2852,15 @@ editor.init = () => {
svgCanvas.setDocumentTitle(title);
if (w !== 'fit' && !isValidUnit('width', w)) {
/* await */ $.alert(uiStrings.notification.invalidAttrValGiven);
alert(uiStrings.notification.invalidAttrValGiven);
return false;
}
if (h !== 'fit' && !isValidUnit('height', h)) {
/* await */ $.alert(uiStrings.notification.invalidAttrValGiven);
alert(uiStrings.notification.invalidAttrValGiven);
return false;
}
if (!svgCanvas.setResolution(w, h)) {
/* await */ $.alert(uiStrings.notification.noContentToFitTo);
alert(uiStrings.notification.noContentToFitTo);
return false;
}
// Set image save option
@@ -2933,9 +2904,9 @@ editor.init = () => {
/**
* @param {Event} e
* @returns {Promise<void>} Resolves to `undefined`
* @returns {void} Resolves to `undefined`
*/
const cancelOverlays = async (e) => {
const cancelOverlays = (e) => {
$('#dialog_box').hide();
if (!editingsource && !docprops && !preferences) {
if (curContext) {
@@ -2946,7 +2917,7 @@ editor.init = () => {
if (editingsource) {
if (origSource !== e.detail.value) {
const ok = await $.confirm(uiStrings.notification.QignoreSourceChanges);
const ok = confirm(uiStrings.notification.QignoreSourceChanges);
if (ok) {
hideSourceEditor();
}
@@ -2977,7 +2948,7 @@ editor.init = () => {
});
$('#url_notice').click(() => {
/* await */ $.alert(this.title);
alert(this.title);
});
$('#change_image_url').click(promptImgURL);
@@ -3571,7 +3542,7 @@ editor.init = () => {
if (undoMgr.getUndoStackSize() === 0) {
return true;
}
return $.confirm(uiStrings.notification.QwantToOpen);
return confirm(uiStrings.notification.QwantToOpen);
};
/**
@@ -3883,7 +3854,7 @@ editor.loadFromURL = function (url, {cache, noAlert} = {}) {
reject(new Error('URLLoadFail'));
return;
}
$.alert(uiStrings.notification.URLLoadFail + ': \n' + err);
alert(uiStrings.notification.URLLoadFail + ': \n' + err);
resolve();
},
complete () {

View File

@@ -5,7 +5,7 @@
* @license MIT
* @copyright 2011 Jeff Schiller
*/
import jQueryPluginSVG from '../common/jQuery.attr.js';
import jQueryPluginSVG from './jQuery.attr.js';
import {NS} from '../common/namespaces.js';
const $ = jQueryPluginSVG(jQuery);

View File

@@ -1,6 +1,6 @@
/* globals jQuery */
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import {isWebkit} from '../common/browser.js';
import {convertPath} from './path.js';
import {preventClickDefault} from './utilities.js';

View File

@@ -1,178 +0,0 @@
/**
* @module jQueryPluginDBox
*/
/**
* @param {external:jQuery} $
* @param {PlainObject} [strings]
* @param {PlainObject} [strings.ok]
* @param {PlainObject} [strings.cancel]
* @returns {external:jQuery}
*/
export default function jQueryPluginDBox ($, {
ok: okString = 'Ok',
cancel: cancelString = 'Cancel'
} = {}) {
// This sets up alternative dialog boxes. They mostly work the same way as
// their UI counterparts, expect instead of returning the result, a callback
// needs to be included that returns the result as its first parameter.
// In the future we may want to add additional types of dialog boxes, since
// they should be easy to handle this way.
$('#dialog_container').draggable({
cancel: '#dialog_content, #dialog_buttons *',
containment: 'window'
}).css('position', 'absolute');
const box = $('#dialog_box'),
btnHolder = $('#dialog_buttons'),
dialogContent = $('#dialog_content');
/**
* @typedef {PlainObject} module:jQueryPluginDBox.PromiseResultObject
* @property {string|true} response
* @property {boolean} checked
*/
/**
* Resolves to `false` (if cancelled), for prompts and selects
* without checkboxes, it resolves to the value of the form control. For other
* types without checkboxes, it resolves to `true`. For checkboxes, it resolves
* to an object with the `response` key containing the same value as the previous
* mentioned (string or `true`) and a `checked` (boolean) property.
* @typedef {Promise<boolean|string|module:jQueryPluginDBox.PromiseResultObject>} module:jQueryPluginDBox.ResultPromise
*/
/**
* @typedef {PlainObject} module:jQueryPluginDBox.SelectOption
* @property {string} text
* @property {string} value
*/
/**
* @typedef {PlainObject} module:jQueryPluginDBox.CheckboxInfo
* @property {string} label Label for the checkbox
* @property {string} value Value of the checkbox
* @property {string} tooltip Tooltip on the checkbox label
* @property {boolean} checked Whether the checkbox is checked by default
*/
/**
* Triggered upon a change of value for the select pull-down.
* @callback module:jQueryPluginDBox.SelectChangeListener
* @returns {void}
*/
/**
* Creates a dialog of the specified type with a given message
* and any defaults and type-specific metadata. Returns a `Promise`
* which resolves differently depending on whether the dialog
* was cancelled or okayed (with the response and any checked state).
* @param {"alert"|"prompt"|"select"|"process"} type
* @param {string} msg
* @param {string} [defaultVal]
* @param {module:jQueryPluginDBox.SelectOption[]} [opts]
* @param {module:jQueryPluginDBox.SelectChangeListener} [changeListener]
* @param {module:jQueryPluginDBox.CheckboxInfo} [checkbox]
* @returns {jQueryPluginDBox.ResultPromise}
*/
function dbox (type, msg, defaultVal, opts, changeListener, checkbox) {
dialogContent.html('<p>' + msg.replace(/\n/g, '</p><p>') + '</p>')
.toggleClass('prompt', (type === 'prompt'));
btnHolder.empty();
const ok = $('<input type="button" data-ok="" value="' + okString + '">').appendTo(btnHolder);
return new Promise((resolve, reject) => { // eslint-disable-line promise/avoid-new
if (type !== 'alert') {
$('<input type="button" value="' + cancelString + '">')
.appendTo(btnHolder)
.click(function () {
box.hide();
resolve(false);
});
}
let ctrl, chkbx;
if (type === 'prompt') {
ctrl = $('<input type="text">').prependTo(btnHolder);
ctrl.val(defaultVal || '');
ctrl.bind('keydown', 'return', function () { ok.click(); });
} else if (type === 'select') {
const div = $('<div style="text-align:center;">');
ctrl = $(`<select aria-label="${msg}">`).appendTo(div);
if (checkbox) {
const label = $('<label>').text(checkbox.label);
chkbx = $('<input type="checkbox">').appendTo(label);
chkbx.val(checkbox.value);
if (checkbox.tooltip) {
label.attr('title', checkbox.tooltip);
}
chkbx.prop('checked', Boolean(checkbox.checked));
div.append($('<div>').append(label));
}
$.each(opts || [], function (opt, val) {
if (typeof val === 'object') {
ctrl.append($('<option>').val(val.value).html(val.text));
} else {
ctrl.append($('<option>').html(val));
}
});
dialogContent.append(div);
if (defaultVal) {
ctrl.val(defaultVal);
}
if (changeListener) {
ctrl.bind('change', 'return', changeListener);
}
ctrl.bind('keydown', 'return', function () { ok.click(); });
} else if (type === 'process') {
ok.hide();
}
box.show();
ok.click(function () {
box.hide();
const response = (type === 'prompt' || type === 'select') ? ctrl.val() : true;
if (chkbx) {
resolve({response, checked: chkbx.prop('checked')});
return;
}
resolve(response);
}).focus();
if (type === 'prompt' || type === 'select') {
ctrl.focus();
}
});
}
/**
* @param {string} msg Message to alert
* @returns {jQueryPluginDBox.ResultPromise}
*/
$.alert = function (msg) {
return dbox('alert', msg);
};
/**
* @param {string} msg Message for which to ask confirmation
* @returns {jQueryPluginDBox.ResultPromise}
*/
$.confirm = function (msg) {
return dbox('confirm', msg);
};
/**
* @param {string} msg Message to indicate upon cancelable indicator
* @returns {jQueryPluginDBox.ResultPromise}
*/
$.process_cancel = function (msg) {
return dbox('process', msg);
};
/**
* @param {string} msg Message to accompany the prompt
* @param {string} [defaultText=""] The default text to show for the prompt
* @returns {jQueryPluginDBox.ResultPromise}
*/
$.prompt = function (msg, defaultText = '') {
return dbox('prompt', msg, defaultText);
};
$.select = function (msg, opts, changeListener, txt, checkbox) {
return dbox('select', msg, txt, opts, changeListener, checkbox);
};
return $;
}

View File

@@ -6,7 +6,7 @@
*/
import * as hstry from './history.js';
import jQueryPluginSVG from '../common/jQuery.attr.js';
import jQueryPluginSVG from './jQuery.attr.js';
import {NS} from '../common/namespaces.js';
import {
getVisibleElements, getStrokedBBoxDefaultVisible, findDefs,

View File

@@ -5,7 +5,7 @@
* @license MIT
* @copyright 2011 Jeff Schiller
*/
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute
import {
assignAttributes, cleanupElement, getElem, getRotationAngle, snapToGrid, walkTree,
getBBox as utilsGetBBox, isNullish, preventClickDefault, setHref

View File

@@ -1,6 +1,6 @@
/* globals jQuery */
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import {
getStrokedBBoxDefaultVisible
} from './utilities.js';

View File

@@ -5,7 +5,7 @@
* @license MIT
*/
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import {NS} from '../common/namespaces.js';
import {convertToNum} from '../common/units.js';
import {isWebkit} from '../common/browser.js';

View File

@@ -6,7 +6,7 @@
*
* @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
*/
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute
import {NS} from '../common/namespaces.js';
import * as hstry from './history.js';
import * as pathModule from './path.js';

View File

@@ -11,7 +11,7 @@ import {
isNullish, getBBox as utilsGetBBox, getStrokedBBoxDefaultVisible
} from './utilities.js';
import {transformPoint, transformListToTransform, rectsIntersect} from './math.js';
import jQueryPluginSVG from '../common/jQuery.attr.js';
import jQueryPluginSVG from './jQuery.attr.js';
import {
getTransformList
} from './svgtransformlist.js';

View File

@@ -8,7 +8,7 @@
import {jsPDF} from 'jspdf/dist/jspdf.es.min.js';
import 'svg2pdf.js/dist/svg2pdf.es.js';
import jQueryPluginSVG from '../common/jQuery.attr.js';
import jQueryPluginSVG from './jQuery.attr.js';
import * as hstry from './history.js';
import {
text2xml, cleanupElement, findDefs, getHref, preventClickDefault,

View File

@@ -17,8 +17,7 @@
import {Canvg as canvg} from 'canvg';
import 'pathseg';
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import jQueryPluginDBox from './dbox.js';
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import * as pathModule from './path.js';
import * as hstry from './history.js';
@@ -117,7 +116,7 @@ import {
init as clearInit
} from './clear.js';
let $ = jQueryPluginSVG(jQuery);
const $ = jQueryPluginSVG(jQuery);
const {
MoveElementCommand, InsertElementCommand, RemoveElementCommand,
ChangeElementCommand, BatchCommand
@@ -1741,7 +1740,6 @@ class SvgCanvas {
*/
this.setUiStrings = function (strs) {
Object.assign(uiStrings, strs.notification);
$ = jQueryPluginDBox($, strs.common);
pathModule.setUiStrings(strs);
};

View File

@@ -6,7 +6,7 @@
* @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
*/
import jQueryPluginSVG from '../common/jQuery.attr.js';
import jQueryPluginSVG from './jQuery.attr.js';
import {NS} from '../common/namespaces.js';
import {
transformPoint, getMatrix
@@ -263,15 +263,6 @@ export const textActionsMethod = (function () {
return out;
}
/*
// Not currently in use
function hideCursor () {
if (cursor) {
cursor.setAttribute('visibility', 'hidden');
}
}
*/
/**
*
* @param {Event} evt

View File

@@ -7,7 +7,7 @@
* @copyright 2010 Alexis Deveria, 2010 Jeff Schiller
*/
import jQueryPluginSVG from '../common/jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import jQueryPluginSVG from './jQuery.attr.js'; // Needed for SVG attribute setting and array form with `attr`
import {NS} from '../common/namespaces.js';
import {getTransformList} from './svgtransformlist.js';
import {setUnitAttr, getTypeMap} from '../common/units.js';