diff --git a/assets/css/index.css b/assets/css/index.css index 4a07a89..46e898a 100644 --- a/assets/css/index.css +++ b/assets/css/index.css @@ -773,8 +773,6 @@ u { .notification .inline { width: auto; height: auto; - padding: .2em; - margin: -.2em 0; border-radius: 3px; font-size: 85%; font-family: Consolas, Andale Mono WT, Andale Mono, Lucida Console, Lucida Sans Typewriter, DejaVu Sans Mono, Bitstream Vera Sans Mono, Liberation Mono, Nimbus Mono L, Monaco, Courier New, Courier, monospace; @@ -782,11 +780,12 @@ u { border: none; overflow: hidden; white-space: pre-wrap; - background-color: #4a3535; color: white; color: inherit; - background-color: inherit; - border: 1px dashed; + /* border: 1px dashed; */ + padding: .3em 0em; + border-radius: 2px; + margin: -.2em 5px; } @keyframes notifAn { @@ -1253,7 +1252,7 @@ textarea { .browse.error>p::after { color: #ee9191; - content: "Request failed. (Check dev-tools)"; + content: "Request failed. (Check console)"; } .linkName { @@ -1651,8 +1650,9 @@ body { height: 100%; } .notification .inline { - display: block; margin-top: 5px; + background-color: #20222500; + border: none; } .bottom .colrs { bottom: 40px; diff --git a/assets/js/index.js b/assets/js/index.js index e18ed05..dd2ced7 100644 --- a/assets/js/index.js +++ b/assets/js/index.js @@ -99,9 +99,21 @@ window.onload = () => { .onfinish = () => notif.style.removeProperty('display'), time); return false; }, allGood = e => { - let re = /"((icon_)?url")(: *)("(?!https?:\/\/).+?")/g.exec(editor.getValue()); - if (re) return error(`URL should start with https:// or http:// on this line ${makeShort(re[0], 30, 600)}`); + let str = JSON.stringify(e, null, 4), re = /("(?:icon_)?url": *")((?!\w+?:\/\/).+)"/g.exec(str); if (e.timestamp && new Date(e.timestamp).toString() === "Invalid Date") return error('Timestamp is invalid'); + if (re) { // If URL witout protocol is found in JSON + if (!/\w+:|\/\/|^\//g.exec(re[2]) && re[2].includes('.')) { + let activeInput = document.querySelector('input[class$="link" i]:focus') + if (activeInput){ + lastPos = activeInput.selectionStart + 7; + authorLink.value = `http://${re[2]}`; + update(JSON.parse(str.replace(re[0], `${re[1]}http://${re[2]}"`))); + activeInput.setSelectionRange(lastPos, lastPos) + return true; + } + } + return error(`URL should have a protocol. Did you mean http://${makeShort(re[2], 30, 600).replace(' ', '')}?`); + } return true; }, markup = (txt, opts) => { txt = txt @@ -148,237 +160,237 @@ window.onload = () => { toObj = jsonString => JSON.parse(jsonString.replace(/\\"|"(?:\\"|[^"])*"|(\/\/.*|\/\*[\s\S]*?\*\/)/g, (x, y) => y ? "" : x)); buildGui = (object, opts) => { gui.innerHTML = ` -

Message content

-
- -
-

Author

-
-
-
- - -
-
- -
+

Message content

+
+ +
+

Author

+
+
+
+ +
-
- - - -
-
-
-
-
-

Title

- -
-

Description

-
- -
-

Fields

-
-

Thumbnail

-
-
-
- -
- -
- - - -
-
-
+
+
-

Image

-
-
-
- -
- -
- - - -
-
-
-
-
-

Footer

-
-
-
- - -
-
- -
-
-
- - - -
-
`; - - let fieldsEditor = gui.querySelector('.fields ~ .edit'), addField = ` -
-

New Field

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
`; - if (object.embed?.fields) fieldsEditor.innerHTML = object.embed.fields.filter(f => f && typeof f === 'object').map(f => ` -
-
-
-
- -
-
- -
-
-
- -
-
- +
+ + +
+ - + + - Remove + + + + + + + + + + + + + +

-
`).join('\n') + addField; + + +
+
+
+
+

Title

+ +
+

Description

+
+ +
+

Fields

+
+

Thumbnail

+
+
+
+ +
+ +
+ + + +
+
+
+
+
+

Image

+
+
+
+ +
+ +
+ + + +
+
+
+
+
+

Footer

+
+
+
+ + +
+
+ +
+
+
+ + + +
+
`; + + let fieldsEditor = gui.querySelector('.fields ~ .edit'), addField = ` +
+

New Field

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
`; + if (object.embed?.fields) fieldsEditor.innerHTML = object.embed.fields.filter(f => f && typeof f === 'object').map(f => ` +
+
+
+
+ +
+
+ +
+
+
+ +
+
+ + + + + + Remove +
+
`).join('\n') + addField; else fieldsEditor.innerHTML = addField; gui.querySelectorAll('.removeBtn').forEach(e => { @@ -437,32 +449,32 @@ window.onload = () => { }) gui.querySelectorAll('textarea, input').forEach(e => e.addEventListener('input', el => { - let v = el.target.value, field = el.target.closest('.field'); + let value = el.target.value, field = el.target.closest('.field'); if (field) { let jsonField = json.embed.fields[Array.from(fields.children).indexOf(field)]; if (jsonField) { - if (el.target.type === 'text') jsonField.name = v; - else if (el.target.type === 'textarea') jsonField.value = v; + if (el.target.type === 'text') jsonField.name = value; + else if (el.target.type === 'textarea') jsonField.value = value; else jsonField.inline = el.target.checked; } else { let obj = {} - if (el.target.type === 'text') obj.name = v; - else if (el.target.type === 'textarea') obj.value = v; + if (el.target.type === 'text') obj.name = value; + else if (el.target.type === 'textarea') obj.value = value; else obj.inline = el.target.checked; json.embed.fields.push(obj); } } else { json.embed ??= {}; switch (el.target) { - case content: json.content = v; break; - case title: json.embed.title = v; break; - case authorName: json.embed.author ??= {}, json.embed.author.name = v; break; - case authorLink: json.embed.author ??= {}, json.embed.author.icon_url = v, imgSrc(el.target.previousElementSibling, v); break; - case desc: json.embed.description = v; break; - case thumbLink: json.embed.thumbnail ??= {}, json.embed.thumbnail.url = v, imgSrc(el.target.closest('.editIcon').querySelector('.imgParent'), v); break; - case imgLink: json.embed.image ??= {}, json.embed.image.url = v, imgSrc(el.target.closest('.editIcon').querySelector('.imgParent'), v); break; - case footerText: json.embed.footer ??= {}, json.embed.footer.text = v; break; - case footerLink: json.embed.footer ??= {}, json.embed.footer.icon_url = v, imgSrc(el.target.previousElementSibling, v); break; + case content: json.content = value; break; + case title: json.embed.title = value; break; + case authorName: json.embed.author ??= {}, json.embed.author.name = value; break; + case authorLink: json.embed.author ??= {}, json.embed.author.icon_url = value, imgSrc(el.target.previousElementSibling, value); break; + case desc: json.embed.description = value; break; + case thumbLink: json.embed.thumbnail ??= {}, json.embed.thumbnail.url = value, imgSrc(el.target.closest('.editIcon').querySelector('.imgParent'), value); break; + case imgLink: json.embed.image ??= {}, json.embed.image.url = value, imgSrc(el.target.closest('.editIcon').querySelector('.imgParent'), value); break; + case footerText: json.embed.footer ??= {}, json.embed.footer.text = value; break; + case footerLink: json.embed.footer ??= {}, json.embed.footer.icon_url = value, imgSrc(el.target.previousElementSibling, value); break; } } update(json); @@ -510,13 +522,13 @@ window.onload = () => { imgSrc(e.target.previousElementSibling.querySelector('.editIcon > .imgParent') || e.target.closest('.editIcon').querySelector('.imgParent'), res.link); let input = e.target.previousElementSibling.querySelector('.editIcon > input') || e.target.previousElementSibling; input.value = res.link; - if (input === authorLink) json.embed.author.icon_url = res.link; - else if (input === thumbLink) json.embed.thumbnail.url = res.link; - else if (input === imgLink) json.embed.image.url = res.link; - else json.embed.footer.icon_url = res.link; + if (input === authorLink) ((json.embed ??= {}).author ??= {}).icon_url = res.link; + else if (input === thumbLink) ((json.embed ??= {}).thumbnail ??= {}).url = res.link; + else if (input === imgLink) ((json.embed ??= {}).image ??= {}).url = res.link; + else ((json.embed ??= {}).footer ??= {}).url = res.link; update(json); - console.info(`Image (${res.link}) will be deleted in 5 minutes. To delete it now got to ${res.link.replace('/files', '/del')} and enter this code: ${res.authkey}`); - }).catch(err => `Request to tempfile.site failed with error: ${err}`) + console.info(`Image (${res.link}) will be deleted in 10 minutes. To delete it now, go to ${res.link.replace('/files', '/del')} and enter this code: ${res.authkey}`); + }).catch(err => error(`Request to tempfile.site failed with error: ${err}`, 5000)) })) } @@ -649,7 +661,7 @@ window.onload = () => { }) document.querySelector('.clear').addEventListener('click', () => { - json = { }; + json = {}; embed.style.removeProperty('border-color'); picker.source.style.removeProperty('background'); update(json); buildGui(json); editor.setValue(JSON.stringify(json, null, 4));