Skip to content

Commit b8c8877

Browse files
guFalconguFalcon
committed
add hot-update, local-wysiwig-container
1 parent 7a9d4b2 commit b8c8877

File tree

14 files changed

+472
-698
lines changed

14 files changed

+472
-698
lines changed

‎.github/workflows/docs-local.yml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -67,6 +67,7 @@ jobs:
6767
echo NEXT_PUBLIC_PLANTUML_URL=${{ secrets.PLANTUML_URL }} >> site/.env
6868
echo NEXT_PUBLIC_SERVER_URL=${{ secrets.SERVER_URL }} >> site/.env
6969
echo NEXT_PUBLIC_IS_APP_FOLDER=true >> site/.env
70+
echo NEXT_AUTOSCAN=${{ secrets.AUTOSCAN || 'false' }} >> site/.env
7071
- name: Touch keycloak.json file
7172
run: touch site/keycloak.json
7273
- name: Fill keycloak.json file

‎.vscode/launch.json‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,10 @@
1212
"type": "node",
1313
"request": "launch",
1414
"name": "Launch Node.js",
15-
"program": "${workspaceFolder}/app.js"
15+
"program": "${workspaceFolder}/app.js",
16+
"env": {
17+
"NEXT_AUTOSCAN": "true"
18+
}
1619
}
1720
],
1821
"compounds": [

‎README.md‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
As a teacher you probably have to cover a vast field of expertise and to keep up with changes in this very field, constantly updating your teaching materials. Most of the time your materials are scattered over a number of formats and platforms, which doesn't exactly make things easier.
33

44
This project is the attempt to unify all teaching materials using Markdown and Obsidian as an editor while using this site as a reader for the students.
5-
As a reader for students it has various benefits, such as responsive design allowing the use of a mobile phone when learning, or customizability of the look-and-feel to suit various tastes.
5+
As a reader for students it has various benefits, such as responsive design allowing the use of a mobile phone when learning, or customization of the look-and-feel to suit various tastes.
66

77
See a working version of this project, hosted by myself, here:
88
https://safelearn.unterrainer.info
@@ -28,6 +28,7 @@ If you'd like to host your own files, you'll have to fork this repository.
2828
* Generate different views on a document to keep exam-questions, answers and testing-questions together in one document.
2929
* Full Obsidian-flavor Markdown support
3030
* Switch between teacher- and student-view
31+
* Local [WYSIWIG Editor Setup](docs-wysiwig) that allows you to see the changes to your documents instantly.
3132
### Features for Students
3233
* Availability
3334
* Teaching materials are always up-to-date
@@ -85,6 +86,8 @@ So there are some intricacies you should be aware of when working with it and se
8586
If you'd like to use any other server, set your secret accordingly.
8687
## Obsidian Language Extensions
8788
Here you can find the technical intricacies of the Obsidian-specific language extension implemented in this project [docs](docs-obsidian.md).
89+
## Local WYSIWIG Container
90+
Start a container running the server, which is exposing a web-page and constantly scanning for changes in your files [here](docs-wysiwig).
8891
## Permissions
8992
You can specify who is able to read whole files, or only parts of it.
9093
Here you can find more information about [permissions](docs-permissions).

‎app.js‎

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,8 @@ const app = express();
9696
app.set("trust proxy", true);
9797

9898
import { scanFiles, scanFonts, preParse, manipulateHtml, wrapInPage, wrapInReveal, splitForReveal, parseFirstLineForPermissions, wrapAsDocument } from "./obsidian.js";
99+
100+
import chokidar from "chokidar";
99101
import { hasSomeRoles } from "./utils.js";
100102

101103
async function sanitizeAndParseMarkdown(data, req) {
@@ -315,12 +317,26 @@ initKeycloak(app).then(() => {
315317
});
316318

317319
const basePath = process.env.NEXT_PUBLIC_IS_APP_FOLDER ? '/app/' : '.';
320+
321+
// Initial scan
318322
scanFiles("md/", path.join(basePath, "md")).then(() => {
319323
scanFonts(path.join(basePath, "assets")).then(() => {
320324
app.listen(process.env.NEXT_PUBLIC_PORT, "0.0.0.0");
321325
});
322326
});
323327

328+
// Watch md/ folder and trigger scanFiles on changes if NEXT_AUTOSCAN is true
329+
const isAutoScan = process.env.NEXT_AUTOSCAN === "true";
330+
console.log(`AutoScan is set to ${isAutoScan}`);
331+
if (isAutoScan) {
332+
const mdPath = path.join(basePath, "md");
333+
const watcher = chokidar.watch(mdPath, { ignoreInitial: true, persistent: true, depth: 99 });
334+
watcher.on("all", (event, pathChanged) => {
335+
console.log(`[Watcher] Detected ${event} in ${pathChanged}. Triggering scanFiles...`);
336+
scanFiles("md/", mdPath);
337+
});
338+
}
339+
324340
// If file is not found, redirect to the start page.
325341
app.use((_, res) => res.redirect(getStartPage()));
326342
});

