msb-public
/
wiki
mirror of https://github.com/requarks/wiki
1
0
Code Issues Projects Releases Wiki Activity

Paste Images

Browse Source
pull/6551/head
Andrew McFadden 1 year ago
parent f02b7ba94e
commit e52c26d726
2 changed files with 112 additions and 52 deletions
Show Stats Download Patch File Download Diff File

13
client/components/editor/common/cmFold.js
Unescape View File

@ -44,6 +44,19 @@ function foldHandler (cm, start) {
end++ end++
nextNextLine = cm.getLine(end + 1) nextNextLine = cm.getLine(end + 1)
} }
// -> Collapsable
} else if (cm.getLine(start.line).startsWith('<markdown collapsable')) {
end = start.line
let nextNextLine = cm.getLine(end + 1)
while (end < lastLineNo) {
if (nextNextLine.includes('</markdown>')) {
end++
break
}
end++
nextNextLine = cm.getLine(end + 1)
}
} else { } else {
// -> HEADER // -> HEADER

151
client/components/editor/editor-markdown.vue
Unescape View File

@ -433,21 +433,29 @@ export default {
this.processContent(newContent) this.processContent(newContent)
}, 600), }, 600),
onCmPaste (cm, ev) { onCmPaste (cm, ev) {
// const clipItems = (ev.clipboardData || ev.originalEvent.clipboardData).items const clipItems = (ev.clipboardData || ev.originalEvent.clipboardData).items
// for (let clipItem of clipItems) { for (let clipItem of clipItems) {
// if (_.startsWith(clipItem.type, 'image/')) { if (_.startsWith(clipItem.type, 'image/')) {
// const file = clipItem.getAsFile() const file = clipItem.getAsFile()
// const reader = new FileReader() console.log(file)
// reader.onload = evt => { const reader = new FileReader()
// this.$store.commit(`loadingStart`, 'editor-paste-image') reader.onload = evt => {
// this.insertAfter({ this.insertAfter({
// content: `![${file.name}](${evt.target.result})`, content: `<markdown collapsable title="${file.name}" type="Image">`,
// newLine: true newLine: true
// }) })
// } this.insertAfter({
// reader.readAsDataURL(file) content: `<img src="${evt.target.result}">`,
// } newLine: false
// } })
this.insertAfter({
content: `</markdown>`,
newLine: true
})
}
reader.readAsDataURL(file)
}
}
}, },
processContent (newContent) { processContent (newContent) {
linesMap = [] linesMap = []
@ -664,6 +672,8 @@ export default {
processMarkers (from, to) { processMarkers (from, to) {
let found = null let found = null
let foundStart = 0 let foundStart = 0
let markerTitle = ''
let markerType = ''
this.cm.doc.getAllMarks().forEach(mk => { this.cm.doc.getAllMarks().forEach(mk => {
if (mk.__kind) { if (mk.__kind) {
mk.clear() mk.clear()
@ -671,47 +681,84 @@ export default {
}) })
this.cm.eachLine(from, to, ln => { this.cm.eachLine(from, to, ln => {
const line = ln.lineNo() const line = ln.lineNo()
if (ln.text.startsWith('```diagram')) { if (found == null) {
found = 'diagram' if (ln.text.startsWith('```diagram')) {
foundStart = line found = 'diagram'
} else if (ln.text === '```' && found) { foundStart = line
switch (found) { markerTitle = 'Edit Diagram'
// ------------------------------ markerType = ''
// -> DIAGRAM } else if (ln.text.startsWith('<markdown collapsable')) {
// ------------------------------ found = 'collapsable'
case 'diagram': { foundStart = line
if (line - foundStart !== 2) { markerTitle = ''
return markerType = '<markdown>'
} let match = ln.text.match(/title="([^"]*)"/)
this.addMarker({ if (match) {
kind: 'diagram', markerTitle = match[1]
from: { line: foundStart, ch: 3 }, }
to: { line: foundStart, ch: 10 }, match = ln.text.match(/type="([^"]*)"/)
text: 'Edit Diagram', if (match) {
action: ((start, end) => { markerType = match[1]
return (ev) => { }
this.cm.doc.setSelection({ line: start, ch: 0 }, { line: end, ch: 3 }) }
try { } else if (found === 'diagram') {
const raw = this.cm.doc.getLine(end - 1) if (ln.text === '```' && found) {
this.$store.set('editor/activeModalData', Buffer.from(raw, 'base64').toString()) switch (found) {
this.toggleModal(`editorModalDrawio`) // ------------------------------
} catch (err) { // -> DIAGRAM
return this.$store.commit('showNotification', { // ------------------------------
message: 'Failed to process diagram data.', case 'diagram': {
style: 'warning', if (line - foundStart !== 2) {
icon: 'warning' return
}) }
this.addMarker({
kind: 'diagram',
from: { line: foundStart, ch: 3 },
to: { line: foundStart, ch: 10 },
text: markerTitle,
action: ((start, end) => {
return (ev) => {
this.cm.doc.setSelection({ line: start, ch: 0 }, { line: end, ch: 3 })
try {
const raw = this.cm.doc.getLine(end - 1)
this.$store.set('editor/activeModalData', Buffer.from(raw, 'base64').toString())
this.toggleModal(`editorModalDrawio`)
} catch (err) {
return this.$store.commit('showNotification', {
message: 'Failed to process diagram data.',
style: 'warning',
icon: 'warning'
})
}
} }
} })(foundStart, line)
})(foundStart, line) })
}) if (ln.height > 0) {
if (ln.height > 0) { this.cm.foldCode(foundStart)
this.cm.foldCode(foundStart) }
break
}
}
found = null
}
} else if (found === 'collapsable') {
if (ln.text.includes('</markdown>')) {
switch (found) {
case 'collapsable': {
this.addMarker({
kind: 'diagram',
from: { line: foundStart, ch: 0 },
to: { line: foundStart, ch: 120 },
text: markerType + ' ' + markerTitle
})
if (ln.height > 0) {
this.cm.foldCode(foundStart)
}
break
} }
break
} }
found = null
} }
found = null
} }
}) })
}, },

Write Preview
Loading…
Cancel
Save