more generic handling of links to note

This commit is contained in:
azivner 2017-11-04 17:03:15 -04:00
parent c723bfc3ac
commit 819ae7c4c0
8 changed files with 118 additions and 103 deletions

View file

@ -6,6 +6,8 @@ const addLink = (function() {
const linkTitleEl = $("#link-title");
function showDialog() {
glob.activeDialog = dialogEl;
noteDetailEl.summernote('editor.saveRange');
dialogEl.dialog({
@ -65,51 +67,6 @@ const addLink = (function() {
return false;
});
// when click on link popup, in case of internal link, just go the the referenced note instead of default behavior
// of opening the link in new window/tab
$(document).on('click', 'div.popover-content a, div.ui-tooltip-content', goToInternalNote);
$(document).on('dblclick', '.note-editable a, div.ui-tooltip-content', goToInternalNote);
function goToInternalNote(e, callback) {
const targetUrl = $(e.target).attr("href");
const noteId = getNoteIdFromLink(targetUrl);
if (noteId !== null) {
getNodeByKey(noteId).setActive();
// this is quite ugly hack, but it seems like we can't close the tooltip otherwise
$("[role='tooltip']").remove();
e.preventDefault();
if (callback) {
callback();
}
}
}
function getNoteIdFromLink(url) {
const noteIdMatch = /app#([A-Za-z0-9]{12})/.exec(url);
if (noteIdMatch === null) {
return null;
}
else {
return noteIdMatch[1];
}
}
function getNodeIdFromLabel(label) {
const noteIdMatch = / \(([A-Za-z0-9]{12})\)/.exec(label);
if (noteIdMatch !== null) {
return noteIdMatch[1];
}
return null;
}
$(document).bind('keydown', 'alt+l', showDialog);
return {

View file

@ -3,6 +3,8 @@ const eventLog = (function() {
const listEl = $("#event-log-list");
async function showDialog() {
glob.activeDialog = dialogEl;
dialogEl.dialog({
modal: true,
width: 800,
@ -21,10 +23,7 @@ const eventLog = (function() {
const dateTime = formatDateTime(getDateFromTS(event.date_added));
if (event.note_id) {
const noteLink = $("<a>", {
href: 'app#' + event.note_id,
text: getFullName(event.note_id)
}).prop('outerHTML');
const noteLink = createNoteLink(event.note_id).prop('outerHTML');
event.comment = event.comment.replace('<note>', noteLink);
}
@ -35,12 +34,6 @@ const eventLog = (function() {
}
}
$(document).on('click', '#event-log-dialog a', e => {
goToInternalNote(e, () => {
dialogEl.dialog('close');
});
});
return {
showDialog
};

View file

@ -4,6 +4,8 @@ const jumpToNote = (function() {
const formEl = $("#jump-to-note-form");
function showDialog() {
glob.activeDialog = dialogEl;
autoCompleteEl.val('');
dialogEl.dialog({

View file

@ -10,12 +10,9 @@ const noteHistory = (function() {
await showNoteHistoryDialog(glob.currentNote.detail.note_id);
}
// weird hack because browser doesn't like we're returning promise and displays promise page
function showNoteHistoryDialogNotAsync(noteId, noteHistoryId) {
showNoteHistoryDialog(noteId, noteHistoryId);
}
async function showNoteHistoryDialog(noteId, noteHistoryId) {
glob.activeDialog = dialogEl;
dialogEl.dialog({
modal: true,
width: 800,
@ -68,9 +65,17 @@ const noteHistory = (function() {
contentEl.html(noteText);
});
$(document).on('click', "a[action='note-history']", event => {
const linkEl = $(event.target);
const noteId = linkEl.attr('note-id');
const noteHistoryId = linkEl.attr('note-history-id');
showNoteHistoryDialog(noteId, noteHistoryId);
return false;
});
return {
showCurrentNoteHistory,
showNoteHistoryDialog,
showNoteHistoryDialogNotAsync
showCurrentNoteHistory
};
})();

View file

@ -1,8 +1,10 @@
const recentChanges = (function() {
const dialog = $("#recent-changes-dialog");
const dialogEl = $("#recent-changes-dialog");
async function showDialog() {
dialog.dialog({
glob.activeDialog = dialogEl;
dialogEl.dialog({
modal: true,
width: 800,
height: 700
@ -14,7 +16,7 @@ const recentChanges = (function() {
error: () => error("Error getting recent changes.")
});
dialog.html('');
dialogEl.html('');
const groupedByDate = groupByDate(result);
@ -26,23 +28,20 @@ const recentChanges = (function() {
for (const change of dayChanges) {
const formattedTime = formatTime(getDateFromTS(change.date_modified_to));
const noteLink = $("<a>", {
href: 'app#' + change.note_id,
text: change.note_title
});
const revLink = $("<a>", {
href: "javascript: noteHistory.showNoteHistoryDialogNotAsync('" + change.note_id + "', '" + change.note_history_id + "');",
href: 'javascript:',
text: 'rev'
});
}).attr('action', 'note-history')
.attr('note-id', change.note_id)
.attr('note-history-id', change.note_history_id);
changesListEl.append($('<li>')
.append(formattedTime + ' - ')
.append(noteLink)
.append(createNoteLink(change.note_id))
.append(' (').append(revLink).append(')'));
}
dialog.append(dayEl);
dialogEl.append(dayEl);
}
}
@ -51,8 +50,6 @@ const recentChanges = (function() {
const dayCache = {};
for (const row of result) {
row.note_title = getFullName(row.note_id);
let dateDay = getDateFromTS(row.date_modified_to);
dateDay.setHours(0);
dateDay.setMinutes(0);
@ -77,15 +74,8 @@ const recentChanges = (function() {
return groupedByDate;
}
$(document).bind('keydown', 'alt+r', showDialog);
$(document).on('click', '#recent-changes-dialog a', e => {
goToInternalNote(e, () => {
dialog.dialog('close');
});
});
return {
showDialog
};

View file

@ -1,9 +1,9 @@
const recentNotes = (function() {
const dialog = $("#recent-notes-dialog");
const selectBox = $('#recent-notes-select-box');
const jumpToButton = $('#recentNotesJumpTo');
const addLinkButton = $('#recentNotesAddLink');
const noteDetail = $('#note-detail');
const dialogEl = $("#recent-notes-dialog");
const selectBoxEl = $('#recent-notes-select-box');
const jumpToButtonEl = $('#recentNotesJumpTo');
const addLinkButtonEl = $('#recentNotesAddLink');
const noteDetailEl = $('#note-detail');
let list = [];
function addRecentNote(noteTreeId, noteContentId) {
@ -23,14 +23,16 @@ const recentNotes = (function() {
}
function showDialog() {
noteDetail.summernote('editor.saveRange');
glob.activeDialog = dialogEl;
dialog.dialog({
noteDetailEl.summernote('editor.saveRange');
dialogEl.dialog({
modal: true,
width: 800
});
selectBox.find('option').remove();
selectBoxEl.find('option').remove();
// remove the current note
const recNotes = list.filter(note => note !== glob.currentNote.detail.note_id);
@ -51,12 +53,12 @@ const recentNotes = (function() {
option.attr("selected", "selected");
}
selectBox.append(option);
selectBoxEl.append(option);
});
}
function getSelectedNoteIdFromRecentNotes() {
return selectBox.find("option:selected").val();
return selectBoxEl.find("option:selected").val();
}
function setActiveNoteBasedOnRecentNotes() {
@ -64,7 +66,7 @@ const recentNotes = (function() {
getNodeByKey(noteId).setActive();
dialog.dialog('close');
dialogEl.dialog('close');
}
function addLinkBasedOnRecentNotes() {
@ -72,18 +74,18 @@ const recentNotes = (function() {
const linkTitle = getNoteTitle(noteId);
dialog.dialog("close");
dialogEl.dialog("close");
noteDetail.summernote('editor.restoreRange');
noteDetailEl.summernote('editor.restoreRange');
noteDetail.summernote('createLink', {
noteDetailEl.summernote('createLink', {
text: linkTitle,
url: 'app#' + noteId,
isNewWindow: true
});
}
selectBox.keydown(e => {
selectBoxEl.keydown(e => {
const key = e.which;
if (key === 13)// the enter key code
@ -102,12 +104,12 @@ const recentNotes = (function() {
$(document).bind('keydown', 'alt+q', showDialog);
selectBox.dblclick(e => {
selectBoxEl.dblclick(e => {
setActiveNoteBasedOnRecentNotes();
});
jumpToButton.click(setActiveNoteBasedOnRecentNotes);
addLinkButton.click(addLinkBasedOnRecentNotes);
jumpToButtonEl.click(setActiveNoteBasedOnRecentNotes);
addLinkButtonEl.click(addLinkBasedOnRecentNotes);
return {
showDialog,

View file

@ -9,6 +9,8 @@ const settings = (function() {
}
async function showDialog() {
glob.activeDialog = dialogEl;
const settings = await $.ajax({
url: baseApiUrl + 'settings',
type: 'GET',

View file

@ -1,4 +1,6 @@
glob = {};
glob = {
activeDialog: null
};
// hot keys are active also inside inputs and content editables
jQuery.hotkeys.options.filterInputAcceptingElements = true;
@ -84,4 +86,66 @@ $(document).tooltip({
function isElectron() {
return window && window.process && window.process.type;
}
// when click on link popup, in case of internal link, just go the the referenced note instead of default behavior
// of opening the link in new window/tab
$(document).on('click', "a[action='note']", goToInternalNote);
$(document).on('click', 'div.popover-content a, div.ui-tooltip-content', goToInternalNote);
$(document).on('dblclick', '.note-editable a, div.ui-tooltip-content', goToInternalNote);
function goToInternalNote(e) {
const linkEl = $(e.target);
let noteId = linkEl.attr("note-id");
if (!noteId) {
noteId = getNoteIdFromLink(linkEl.attr('href'));
}
if (noteId) {
getNodeByKey(noteId).setActive();
// this is quite ugly hack, but it seems like we can't close the tooltip otherwise
$("[role='tooltip']").remove();
if (glob.activeDialog) {
try {
glob.activeDialog.dialog('close');
}
catch (e) {}
}
e.preventDefault();
}
}
function getNoteIdFromLink(url) {
const noteIdMatch = /app#([A-Za-z0-9]{12})/.exec(url);
if (noteIdMatch === null) {
return null;
}
else {
return noteIdMatch[1];
}
}
function getNodeIdFromLabel(label) {
const noteIdMatch = / \(([A-Za-z0-9]{12})\)/.exec(label);
if (noteIdMatch !== null) {
return noteIdMatch[1];
}
return null;
}
function createNoteLink(noteId) {
const noteLink = $("<a>", {
href: 'javascript:',
text: getFullName(noteId)
}).attr('action', 'note')
.attr('note-id', noteId);
return noteLink;
}