‎docs-building.md‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -28,6 +28,7 @@ To build, there is a Github action in this repository, but in order to configure
2828
| KEYCLOAK_FILE | The copy-pasted contents of the file you get when you enter your Keycloak-realm as admin -> Client -> Installation -> Keycloak JSON File. |
2929
| PORT | -> `.env`<br>The port your web-server will be accessible when started later on (for example: `8080`).<br>This variable will be written to a newly generated `.env` file that will reside in the root-directory of the node web-server.<br>So that port is INSIDE this web-servers' docker-image that is created. |
3030
| WEBSERVER_PORT | This is the EXTERNAL port of the web-server that is created.<br>This port must be unique and accessible on the deployment-machine. |
31+
| AUTOSCAN | Starts a file-watcher on the markdown-directory on the server so that all changes within that folder will trigger a re-scan of all files available to the server. This only makes sense, if you plan on changing content without re-starting (-building). That would be the case when you're debugging, or if you're running a WYSIWYG docker-container of the server locally. |
3132
| VPN_OVPN_FILE | The OVPN file of your Open VPN configuration. This is used to reach the deployment-server (target host) to start conversation via SSH. |
3233
| VPN_PASSWORD | The password of your VPN connection. |
3334
| VPN_SERVER | The server to call for opening your VPN connection. |

‎docs-wysiwig.md‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
# WYSIWIG
2+
If you'd like to run a local container of this server in order to see changes you make on your files on-the-fly, you've come to the right page.
3+
4+
[Back](README.md) to the main page.
5+
## How to setup your local container
6+
### Prerequisites
7+
- Local [Docker](https://docker.com)-installation
8+
- Some access to the keycloak-server that's being used (may be local, or the standard remote one)
9+
- Free port `8081` on your local machine (you may change that, but it has to be configured on the keycloak-client as a `valid redirect URL` like `http://localhost:<port>/*`)
10+
### Installation
11+
- Clone this repository
12+
- Copy the contents of the directory `local-wysiwig-container` to your local host
13+
- Adjust the contents of the `.env` file
14+
- Adjust the contents of the `keycloak.json` file
15+
- Run `up.sh` to start your container as a persistent container
16+
### `.env` File
17+
18+
| Field | Example-value | Description |
19+
| ---------------------- | -------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------- |
20+
| WEBSERVER_PORT | 8081 | The port your local web-server should expose |
21+
| NEXT_PUBLIC_SERVER_URL | http://localhost:8081 | This is important for the keycloak-login process. The port should be the same as in WEBSERVER_PORT. |
22+
| LOCAL_DEV_MD_DIR | /home/larifari/secureLectures/md | This is the place of the md-directory within the repository you've cloned to your local machine. This is the place where your MD-files live. |
23+
| NEXT_AUTOSCAN | true | This switch tells the server to watch for changes in your MD-directory and reload all files, when it detects those. |
24+
### `keycloak.json` File
25+
This should be self-explanatory for keycloak-users. It's the config file for the keycloak-instance you are using.
26+
27+
| Field | Explanation |
28+
| --------------- | --------------------------------- |
29+
| realm | The realm. |
30+
| auth-server-url | The full URL to the server. |
31+
| resource | The client of your application. |
32+
| secret | The client-secret of your client. |

‎local-wysiwyg-container/.env‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
WEBSERVER_PORT=8081
2+
NEXT_PUBLIC_SERVER_URL=http://localhost:8081
3+
4+
LOCAL_DEV_MD_DIR=/path/to/your/local/md
5+
NEXT_AUTOSCAN=true
6+
7+
INTERNAL_PORT=8080
8+
DOCKER_HUB_USER=gufalcon
9+
DOCKER_IMAGE_NAME=secure-lectures

‎local-wysiwyg-container/docker-compose.yml‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
version: '3'
2+
services:
3+
4+
secure-lectures:
5+
image: ${DOCKER_HUB_USER}/${DOCKER_IMAGE_NAME}:latest
6+
container_name: secure-lectures
7+
restart: unless-stopped
8+
ports:
9+
- ${WEBSERVER_PORT}:${INTERNAL_PORT}
10+
environment:
11+
- NEXT_PUBLIC_SERVER_URL=${NEXT_PUBLIC_SERVER_URL}
12+
volumes:
13+
- ${LOCAL_DEV_MD_DIR}:/app/md
14+
- ./keycloak.json:/app/keycloak.json

‎local-wysiwyg-container/keycloak.json‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"realm": "realm",
3+
"auth-server-url": "https://yourserver.com/",
4+
"ssl-required": "external",
5+
"resource": "client",
6+
"verify-token-audience": false,
7+
"credentials": {
8+
"secret": "clien-secret"
9+
},
10+
"use-resource-role-mappings": true,
11+
"confidential-port": 0
12+
}

‎local-wysiwyg-container/up.sh‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
docker-compose pull
2+
docker-compose up -d --force-recreate --remove-orphans &

0 commit comments

Comments
 (0)