trilium/src/templates/app.html
2017-09-05 22:01:22 -04:00

144 lines
5.6 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Notecase web app</title>
</head>
<body>
<div id="top" style="text-align: center;">
&nbsp;
<span id="top-message"></span>
<span id="error-message"></span>
</div>
<div id="content" style="margin-left: auto; margin-right: auto; width: 1100px; position: relative;">
<div style="position: absolute; left: 1020px;" class="hide-toggle">
<form action="logout" method="POST">
<input type="submit" class="btn btn-sm" value="Logout">
</form>
</div>
<div class="hide-toggle" style="width: 300px; height: 100%; float: left;">
<p>
<label>Search:</label>
<input name="search" autocomplete="off">
<button id="btnResetSearch">&times;</button>
<span id="matches"></span>
</p>
<a onclick="createNewTopLevelNote()" title="Create new top level note">
<img src="stat/icons/file-plus.png" alt="Create new top level note"/>
</a>
<a onclick="collapseTree()" title="Collapse tree">
<img src="stat/icons/list.png" alt="Collapse tree"/>
</a>
<div id="tree">
</div>
</div>
<div id="noteDetailWrapper" style="width: 750px; float: left; margin-left: 30px;">
<div style="float: left; margin: 0 5px 5px 5px;" class="hide-toggle">
<button class="btn btn-sm" onclick="encryptNoteAndSendToServer();" id="encryptButton">Encrypt</button>
<button class="btn btn-sm" onclick="decryptNoteAndSendToServer();" id="decryptButton">Decrypt</button>
<input autocomplete="off" value="Welcome to Notecase web app!" id="noteTitle" style="font-size: x-large; border: 0; width: 600px;" tabindex="1">
</div>
<div style="clear: both; height: 0"></div>
<div id="noteDetail" style="overflow: scroll; height: 100%;">
<p>This prototype version supports basic editing, including some formatting (bold, italic, strike-through, underscore), images (just paste it into editor) and links. To edit the note, just click on title or content and you can directly modify it. Changes are saved immediately.</p>
<p>You can work with the tree using following keyboard shortcuts:</p>
<ul>
<li>insert - create new note on current tree level</li>
<li>ctrl + insert - create new sub-note</li>
<li>delete - delete current note (and it's sub-notes)</li>
<li>shift + up - move current note up in the current tree level</li>
<li>shift + down - move current note down in the current tree level</li>
<li>shift + left - move current note up in the tree hierarchy</li>
<li>shift + right - move current note down in the tree hierarchy</li>
</ul>
</div>
</div>
</div>
<div id="recentNotesDialog" title="Recent notes" style="display: none;">
<select id="recentNotesSelectBox" size="15" style="width: 100%">
</select>
</div>
<div id="insertLinkDialog" title="Insert link" style="display: none;">
<form id="insertLinkForm">
<div class="form-group">
<label for="noteAutocomplete">Link to note</label>
<input id="noteAutocomplete" style="width: 100%;">
</div>
<div class="form-group">
<label for="linkTitle">Link title</label>
<input id="linkTitle" style="width: 100%;">
</div>
<button class="btn btn-sm">Add link</button>
</form>
</div>
<div id="jumpToNoteDialog" title="Jumpt to note" style="display: none;">
<form id="jumpToNoteForm">
<div class="form-group">
<label for="jumpToNoteAutocomplete">Jump to note</label>
<input id="jumpToNoteAutocomplete" style="width: 100%;">
</div>
<button class="btn btn-sm">Jump</button>
</form>
</div>
<script type="text/javascript">
const baseUrl = '';
</script>
<script src="stat/lib/jquery.min.js"></script>
<link href="stat/lib/jqueryui/jquery-ui.min.css" rel="stylesheet">
<script src="stat/lib/jqueryui/jquery-ui.min.js"></script>
<!-- Include Fancytree skin and library -->
<link href="stat/lib/fancytree/skin-win8/ui.fancytree.css" rel="stylesheet">
<script src="stat/lib/fancytree/jquery.fancytree-all.js"></script>
<link href="stat/lib/bootstrap/css/bootstrap.css" rel="stylesheet">
<script src="stat/lib/bootstrap/js/bootstrap.js"></script>
<link href="stat/lib/summernote/summernote.css" rel="stylesheet">
<script src="stat/lib/summernote/summernote.js"></script>
<script src="stat/lib/jquery.hotkeys.js"></script>
<script src="stat/lib/jquery.fancytree.hotkeys.js"></script>
<script src="stat/lib/jquery.ui-contextmenu.min.js"></script>
<!-- https://github.com/ricmoo/aes-js -->
<script src="stat/lib/aes.js"></script>
<!-- https://github.com/emn178/js-sha256 -->
<script src="stat/lib/sha256.min.js"></script>
<!-- https://github.com/ricmoo/scrypt-js -->
<script src="stat/lib/scrypt/scrypt.js"></script>
<script src="stat/lib/scrypt/buffer.js"></script>
<script src="stat/lib/scrypt/setImmediate.js"></script>
<script src="stat/lib/scrypt/unorm.js"></script>
<link href="stat/style.css" rel="stylesheet">
<script src="stat/js/init.js"></script>
<script src="stat/js/tree.js"></script>
<script src="stat/js/note.js"></script>
<script src="stat/js/notecase2html.js"></script>
<script src="stat/js/html2notecase.js"></script>
<script src="stat/js/utils.js"></script>
</body>
</html>