Deal with data:image in icon image form

This commit is contained in:
Yohan Boniface 2023-12-20 11:45:00 +01:00
parent 417f1b9d08
commit cab87cd59f
2 changed files with 22 additions and 14 deletions

View file

@ -260,6 +260,18 @@ L.Util.hasVar = (value) => {
return typeof value === 'string' && value.indexOf('{') != -1 return typeof value === 'string' && value.indexOf('{') != -1
} }
L.Util.isPath = function (value) {
return value && value.length && value.startsWith('/')
}
L.Util.isRemoteUrl = function (value) {
return value && value.length && value.startsWith('http')
}
L.Util.isDataImage = function (value) {
return value && value.length && value.startsWith('data:image')
}
L.Util.copyToClipboard = function (textToCopy) { L.Util.copyToClipboard = function (textToCopy) {
// https://stackoverflow.com/a/65996386 // https://stackoverflow.com/a/65996386
// Navigator clipboard api needs a secure context (https) // Navigator clipboard api needs a secure context (https)

View file

@ -538,8 +538,8 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
this.footer.innerHTML = '' this.footer.innerHTML = ''
this.buildTabs() this.buildTabs()
const value = this.value() const value = this.value()
if (!value || value.startsWith('/')) this.showSymbolsTab() if (!value || L.Util.isPath(value)) this.showSymbolsTab()
else if (value.startsWith('http')) this.showURLTab() else if (L.Util.isRemoteUrl(value) || L.Util.isDataImage(value)) this.showURLTab()
else this.showCharsTab() else this.showCharsTab()
const closeButton = L.DomUtil.createButton( const closeButton = L.DomUtil.createButton(
'button action-button', 'button action-button',
@ -596,18 +596,11 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
this.body.innerHTML = '' this.body.innerHTML = ''
}, },
isPath: function () {
const value = this.value()
return value && value.length && value.startsWith('/')
},
isRemoteUrl: function () {
const value = this.value()
return value && value.length && value.startsWith('http')
},
isImg: function () { isImg: function () {
return this.isPath() || this.isRemoteUrl() const value = this.value()
return (
L.Util.isPath(value) || L.Util.isRemoteUrl(value) || L.Util.isDataImage(value)
)
}, },
updatePreview: function () { updatePreview: function () {
@ -731,7 +724,10 @@ L.FormBuilder.IconUrl = L.FormBuilder.BlurInput.extend({
showURLTab: function () { showURLTab: function () {
this.openTab('url') this.openTab('url')
const value = this.isRemoteUrl() ? this.value() : null const value =
L.Util.isRemoteUrl(this.value()) || L.Util.isDataImage(this.value())
? this.value()
: null
const input = this.buildInput(this.body, value) const input = this.buildInput(this.body, value)
input.placeholder = L._('Add image URL') input.placeholder = L._('Add image URL')
input.type = 'url' input.type = 'url'