Code Block editor fixes + Image editor UI

This commit is contained in:
NGPixel 2016-09-12 00:00:52 -04:00
parent b524cd9f79
commit 10441de4e8
7 changed files with 54 additions and 7 deletions

File diff suppressed because one or more lines are too long

View File

@ -32,7 +32,7 @@ let vueCodeBlock = new Vue({
if(mde.codemirror.doc.somethingSelected()) {
mde.codemirror.execCommand('singleSelection');
}
let codeBlockText = '```' + vueCodeBlock.modeSelected + '\n' + codeEditor.getValue() + '\n```';
let codeBlockText = '\n```' + vueCodeBlock.modeSelected + '\n' + codeEditor.getValue() + '\n```\n';
mde.codemirror.doc.replaceSelection(codeBlockText);
vueCodeBlock.cancel();

View File

@ -88,11 +88,19 @@ if($('#mk-editor').length === 1) {
{
name: "image",
action: (editor) => {
//todo
$('#modal-editor-image').slideDown();
},
className: "fa fa-image",
title: "Insert Image",
},
{
name: "file",
action: (editor) => {
//todo
},
className: "fa fa-file-text-o",
title: "Insert File",
},
'|',
{
name: "inline-code",
@ -106,7 +114,7 @@ if($('#mk-editor').length === 1) {
return '`' + s + '`';
});
editor.codemirror.doc.replaceSelections(curSel);
},
className: "fa fa-terminal",
title: "Inline Code",

View File

@ -77,6 +77,7 @@
"remove-markdown": "^0.1.0",
"search-index": "^0.8.15",
"serve-favicon": "^2.3.0",
"sharp": "^0.16.0",
"simplemde": "^1.11.2",
"snyk": "^1.19.1",
"socket.io": "^1.4.8",

View File

@ -11,9 +11,11 @@
select(style={width: '300px'}, v-model='modeSelected')
option(v-for="mode in modes" v-bind:value='mode.name') {{ mode.caption }}
.column.is-narrow
a.button.is-warning.is-outlined(v-on:click="cancel") Cancel
.column.is-narrow
a.button.is-primary.is-outlined(v-on:click="insertCode") Insert Code Block
.control.is-grouped
p.control
a.button.is-warning.is-outlined(v-on:click="cancel") Cancel
p.control
a.button.is-primary.is-outlined(v-on:click="insertCode") Insert Code Block
.ace-container(style={'border-radius':'5px'})
#codeblock-editor

View File

@ -0,0 +1,35 @@
.modallayer#modal-editor-image
.modallayer-content
.columns
.column
h3 Image
.column.is-narrow
.control.is-grouped
p.control
a.button.is-dark.is-outlined(v-on:click="cancel")
span.icon.is-small: i.fa.fa-folder
span New Folder
.control.has-addons
a.button.is-info.is-outlined(v-on:click="cancel")
span.icon.is-small: i.fa.fa-upload
span Upload Image
a.button.is-info.is-outlined(v-on:click="cancel")
span.icon.is-small: i.fa.fa-download
span Fetch from URL
.column.is-narrow
.control.is-grouped
p.control
a.button.is-warning.is-outlined(v-on:click="cancel") Cancel
p.control
a.button.is-primary.is-outlined(v-on:click="insertCode") Insert Image
.columns
.column.is-one-quarter(style={'max-width':'350px'})
.box
| Folders
.column
| Files

View File

@ -23,4 +23,5 @@ block content
include ../modals/edit-discard.pug
include ../modals/editor-link.pug
include ../modals/editor-image.pug
include ../modals/editor-codeblock.pug