Add quick note

# Setup the quick-notes template The journal-manager project comes with the *quick-notes* template. This journal-manager template adds a dynamic functionality to the static web page built by journal-manager. The first step is to register the quick-notes template. If you have cloned the journal-manager repository, you can run the command below: ```bash $ jm template register quick-notes /templates/quick-notes ``` Otherwise, download the quick-notes template direct from the repository and use its path instead. ## quick-notes: A journal-manager template This template is based on the MkDocs material theme. It sets a collection of plugins and adds two buttons to the top menu. - Index button: Go to the index page generated by journal-manager. - Quick-note button: Opens an input text field to write markdown test to be included in the Quick Notes page. ### Setup This template adds a dynamic action to the static web page generated by MkDocs. In order to activate the quick-note button, you need to setup a an API with the following interface: - **GET** */journal_name/quick-note/add*: Returns an html page which contains a text input field to write down a markdown text. - **POST** */journal_name/quick-note/add*: Register the markdown text in the quick-note page. In this tutorial we are going to setup the quick-notes template in a test environment. ### Build the journal using `--with-http-server` The fist step consists in creating a journal using the quick-notes template and then build it with the `--with-http-server` flag. ```bash $ jm journal create "nlp" --template-name "quick-notes" $ jm build --build-location ~/my-built-journals --jn "nlp" --with-http-server ``` This creates the following folders in `~/my-build-journals`: - file-monitor: script to monitor file updates. - http-server: basic nodejs http-server. - site: static web pages. Open your browser and navigate to `localhost:4960`. You should see the index page created by journal-manager. The index will contain the journal `nlp` only. Click on it. Notice that two new buttons appear in the top menu of the material theme: - Index button: Go to the index page. - Quick-note button: Go to the add quick-note page. The quick-note button does nothing yet. We need to implement the HTTP API in our HTTP server. ### Implementing the quick-notes HTTP API Stop the http-server and then add the following lines in `http-server/init.js`: ```js //Handle default form post requests app.use(express.urlencoded({ extended: true, limit: "2Mb" })); //To populate req.body with submitted form data. app.get('/:journal_name/quick-note/add', (req,res) => { res.sendFile(`${HTTP_SERVER_ROOT}/add-quick-note.html`) }); app.post('/:journal_name/quick-note/add', (req,res) => { let journal_name = req.params["journal_name"]; // .replaceAll is only available for node.js 15.0 and after. let text = req.body.text.replace(/\r/g,""); add_quick_note(journal_name, text) .then( () => { res.redirect(`/${journal_name}`) }) .catch( error => { res.send("Oups! An error occurred!") }); }); function add_quick_note(journal_name, text) { let BIN_DIR = path.resolve(__dirname,"./bin"); const addQuickNotes = `${BIN_DIR}/add-quick-note/add-quick-note.sh`; let wd = p_execFile(addQuickNotes, [journal_name, text]); return wd.then(result => new Promise(function(resolve) { console.info("[add-quick-note][stdout]:",result.stdout); console.error("[add-quick-note][stderr]:",result.stderr); resolve(result.stdout); })) .catch( error => { console.log(error); throw error; }); } ``` The code above creates the `GET` and `POST` methods required by the quick-notes template. Next we need to create the file `add-quick-note.html` containing the text input field. This file should be stored in `http-server`. ```html Add quick note

``` Finally, we setup the script `add-quick-note.sh` that will consume the markdown text entered in the html page above. This script must be located at `http-server/bin/add-quick-note`. ```{important} You need to have the [quick-notes](https://github.com/danoan/quick-notes) project installed. ``` ```bash #! /usr/bin/env bash SCRIPT_PATH="$( cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)" PROJECT_PATH="${SCRIPT_PATH%add-quick-note*}add-quick-note" INPUT_FOLDER="${SCRIPT_PATH}/input" OUTPUT_FOLDER="${SCRIPT_PATH}/output" mkdir -p "${OUTPUT_FOLDER}" JOURNAL_NAME="${1}" TEXT_NOTE="${2}" JOURNAL_LOCATION_FOLDER="$(journal-manager journal show "${JOURNAL_NAME}" "location_folder")" QUICK_NOTES_MARKDOWN="${JOURNAL_LOCATION_FOLDER}/docs/quick-notes.md" if [[ ! -e "${QUICK_NOTES_MARKDOWN}" ]] then touch "${QUICK_NOTES_MARKDOWN}" fi QUICK_NOTES_TOML="$(mktemp -t -p"${OUTPUT_FOLDER}" )" quick-notes generate-toml "${QUICK_NOTES_MARKDOWN}" > "${QUICK_NOTES_TOML}" quick-notes generate-quick-note "${TEXT_NOTE}" >> "${QUICK_NOTES_TOML}" quick-notes generate-markdown "${QUICK_NOTES_TOML}" > "${QUICK_NOTES_MARKDOWN}" # This is necessary to trigger `entr`. Otherwise, the build job is not executed. touch "${QUICK_NOTES_MARKDOWN}" rm "${QUICK_NOTES_TOML}" ``` Now we need to restart the server: ```bash $ nodejs http-server/init.js ``` ```{important} In order to not loose the modifications done in the `http-server` folder, next time you will build your journals, do not use the `--with-http-server` flag and start your http server manually with the command above. ```