zadam/trilium
1
1
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2024-09-20 15:45:58 +08:00
Code Issues Packages Projects Releases Wiki Activity

add link dialog should recognize external links, closes #1521

Browse source
This commit is contained in:
zadam 2021-01-08 21:44:43 +01:00
parent 9fcd659df4
commit cd653b9f0c
5 changed files with 99 additions and 28 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
package-lock.json generated
View file

@ -2361,9 +2361,9 @@
}
},
"dayjs": {
"version": "1.10.1",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.1.tgz",
"integrity": "sha512-2xg7JrHQeLBQFkvTumLoy62x1siyeocc98QwjtURgvRqOPYmAkMUdmSjrOA+MlmL6QMQn5MUhDf6rNZNuPc1LQ=="
"version": "1.10.2",
"resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.10.2.tgz",
"integrity": "sha512-h/YtykNNTR8Qgtd1Fxl5J1/SFP1b7SOk/M1P+Re+bCdFMV0IMkuKNgHPN7rlvvuhfw24w0LX78iYKt4YmePJNQ=="
},
"debug": {
"version": "4.1.1",

4
package.json
View file

@ -32,7 +32,7 @@
"commonmark": "0.29.3",
"cookie-parser": "1.4.5",
"csurf": "1.11.0",
"dayjs": "1.10.1",
"dayjs": "1.10.2",
"ejs": "3.1.5",
"electron-debug": "3.2.0",
"electron-dl": "3.0.2",
@ -54,7 +54,7 @@
"mime-types": "2.1.28",
"multer": "1.4.2",
"node-abi": "2.19.3",
"open": "7.3.0",
"open": "7.3.1",
"portscanner": "2.2.0",
"rand-token": "1.0.1",
"request": "^2.88.2",

62
src/public/app/dialogs/add_link.js
View file

@ -7,6 +7,7 @@ const $form = $("#add-link-form");
const $autoComplete = $("#add-link-note-autocomplete");
const $linkTitle = $("#link-title");
const $addLinkTitleSettings = $("#add-link-title-settings");
const $addLinkTitleRadios = $(".add-link-title-radios");
const $addLinkTitleFormGroup = $("#add-link-title-form-group");
/** @var TextTypeWidget */
@ -17,7 +18,7 @@ export async function showDialog(widget, text = '') {
$addLinkTitleSettings.toggle(!textTypeWidget.hasSelection());
$addLinkTitleSettings.find('input[type=radio]').on('change', updateTitleFormGroupVisibility);
$addLinkTitleSettings.find('input[type=radio]').on('change', updateTitleSettingsVisibility);
// with selection hyper link is implied
if (textTypeWidget.hasSelection()) {
@ -27,7 +28,7 @@ export async function showDialog(widget, text = '') {
$addLinkTitleSettings.find("input[value='reference-link']").prop("checked", true);
}
updateTitleFormGroupVisibility();
updateTitleSettingsVisibility();
utils.openDialog($dialog);
@ -40,13 +41,15 @@ export async function showDialog(widget, text = '') {
$linkTitle.val(noteTitle);
}
noteAutocompleteService.initNoteAutocomplete($autoComplete);
noteAutocompleteService.initNoteAutocomplete($autoComplete, { allowExternalLinks: true });
$autoComplete.on('autocomplete:noteselected', function(event, suggestion, dataset) {
$autoComplete.on('autocomplete:noteselected', (event, suggestion, dataset) => {
if (!suggestion.notePath) {
return false;
}
updateTitleSettingsVisibility();
const noteId = treeService.getNoteIdFromNotePath(suggestion.notePath);
if (noteId) {
@ -54,11 +57,26 @@ export async function showDialog(widget, text = '') {
}
});
$autoComplete.on('autocomplete:cursorchanged', function(event, suggestion, dataset) {
const noteId = treeService.getNoteIdFromNotePath(suggestion.notePath);
$autoComplete.on('autocomplete:externallinkselected', (event, suggestion, dataset) => {
if (!suggestion.externalLink) {
return false;
}
if (noteId) {
setDefaultLinkTitle(noteId);
updateTitleSettingsVisibility();
$linkTitle.val(suggestion.externalLink);
});
$autoComplete.on('autocomplete:cursorchanged', function(event, suggestion, dataset) {
if (suggestion.externalLink) {
$linkTitle.val(suggestion.externalLink)
}
else {
const noteId = treeService.getNoteIdFromNotePath(suggestion.notePath);
if (noteId) {
setDefaultLinkTitle(noteId);
}
}
});
@ -69,31 +87,41 @@ export async function showDialog(widget, text = '') {
noteAutocompleteService.showRecentNotes($autoComplete);
}
$autoComplete.trigger('focus');
$autoComplete
.trigger('focus')
.trigger('select'); // to be able to quickly remove entered text
}
function getLinkType() {
if ($autoComplete.getSelectedExternalLink()) {
return 'external-link';
}
return $addLinkTitleSettings.find('input[type=radio]:checked').val();
}
function updateTitleFormGroupVisibility() {
const visible = getLinkType() === 'hyper-link';
function updateTitleSettingsVisibility() {
const linkType = getLinkType();
$addLinkTitleFormGroup.toggle(visible);
$addLinkTitleFormGroup.toggle(linkType !== 'reference-link');
$addLinkTitleRadios.toggle(linkType !== 'external-link')
}
$form.on('submit', () => {
const notePath = $autoComplete.getSelectedNotePath();
if (notePath) {
if ($autoComplete.getSelectedNotePath()) {
$dialog.modal('hide');
const linkTitle = getLinkType() === 'reference-link' ? null : $linkTitle.val();
textTypeWidget.addLink(notePath, linkTitle);
textTypeWidget.addLink($autoComplete.getSelectedNotePath(), linkTitle);
}
else if ($autoComplete.getSelectedExternalLink()) {
$dialog.modal('hide');
textTypeWidget.addLink($autoComplete.getSelectedExternalLink(), $linkTitle.val());
}
else {
logError("No path to add link.");
logError("No link to add.");
}
return false;

47
src/public/app/services/note_autocomplete.js
View file

@ -7,6 +7,8 @@ import treeService from './tree.js';
// this key needs to have this value so it's hit by the tooltip
const SELECTED_NOTE_PATH_KEY = "data-note-path";
const SELECTED_EXTERNAL_LINK_KEY = "data-external-link";
async function autocompleteSourceForCKEditor(queryText) {
return await new Promise((res, rej) => {
autocompleteSource(queryText, rows => {
@ -25,7 +27,7 @@ async function autocompleteSourceForCKEditor(queryText) {
});
}
async function autocompleteSource(term, cb) {
async function autocompleteSource(term, cb, options = {}) {
const activeNoteId = appContext.tabManager.getActiveTabNoteId();
let results = await server.get('autocomplete'
@ -43,6 +45,16 @@ async function autocompleteSource(term, cb) {
].concat(results);
}
if (term.match(/^[a-z]+:\/\/.+/i) && options.allowExternalLinks) {
results = [
{
action: 'external-link',
externalLink: term,
highlightedNotePathTitle: `Insert external link to "${term}"`
}
].concat(results);
}
cb(results);
}
@ -130,7 +142,7 @@ function initNoteAutocomplete($el, options) {
tabAutocomplete: false
}, [
{
source: autocompleteSource,
source: (term, cb) => autocompleteSource(term, cb, options),
displayKey: 'notePathTitle',
templates: {
suggestion: suggestion => suggestion.highlightedNotePathTitle
@ -141,6 +153,19 @@ function initNoteAutocomplete($el, options) {
]);
$el.on('autocomplete:selected', async (event, suggestion) => {
if (suggestion.action === 'external-link') {
$el.setSelectedNotePath(null);
$el.setSelectedExternalLink(suggestion.externalLink);
$el.autocomplete("val", suggestion.externalLink);
$el.autocomplete("close");
$el.trigger('autocomplete:externallinkselected', [suggestion]);
return;
}
if (suggestion.action === 'create-note') {
const {note} = await noteCreateService.createNote(suggestion.parentNoteId, {
title: suggestion.noteTitle,
@ -151,6 +176,7 @@ function initNoteAutocomplete($el, options) {
}
$el.setSelectedNotePath(suggestion.notePath);
$el.setSelectedExternalLink(null);
$el.autocomplete("val", suggestion.noteTitle);
@ -204,6 +230,23 @@ function init() {
.toggleClass("disabled", !notePath.trim())
.attr(SELECTED_NOTE_PATH_KEY, notePath); // we also set attr here so tooltip can be displayed
};
$.fn.getSelectedExternalLink = function () {
if (!$(this).val().trim()) {
return "";
} else {
return $(this).attr(SELECTED_EXTERNAL_LINK_KEY);
}
};
$.fn.setSelectedExternalLink = function (externalLink) {
$(this).attr(SELECTED_EXTERNAL_LINK_KEY, externalLink);
$(this)
.closest(".input-group")
.find(".go-to-selected-note-button")
.toggleClass("disabled", true);
}
}
export default {

8
src/views/dialogs/add_link.ejs
View file

@ -2,7 +2,7 @@
<div class="modal-dialog modal-lg" style="max-width: 1000px" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title mr-auto">Add note link</h5>
<h5 class="modal-title mr-auto">Add link</h5>
<button type="button" class="help-button" title="Help on links" data-help-page="Links">?</button>
@ -21,13 +21,13 @@
</div>
<div id="add-link-title-settings">
<div class="form-check">
<div class="form-check add-link-title-radios">
<input class="form-check-input" type="radio" name="link-type" value="reference-link" id="add-link-reference-link" checked>
<label class="form-check-label" for="add-link-reference-link">
link title mirrors the note's current title
</label>
</div>
<div class="form-check">
<div class="form-check add-link-title-radios">
<input class="form-check-input" type="radio" name="link-type" value="hyper-link" id="add-link-hyper-link">
<label class="form-check-label" for="add-link-hyper-link">
link title can be changed arbitrarily
@ -41,7 +41,7 @@
</div>
</div>
<div class="modal-footer">
<button type="submit" class="btn btn-primary">Add note link <kbd>enter</kbd></button>
<button type="submit" class="btn btn-primary">Add link <kbd>enter</kbd></button>
</div>
</form>
</div>