unified naming of IDs in all lower case

This commit is contained in:
azivner 2017-10-10 20:19:16 -04:00
parent fb28111288
commit af8b26cbd5
13 changed files with 136 additions and 186 deletions

View file

@ -51,7 +51,7 @@
<p>
<label>Search:</label>
<input name="search" autocomplete="off">
<button id="btnResetSearch">&times;</button>
<button id="reset-search-button">&times;</button>
<span id="matches"></span>
</p>
</div>
@ -65,7 +65,7 @@
<a onclick="encryptNoteAndSendToServer()"
title="Encrypt the note so that password will be required to view the note"
class="icon-action"
id="encryptButton"
id="encrypt-button"
style="display: none;">
<img src="stat/icons/lock.png" alt="Encrypt note"/>
</a>
@ -73,121 +73,121 @@
<a onclick="decryptNoteAndSendToServer()"
title="Decrypt note permamently so that password will not be required to access this note in the future"
class="icon-action"
id="decryptButton"
id="decrypt-button"
style="display: none;">
<img src="stat/icons/unlock.png" alt="Decrypt note"/>
</a>
&nbsp;
<input autocomplete="off" value="" id="noteTitle" style="font-size: x-large; border: 0; flex-grow: 100;" tabindex="1">
<input autocomplete="off" value="" id="note-title" style="font-size: x-large; border: 0; flex-grow: 100;" tabindex="1">
<button class="btn btn-xs" onclick="showCurrentNoteHistory();">History</button>
</div>
</div>
<div style="overflow: auto; grid-area: note-content; padding-left: 10px;">
<div id="noteDetail"></div>
<div id="note-detail"></div>
</div>
</div>
<div id="recentNotesDialog" title="Recent notes" style="display: none;">
<select id="recentNotesSelectBox" size="15" style="width: 100%">
<div id="recent-notes-dialog" title="Recent notes" style="display: none;">
<select id="recent-notes-select-box" size="15" style="width: 100%">
</select>
<br/><br/>
<p>
<button class="btn btn-sm" id="recentNotesJumpTo">Jump to (enter)</button>
<button class="btn btn-sm" id="recent-notes-jump-to">Jump to (enter)</button>
&nbsp;
<button class="btn btn-sm" id="recentNotesAddLink">Add link (l)</button>
<button class="btn btn-sm" id="recent-notes-add-link">Add link (l)</button>
</p>
</div>
<div id="insertLinkDialog" title="Insert link" style="display: none;">
<form id="insertLinkForm">
<div id="insert-link-dialog" title="Insert link" style="display: none;">
<form id="insert-link-form">
<div class="form-group">
<label for="noteAutocomplete">Link to note</label>
<input id="noteAutocomplete" style="width: 100%;">
<label for="note-autocomplete">Link to note</label>
<input id="note-autocomplete" style="width: 100%;">
</div>
<div class="form-group">
<label for="linkTitle">Link title</label>
<input id="linkTitle" style="width: 100%;">
<label for="link-title">Link title</label>
<input id="link-title" style="width: 100%;">
</div>
<button class="btn btn-sm">Add link</button>
</form>
</div>
<div id="jumpToNoteDialog" title="Jump to note" style="display: none;">
<form id="jumpToNoteForm">
<div id="jump-to-note-dialog" title="Jump to note" style="display: none;">
<form id="jump-to-note-form">
<div class="form-group">
<label for="jumpToNoteAutocomplete">Jump to note</label>
<input id="jumpToNoteAutocomplete" style="width: 100%;">
<label for="jump-to-note-autocomplete">Jump to note</label>
<input id="jump-to-note-autocomplete" style="width: 100%;">
</div>
<button class="btn btn-sm">Jump</button>
</form>
</div>
<div id="encryptionPasswordDialog" title="Encrypted note" style="display: none;">
<form id="encryptionPasswordForm">
<div id="encryption-password-dialog" title="Encrypted note" style="display: none;">
<form id="encryption-password-form">
<div class="form-group">
<label for="encryptionPassword">This note is encrypted. Enter password to show it:</label>
<input id="encryptionPassword" style="width: 250px;" type="password">
<label for="encryption-password">This note is encrypted. Enter password to show it:</label>
<input id="encryption-password" style="width: 250px;" type="password">
<button class="btn btn-sm">Show</button>
</div>
</form>
</div>
<div id="settingsDialog" title="Settings" style="display: none;">
<div id="settingsTabs">
<div id="settings-dialog" title="Settings" style="display: none;">
<div id="settings-tabs">
<ul>
<li><a href="#changePassword">Change password</a></li>
<li><a href="#encryptionTimeout">Encryption timeout</a></li>
<li><a href="#historySnapshotTimeInterval">History snapshots</a></li>
<li><a href="#change-password">Change password</a></li>
<li><a href="#encryption-timeout">Encryption timeout</a></li>
<li><a href="#history-snapshot-time-interval">History snapshots</a></li>
</ul>
<div id="changePassword">
<form id="changePasswordForm">
<div id="change-password">
<form id="change-password-form">
<div class="form-group">
<label for="oldPassword">Old password</label>
<input class="form-control" id="oldPassword" type="password">
<label for="old-password">Old password</label>
<input class="form-control" id="old-password" type="password">
</div>
<div class="form-group">
<label for="newPassword1">New password</label>
<input class="form-control" id="newPassword1" type="password">
<label for="new-password1">New password</label>
<input class="form-control" id="new-password1" type="password">
</div>
<div class="form-group">
<label for="newPassword2">New password once more</label>
<input class="form-control" id="newPassword2" type="password">
<label for="new-password2">New password once more</label>
<input class="form-control" id="new-password2" type="password">
</div>
<button class="btn btn-sm">Change password</button>
</form>
</div>
<div id="encryptionTimeout">
<div id="encryption-timeout">
<p>Encryption timeout is a time period after which the encryption key and encrypted data is wiped out from
browser's memory. This is measured from the last encryption / decryption activity.</p>
<form id="encryptionTimeoutForm">
<form id="encryption-timeout-form">
<div class="form-group">
<label for="encryptionTimeoutInSeconds">Encryption timeout (in seconds)</label>
<input class="form-control" id="encryptionTimeoutInSeconds" type="number">
<label for="encryption-timeout-in-seconds">Encryption timeout (in seconds)</label>
<input class="form-control" id="encryption-timeout-in-seconds" type="number">
</div>
<button class="btn btn-sm">Save</button>
</form>
</div>
<div id="historySnapshotTimeInterval">
<div id="history-snapshot-time-interval">
<p>History snapshot time interval is time in seconds after which new history record will be created for the note.</p>
<form id="historySnapshotTimeIntervalForm">
<form id="history-snapshot-time-interval-form">
<div class="form-group">
<label for="historySnapshotTimeIntervalInSeconds">History snapshot time interval (in seconds)</label>
<input class="form-control" id="historySnapshotTimeIntervalInSeconds" type="number">
<label for="history-snapshot-time-interval-in-seconds">History snapshot time interval (in seconds)</label>
<input class="form-control" id="history-snapshot-time-interval-in-seconds" type="number">
</div>
<button class="btn btn-sm">Save</button>
@ -196,20 +196,20 @@
</div>
</div>
<div id="noteHistoryDialog" title="Note history" style="display: none;">
<div id="note-history-dialog" title="Note history" style="display: none;">
<div style="display: flex;">
<select id="noteHistoryList" size="25" style="width: 150px; height: 630px;">
<select id="note-history-list" size="25" style="width: 150px; height: 630px;">
</select>
<div id="noteHistoryContentWrapper" style="flex-grow: 1; margin-left: 20px;">
<h3 id="noteHistoryTitle" style="margin: 3px;"></h3>
<div id="note-history-content-wrapper" style="flex-grow: 1; margin-left: 20px;">
<h3 id="note-history-title" style="margin: 3px;"></h3>
<div id="noteHistoryContent" style="height: 600px; width: 600px; overflow: auto;"></div>
<div id="note-history-content" style="height: 600px; width: 600px; overflow: auto;"></div>
</div>
</div>
</div>
<div id="recentChangesDialog" title="Recent changes" style="display: none; padding: 20px;">
<div id="recent-changes-dialog" title="Recent changes" style="display: none; padding: 20px;">
</div>
<script type="text/javascript">
@ -271,6 +271,5 @@
<script src="stat/js/recent_changes.js"></script>
<script src="stat/js/utils.js"></script>
<script src="stat/js/convert2html.js"></script>
</body>
</html>

