Browse Source

CustomCategory: add a download action

master
parent
commit
ceae25456a
  1. 1
      lang/en.json
  2. 18
      src/customCategory.js
  3. 4
      style.css

1
lang/en.json

@ -9,6 +9,7 @@
"close": "Close", "close": "Close",
"closed": "closed", "closed": "closed",
"default": "default", "default": "default",
"download": "Download",
"apply": "Apply", "apply": "Apply",
"tip-tutorial": "Check out the [Tutorial]", "tip-tutorial": "Check out the [Tutorial]",
"customCategory:header": "Custom categories", "customCategory:header": "Custom categories",

18
src/customCategory.js

@ -123,6 +123,17 @@ class CustomCategoryEditor {
inputClose.onclick = () => this.window.close() inputClose.onclick = () => this.window.close()
controls.appendChild(inputClose) controls.appendChild(inputClose)
const icons = document.createElement('div')
icons.className = 'actions'
controls.appendChild(icons)
this.inputDownload = document.createElement('a')
this.textarea.onchange = () => this.updateDownload()
this.updateDownload()
this.inputDownload.title = lang('download')
this.inputDownload.innerHTML = '<i class="fas fa-download"></i>'
icons.appendChild(this.inputDownload)
const tutorial = document.createElement('span') const tutorial = document.createElement('span')
tutorial.className = 'tip-tutorial' tutorial.className = 'tip-tutorial'
let text = lang('tip-tutorial') let text = lang('tip-tutorial')
@ -150,6 +161,7 @@ class CustomCategoryEditor {
if (this.textarea) { if (this.textarea) {
this.textarea.value = content this.textarea.value = content
this.updateDownload()
} }
const id = md5(content) const id = md5(content)
@ -171,6 +183,12 @@ class CustomCategoryEditor {
this.category.open() this.category.open()
}) })
} }
updateDownload () {
const file = new Blob([this.textarea.value], { type: 'application/yaml' })
this.inputDownload.href = URL.createObjectURL(file)
this.inputDownload.download = md5(this.textarea.value) + '.yaml'
}
} }

4
style.css

@ -622,6 +622,10 @@ ul.overpass-layer-list > li > a > .content > .details {
.Window > .content .controls { .Window > .content .controls {
flex-grow: 0; flex-grow: 0;
} }
.Window > .content .controls > .actions {
margin-left: 1em;
display: inline;
}
/* Window */ /* Window */
.Window { .Window {

Loading…
Cancel
Save