diff --git a/client/components/editor/editor-markdown.vue b/client/components/editor/editor-markdown.vue
index 9253241d..ded4833e 100644
--- a/client/components/editor/editor-markdown.vue
+++ b/client/components/editor/editor-markdown.vue
@@ -1,9 +1,9 @@
.editor-markdown
- v-toolbar.editor-markdown-toolbar(dense, color='primary', dark, flat)
+ v-toolbar.editor-markdown-toolbar(dense, color='primary', dark, flat, style='overflow-x: hidden;')
v-btn.animated.fadeInLeft(v-if='isModalShown', flat, @click='closeAllModal')
- v-icon(left) chevron_left
- span Back
+ v-icon(left) close
+ span Back to Editor
template(v-else)
v-tooltip(bottom, color='primary')
v-btn.animated.fadeIn(icon, slot='activator', @click='toggleMarkup({ start: `**` })').mx-0
@@ -92,45 +92,42 @@
span Insert Link
v-tooltip(right, color='teal')
v-btn.animated.fadeInLeft.wait-p1s(icon, slot='activator', dark, @click='toggleModal(`editorModalMedia`)').mx-0
- v-icon(:color='activeModal === `editorModalMedia` ? `teal` : ``') image
- span Insert Image
+ v-icon(:color='activeModal === `editorModalMedia` ? `teal` : ``') burst_mode
+ span Insert Assets
v-tooltip(right, color='teal')
v-btn.animated.fadeInLeft.wait-p2s(icon, slot='activator', dark, @click='toggleModal(`editorModalBlocks`)').mx-0
v-icon(:color='activeModal === `editorModalBlocks` ? `teal` : ``') dashboard
span Insert Block
v-tooltip(right, color='teal')
v-btn.animated.fadeInLeft.wait-p3s(icon, slot='activator', dark, disabled).mx-0
- v-icon insert_drive_file
- span Insert File
- v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p4s(icon, slot='activator', dark, disabled).mx-0
v-icon code
span Insert Code Block
v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p5s(icon, slot='activator', dark, disabled).mx-0
+ v-btn.animated.fadeInLeft.wait-p4s(icon, slot='activator', dark, disabled).mx-0
v-icon play_circle_outline
span Insert Video / Audio
v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p6s(icon, slot='activator', dark, disabled).mx-0
+ v-btn.animated.fadeInLeft.wait-p5s(icon, slot='activator', dark, disabled).mx-0
v-icon multiline_chart
span Insert Diagram
v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p7s(icon, slot='activator', dark, disabled).mx-0
+ v-btn.animated.fadeInLeft.wait-p6s(icon, slot='activator', dark, disabled).mx-0
v-icon functions
span Insert Math Expression
v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p8s(icon, slot='activator', dark, disabled).mx-0
+ v-btn.animated.fadeInLeft.wait-p7s(icon, slot='activator', dark, disabled).mx-0
v-icon border_outer
span Table Helper
- v-spacer
- v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p9s(icon, slot='activator', dark, @click='toggleFullscreen').mx-0
- v-icon crop_free
- span Distraction Free Mode
- v-tooltip(right, color='teal')
- v-btn.animated.fadeInLeft.wait-p10s(icon, slot='activator', dark, @click='toggleHelp').mx-0
- v-icon(:color='helpShown ? `teal` : ``') help
- span Markdown Formatting Help
+ template(v-if='$vuetify.breakpoint.mdAndUp')
+ v-spacer
+ v-tooltip(right, color='teal')
+ v-btn.animated.fadeInLeft.wait-p8s(icon, slot='activator', dark, @click='toggleFullscreen').mx-0
+ v-icon crop_free
+ span Distraction Free Mode
+ v-tooltip(right, color='teal')
+ v-btn.animated.fadeInLeft.wait-p9s(icon, slot='activator', dark, @click='toggleHelp').mx-0
+ v-icon(:color='helpShown ? `teal` : ``') help
+ span Markdown Formatting Help
.editor-markdown-editor
.editor-markdown-editor-title(v-if='previewShown', @click='previewShown = false') Editor
.editor-markdown-editor-title(v-else='previewShown', @click='previewShown = true'): v-icon(dark) drag_indicator
@@ -143,10 +140,11 @@
v-system-bar.editor-markdown-sysbar(dark, status, color='grey darken-3')
.caption.editor-markdown-sysbar-locale {{locale.toUpperCase()}}
.caption.px-3 /{{path}}
- v-spacer
- .caption Markdown
- v-spacer
- .caption Ln {{cursorPos.line + 1}}, Col {{cursorPos.ch + 1}}
+ template(v-if='$vuetify.breakpoint.mdAndUp')
+ v-spacer
+ .caption Markdown
+ v-spacer
+ .caption Ln {{cursorPos.line + 1}}, Col {{cursorPos.ch + 1}}
markdown-help(v-if='helpShown')
@@ -329,7 +327,11 @@ export default {
return false
})
- cm.setSize(null, 'calc(100vh - 112px - 24px)')
+ if (this.$vuetify.breakpoint.mdAndUp) {
+ cm.setSize(null, 'calc(100vh - 112px - 24px)')
+ } else {
+ cm.setSize(null, 'calc(100vh - 112px - 16px)')
+ }
cm.setOption('extraKeys', keyBindings)
cm.on('cursorActivity', cm => {
this.positionSync(cm)
@@ -462,6 +464,7 @@ export default {
diff --git a/client/components/editor/editor-modal-properties.vue b/client/components/editor/editor-modal-properties.vue
index 0700c8a3..2814bb9c 100644
--- a/client/components/editor/editor-modal-properties.vue
+++ b/client/components/editor/editor-modal-properties.vue
@@ -4,6 +4,7 @@
persistent
lazy
width='1100'
+ :fullscreen='$vuetify.breakpoint.smAndDown'
)
.dialog-header
v-icon(color='white') sort_by_alpha
diff --git a/client/components/editor/markdown/help.vue b/client/components/editor/markdown/help.vue
index ebec5a2a..3c0de729 100644
--- a/client/components/editor/markdown/help.vue
+++ b/client/components/editor/markdown/help.vue
@@ -2,7 +2,7 @@
v-card.editor-markdown-help.animated.fadeInLeft(flat, tile)
v-container.pa-3(grid-list-lg, fluid)
v-layout(row, wrap)
- v-flex(xs4)
+ v-flex(xs12, lg6, xl4)
v-card.radius-7.animated.fadeInUp(light)
v-card-text
.d-flex
@@ -98,7 +98,7 @@
li Unordered List Item 2
li Unordered List Item 3
- v-flex(xs4)
+ v-flex(xs12, lg6, xl4)
v-card.radius-7.animated.fadeInUp.wait-p1s(light)
v-card-text
.d-flex
@@ -196,7 +196,7 @@
v-card-text
blockquote(style='border: 1px solid #263238; border-radius: .5rem; padding: 1rem 24px;') Lorem ipsum#[br]dolor sit amet#[br]consectetur adipiscing elit
- v-flex(xs4)
+ v-flex(xs12, xl4)
v-card.radius-7.animated.fadeInUp.wait-p2s(light)
v-card-text
v-toolbar.radius-7(color='teal lighten-5', dense, flat)
diff --git a/client/scss/components/v-dialog.scss b/client/scss/components/v-dialog.scss
index ab834749..c7dc20f1 100644
--- a/client/scss/components/v-dialog.scss
+++ b/client/scss/components/v-dialog.scss
@@ -27,3 +27,9 @@
radial-gradient(ellipse at bottom, mc('grey', '800'), mc('grey', '900'));
}
}
+
+.v-dialog--fullscreen {
+ @include until($tablet) {
+ padding-top: 56px;
+ }
+}
diff --git a/server/graph/resolvers/asset.js b/server/graph/resolvers/asset.js
index e05600f1..4f85762b 100644
--- a/server/graph/resolvers/asset.js
+++ b/server/graph/resolvers/asset.js
@@ -12,10 +12,13 @@ module.exports = {
},
AssetQuery: {
async list(obj, args, context) {
- const result = await WIKI.models.assets.query().where({
- folderId: null,
- kind: args.kind.toLowerCase()
- })
+ let cond = {
+ folderId: null
+ }
+ if (args.kind !== 'ALL') {
+ cond.kind = args.kind.toLowerCase()
+ }
+ const result = await WIKI.models.assets.query().where(cond)
return result.map(a => ({
...a,
kind: a.kind.toUpperCase()
diff --git a/server/graph/schemas/asset.graphql b/server/graph/schemas/asset.graphql
index 03a52d4d..04077668 100644
--- a/server/graph/schemas/asset.graphql
+++ b/server/graph/schemas/asset.graphql
@@ -56,4 +56,5 @@ type AssetFolder {
enum AssetKind {
IMAGE
BINARY
+ ALL
}
diff --git a/server/models/assets.js b/server/models/assets.js
index 1ccecd55..99297976 100644
--- a/server/models/assets.js
+++ b/server/models/assets.js
@@ -96,13 +96,9 @@ module.exports = class Asset extends Model {
}
static async getAsset(assetPath, res) {
- let asset = await WIKI.models.assets.getAssetFromCache(assetPath, res)
- if (!asset) {
- // asset = await WIKI.models.assets.getAssetFromDb(assetPath, res)
- // if (asset) {
- // await WIKI.models.assets.saveAssetToCache(asset)
- // }
- res.sendStatus(404)
+ let assetExists = await WIKI.models.assets.getAssetFromCache(assetPath, res)
+ if (!assetExists) {
+ await WIKI.models.assets.getAssetFromDb(assetPath, res)
}
}
@@ -121,4 +117,19 @@ module.exports = class Asset extends Model {
})
})
}
+
+ static async getAssetFromDb(assetPath, res) {
+ const fileHash = assetHelper.generateHash(assetPath)
+ const cachePath = path.join(process.cwd(), `data/cache/${fileHash}.dat`)
+
+ const asset = await WIKI.models.assets.query().where('hash', fileHash).first()
+ if (asset) {
+ const assetData = await WIKI.models.knex('assetData').where('id', asset.id).first()
+ res.type(asset.ext)
+ res.send(assetData.data)
+ await fs.outputFile(cachePath, assetData.data)
+ } else {
+ res.sendStatus(404)
+ }
+ }
}