Skip to content

Instantly share code, notes, and snippets.

@solarkraft

solarkraft/index.html

Last active April 28, 2022 23:47
Show Gist options
  • Save solarkraft/9d93f8a6bd80a9b929df19561e25e794 to your computer and use it in GitHub Desktop.
Save solarkraft/9d93f8a6bd80a9b929df19561e25e794 to your computer and use it in GitHub Desktop.
Download ZIP
Decoupling Logeq's published web app from its content
Raw
index.html
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<link href="static/css/style.css" rel="stylesheet" type="text/css" />
<!-- By far the least important -->
<!-- <link href="static/css/tabler-icons.min.css" rel="stylesheet" type="text/css" /> -->
<link href="custom.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="root">
<p style="color: #999; font-size: 3rem; text-align: center; margin-top: 5rem;">Logseq is loading ...</p>
</div>
<!-- Get database -->
<script>
(async () => {
// Logseq needs the database to be there before it begins loading.
// This presumably only works because the fetch blocks the loading of main.js.
// Any other delay will break it. This is an async function, after all.
// database.transit is exported from ~/.logseq/graphs.
// It contains all user data, so it needs to be filtered to only show public pages.
// This can be done with https://github.com/cldwalker/logseq-query
console.log("Getting database")
let db = await (await fetch("database.transit")).text()
console.log("Got database")
window.logseq_db = db
})()
</script>
<!-- window.logseq_state ... -->
<script src="state.js"></script>
<!-- Main application (needs slimming down) -->
<script src="static/js/main.js"></script>
<!-- Secondary stuff -->
<!-- <script src="static/js/highlight.min.js"></script>
<script src="static/js/interact.min.js"></script>
<script src="static/js/code-editor.js"></script> -->
<!-- Customizations after main application has loaded -->
<script src="custom.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment