mirror of
				https://github.com/zadam/trilium.git
				synced 2025-11-03 11:56:01 +01:00 
			
		
		
		
	initial work on mobile frontend
This commit is contained in:
		
							
								
								
									
										3
									
								
								src/public/javascripts/services/mobile.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										3
									
								
								src/public/javascripts/services/mobile.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,3 @@
 | 
				
			|||||||
 | 
					import treeService from "./tree.js";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					treeService.showTree();
 | 
				
			||||||
							
								
								
									
										49
									
								
								src/public/stylesheets/mobile.css
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										49
									
								
								src/public/stylesheets/mobile.css
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,49 @@
 | 
				
			|||||||
 | 
					html, body {
 | 
				
			||||||
 | 
					    height:100vh;
 | 
				
			||||||
 | 
					    width:100vw;
 | 
				
			||||||
 | 
					    margin: 0;
 | 
				
			||||||
 | 
					    padding: 0;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					#tree {
 | 
				
			||||||
 | 
					    font-size: larger;
 | 
				
			||||||
 | 
					    width: 100vw;
 | 
				
			||||||
 | 
					    height: 100vh;
 | 
				
			||||||
 | 
					    overflow: auto;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-custom-icon {
 | 
				
			||||||
 | 
					    font-size: 2em;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-title {
 | 
				
			||||||
 | 
					    font-size: 1.5em;
 | 
				
			||||||
 | 
					    margin-left: 0.6em !important;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-node {
 | 
				
			||||||
 | 
					    padding: 5px;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-node .fancytree-expander {
 | 
				
			||||||
 | 
					    background: none;
 | 
				
			||||||
 | 
					    width: auto;
 | 
				
			||||||
 | 
					    height: auto;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-node .fancytree-expander:before {
 | 
				
			||||||
 | 
					    font-family: 'jam-icons' !important;
 | 
				
			||||||
 | 
					    speak:none;font-style:normal;
 | 
				
			||||||
 | 
					    font-weight:normal;
 | 
				
			||||||
 | 
					    font-variant:normal;
 | 
				
			||||||
 | 
					    text-transform:none;
 | 
				
			||||||
 | 
					    line-height:1;
 | 
				
			||||||
 | 
					    font-size: 2em;
 | 
				
			||||||
 | 
					    padding-left: 5px;
 | 
				
			||||||
 | 
					    padding-right: 5px;
 | 
				
			||||||
 | 
					    content: "\e9bc";
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					.fancytree-node.fancytree-expanded .fancytree-expander:before {
 | 
				
			||||||
 | 
					    content: "\e9ba";
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
							
								
								
									
										37
									
								
								src/routes/mobile.js
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										37
									
								
								src/routes/mobile.js
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,37 @@
 | 
				
			|||||||
 | 
					"use strict";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const sourceIdService = require('../services/source_id');
 | 
				
			||||||
 | 
					const sql = require('../services/sql');
 | 
				
			||||||
 | 
					const attributeService = require('../services/attributes');
 | 
				
			||||||
 | 
					const config = require('../services/config');
 | 
				
			||||||
 | 
					const optionService = require('../services/options');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					async function index(req, res) {
 | 
				
			||||||
 | 
					    const options = await optionService.getOptionsMap();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    res.render('mobile', {
 | 
				
			||||||
 | 
					        theme: options.theme,
 | 
				
			||||||
 | 
					        sourceId: await sourceIdService.generateSourceId(),
 | 
				
			||||||
 | 
					        maxSyncIdAtLoad: await sql.getValue("SELECT MAX(id) FROM sync"),
 | 
				
			||||||
 | 
					        instanceName: config.General ? config.General.instanceName : null,
 | 
				
			||||||
 | 
					        appCss: await getAppCss()
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					async function getAppCss() {
 | 
				
			||||||
 | 
					    let css = '';
 | 
				
			||||||
 | 
					    const notes = attributeService.getNotesWithLabel('appCss');
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    for (const note of await notes) {
 | 
				
			||||||
 | 
					        css += `/* ${note.noteId} */
 | 
				
			||||||
 | 
					${note.content}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					`;
 | 
				
			||||||
 | 
					    }
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					    return css;
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					module.exports = {
 | 
				
			||||||
 | 
					    index
 | 
				
			||||||
 | 
					};
 | 
				
			||||||
@@ -1,6 +1,7 @@
 | 
				
			|||||||
const indexRoute = require('./index');
 | 
					 | 
				
			||||||
const loginRoute = require('./login');
 | 
					 | 
				
			||||||
const setupRoute = require('./setup');
 | 
					const setupRoute = require('./setup');
 | 
				
			||||||
 | 
					const loginRoute = require('./login');
 | 
				
			||||||
 | 
					const indexRoute = require('./index');
 | 
				
			||||||
 | 
					const mobileRoute = require('./mobile');
 | 
				
			||||||
const multer = require('multer')();
 | 
					const multer = require('multer')();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
// API routes
 | 
					// API routes
 | 
				
			||||||
@@ -96,6 +97,8 @@ const uploadMiddleware = multer.single('upload');
 | 
				
			|||||||
 | 
					
 | 
				
			||||||
function register(app) {
 | 
					function register(app) {
 | 
				
			||||||
    route(GET, '/', [auth.checkAuth], indexRoute.index);
 | 
					    route(GET, '/', [auth.checkAuth], indexRoute.index);
 | 
				
			||||||
 | 
					    route(GET, '/mobile', [auth.checkAuth], mobileRoute.index);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    route(GET, '/login', [auth.checkAppInitialized], loginRoute.loginPage);
 | 
					    route(GET, '/login', [auth.checkAppInitialized], loginRoute.loginPage);
 | 
				
			||||||
    route(POST, '/login', [], loginRoute.login);
 | 
					    route(POST, '/login', [], loginRoute.login);
 | 
				
			||||||
    route(POST, '/logout', [auth.checkAuth], loginRoute.logout);
 | 
					    route(POST, '/logout', [auth.checkAuth], loginRoute.logout);
 | 
				
			||||||
 
 | 
				
			|||||||
@@ -45,6 +45,6 @@
 | 
				
			|||||||
<!-- Required for correct loading of scripts in Electron -->
 | 
					<!-- Required for correct loading of scripts in Electron -->
 | 
				
			||||||
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
 | 
					<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<link href="/libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 | 
					<link href="libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 | 
				
			||||||
</body>
 | 
					</body>
 | 
				
			||||||
</html>
 | 
					</html>
 | 
				
			||||||
							
								
								
									
										39
									
								
								src/views/mobile.ejs
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										39
									
								
								src/views/mobile.ejs
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,39 @@
 | 
				
			|||||||
 | 
					<!DOCTYPE html>
 | 
				
			||||||
 | 
					<html lang="en">
 | 
				
			||||||
 | 
					<head>
 | 
				
			||||||
 | 
					    <meta charset="utf-8">
 | 
				
			||||||
 | 
					    <title>Trilium Notes</title>
 | 
				
			||||||
 | 
					</head>
 | 
				
			||||||
 | 
					<body>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<div id="tree"></div>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<script type="text/javascript">
 | 
				
			||||||
 | 
					    window.baseApiUrl = 'api/';
 | 
				
			||||||
 | 
					    window.glob = {
 | 
				
			||||||
 | 
					        activeDialog: null,
 | 
				
			||||||
 | 
					        sourceId: '<%= sourceId %>',
 | 
				
			||||||
 | 
					        maxSyncIdAtLoad: <%= maxSyncIdAtLoad %>,
 | 
				
			||||||
 | 
					        instanceName: '<%= instanceName %>'
 | 
				
			||||||
 | 
					    };
 | 
				
			||||||
 | 
					</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<script src="libraries/jquery.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<link href="libraries/fancytree/skin-win8/ui.fancytree.css" rel="stylesheet">
 | 
				
			||||||
 | 
					<script src="libraries/fancytree/jquery.fancytree-all-deps.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<link href="libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 | 
				
			||||||
 | 
					<script src="javascripts/services/mobile.js" crossorigin type="module"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<script src="libraries/jquery.hotkeys.js"></script>
 | 
				
			||||||
 | 
					<script src="libraries/jquery.fancytree.hotkeys.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<script src="libraries/knockout.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<link href="stylesheets/style.css" rel="stylesheet">
 | 
				
			||||||
 | 
					<link href="stylesheets/mobile.css" rel="stylesheet">
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					<link rel="stylesheet" type="text/css" href="libraries/jam/css/jam.min.css">
 | 
				
			||||||
 | 
					</body>
 | 
				
			||||||
 | 
					</html>
 | 
				
			||||||
@@ -124,13 +124,13 @@
 | 
				
			|||||||
<!-- Required for correct loading of scripts in Electron -->
 | 
					<!-- Required for correct loading of scripts in Electron -->
 | 
				
			||||||
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
 | 
					<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script src="/libraries/jquery.min.js"></script>
 | 
					<script src="libraries/jquery.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<link href="/libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 | 
					<link href="libraries/bootstrap/css/bootstrap.min.css" rel="stylesheet">
 | 
				
			||||||
<script src="/libraries/bootstrap/js/bootstrap.bundle.min.js"></script>
 | 
					<script src="libraries/bootstrap/js/bootstrap.bundle.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script src="/libraries/knockout.min.js"></script>
 | 
					<script src="libraries/knockout.min.js"></script>
 | 
				
			||||||
 | 
					
 | 
				
			||||||
<script src="/javascripts/setup.js" crossorigin type="module"></script>
 | 
					<script src="javascripts/setup.js" crossorigin type="module"></script>
 | 
				
			||||||
</body>
 | 
					</body>
 | 
				
			||||||
</html>
 | 
					</html>
 | 
				
			||||||
 
 | 
				
			|||||||
		Reference in New Issue
	
	Block a user