diff --git a/src/editor/dialogs/seAlertDialog.js b/src/editor/dialogs/seAlertDialog.js
index 6d417f22..3ae405e2 100644
--- a/src/editor/dialogs/seAlertDialog.js
+++ b/src/editor/dialogs/seAlertDialog.js
@@ -18,7 +18,7 @@ export class SeAlertDialog extends HTMLElement {
* @returns {any} observed
*/
static get observedAttributes () {
- return ['title'];
+ return ['title', 'type', 'close'];
}
/**
* @function attributeChangedCallback
@@ -30,9 +30,24 @@ export class SeAlertDialog extends HTMLElement {
attributeChangedCallback (name, oldValue, newValue) {
switch (name) {
case 'title':
+ if (this.dialog.opened) {
+ this.dialog.close();
+ }
this.dialog.textContent = newValue;
this.dialog.open();
break;
+ case 'type':
+ if (newValue === 'prompt_cancel') {
+ this.dialog.choices = ['Cancel'];
+ } else {
+ this.dialog.choices = ['Ok'];
+ }
+ break;
+ case 'close':
+ if (this.dialog.opened) {
+ this.dialog.close();
+ }
+ break;
default:
console.error('unkonw attr for:', name, 'newValue =', newValue);
break;
@@ -53,6 +68,36 @@ export class SeAlertDialog extends HTMLElement {
set title (value) {
this.setAttribute('title', value);
}
+ /**
+ * @function get
+ * @returns {any}
+ */
+ get type () {
+ return this.getAttribute('type');
+ }
+
+ /**
+ * @function set
+ * @returns {void}
+ */
+ set type (value) {
+ this.setAttribute('type', value);
+ }
+ /**
+ * @function get
+ * @returns {any}
+ */
+ get close () {
+ return this.getAttribute('close');
+ }
+
+ /**
+ * @function set
+ * @returns {void}
+ */
+ set close (value) {
+ this.setAttribute('close', value);
+ }
}
// Register
diff --git a/src/editor/extensions/ext-imagelib/ext-imagelib.js b/src/editor/extensions/ext-imagelib/ext-imagelib.js
index e9931c16..88fd9887 100644
--- a/src/editor/extensions/ext-imagelib/ext-imagelib.js
+++ b/src/editor/extensions/ext-imagelib/ext-imagelib.js
@@ -181,11 +181,9 @@ export default {
const message = uiStrings.notification.retrieving.replace('%s', name);
if (mode !== 'm') {
- await $.process_cancel(message);
+ await seConfirm(message, [uiStrings.common.cancel]);
transferStopped = true;
// Should a message be sent back to the frame?
-
- $('#dialog_box').hide();
} else {
entry = $('
').text(message).data('id', curMeta.id);
preview.append(entry);
diff --git a/src/editor/extensions/ext-imagelib/index.js b/src/editor/extensions/ext-imagelib/index.js
index 2e48c220..84835d42 100644
--- a/src/editor/extensions/ext-imagelib/index.js
+++ b/src/editor/extensions/ext-imagelib/index.js
@@ -32,6 +32,7 @@ $('a').click(function () {
data = canvas.toDataURL();
} catch (err) {
// This fails in Firefox with `file:///` URLs :(
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = 'Data URL conversion failed: ' + err;
data = '';
}
diff --git a/src/editor/extensions/ext-imagelib/openclipart.js b/src/editor/extensions/ext-imagelib/openclipart.js
index d66b3e84..c1dbb0a5 100644
--- a/src/editor/extensions/ext-imagelib/openclipart.js
+++ b/src/editor/extensions/ext-imagelib/openclipart.js
@@ -39,6 +39,7 @@ async function processResults (url) {
// console.log('json', json);
if (!json || json.msg !== 'success') {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = 'There was a problem downloading the results';
return;
}
diff --git a/src/editor/extensions/ext-mathjax/ext-mathjax.js b/src/editor/extensions/ext-mathjax/ext-mathjax.js
index 85687cbe..b9108506 100644
--- a/src/editor/extensions/ext-mathjax/ext-mathjax.js
+++ b/src/editor/extensions/ext-mathjax/ext-mathjax.js
@@ -202,6 +202,7 @@ export default {
});
} catch (e) {
console.log('Failed loading MathJax.'); // eslint-disable-line no-console
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
// eslint-disable-next-line max-len
document.getElementById('se-alert-dialog').title = 'Failed loading MathJax. You will not be able to change the mathematics.';
}
diff --git a/src/editor/extensions/ext-server_moinsave/ext-server_moinsave.js b/src/editor/extensions/ext-server_moinsave/ext-server_moinsave.js
index be51a83a..51efa601 100644
--- a/src/editor/extensions/ext-server_moinsave/ext-server_moinsave.js
+++ b/src/editor/extensions/ext-server_moinsave/ext-server_moinsave.js
@@ -64,6 +64,7 @@ export default {
`).appendTo('body')
.submit().remove();
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = strings.saved;
top.window.location = '/' + name;
}
diff --git a/src/editor/extensions/ext-server_opensave/ext-server_opensave.js b/src/editor/extensions/ext-server_opensave/ext-server_opensave.js
index 5310aca4..fdbe99f6 100644
--- a/src/editor/extensions/ext-server_opensave/ext-server_opensave.js
+++ b/src/editor/extensions/ext-server_opensave/ext-server_opensave.js
@@ -245,9 +245,8 @@ export default {
form.submit();
rebuildInput(form);
- await $.process_cancel(strings.uploading);
+ await seConfirm(strings.uploading, ['Cancel']);
cancelled = true;
- $('#dialog_box').hide();
}
if (form[0] === openSvgForm[0]) {
diff --git a/src/editor/extensions/ext-webappfind/ext-webappfind.js b/src/editor/extensions/ext-webappfind/ext-webappfind.js
index 176b226a..70ed0610 100644
--- a/src/editor/extensions/ext-webappfind/ext-webappfind.js
+++ b/src/editor/extensions/ext-webappfind/ext-webappfind.js
@@ -63,6 +63,7 @@ export default {
} */
break;
case 'save-end':
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = `save complete for pathID ${pathID}!`;
break;
default:
diff --git a/src/editor/panels/LayersPanel.js b/src/editor/panels/LayersPanel.js
index 400a3bd8..3c160a71 100644
--- a/src/editor/panels/LayersPanel.js
+++ b/src/editor/panels/LayersPanel.js
@@ -156,6 +156,7 @@ class LayersPanel {
const newName = prompt(this.uiStrings.notification.enterUniqueLayerName, uniqName);
if (!newName) { return; }
if (this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = this.uiStrings.notification.dupeLayerName;
return;
}
@@ -190,6 +191,7 @@ class LayersPanel {
const newName = prompt(this.uiStrings.notification.enterUniqueLayerName, name);
if (!newName) { return; }
if (this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = this.uiStrings.notification.dupeLayerName;
return;
}
@@ -235,6 +237,7 @@ class LayersPanel {
const newName = prompt(this.uiStrings.notification.enterNewLayerName, '');
if (!newName) { return; }
if (oldName === newName || this.svgCanvas.getCurrentDrawing().hasLayer(newName)) {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = this.uiStrings.notification.layerHasThatName;
return;
}
diff --git a/src/editor/panels/TopPanelHandlers.js b/src/editor/panels/TopPanelHandlers.js
index 2dac9259..3fb4ee04 100644
--- a/src/editor/panels/TopPanelHandlers.js
+++ b/src/editor/panels/TopPanelHandlers.js
@@ -403,6 +403,7 @@ class TopPanelHandlers {
if (!valid) {
e.target.value = this.selectedElement().getAttribute(attr);
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = this.uiStrings.notification.invalidAttrValGiven;
return false;
}
diff --git a/src/editor/svgedit.js b/src/editor/svgedit.js
index ce81af8f..3d140a11 100644
--- a/src/editor/svgedit.js
+++ b/src/editor/svgedit.js
@@ -456,6 +456,7 @@ editor.init = () => {
editor.pref('save_notice_done', 'all');
}
if (done !== 'part') {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = note;
}
}
@@ -473,6 +474,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) {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = uiStrings.notification.popupWindowBlocked;
return;
}
@@ -789,7 +791,7 @@ editor.init = () => {
}
if (editor.configObj.urldata.storagePrompt !== true && editor.storagePromptState === 'ignore') {
- $('#dialog_box').hide();
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
}
};
@@ -1902,7 +1904,7 @@ editor.init = () => {
const {title, w, h, save} = e.detail;
// set document title
svgCanvas.setDocumentTitle(title);
-
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
if (w !== 'fit' && !isValidUnit('width', w)) {
document.getElementById('se-alert-dialog').title = uiStrings.notification.invalidAttrValGiven;
return false;
@@ -1959,7 +1961,6 @@ editor.init = () => {
* @returns {void} Resolves to `undefined`
*/
const cancelOverlays = async (e) => {
- $('#dialog_box').hide();
const $editorDialog = document.getElementById('se-svg-editor-dialog');
const editingsource = $editorDialog.getAttribute('dialog') === 'open';
if (!editingsource && !docprops && !preferences) {
@@ -2003,6 +2004,7 @@ editor.init = () => {
});
$('#url_notice').click(() => {
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = this.title;
});
@@ -2440,13 +2442,14 @@ editor.init = () => {
* @returns {void}
*/
const importImage = function (e) {
- $.process_cancel(uiStrings.notification.loadingImage);
+ document.getElementById('se-alert-dialog').setAttribute('type', 'prompt_cancel');
+ document.getElementById('se-alert-dialog').title = uiStrings.notification.loadingImage;
e.stopPropagation();
e.preventDefault();
$('#main_menu').hide();
const file = (e.type === 'drop') ? e.dataTransfer.files[0] : this.files[0];
if (!file) {
- $('#dialog_box').hide();
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
return;
}
@@ -2467,7 +2470,7 @@ editor.init = () => {
svgCanvas.alignSelectedElements('c', 'page');
// highlight imported element, otherwise we get strange empty selectbox
svgCanvas.selectOnly([newElement]);
- $('#dialog_box').hide();
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
};
reader.readAsText(file);
} else {
@@ -2497,7 +2500,7 @@ editor.init = () => {
svgCanvas.alignSelectedElements('m', 'page');
svgCanvas.alignSelectedElements('c', 'page');
editor.topPanelHandlers.updateContextPanel();
- $('#dialog_box').hide();
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
};
// create dummy img so we know the default dimensions
let imgWidth = 100;
@@ -2525,7 +2528,8 @@ editor.init = () => {
if (!ok) { return; }
svgCanvas.clear();
if (this.files.length === 1) {
- $.process_cancel(uiStrings.notification.loadingImage);
+ document.getElementById('se-alert-dialog').setAttribute('type', 'prompt_cancel');
+ document.getElementById('se-alert-dialog').title = uiStrings.notification.loadingImage;
const reader = new FileReader();
reader.onloadend = async function ({target}) {
await loadSvgString(target.result);
@@ -2691,7 +2695,8 @@ editor.loadFromURL = function (url, {cache, noAlert} = {}) {
dataType: 'text',
cache: Boolean(cache),
beforeSend () {
- $.process_cancel(uiStrings.notification.loadingImage);
+ document.getElementById('se-alert-dialog').setAttribute('type', 'prompt_cancel');
+ document.getElementById('se-alert-dialog').title = uiStrings.notification.loadingImage;
},
success (str) {
loadSvgString(str, {noAlert});
@@ -2705,11 +2710,13 @@ editor.loadFromURL = function (url, {cache, noAlert} = {}) {
reject(new Error('URLLoadFail'));
return;
}
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
+ document.getElementById('se-alert-dialog').setAttribute('type', 'alert');
document.getElementById('se-alert-dialog').title = uiStrings.notification.URLLoadFail + ': \n' + err;
resolve();
},
complete () {
- $('#dialog_box').hide();
+ document.getElementById('se-alert-dialog').setAttribute('close', true);
}
});
});