From 78cdbcfa72cb42e407dc657fc02645df3d87e52a Mon Sep 17 00:00:00 2001 From: Peter Stuifzand Date: Mon, 1 Jun 2020 01:17:44 +0200 Subject: [PATCH] Add slash commands --- editor/package-lock.json | 5 ++ editor/package.json | 1 + editor/src/fuse.js | 16 ++++- editor/src/index.js | 122 +++++++++++++++++++++++++++++---------- 4 files changed, 111 insertions(+), 33 deletions(-) diff --git a/editor/package-lock.json b/editor/package-lock.json index 69320a2..293984b 100644 --- a/editor/package-lock.json +++ b/editor/package-lock.json @@ -4252,6 +4252,11 @@ "minimist": "^1.2.5" } }, + "moment": { + "version": "2.26.0", + "resolved": "https://registry.npmjs.org/moment/-/moment-2.26.0.tgz", + "integrity": "sha512-oIixUO+OamkUkwjhAVE18rAMfRJNsNe/Stid/gwHSOfHrOtw9EhAY2AHvdKZ/k/MggcYELFCJz/Sn2pL8b8JMw==" + }, "move-concurrently": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/move-concurrently/-/move-concurrently-1.0.1.tgz", diff --git a/editor/package.json b/editor/package.json index c20d084..5d9183e 100644 --- a/editor/package.json +++ b/editor/package.json @@ -15,6 +15,7 @@ "fuse.js": "^6.0.0", "jquery-contextmenu": "^2.9.2", "lunr": "^2.3.8", + "moment": "^2.26.0", "mustache": "^4.0.1", "node-sass": "^4.14.1", "sass-loader": "^7.3.1", diff --git a/editor/src/fuse.js b/editor/src/fuse.js index 7343c52..9baffda 100644 --- a/editor/src/fuse.js +++ b/editor/src/fuse.js @@ -8,12 +8,24 @@ function createTitleSearch() { keys: ['title'], } + let commands = [ + {title: 'Current Time', name: 'time'}, + {title: 'Today', name: 'today'}, + {title: 'Tomorrow', name: 'tomorrow'}, + {title: 'Yesterday', name: 'yesterday'}, + {title: 'TODO', name: 'todo'}, + {title: 'Page Reference', name: 'page_reference'}, + ]; + const fuseIndex = Fuse.createIndex(options.keys, documents) - let fuse = new Fuse(documents, options, fuseIndex) + let titleFuse = new Fuse(documents, options, fuseIndex) + let commandFuse = new Fuse(commands, {keys: ['title', 'name']}) resolve({ documents, - search: fuse, + titleSearch: titleFuse, + commandSearch: commandFuse, + commands: commands, }) }) }) diff --git a/editor/src/index.js b/editor/src/index.js index fbf301f..7967e5c 100644 --- a/editor/src/index.js +++ b/editor/src/index.js @@ -7,10 +7,12 @@ import createPageSearch from './fuse'; import Mustache from 'mustache'; import 'jquery-contextmenu'; import getCaretCoordinates from './caret-position' - +import moment from 'moment' import './styles.scss'; import '../node_modules/jquery-contextmenu/dist/jquery.contextMenu.css'; +moment.locale('nl') + function addSaver(editor, saveUrl, page, beforeSave) { return { save() { @@ -61,6 +63,28 @@ function addIndicator(editor, indicator) { } let holder = document.getElementById('editor'); + +function showSearchResults(searchTool, query, input, value, resultType) { + let results = searchTool(query) + + if (results.length === 0) { + return + } + + let pos = getCaretCoordinates(input, value.selectionEnd, {}) + let off = $(input).offset() + pos.top += off.top + pos.height + pos.left += off.left + + const $lc = $('#link-complete') + $lc.data('result-type', resultType) + $lc.offset(pos) + + var template = document.getElementById('link-template').innerHTML; + var rendered = Mustache.render(template, {results: results}, {}, ['[[', ']]']); + $lc.html(rendered).fadeIn() +} + if (holder) { let editor = listEditor(holder, JSON.parse(holder.dataset.input)); @@ -89,7 +113,7 @@ if (holder) { if (event.key === 'Enter') { const linkName = $popup.find('li.selected').text() - $popup.trigger('popup:selected', [linkName]) + $popup.trigger('popup:selected', [linkName, $popup.data('result-type')]) $popup.fadeOut() return false } @@ -123,20 +147,56 @@ if (holder) { return true }) - createPageSearch().then(function ({search}) { + createPageSearch().then(function ({titleSearch, commandSearch, commands}) { editor.on('start-editing', function (input) { const $lc = $('#link-complete') - $lc.on('popup:selected', function (event, linkName) { + $lc.on('popup:selected', function (event, linkName, resultType) { let value = input.value let end = input.selectionEnd - let start = value.lastIndexOf("[[", end) - end += 2 - let startAndLink = value.substring(0, start) + "[[" + linkName + "]]" - input.value = startAndLink + value.substring(end) - input.selectionStart = startAndLink.length - input.selectionEnd = startAndLink.length - input.focus() + if (resultType === 'link') { + let start = value.lastIndexOf("[[", end) + end += 2 + let startAndLink = value.substring(0, start) + "[[" + linkName + "]]" + input.value = startAndLink + value.substring(end) + input.selectionStart = startAndLink.length + input.selectionEnd = startAndLink.length + input.focus() + } else if (resultType === 'command') { + let start = value.lastIndexOf("/", end) + let commandResult = "" + let prefix = false + let adjustment = 0 + + let now = moment() + + if (linkName === "Current Time") { + commandResult = now.format('HH:mm') + } else if (linkName === "Today") { + commandResult = "[[" + now.format('D MMMM YYYY') + "]]" + } else if (linkName === "Tomorrow") { + commandResult = "[[" + now.add(1, 'day').format('D MMMM YYYY') + "]]" + } else if (linkName === "Yesterday") { + commandResult = "[[" + now.add(-1, 'day').format('D MMMM YYYY') + "]]" + } else if (linkName === "TODO") { + commandResult = "#[[TODO]] " + prefix = true + } else if (linkName === "Page Reference") { + commandResult = "[[]]" + adjustment = -2 + } + + let startAndLink = prefix + ? commandResult + value.substring(0, start) + : value.substring(0, start) + commandResult + + input.value = startAndLink + value.substring(end) + + input.selectionStart = startAndLink.length + adjustment + input.selectionEnd = startAndLink.length + adjustment + + input.focus() + } return true }) @@ -164,34 +224,34 @@ if (holder) { $(input).on('keyup', function () { let value = input.value let end = input.selectionEnd + + let insideLink = true + let insideSearch = false + let start = value.lastIndexOf("[[", end) if (start < 0) { - return true + insideLink = false } let linkEnd = value.lastIndexOf("]]", end - 1) - if (start < linkEnd) { - return true - } - let query = value.substring(start+2, end); - let results = search.search(query) - - if (results.length === 0) { - return true + if (insideLink && start < linkEnd) { + insideLink = false } - let pos = getCaretCoordinates(input, value.selectionEnd, {}) - let off = $(input).offset() - pos.top += off.top + pos.height - pos.left += off.left + if (!insideLink) { + start = value.lastIndexOf("/", end) + insideSearch = start >= 0 + } - const $lc = $('#link-complete') - $lc.offset(pos) - - var template = document.getElementById('link-template').innerHTML; - var rendered = Mustache.render(template, {results: results}, {}, ['[[', ']]']); - $lc.html(rendered).fadeIn() - return true + if (insideSearch) { + let query = value.substring(start + 1, end); + showSearchResults(query => commandSearch.search(query), query, input, value, 'command'); + return true + } else if (insideLink) { + let query = value.substring(start + 2, end); + showSearchResults(query => titleSearch.search(query), query, input, value, 'link'); + return true + } }) })