View file

@ -1,30 +1,30 @@
$(document).bind('keydown', 'alt+l', () => {
$("#noteAutocomplete").val('');
$("#linkTitle").val('');
$("#note-autocomplete").val('');
$("#link-title").val('');
const noteDetail = $('#noteDetail');
const noteDetail = $('#note-detail');
noteDetail.summernote('editor.saveRange');
$("#insertLinkDialog").dialog({
$("#insert-link-dialog").dialog({
modal: true,
width: 500
});
function setDefaultLinkTitle(noteId) {
function setDefaultlinkTitle(noteId) {
const noteTitle = getNoteTitle(noteId);
$("#linkTitle").val(noteTitle);
$("#link-title").val(noteTitle);
}
$("#noteAutocomplete").autocomplete({
$("#note-autocomplete").autocomplete({
source: getAutocompleteItems(globalAllNoteIds),
minLength: 0,
change: () => {
const val = $("#noteAutocomplete").val();
const val = $("#note-autocomplete").val();
const noteId = getNodeIdFromLabel(val);
if (noteId) {
setDefaultLinkTitle(noteId);
setDefaultlinkTitle(noteId);
}
},
// this is called when user goes through autocomplete list with keyboard
@ -38,20 +38,20 @@ $(document).bind('keydown', 'alt+l', () => {
});
$("#insertLinkForm").submit(() => {
let val = $("#noteAutocomplete").val();
let val = $("#note-autocomplete").val();
const noteId = getNodeIdFromLabel(val);
if (noteId) {
const linkTitle = $("#linkTitle").val();
const noteDetail = $('#noteDetail');
const linkTitle = $("#link-title").val();
const noteDetail = $('#note-detail');
$("#insertLinkDialog").dialog("close");
$("#insert-link-dialog").dialog("close");
noteDetail.summernote('editor.restoreRange');
noteDetail.summernote('createLink', {
text: linkTitle,
text: link-title,
url: 'app#' + noteId,
isNewWindow: true
});

View file

@ -1,42 +0,0 @@
function convertNoteToHtml(noteId, failedNotes) {
$.ajax({
url: baseApiUrl + 'notes/' + noteId,
type: 'GET',
async: false,
success: note => {
const noteNode = getNodeByKey(noteId);
if (noteNode.data.is_clone) {
// we shouldn't process notes twice
return;
}
note.formatting = [];
for (const link of note.links) {
delete link.type;
}
$.ajax({
url: baseApiUrl + 'notes/' + noteId,
type: 'PUT',
data: JSON.stringify(note),
contentType: "application/json",
async: false,
success: () => {
console.log("Note " + noteId + " converted.")
},
error: () => {
console.log("Note " + noteId + " failed when writing");
failedNotes.push(noteId);
}
});
},
error: () => {
console.log("Note " + noteId + " failed when reading");
failedNotes.push(noteId);
}
});
}

View file

@ -4,11 +4,7 @@ function handleEncryption(requireEncryption, modal, callback) {
if (requireEncryption && globalDataKey === null) {
globalEncryptionCallback = callback;
if (!modal) {
$("#noteDetailWrapper").hide();
}
$("#encryptionPasswordDialog").dialog({
$("#encryption-password-dialog").dialog({
modal: modal,
width: 400,
open: () => {
@ -72,13 +68,12 @@ function computeScrypt(password, salt, callback) {
});
}
$("#encryptionPasswordForm").submit(() => {
const password = $("#encryptionPassword").val();
$("#encryptionPassword").val("");
$("#encryption-password-form").submit(() => {
const password = $("#encryption-password").val();
$("#encryption-password").val("");
getDataKey(password).then(key => {
$("#noteDetailWrapper").show();
$("#encryptionPasswordDialog").dialog("close");
$("#encryption-password-dialog").dialog("close");
globalDataKey = key;

View file

@ -7,8 +7,6 @@ $(document).bind('keydown', 'alt+m', () => {
const hidden = toggle.css('display') === 'none';
toggle.css('display', hidden ? 'block' : 'none');
$("#noteDetailWrapper").css("width", hidden ? "750px" : "100%");
});
// hide (toggle) everything except for the note content for distraction free writing
@ -16,7 +14,7 @@ $(document).bind('keydown', 'alt+t', () => {
const date = new Date();
const dateString = formatDateTime(date);
$('#noteDetail').summernote('insertText', dateString);
$('#note-detail').summernote('insertText', dateString);
});
$(window).on('beforeunload', () => {

View file

@ -1,25 +1,25 @@
$(document).bind('keydown', 'alt+j', () => {
$("#jumpToNoteAutocomplete").val('');
$("#jump-to-note-autocomplete").val('');
$("#jumpToNoteDialog").dialog({
$("#jump-to-note-dialog").dialog({
modal: true,
width: 500
});
$("#jumpToNoteAutocomplete").autocomplete({
$("#jump-to-note-autocomplete").autocomplete({
source: getAutocompleteItems(globalAllNoteIds),
minLength: 0
});
});
$("#jumpToNoteForm").submit(() => {
const val = $("#jumpToNoteAutocomplete").val();
$("#jump-to-note-form").submit(() => {
const val = $("#jump-to-note-autocomplete").val();
const noteId = getNodeIdFromLabel(val);
if (noteId) {
getNodeByKey(noteId).setActive();
$("#jumpToNoteDialog").dialog('close');
$("#jump-to-note-dialog").dialog('close');
}
return false;

View file

@ -42,11 +42,11 @@ function saveNoteIfChanged(callback) {
setInterval(saveNoteIfChanged, 5000);
$(document).ready(() => {
$("#noteTitle").on('input', () => {
$("#note-title").on('input', () => {
noteChanged();
});
$('#noteDetail').summernote({
$('#note-detail').summernote({
airMode: true,
height: 300,
callbacks: {
@ -81,11 +81,11 @@ function parseHtml(contents, note) {
}
function updateNoteFromInputs(note) {
let contents = $('#noteDetail').summernote('code');
let contents = $('#note-detail').summernote('code');
parseHtml(contents, note);
let title = $('#noteTitle').val();
let title = $('#note-title').val();
getNodeByKey(note.detail.note_id).setTitle(title);
@ -179,13 +179,13 @@ function setTreeBasedOnEncryption(note) {
function setNoteBackgroundIfEncrypted(note) {
if (note.detail.encryption > 0) {
$(".note-editable").addClass("encrypted");
$("#encryptButton").hide();
$("#decryptButton").show();
$("#encrypt-button").hide();
$("#decrypt-button").show();
}
else {
$(".note-editable").removeClass("encrypted");
$("#encryptButton").show();
$("#decryptButton").hide();
$("#encrypt-button").show();
$("#decrypt-button").hide();
}
setTreeBasedOnEncryption(note);
@ -198,30 +198,30 @@ function loadNote(noteId) {
if (newNoteCreated) {
newNoteCreated = false;
$("#noteTitle").focus().select();
$("#note-title").focus().select();
}
handleEncryption(note.detail.encryption > 0, false, () => {
$("#noteDetailWrapper").show();
$("#note-detail-wrapper").show();
// this may fal if the dialog has not been previously opened
try {
$("#encryptionPasswordDialog").dialog('close');
$("#encryption-password-dialog").dialog('close');
}
catch(e) {}
$("#encryptionPassword").val('');
$("#encryption-password").val('');
decryptNoteIfNecessary(note);
$("#noteTitle").val(note.detail.note_title);
$("#note-title").val(note.detail.note_title);
noteChangeDisabled = true;
// Clear contents and remove all stored history. This is to prevent undo from going across notes
$('#noteDetail').summernote('reset');
$('#note-detail').summernote('reset');
$('#noteDetail').summernote('code', note.detail.note_text);
$('#note-detail').summernote('code', note.detail.note_text);
document.location.hash = noteId;

View file

@ -5,14 +5,14 @@ function showCurrentNoteHistory() {
}
function showNoteHistoryDialog(noteId, noteHistoryId) {
$("#noteHistoryDialog").dialog({
$("#note-history-dialog").dialog({
modal: true,
width: 800,
height: 700
});
$("#noteHistoryList").empty();
$("#noteHistoryContent").empty();
$("#note-history-list").empty();
$("#note-history-content").empty();
$.ajax({
url: baseApiUrl + 'notes-history/' + noteId,
@ -23,7 +23,7 @@ function showNoteHistoryDialog(noteId, noteHistoryId) {
for (const row of result) {
const dateModified = getDateFromTS(row.date_modified);
$("#noteHistoryList").append($('<option>', {
$("#note-history-list").append($('<option>', {
value: row.id,
text: formatDateTime(dateModified)
}));
@ -31,10 +31,10 @@ function showNoteHistoryDialog(noteId, noteHistoryId) {
if (result.length > 0) {
if (!noteHistoryId) {
noteHistoryId = $("#noteHistoryList option:first").val();
noteHistoryId = $("#note-history-list option:first").val();
}
$("#noteHistoryList").val(noteHistoryId).trigger('change');
$("#note-history-list").val(noteHistoryId).trigger('change');
}
},
error: () => alert("Error getting note history.")
@ -43,10 +43,10 @@ function showNoteHistoryDialog(noteId, noteHistoryId) {
$(document).bind('keydown', 'alt+h', showCurrentNoteHistory);
$("#noteHistoryList").on('change', () => {
const optVal = $("#noteHistoryList").find(":selected").val();
const historyItem = globalHistoryItems.find(r => r.id == optVal); // non-strict comparison is important here!!!s
$("#note-history-list").on('change', () => {
const optVal = $("#note-history-list").find(":selected").val();
const historyItem = globalHistoryItems.find(r => r.id == optVal); // non-strict comparison is important here!!!
$("#noteHistoryTitle").html(historyItem.note_title);
$("#noteHistoryContent").html(historyItem.note_text);
$("#note-history-title").html(historyItem.note_title);
$("#note-history-content").html(historyItem.note_text);
});

View file

@ -1,5 +1,5 @@
function showRecentChanges() {
$("#recentChangesDialog").dialog({
$("#recent-changes-dialog").dialog({
modal: true,
width: 400,
height: 700
@ -69,7 +69,7 @@ function showRecentChanges() {
.append(' (').append(revLink).append(')'));
}
$("#recentChangesDialog").append(dayEl);
$("#recent-changes-dialog").append(dayEl);
}
},
error: () => alert("Error getting recent changes.")
@ -78,8 +78,8 @@ function showRecentChanges() {
$(document).bind('keydown', 'alt+r', showRecentChanges);
$(document).on('click', '#recentChangesDialog a', e => {
$(document).on('click', '#recent-changes-dialog a', e => {
goToInternalNote(e, () => {
$("#recentChangesDialog").dialog('close');
$("#recent-changes-dialog").dialog('close');
});
});

View file

@ -13,14 +13,14 @@ function addRecentNote(noteTreeId, noteContentId) {
}
function showRecentNotes() {
$('#noteDetail').summernote('editor.saveRange');
$('#note-detail').summernote('editor.saveRange');
$("#recentNotesDialog").dialog({
$("#recent-notes-dialog").dialog({
modal: true,
width: 500
});
let recentNotesSelectBox = $('#recentNotesSelectBox');
let recentNotesSelectBox = $('#recent-notes-select-box');
recentNotesSelectBox.find('option').remove();
@ -50,7 +50,7 @@ function showRecentNotes() {
$(document).bind('keydown', 'alt+q', showRecentNotes);
function getSelectedNoteIdFromRecentNotes() {
return $("#recentNotesSelectBox option:selected").val();
return $("#recent-notes-select-box option:selected").val();
}
function setActiveNoteBasedOnRecentNotes() {
@ -58,16 +58,16 @@ function setActiveNoteBasedOnRecentNotes() {
getNodeByKey(noteId).setActive();
$("#recentNotesDialog").dialog('close');
$("#recent-notes-dialog").dialog('close');
}
function addLinkBasedOnRecentNotes() {
const noteId = getSelectedNoteIdFromRecentNotes();
const linkTitle = getNoteTitle(noteId);
const noteDetail = $('#noteDetail');
const noteDetail = $('#note-detail');
$("#recentNotesDialog").dialog("close");
$("#recent-notes-dialog").dialog("close");
noteDetail.summernote('editor.restoreRange');
@ -78,7 +78,7 @@ function addLinkBasedOnRecentNotes() {
});
}
$('#recentNotesSelectBox').keydown(e => {
$('#recent-notes-select-box').keydown(e => {
const key = e.which;
if (key === 13)// the enter key code
@ -92,7 +92,7 @@ $('#recentNotesSelectBox').keydown(e => {
e.preventDefault();
});
$('#recentNotesSelectBox').dblclick(e => {
$('#recent-notes-select-box').dblclick(e => {
setActiveNoteBasedOnRecentNotes();
});

View file

@ -3,30 +3,30 @@ function displaySettings() {
url: baseApiUrl + 'settings',
type: 'GET',
success: result => {
$("#encryptionTimeoutInSeconds").val(result['encryption_session_timeout']);
$("#historySnapshotTimeIntervalInSeconds").val(result['history_snapshot_time_interval']);
$("#encryption-timeout-in-seconds").val(result['encryption_session_timeout']);
$("#history-snapshot-time-interval-in-seconds").val(result['history_snapshot_time_interval']);
},
error: () => alert("Error getting settings.")
});
$("#settingsDialog").dialog({
$("#settings-dialog").dialog({
modal: true,
width: 600
});
$("#settingsTabs").tabs();
$("#settings-tabs").tabs();
}
$("#changePasswordForm").submit(() => {
const oldPassword = $("#oldPassword").val();
const newPassword1 = $("#newPassword1").val();
const newPassword2 = $("#newPassword2").val();
$("#change-password-form").submit(() => {
const oldPassword = $("#old-password").val();
const newPassword1 = $("#new-password1").val();
const newPassword2 = $("#new-password2").val();
$("#oldPassword").val('');
$("#newPassword1").val('');
$("#newPassword2").val('');
$("#old-password").val('');
$("#new-password1").val('');
$("#new-password2").val('');
if (newPassword1 != newPassword2) {
if (newPassword1 !== newPassword2) {
alert("New passwords are not the same.");
return false;
}
@ -48,7 +48,7 @@ $("#changePasswordForm").submit(() => {
alert("Password has been changed.");
$("#settingsDialog").dialog('close');
$("#settings-dialog").dialog('close');
}
else {
alert(result.message);
@ -60,8 +60,8 @@ $("#changePasswordForm").submit(() => {
return false;
});
$("#encryptionTimeoutForm").submit(() => {
const encryptionTimeout = $("#encryptionTimeoutInSeconds").val();
$("#encryption-timeout-form").submit(() => {
const encryptionTimeout = $("#encryption-timeout-in-seconds").val();
$.ajax({
url: baseApiUrl + 'settings',
@ -82,8 +82,8 @@ $("#encryptionTimeoutForm").submit(() => {
return false;
});
$("#historySnapshotTimeIntervalForm").submit(() => {
const historySnapshotTimeInterval = $("#historySnapshotTimeIntervalInSeconds").val();
$("#history-snapshot-time-interval-form").submit(() => {
const historySnapshotTimeInterval = $("#history-snapshot-time-interval-in-seconds").val();
$.ajax({
url: baseApiUrl + 'settings',

View file

@ -36,7 +36,7 @@ const keybindings = {
},
"return": node => {
// doesn't work :-/
$('#noteDetail').summernote('focus');
$('#note-detail').summernote('focus');
}
};
@ -215,13 +215,13 @@ function resetSearch() {
tree.clearFilter();
}
$("button#btnResetSearch").click(resetSearch);
$("button#reset-search-button").click(resetSearch);
$("input[name=search]").keyup(e => {
const searchString = $(this).val();
if (e && e.which === $.ui.keyCode.ESCAPE || $.trim(searchString) === "") {
$("button#btnResetSearch").click();
$("button#reset-search-button").click();
return;
}

View file

@ -78,7 +78,7 @@ span.fancytree-node.encrypted.fancytree-folder > span.fancytree-icon {
text-decoration: none;
}
#encryptButton, #decryptButton {
#encrypt-button, #decrypt-button {
display: none;
}