Merge pull request 'develop' (#14) from develop into main

Reviewed-on: cheeze.fr/mdnotes#14

Cargo.toml

@@ -1,5 +1,5 @@
 [package]
-name = "mdnotes"
+name = "cheezenotes"
 version = "0.1.0"
 edition = "2021"
 
@@ -22,4 +22,6 @@ git2 = "0.16.0"
 regex = "1"
 
 rusqlite = {version = "0.28.0", features=["bundled"]}
+
 lazy_static = "1.4.0"
+mongodb = "2.3.1"

README.md

@@ -1,4 +1,4 @@
-mdnotes
+cheezenotes
 ======
 
 Notes utilisant la syntaxe MarkDown pour être rapide et facile à modifier.

pages/Gaufres de Mulhouse.md

@@ -0,0 +1,14 @@
+[Cuisine](cuisine)
+# Gaufres de Mulhouse
+> Pour une douzaine de gaufres environ
+## Ingrédients
+- 125 g de beurre pommade
+- 250 g de farine
+- 4 œufs
+- 37 cl de lait tiède
+- 65 g de sucre
+- 1 sachet de levure chimique
+## Recette
+Tourner le beurre en pommade. Ajouter les œufs un à un en tournant bien entre chaque œuf.
+Incorporer la farine en alternant avec le lait tiède et le sucre. Ajouter une pincée de sel fin et la levure chimique.
+Laisser reposer la pâte une heure avant de faire les gaufres.

pages/Gaufres.md

@@ -0,0 +1,21 @@
+[Cuisine](cuisine)
+# Gaufres
+> Gaufres inspirées de la recette de la grand-mère Bocuse
+## Ingrédients
+- 150 g de beurre
+- 4 oeufs entier
+- 250 g de farine
+- 40 cl de crème liquide
+- 12 cl d'eau (à adopter selon la consistance)
+- 1 pincée de sel fin
+- 35 g de sucre semoule
+## Recette
+Faire fondre le beurre dans une casserole.
+Séparer les blancs des jaunes d'oeuf.
+
+Mettre la farine dans un saladier et former un puits.
+Ajouter la crème liquide et progressivement l'eau tout en incorporant la farine à l'aide d'un fouet (la pâte doit faire le ruban).
+Ajouter, tout en mélangeant, le beurre fondu
+
+Cuisson dans le gaufrier position II moelleux.
+Deux cuillère à salade bien remplie pour chaque fournée.

pages/Glace au yaourt.md

@@ -0,0 +1,11 @@
+[Cuisine](cuisine)
+# Glace au yaourt
+> Pour 1l de glace environ
+## Ingrédients
+- 3 yaourts à la vanille maison
+- 20 cl de crème liquide
+- 100 g de sucre
+## Recette
+Fouetter la crème en ajoutant progressivement le sucre.
+Mélanger délicatement la crème fouettée et le yaourt.
+Turbiner 40 minutes.

pages/Kouglof perdu.md

@@ -0,0 +1,9 @@
+[Cuisine](cuisine)
+# Kouglof perdu
+> Comme du pain perdu
+## Ingrédients
+- 50 cl de lait
+- 60 g de sucre
+- 2 œufs
+- Du sucre en poudre ou du caramel
+## Recette

pages/Kouglof.md

@@ -0,0 +1,31 @@
+[Cuisine](cuisine)
+# Kouglof
+> Pour un moule moyen à kouglof (pour un grand moule, voir les informations entre parenthèses)
+## Ingrédients
+- 375 g (500 g) de farine
+- 150 g (200 g) de beurre
+- 60 g (80 g) de sucre
+- Une pincée de sel
+- 3 œufs (4 œufs) entiers (moyen)
+- 1,5 paquets (2 paquets) de levure de boulangerie sèche (oetker)
+- 75 ml (100 ml) de lait légèrement tiédi
+- 75 g (100 g) de raisin sec
+## Recette
+Faire gonfler les raisins secs dans de l'eau chaude avec du sucre.
+
+Mettre la levure dans le lait tiède.
+
+Tout mettre dans le bol du robot (sauf les raisins secs) et battre au crochet jusqu'à ce que la pâte se détache du crochet.
+
+Egouter les raisins secs et les ajouter à la pâte et faire tourner le robot pour bien les incorporer à la pâte.
+
+Mettre un torchon humide sur le bol du mixer et faire lever dans le bol du mixer (2h environ).
+
+Beurrer le moule et mettre du sucre et couvrir d'amandes effilées.
+
+Sortir la pâte du bol du mixer, la casser et façonner comme une boule de pâte à pizza (replier plusieurs fois pour incorporer de l'air).
+Faire un trou au milieu de la pâte et la mettre dans le moule et laisser monter encore une fois (1 bonne heure) en couvrant avec un torchon humide.
+
+Mettre au four à 160°C pendant 45 minutes (50 minutes).
+
+Démouler à la sortie du four et laisser refroidir sur une grille.

pages/Madeleines.md

@@ -0,0 +1,18 @@
+[Cuisine](cuisine)
+# Madeleines
+> Madeleines De Commercy ou d'ailleurs.
+> Recette pour 12 madeleines environ
+## Ingrédients
+- 2 œufs entiers
+- 87 g de sucre semoule
+- 33 g de Lait
+- 125 g de farine
+- 5 g de levure chimique
+- 125 g de beurre
+- 1 gousse de vanille ou le zeste râpé d'un citron non traité
+## Recette
+Beurrer et fariner les moules à madeleines.
+Mélanger les oeufs et le sucre.
+Ajouter le lait.
+Ajouter la farine et la poudre à lever préalablement mélangés.
+Ajouter les arômes.

pages/Mangues pochées au jus d'orange sanguine.md

@@ -0,0 +1,14 @@
+[Cuisine](cuisine)
+## Mangues pochées au jus d'orange sanguine
+> A tester
+## Ingrédients
+- Une mangue
+- 30 cl de jus d'orange sanguine
+- 60 g de sucre semoule
+- 1 feuille de menthe
+## Recette
+Porter à ébullition le jus d'orange et le sucre avec la feuille de menthe.
+Laisser refroidir.
+
+Couper la mangue en fines lamelles et les plonger dans le sirop obtenu.
+Faire cuire pendant 10 minutes à feu doux.

pages/Meringues.md

@@ -0,0 +1,13 @@
+[Cuisine](cuisine)
+# Meringues
+> Des mini meringues qui tiennent sur deux plaques de cuisson
+## Ingrédients
+- 340 g de sucre
+- 5 blancs d’œufs
+- 1 cuillère à café d’extrait de vanille
+## Recette
+Battre les blancs d’œufs en ajoutant progressivement 170 g de sucre jusqu’à ce qu’ils doublent de volume.
+Ajouter 85 g de sucre et l’extrait de vanille et fouetter jusqu’à ce que les œufs soient brillants et fermes.
+Ajouter le reste de sucre en pluie et continuer à battre deux minutes.
+A l’aide d’une poche à douille former les meringues sur une plaque de cuisson.
+Cuire 1h15 a 90ºC.

pages/Sauce caramel beurre salé.md

@@ -0,0 +1,15 @@
+[Cuisine](cuisine)
+# Sauce caramel beurre salé
+> Idéale pour les crêpes ou les gaufres.
+## Ingrédients
+- 20 cl de crème liquide (environ 190 g)
+- 30 g de beurre demi-sel
+- 160 g de sucre en poudre
+## Recette
+Mettre une casserole sur feu doux et repartir une petite quantité du sucre sur toute la surface, puis au fur et à mesure qu’il fond rajouter le sucre. Ne pas remuer.
+
+Pendant ce temps faire bouillir la crème.
+
+Une fois tout le sucre fondu, le caramel sera alors noisette, décuire avec le beurre coupé en petits dés (verser peu à peu le beurre en remuant sans s’arreter pour faire baisser la température du sucre).
+
+Puis ajouter la crème bouillie en remuant. Porter à ébullition puis verser dans un récipient placé dans de l’eau glacée.

pages/accueil.md

@@ -1,4 +1,5 @@
-[index]()
+[Index](index)
 # Accueil
 ## [Notes](notes)
 ## [Cuisine](cuisine)
+[Page de tests pour le développement de CheezeNotes](test)

pages/cuisine.md

@@ -46,4 +46,14 @@
 [Crêpes]()
 [Fondants au chocolat]()
 [Gâteau au chocolat leger]()
+[Gaufres]()
+[Gaufres de Mulhouse]()
+[Glace au yaourt]()
+[Kouglof]()
+[Kouglof perdu]()
+[Madeleines]()
+[Mangues pochées au jus d'orange sanguine]()
+[Meringues]()
+[Œufs au lait]()
+[Sauce caramel beurre salé]()
 ## Autre

pages/index.md

@@ -1,6 +1,7 @@
-# RustyNotes
-L'objectif de RustyNotes est de pouvoir saisir des notes avec un minimum de formatage le plus rapidement possible.
-> Cette page est un bac à sable. Les modifications ne seront jamais enregistrées.
+[Accueil](accueil)
+# CheezeNotes
+L'objectif de CheezeNotes est de pouvoir saisir des notes avec un minimum de formatage le plus rapidement possible.
+> Cette page est un bac à sable. Les modifications ne seront jamais enregistrées.
 > Pour réinitialiser la page, il suffit de la recharger.
 ## Utilisation
 Pour passer en mode édition, il suffit de cliquer sur le texte à modifier.
@@ -13,16 +14,20 @@ Il y a 4 niveaux de titres :
 - `## titre 2`
 - `### titre 3`
 - `#### titre 4`
+- `##### titre 5`
+- `###### titre 6`
 ### **Gras**, *italic* etc.
 |:Syntaxe:|:Résultat:|:Ok ?:|
 |:`**gras**`|:**gras**|:|
 |`*italic*`|*italic*||
 |`__gras__`|__gras__||
 |`_italic_`|_italic_||
+|`~~barré~~`|~~barré~~||
 |`***gras_italic***`|***gras_italic***||
 |`___gras_italic___`|___gras_italic___|Non|
 |`__*gras_italic*__`|__*gras_italic*__||
 |````texte formaté````|`texte formaté`||
+| `````````|```||
 ### Liens
 Pour une url longue à laquelle on veut associer un libellé plus parlant, on choisira la syntaxe complète :
 - [Wikipedia Markdown](https://fr.wikipedia.org/wiki/Markdown)

pages/test.md

@@ -0,0 +1,3 @@
+[Accueil](accueil)
+# Test pour développement CheezeNotes
+test de gras au milieu d'un texte

pages/Œufs au lait.md

@@ -0,0 +1,25 @@
+[Cuisine](cuisine)
+# Œufs au lait
+> Pour 6 ramequins
+## Ingrédients
+- 75 g de sucre en poudre
+- Une gousse de vanille
+- 50 cl de lait
+- 3 gros œufs
+## Recette
+Dans une casserole, mettez le lait, le sucre en poudre et la demi-gousse de vanille
+fendue dans le sens de la longueur, puis portez à ébullition. Éteignez le feu et laissez infuser 5 minutes, retirez ensuite la vanille.
+
+Battez vigoureusement les oeufs dans une terrine. Versez peu à peu le lait chaud
+tout en battant. Passez cette crème au travers d’un tamis fin et répartissez-la dans six ramequins.
+
+Recouvrez la lèchefrite du four avec deux ou trois épaisseurs de papier absorbant.
+Posez les ramequins. Remplissez d’eau jusqu’au niveau de la crème.
+
+Enfournez (à 210°C) en prenant soin de placer le plat au tiers supérieur du four
+pour que le fond des ramequins ne reçoive pas de chaleur trop vive et que la surface,
+en revanche, se teinte légèrement. La crème est cuite lorsqu’elle ne coule plus, soit au
+bout de 40 minutes environ. Retirez du four et laissez refroidir : la crème épaissit en
+refroidissant.
+
+Servez et dégustez.

src/commons.rs

@@ -6,8 +6,11 @@ pub struct Arguments {
     #[arg(short, long, default_value_t = String::from("127.0.0.1"))]
     pub ip: String,
     /// Port to listen to
-    #[arg(short, long, default_value_t = 8081)]
+    #[arg(short, long, default_value_t = 8333)]
     pub port: u16,
+    /// root of the url ending and starting with /
+    #[arg(short, long, default_value_t = String::from("/"))]
+    pub root: String,
 }
 
 impl Arguments {
@@ -22,7 +25,8 @@ impl Arguments {
 #[derive(Clone)]
 pub struct AppData {
     pub name: String,
+    pub root: String,
     pub db_url: String,
     pub db_user: String,
-    pub db_passwd: String,
+    pub db_password: String,
 }

src/index.rs

@@ -10,10 +10,12 @@ use crate::commons::AppData;
 #[template(path = "index.html")]
 pub struct PageTemplate {
     pub name: String,
+    pub root: String,
 }
 
 #[get("/")]
 async fn index(data: web::Data<AppData>) -> impl Responder {
     let name = data.name.to_owned();
-    PageTemplate { name }.to_response()
+    let root = data.root.to_owned();
+    PageTemplate { name, root }.to_response()
 }

src/main.rs

@@ -1,8 +1,8 @@
 use actix_web::{web, App, HttpServer};
 use actix_files;
 
-use mdnotes::commons::{Arguments, AppData};
-use mdnotes::{ page, index };
+use cheezenotes::commons::{Arguments, AppData};
+use cheezenotes::{ page, index };
 
 #[actix_web::main]
 async fn main() -> std::io::Result<()> {
@@ -11,9 +11,14 @@ async fn main() -> std::io::Result<()> {
 
     let ip = args.ip;
     let port = args.port;
+    let root = args.root;
 
     let appdata = AppData {
-        name: String::from("MdNotes"),
+        name: String::from("CheezeNotes"),
+        root,
+        db_url: String::from(""),
+        db_user: String::from(""),
+        db_password: String::from(""),
     };
 
     HttpServer::new(move || {

src/page.rs

@@ -9,12 +9,13 @@ use askama_actix::Template;
 use askama_actix::TemplateToResponse;
 
 use crate::commons::AppData;
-use crate::database::DatabaseConnection;
+//use crate::database::DatabaseConnection;
 
 #[derive(Template)]
 #[template(path = "page.html")]
 pub struct PageTemplate {
     pub name: String,
+    pub root: String,
     pub md: String,
     pub init: String,
 }
@@ -23,21 +24,22 @@ pub struct PageTemplate {
 async fn page(path: web::Path<(String,)>, data: web::Data<AppData>) -> impl Responder {
     let pagename = &path.0;
     let name = data.name.to_owned() + " " + pagename.as_str();
+    let root = data.root.to_owned();
     let filename = String::from("pages/") + pagename.as_str() + ".md";
     let md = match fs::read_to_string(filename) {
         Ok(txt) => txt,
         Err(_) => String::from("# Nouvelle page"),
     };
     let init = String::from("init();");
-    PageTemplate { name, md, init }.to_response()
+    PageTemplate { name, root, md, init }.to_response()
 }
 
 #[put("/page/{page}")]
 async fn save_page(body: String, path: web::Path<(String,)>) -> impl Responder {
     let pagename = &path.0;
-    if pagename == "index" {
+    /*if pagename == "index" {
         return HttpResponse::Ok();
-    }
+    }*/
     let filename = String::from("pages/") + pagename.as_str() + ".md";
     let mut file = match fs::File::create(&filename) {
         Ok(f) => f,

static/cheezenotes.css

@@ -0,0 +1,283 @@
+@font-face {
+  font-family: 'Material Icons';
+  font-style: normal;
+  font-weight: 400;
+  src: local('Material Icons'),
+    local('MaterialIcons-Regular'),
+    url(/static/MaterialIcons-Regular.ttf) format('truetype');
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;  /* Preferred icon size */
+  display: inline-block;
+  line-height: 1;
+  text-transform: none;
+  letter-spacing: normal;
+  word-wrap: normal;
+  white-space: nowrap;
+  direction: ltr;
+  -webkit-font-smoothing: antialiased;
+  text-rendering: optimizeLegibility;
+  -moz-osx-font-smoothing: grayscale;
+  font-feature-settings: 'liga';
+}
+
+html {
+  font-family: system-ui;
+  font-size: 12pt;
+}
+
+body {
+  margin: 0;
+  background-color: #f6f6f6;
+}
+
+button {
+  width: 2.2rem;
+  height: 2.2rem;
+}
+
+div#buttons {
+  position: fixed;
+  background-color: #dddddddd;
+  border-bottom: 3px solid #ccccccdd;
+  top: 0;
+  left: 0;
+  right: 0;
+  height: 3rem;
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 1200;
+}
+
+div#buttons #taButtonLabel {
+  position: relative;
+  font-size: 1.8rem;
+  top: +0.2rem;
+}
+
+div#buttons #lockButtonLabel {
+  position: relative;
+  top: +.5rem;
+}
+
+div.ta { 
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 1200;
+}
+
+textarea#ta {
+  position: relative;
+  top: 3rem;
+  display: none;
+  width: 100%;
+  height: 15rem;
+  padding-left: 3rem;
+  padding-right: 3rem;
+  background-color: #cceeff;
+}
+
+div#cheezenotes {
+  margin-top: 3rem;
+  margin-left: auto;
+  margin-right: auto;
+  max-width: 1200;
+  padding-top: 1rem;
+  padding-left: 3rem;
+  padding-right: 3rem;
+  padding-bottom: 1rem;
+  margin-bottom: 3rem;
+  background-color: #ffffff;
+  min-height: 90%;
+  overflow-x: auto;
+}
+
+div#cheezenotes div.cheezenotes_line {
+  /* Pour firefox : white-space: pre; */
+}
+
+div#cheezenotes span.tokenfictif {
+  font-weight: 1;
+  color: #1353b3;
+}
+
+div#cheezenotes:focus {
+  outline: none;
+}
+
+div#cheezenotes div.line {
+  border-bottom: 1px solid #dddddd;
+  padding-top: 0rem;
+  margin-top: 0rem;
+  font-size: 8pt;
+}
+
+div#cheezenotes div.h1 {
+  font-size: 3rem;
+  margin-top: 1.5rem;
+  margin-bottom: 1.3rem;
+  padding-bottom: 0.5rem;
+  border-bottom: 1px solid #dddddd;
+}
+
+div#cheezenotes div.h2 {
+  font-size: 2.3rem;
+  margin-top: 1rem;
+  margin-bottom: 1rem;
+}
+
+div#cheezenotes div.h3 {
+  font-size: 1.8rem;
+  margin-top: 0.8rem;
+  margin-bottom: 0.8rem;
+}
+
+div#cheezenotes div.h4 {
+  font-size: 1.5rem;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+
+div#cheezenotes div.h5 {
+  font-size: 1.3rem;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+
+div#cheezenotes div.h6 {
+  font-size: 1.2rem;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+
+div#cheezenotes div.bq1 {
+  padding-top: 0.3rem;
+  padding-bottom: 0.3rem;
+  padding-left: .9rem;
+  background-color: #f5f5f5;
+  border-left: .3rem solid #446699;
+}
+
+div#cheezenotes div.bq2 {
+  padding-top: 0.3rem;
+  padding-bottom: 0.3rem;
+  padding-left: .6rem;
+  background-color: #f5f5f5;
+  border-left: .6rem solid #5577aa;
+}
+
+div#cheezenotes div.bq3 {
+  padding-top: 0.3rem;
+  padding-bottom: 0.3rem;
+  padding-left: .3rem;
+  background-color: #f5f5f5;
+  border-left: .9rem solid #6688bb;
+}
+
+div#cheezenotes div.ul1 { display:list-item; list-style-position: inside; padding-left: 2.2rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ul1.bq1 { padding-left: 1.9rem; }
+div#cheezenotes div.ul1.bq2 { padding-left: 1.6rem; }
+div#cheezenotes div.ul1.bq3 { padding-left: 1.3rem; }
+
+div#cheezenotes div.ul2 { display:list-item; list-style-position: inside; list-style-type: circle; padding-left: 2.7rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ul2.bq1 { padding-left: 2.4rem; }
+div#cheezenotes div.ul2.bq2 { padding-left: 2.1rem; }
+div#cheezenotes div.ul2.bq3 { padding-left: 1.8rem; }
+
+div#cheezenotes div.ul3 { display:list-item; list-style-position: inside; list-style-type: square; padding-left: 3.2rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ul3.bq1 { padding-left: 2.9rem; }
+div#cheezenotes div.ul3.bq2 { padding-left: 2.6rem; }
+div#cheezenotes div.ul3.bq3 { padding-left: 2.3rem; }
+
+div#cheezenotes div.ol1 { padding-left: 2.2rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ol1.bq1 { padding-left: 1.9rem; }
+div#cheezenotes div.ol1.bq2 { padding-left: 1.6rem; }
+div#cheezenotes div.ol1.bq3 { padding-left: 1.3rem; }
+
+div#cheezenotes div.ol2 { padding-left: 2.7rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ol2.bq1 { padding-left: 2.4rem; }
+div#cheezenotes div.ol2.bq2 { padding-left: 2.1rem; }
+div#cheezenotes div.ol2.bq3 { padding-left: 1.8rem; }
+
+div#cheezenotes div.ol3 { padding-left: 3.2rem; padding-bottom: .2rem; padding-top: .2rem; }
+div#cheezenotes div.ol3.bq1 { padding-left: 2.9rem; }
+div#cheezenotes div.ol3.bq2 { padding-left: 2.6rem; }
+div#cheezenotes div.ol3.bq3 { padding-left: 2.3rem; }
+
+div#cheezenotes span.oltoken {
+  display: inline-block;
+  width: 2rem;
+}
+
+div#cheezenotes a.link {
+  color: rgb(0, 0, 238);
+}
+
+div#cheezenotes span.lefttablespacer {
+  display: inline-block;
+}
+
+div#cheezenotes span.righttablespacer {
+  display: inline-block;
+}
+
+div#cheezenotes div.tablerow {
+  margin-top: .5rem;
+  margin-bottom: .9rem;
+  overflow-x: visible;
+}
+
+div#cheezenotes span.tablerow {
+  white-space: nowrap;
+  overflow-x: visible;
+  border-bottom: 1px solid #dddddd;
+  padding-bottom: 0.4rem;
+}
+
+div#cheezenotes div.firsttablerow {
+  margin-top: 1.5rem;
+}
+
+div#cheezenotes div.firsttablerow span.tablerow {
+  margin-bottom: 1.5rem;
+  border-bottom: 1px solid #666666;
+  font-weight: bold;
+}
+
+div#cheezenotes div.lasttablerow {
+  margin-bottom: 1.5rem;
+}
+
+div#cheezenotes div.lasttablerow span.tablerow {
+  margin-bottom: 1.5rem;
+  border-bottom: none;
+}
+
+
+
+div#cheezenotes div.cheezenotes_line span.token {
+  font-weight: 1;
+  color: #1353b3;
+  overflow: hidden;
+}
+
+div#cheezenotes div.cheezenotes_line span.token {
+  font-size: 0;
+}
+
+div#cheezenotes:focus div.cheezenotes_line span.token {
+  font-size: inherit;
+}
+
+div#cheezenotes div.body {
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+}
+div#cheezenotes span.mono {
+  font-family: monospace;
+  color: #555555;
+}

static/mdnotes.css

@@ -1,251 +0,0 @@
-html {
-  font-family: system-ui;
-  font-size: 12pt;
-}
-
-body {
-  margin: 0;
-  background-color: #f6f6f6;
-}
-
-button {
-  width: 2.2rem;
-  height: 2.2rem;
-}
-
-div#buttons {
-  position: fixed;
-  background-color: #dddddddd;
-  border-bottom: 3px solid #ccccccdd;
-  top: 0;
-  left: 0;
-  right: 0;
-  height: 3rem;
-  margin-left: auto;
-  margin-right: auto;
-  max-width: 1200;
-}
-
-div#buttons #taButtonLabel {
-  position: relative;
-  font-size: 1.8rem;
-  top: +0.2rem;
-}
-
-div#buttons #lockButtonLabel {
-  position: relative;
-  font-size: 1.8rem;
-  top: +0.2rem;
-}
-
-div.ta { 
-  margin-left: auto;
-  margin-right: auto;
-  max-width: 1200;
-}
-
-textarea#ta {
-  position: relative;
-  top: 3rem;
-  display: none;
-  width: 100%;
-  height: 15rem;
-  padding-left: 3rem;
-  padding-right: 3rem;
-  background-color: #cceeff;
-}
-
-div#mdnotes {
-  margin-top: 3rem;
-  margin-left: auto;
-  margin-right: auto;
-  max-width: 1200;
-  padding-top: 1rem;
-  padding-left: 3rem;
-  padding-right: 3rem;
-  padding-bottom: 1rem;
-  margin-bottom: 3rem;
-  background-color: #ffffff;
-  min-height: 90%;
-  overflow-x: auto;
-}
-
-div#mdnotes div.mdnotes_line {
-  /* Pour firefox : white-space: pre; */
-}
-
-div#mdnotes span.tokenfictif {
-  font-weight: 1;
-  color: #1353b3;
-}
-
-div#mdnotes:focus {
-  outline: none;
-}
-
-div#mdnotes div.line {
-  border-bottom: 1px solid #dddddd;
-  padding-top: 0rem;
-  margin-top: 0rem;
-  font-size: 8pt;
-}
-
-div#mdnotes div.h1 {
-  font-size: 3rem;
-  margin-top: 1.5rem;
-  margin-bottom: 1.3rem;
-  padding-bottom: 0.5rem;
-  border-bottom: 1px solid #dddddd;
-}
-
-div#mdnotes div.h2 {
-  font-size: 2.3rem;
-  margin-top: 1rem;
-  margin-bottom: 1rem;
-}
-
-div#mdnotes div.h3 {
-  font-size: 1.8rem;
-  margin-top: 0.8rem;
-  margin-bottom: 0.8rem;
-}
-
-div#mdnotes div.h4 {
-  font-style: italic;
-  font-size: 1.4rem;
-  margin-top: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-
-div#mdnotes div.bq1 {
-  padding-top: 0.3rem;
-  padding-bottom: 0.3rem;
-  padding-left: .9rem;
-  background-color: #f5f5f5;
-  border-left: .3rem solid #446699;
-}
-
-div#mdnotes div.bq2 {
-  padding-top: 0.3rem;
-  padding-bottom: 0.3rem;
-  padding-left: .6rem;
-  background-color: #f5f5f5;
-  border-left: .6rem solid #5577aa;
-}
-
-div#mdnotes div.bq3 {
-  padding-top: 0.3rem;
-  padding-bottom: 0.3rem;
-  padding-left: .3rem;
-  background-color: #f5f5f5;
-  border-left: .9rem solid #6688bb;
-}
-
-div#mdnotes div.ul1 { display:list-item; list-style-position: inside; padding-left: 2.2rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ul1.bq1 { padding-left: 1.9rem; }
-div#mdnotes div.ul1.bq2 { padding-left: 1.6rem; }
-div#mdnotes div.ul1.bq3 { padding-left: 1.3rem; }
-
-div#mdnotes div.ul2 { display:list-item; list-style-position: inside; list-style-type: circle; padding-left: 2.7rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ul2.bq1 { padding-left: 2.4rem; }
-div#mdnotes div.ul2.bq2 { padding-left: 2.1rem; }
-div#mdnotes div.ul2.bq3 { padding-left: 1.8rem; }
-
-div#mdnotes div.ul3 { display:list-item; list-style-position: inside; list-style-type: square; padding-left: 3.2rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ul3.bq1 { padding-left: 2.9rem; }
-div#mdnotes div.ul3.bq2 { padding-left: 2.6rem; }
-div#mdnotes div.ul3.bq3 { padding-left: 2.3rem; }
-
-div#mdnotes div.ol1 { padding-left: 2.2rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ol1.bq1 { padding-left: 1.9rem; }
-div#mdnotes div.ol1.bq2 { padding-left: 1.6rem; }
-div#mdnotes div.ol1.bq3 { padding-left: 1.3rem; }
-
-div#mdnotes div.ol2 { padding-left: 2.7rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ol2.bq1 { padding-left: 2.4rem; }
-div#mdnotes div.ol2.bq2 { padding-left: 2.1rem; }
-div#mdnotes div.ol2.bq3 { padding-left: 1.8rem; }
-
-div#mdnotes div.ol3 { padding-left: 3.2rem; padding-bottom: .2rem; padding-top: .2rem; }
-div#mdnotes div.ol3.bq1 { padding-left: 2.9rem; }
-div#mdnotes div.ol3.bq2 { padding-left: 2.6rem; }
-div#mdnotes div.ol3.bq3 { padding-left: 2.3rem; }
-
-div#mdnotes span.oltoken {
-  display: inline-block;
-  width: 2rem;
-}
-
-div#mdnotes span.lefttablespacer {
-  display: inline-block;
-}
-
-div#mdnotes span.righttablespacer {
-  display: inline-block;
-}
-
-div#mdnotes div.tablerow {
-  margin-top: .5rem;
-  margin-bottom: .9rem;
-  overflow-x: visible;
-}
-
-div#mdnotes span.tablerow {
-  white-space: nowrap;
-  overflow-x: visible;
-  border-bottom: 1px solid #dddddd;
-  padding-bottom: 0.4rem;
-}
-
-div#mdnotes div.firsttablerow {
-  margin-top: 1.5rem;
-}
-
-div#mdnotes div.firsttablerow span.tablerow {
-  margin-bottom: 1.5rem;
-  border-bottom: 1px solid #666666;
-  font-weight: bold;
-}
-
-div#mdnotes div.lasttablerow {
-  margin-bottom: 1.5rem;
-}
-
-div#mdnotes div.lasttablerow span.tablerow {
-  margin-bottom: 1.5rem;
-  border-bottom: none;
-}
-
-
-
-div#mdnotes div.mdnotes_line span.token {
-  font-weight: 1;
-  color: #1353b3;
-  overflow: hidden;
-}
-
-div#mdnotes div.mdnotes_line span.token {
-  font-size: 0;
-}
-
-div#mdnotes:focus div.mdnotes_line span.token {
-  font-size: inherit;
-}
-
-div#mdnotes div.body {
-  margin-top: 0.5rem;
-  margin-bottom: 0.5rem;
-}
-
-div#mdnotes span.bold {
-  font-weight: bold;
-}
-
-div#mdnotes span.italic {
-  font-style: italic;
-}
-
-div#mdnotes span.mono {
-  font-family: monospace;
-  color: #885511;
-}

static/modules/caret.js

@@ -0,0 +1,193 @@
+function insertTextAtCaret(txtBefore, txtAfter = '') {
+  let ret = saveSelection();
+  let line = ret[0];
+  let start = ret[1];
+  let end = ret[3];
+  let txt = line.innerText;
+  let before = ''
+  if (start == 0) {
+  } else {
+    before = txt.substring(0, start);
+  }
+  let after = txt.substring(end, txt.length);
+  let selection = '';
+  if (end > start) {
+    selection = txt.substring(start, end);
+  }
+  line.innerHTML = before + txtBefore + selection + txtAfter + after;
+  let span = document.createElement('span');
+  if (start == end && ret[0] == ret[2]) {
+    span.innerHTML = txtBefore;
+    ret[1] = start + span.innerText.length;
+    ret[3] = ret[1];
+  } else {
+    span.innerHTML = txtBefore + txtAfter;
+    ret[3] = end + span.innerText.length;
+  }
+  loadSelection(ret);
+}
+
+function saveSelection() {
+  let ret = getStartPositionInLine();
+  let startLine = ret[0];
+  let startPosition = ret[1];
+  ret = getEndPositionInLine();
+  let endLine = ret[0];
+  let endPosition = ret[1];
+  return [startLine, startPosition, endLine, endPosition];
+}
+
+function loadSelection(sel) {
+  setStartPositionInLine(sel[0], sel[1]);
+  setEndPositionInLine(sel[2], sel[3]);
+}
+
+function getStartPositionInLine() {
+  let selection = window.getSelection();
+  if (selection.rangeCount == 0) {
+    return [null, 0];
+  }
+  let range = selection.getRangeAt(0).cloneRange();
+  let obj = range.startContainer;
+
+  let position = range.startOffset;
+
+  if (obj.nodeName == 'DIV' && obj.classList.contains('cheezenotes_line')) {
+    return [obj, position];
+  }
+
+  let line = null;
+
+  while (obj != null) {
+    if (obj.previousSibling != null) {
+      obj = obj.previousSibling;
+      if (obj.innerText != null) {
+        position += obj.innerText.length;
+      } else if (obj.length != null) {
+        position += obj.length;
+      }
+    } else if (obj.parentNode != null && obj.parentNode.classList != null && !obj.parentNode.classList.contains('cheezenotes_line')) {
+      obj = obj.parentNode;
+    } else if (obj.parentNode != null && obj.parentNode.classList != null && obj.parentNode.classList.contains('cheezenotes_line')) {
+      line = obj.parentNode;
+      obj = null;
+    } else {
+      obj = null;
+    }
+  }
+  return [line, position];
+}
+
+function setStartPositionInLine(line, position) {
+  setStartPositionInDiv(line, position)
+}
+
+function setStartPositionInDiv(obj, position) {
+  let temppos = position;
+  if (temppos > obj.innerText.length) {
+    return temppos - obj.innerText.length;
+  }
+  let children = obj.childNodes;
+  for (let i = 0; i < children.length; i++) {
+    let child = children[i];
+    if (child.nodeType == 3) {
+      temppos = setStartPositionInText(child, temppos);
+    } else {
+      temppos = setStartPositionInDiv(child, temppos);
+    }
+    if (temppos == 0) {
+      return temppos;
+    }
+  }
+  return temppos;
+}
+
+function setStartPositionInText(obj, position) {
+  if (position > obj.length) {
+    return position - obj.length;
+  }
+
+  let selection = window.getSelection();
+  selection.removeAllRanges();
+  let range = document.createRange();
+  range.setStart(obj, position);
+  selection.addRange(range);
+  return 0;
+}
+
+function getEndPositionInLine() {
+  let selection = window.getSelection();
+  if (selection.rangeCount == 0) {
+    return [null, 0];
+  }
+  let range = selection.getRangeAt(0).cloneRange();
+  let obj = range.endContainer;
+
+  let position = range.endOffset;
+
+  if (obj.nodeName == 'DIV' && obj.classList.contains('cheezenotes_line')) {
+    return [obj, position];
+  }
+
+  let line = null;
+
+  while (obj != null) {
+    if (obj.previousSibling != null) {
+      obj = obj.previousSibling;
+      if (obj.innerText != null) {
+        position += obj.innerText.length;
+      } else if (obj.length != null) {
+        position += obj.length;
+      }
+    } else if (obj.parentNode != null && obj.parentNode.classList != null && !obj.parentNode.classList.contains('cheezenotes_line')) {
+      obj = obj.parentNode;
+    } else if (obj.parentNode != null && obj.parentNode.classList != null && obj.parentNode.classList.contains('cheezenotes_line')) {
+      line = obj.parentNode;
+      obj = null;
+    } else {
+      obj = null;
+    }
+  }
+  return [line, position];
+}
+
+function setEndPositionInLine(line, position) {
+  setEndPositionInDiv(line, position)
+}
+
+function setEndPositionInDiv(obj, position) {
+  let temppos = position;
+  if (temppos > obj.innerText.length) {
+    return temppos - obj.innerText.length;
+  }
+  let children = obj.childNodes;
+  for (let i = 0; i < children.length; i++) {
+    let child = children[i];
+    if (child.nodeType == 3) {
+      temppos = setEndPositionInText(child, temppos);
+    } else {
+      temppos = setEndPositionInDiv(child, temppos);
+    }
+    if (temppos == 0) {
+      return temppos;
+    }
+  }
+  return temppos;
+}
+
+function setEndPositionInText(obj, position) {
+  if (position > obj.length) {
+    return position - obj.length;
+  }
+
+  let selection = window.getSelection();
+  let oldRange = selection.getRangeAt(0);
+  let range = document.createRange();
+  range.setStart(oldRange.startContainer, oldRange.startOffset);
+  range.setEnd(obj, position);
+  selection.removeAllRanges();
+  selection.addRange(range);
+  return 0;
+}
+
+export { saveSelection, loadSelection, insertTextAtCaret };  

static/modules/cheezenotes.js

@@ -0,0 +1,209 @@
+import { saveSelection, loadSelection, insertTextAtCaret } from './caret.js';
+import { formatLine, load, save, formatTable, redrawTables, appendData, dpwidth } from './md.js';
+
+function timeoutSave() {
+    if (window.tos !== null) {
+        window.clearTimeout(window.tos);
+    }
+    window.tos = window.setTimeout(onsave, 5000);
+}
+
+function ontextarea(e) {
+    let ta = document.getElementById('ta');
+    if (ta.style.display != 'inline') {
+        ta.style.display = 'inline';
+    } else {
+        ta.style.display = 'none';
+    }
+}
+
+function onboldbutton(e) {
+    e.preventDefault();
+    let cheezenotes = document.getElementById('cheezenotes');
+    cheezenotes.focus();
+    insertTextAtCaret('**', '**');
+    onedit(e);
+    return false;
+}
+
+function onitalicbutton(e) {
+    e.preventDefault();
+    let cheezenotes = document.getElementById('cheezenotes');
+    cheezenotes.focus();
+    insertTextAtCaret('_', '_');
+    onedit(e);
+    return false;
+}
+
+function onstrikebutton(e) {
+    e.preventDefault();
+    let cheezenotes = document.getElementById('cheezenotes');
+    cheezenotes.focus();
+    insertTextAtCaret('~~', '~~');
+    onedit(e);
+    return false;
+}
+
+function onsave(e) {
+    let saveButton = document.getElementById('saveButton');
+    saveButton.disabled = true;
+    let text = save(document.getElementById('ta'), document.getElementById('cheezenotes'));
+    var xhttp = new XMLHttpRequest();
+    xhttp.onreadystatechange = function () {
+        if (this.readyState == 4 && this.status != 200) {
+            saveButton.disabled = false;
+            alert(xhttp.responseText);
+        }
+    }
+    xhttp.open("PUT", document.location.href, true);
+    xhttp.send(text);
+}
+
+function onload(e) {
+    load(document.getElementById('ta'), document.getElementById('cheezenotes'));
+}
+
+function onedit(e) {
+    timeoutSave();
+
+    if (e.inputType == 'insertCompositionText') {
+        e.preventDefault();
+        return false;
+    }
+
+    saveButton.disabled = false;
+    let ret = saveSelection();
+    let line = ret[0];
+    let position = ret[1];
+
+    if (line.innerText == '\n') {
+        line.className = 'cheezenotes_line';
+        line.classList.add('body');
+        return;
+    }
+
+    let prevline = line.previousSibling;
+    if (prevline != null && prevline.innerText == '\n') {
+        prevline.className = 'cheezenotes_line';
+        prevline.classList.add('body');
+    }
+
+    let newline = formatLine(line.innerText);
+    line.parentNode.replaceChild(newline, line);
+    formatTable(newline, dpwidth());
+    ret[0] = newline;
+    ret[2] = newline;
+    loadSelection(ret);
+    console.log('onedit fin');
+}
+
+function onkeydown(e) {
+    if (e.key != 'Tab') {
+        return true;
+    }
+
+    e.preventDefault();
+    let key = ' ';
+    insertTextAtCaret(key);
+    onedit(e);
+    return false;
+}
+
+function onkeyup(e) {
+    if (e.key !== 'Escape') {
+        return true;
+    }
+
+    e.preventDefault();
+    document.getElementById('cheezenotes').blur();
+    if (saveButton.disabled == false) {
+        onsave();
+    }
+    return false;
+}
+
+function onkeypress(e) {
+    if (e.key !== 'Escape') {
+        return true;
+    }
+
+    e.preventDefault();
+    document.getElementById('cheezenotes').blur();
+    if (saveButton.disabled == false) {
+        onsave();
+    }
+    return false;
+}
+
+function onpaste(e) {
+    e.preventDefault();
+    timeoutSave();
+    let data = e.clipboardData.getData('text/plain');
+    appendData(document.getElementById('cheezenotes'), data);
+    saveButton.disabled = false;
+    return false;
+}
+
+function oncopy(e) {
+    //alert(e.clipboardData.getData('text/plain'));
+}
+
+function onlockbutton(e) {
+    let lockButton = document.getElementById('lockButton');
+    let lockButtonLabel = document.getElementById('lockButtonLabel');
+    let cheezenotes = document.getElementById('cheezenotes');
+    if (lockButton.checked) {
+        cheezenotes.contentEditable = false;
+        lockButtonLabel.innerText = 'visibility';
+    } else {
+        cheezenotes.contentEditable = true;
+        lockButtonLabel.innerText = 'visibility_off';
+    }
+}
+
+function ondrag(e) {
+    // alert('drag');
+}
+
+function ondragenter(e) {
+    // alert('enter');
+}
+
+function ondragleave(e) {
+    // alert('leave')
+}
+
+function init(pagename = null) {
+    let cheezenotesdiv = document.getElementById('cheezenotes');
+
+    dpwidth(cheezenotesdiv);
+
+    cheezenotesdiv.addEventListener('input', onedit);
+    cheezenotesdiv.addEventListener('keyup', onkeyup);
+    cheezenotesdiv.addEventListener('keypress', onkeypress);
+    cheezenotesdiv.addEventListener('keydown', onkeydown);
+    cheezenotesdiv.addEventListener('paste', onpaste);
+    cheezenotesdiv.addEventListener('copy', oncopy);
+    cheezenotesdiv.addEventListener('blur', () => { redrawTables(cheezenotesdiv); onsave() });
+    cheezenotesdiv.addEventListener('focus', () => { redrawTables(cheezenotesdiv, dpwidth()); });
+    cheezenotesdiv.addEventListener('drag', ondrag);
+    cheezenotesdiv.addEventListener('dragenter', ondragenter);
+    cheezenotesdiv.addEventListener('dragleave', ondragleave);
+
+    let saveButton = document.getElementById('saveButton');
+    saveButton.disabled = true;
+    saveButton.addEventListener('click', onsave);
+    let taButton = document.getElementById('taButton');
+    taButton.addEventListener('click', ontextarea);
+    let lockButton = document.getElementById('lockButton');
+    lockButton.addEventListener('click', onlockbutton);
+    let boldButton = document.getElementById('boldButton');
+    boldButton.addEventListener('mousedown', onboldbutton);
+    let italicButton = document.getElementById('italicButton');
+    italicButton.addEventListener('mousedown', onitalicbutton);
+    let strikeButton = document.getElementById('strikeButton');
+    strikeButton.addEventListener('mousedown', onstrikebutton);
+    onload();
+}
+
+export { init };

static/modules/md.js

@@ -1,4 +1,4 @@
-import { getStartPositionInLine, setStartPositionInLine } from "./position.js";
+import { saveSelection, loadSelection } from "./caret.js";
 
 function load(textarea, div) {
     div.innerHTML = '';
@@ -14,7 +14,7 @@ function load(textarea, div) {
 function appendData(div, data) {
     const selection = window.getSelection();
     selection.deleteFromDocument();
-    let ret = getStartPositionInLine();
+    let ret = saveSelection();
     let line = ret[0];
     let position = ret[1];
     if (line == null) {
@@ -41,7 +41,7 @@ function appendData(div, data) {
         prevline.after(newline);
         position = lines[lines.length - 1].length;
     }
-    setStartPositionInLine(newline, position);
+    loadSelection([newline, position, newline, position]);
     redrawTables(div, dpwidth(div));
 }
 
@@ -80,16 +80,16 @@ function emsp() {
 
 function onlinkin(e) {
     let link = e.currentTarget;
-    if (document.getElementById('mdnotes') !== document.activeElement) {
-        document.getElementById('mdnotes').contentEditable = false;
+    if (document.getElementById('cheezenotes') !== document.activeElement) {
+        document.getElementById('cheezenotes').contentEditable = false;
     }
 }
 
 function onlink(e) {
-    let mdnotes = document.getElementById('mdnotes');
-    if (mdnotes.contentEditable == 'false') {
+    let cheezenotes = document.getElementById('cheezenotes');
+    if (cheezenotes.contentEditable == 'false') {
         e.preventDefault();
-        mdnotes.contentEditable = true;
+        cheezenotes.contentEditable = true;
         let link = e.currentTarget;
         if (link.host !== document.location.host) {
             open(link.href);
@@ -103,16 +103,16 @@ function onlink(e) {
 }
 
 function onlinkout(e) {
-    let mdnotes = document.getElementById('mdnotes');
-    if (mdnotes.contentEditable == 'false') {
-        mdnotes.contentEditable = true;
+    let cheezenotes = document.getElementById('cheezenotes');
+    if (cheezenotes.contentEditable == 'false') {
+        cheezenotes.contentEditable = true;
     }    
 }
 
 function formatLine(line) {
     let token = null;
     let elem = document.createElement('div');
-    elem.classList.add('mdnotes_line');
+    elem.classList.add('cheezenotes_line');
     if (line == '' || line == '\n') {
         elem.classList.add('body');
         elem.innerHTML = '<br>';
@@ -125,13 +125,19 @@ function formatLine(line) {
     line = ret[0];
     let listMono = ret[1];
 
-    // test remove link
     ret = removeLink(line);
-    console.log('removeLink ' + ret[0]);
+    line = ret[0];
+    let listLink = ret[1];
 
-    if (line.match(/^\s*-{3,}\s*$/)) {
-        token = /^(\s*-{3,}\s*)$/
+    if (line.match(/^\s*_{3,}\s*$/)) {
+        token = /^(\s*_{3,}\s*)$/
         elem.classList.add('line');
+    } else if (line.match(/^\s*######(\s|$)/i)) {
+        token = /^(\s*######(\s|$))/i;
+        elem.classList.add('h6');
+    } else if (line.match(/^\s*#####(\s|$)/i)) {
+        token = /^(\s*#####(\s|$))/i;
+        elem.classList.add('h5');
     } else if (line.match(/^\s*####(\s|$)/i)) {
         token = /^(\s*####(\s|$))/i;
         elem.classList.add('h4');
@@ -189,10 +195,11 @@ function formatLine(line) {
     if (token != null) {
         line = line.replace(token, '<span class="token">$1</span>');
     }
-    line = addLink(line);
     line = addBold(line);
     line = addItalic(line);
+    line = addStrike(line);
     line = addTableLine(line);
+    line = addLink(line, listLink);
     line = addMono(line, listMono);
     elem.innerHTML = line;
     if (elem.getElementsByClassName('tablerow').length > 0) {
@@ -282,11 +289,11 @@ function addTableLine(line) {
     return line;
 }
 
-function redrawTables(mdnotes, dpwidth = 0) {
-    if (mdnotes.childNodes.length == 0) {
+function redrawTables(cheezenotes, dpwidth = 0) {
+    if (cheezenotes.childNodes.length == 0) {
         return;
     }
-    let child = mdnotes.childNodes[0];
+    let child = cheezenotes.childNodes[0];
     let firsttableline = null;
     while(child != null) {
         if (firsttableline == null) {
@@ -465,11 +472,33 @@ function removeLink(line) {
         return [line, null];
     }
     
-    line = line.replace(/(\[([^\]]*?)\]\(([^\)]*?)\))/g, "[$2]()");
+    line = line.replace(/(\[([^\]]*?)\]\(([^\)]*?)\))/g, "[]()");
     return [line, listLink.reverse()];
 }
 
-function addLink(line) {
+function addLink(line, listLink) {
+    if (listLink == null) {
+        return line;
+    }
+    let cpt = 0;
+    let match;
+    let matches = [];
+    let re = /\[\]\(\)/g;
+    while ((match = re.exec(line)) != null) {
+        matches[cpt] = match.index;
+        if (cpt > 1000) {
+            continue;
+        }
+        cpt++;
+    }
+    matches = matches.reverse();
+    for(let i=0; i<matches.length; i++) {
+        line = line.substring(0, matches[i]) + formatLink(listLink[i]) + line.substring(matches[i]+4, line.length);
+    }
+    return line;
+}
+
+function formatLink(line) {
     line = line.replace(/(\[([^\]]+?)\]\(([^\)]+?)\))/ig, '<span class="token">[</span><a class="link" data-href="$3" href="$3">$2</a><span class="token">]($3)</span>');
     line = line.replace(/(\[([^\]]+?)\]\(\))/ig, '<span class="token">[</span><a class="link" data-href="$2" href="$2">$2</a><span class="token">]()</span>');
     line = line.replace(/(\[\]\(([^\)]+?)\))/ig, '<span class="token">[](</span><a class="link" data-href="$2" href="$2">$2</a><span class="token">)</span>');
@@ -477,14 +506,19 @@ function addLink(line) {
 }
 
 function addBold(line) {
-    line = line.replace(/\*\*([^\s].*?)\*\*/ig, '<span class="bold"><span class="token">**</span>$1<span class="token">**</span></span>');
-    line = line.replace(/__([^\s].*?)__/ig, '<span class="bold"><span class="token">__</span>$1<span class="token">__</span></span>');
+    line = line.replace(/\*\*([^\s].*?)\*\*/ig, '<b><span class="token">**</span>$1<span class="token">**</span></b>');
+    line = line.replace(/__([^\s].*?)__/ig, '<b><span class="token">__</span>$1<span class="token">__</span></b>');
     return line;
 }
 
 function addItalic(line) {
-    line = line.replace(/(^|[^\*])\*([^\*\s].*?[^\*\s]|[^\*\s])\*([^\*]|$)/ig, '$1<span class="italic"><span class="token">*</span>$2<span class="token">*</span></span>$3');
-    line = line.replace(/(^|[\s^*])_([^_\s].*?[^_\s]|[^_\s])_([^_]|$)/ig, '$1<span class="italic"><span class="token">_</span>$2<span class="token">_</span></span>$3');
+    line = line.replace(/(^|[^\*])\*([^\*\s].*?[^\*\s]|[^\*\s])\*([^\*]|$)/ig, '$1<i><span class="token">*</span>$2<span class="token">*</span></i>$3');
+    line = line.replace(/(^|[\s^*])_([^_\s].*?[^_\s]|[^_\s])_([^_]|$)/ig, '$1<i><span class="token">_</span>$2<span class="token">_</span></i>$3');
+    return line;
+}
+
+function addStrike(line) {
+    line = line.replace(/~~([^\s].*?)~~/ig, '<s><span class="token">~~</span>$1<span class="token">~~</span></s>');
     return line;
 }
 

static/modules/mdnotes.js

@@ -1,177 +0,0 @@
-import { getStartPositionInLine, setStartPositionInLine } from './position.js';
-import { formatLine, load, save, formatTable, redrawTables, appendData, dpwidth } from './md.js';
-
-function timeoutSave() {
-    if (window.tos !== null) {
-        window.clearTimeout(window.tos);
-    } 
-    window.tos = window.setTimeout(onsave, 5000);
-}
-
-function ontextarea(e) {
-    let ta = document.getElementById('ta');
-    if (ta.style.display != 'inline') {
-        ta.style.display = 'inline';
-    } else {
-        ta.style.display = 'none';
-    }
-}
-
-function onsave(e) {
-    let saveButton = document.getElementById('saveButton');
-    saveButton.disabled = true;
-    let text = save(document.getElementById('ta'), document.getElementById('mdnotes'));
-    var xhttp = new XMLHttpRequest();
-    xhttp.onreadystatechange = function() {
-        if (this.readyState == 4 && this.status != 200) {
-            saveButton.disabled = false;
-            alert(xhttp.responseText);
-        }
-    }
-    xhttp.open("PUT", document.location.href, true);
-    xhttp.send(text);
-}
-
-function onload(e) {
-    load(document.getElementById('ta'), document.getElementById('mdnotes'));
-}
-
-function onedit(e) {
-    console.log('onedit');
-    timeoutSave();
-    saveButton.disabled = false;
-    let ret = getStartPositionInLine();
-    let line = ret[0];
-    let position = ret[1];
-
-    if (line.innerText == '\n') {
-        line.className = 'mdnotes_line';
-        line.classList.add('body');
-        return;
-    }
-
-    let prevline = line.previousSibling;
-    if (prevline != null && prevline.innerText == '\n') {
-        prevline.className = 'mdnotes_line';
-        prevline.classList.add('body');
-    }
-
-    let newline = formatLine(line.innerText);
-    line.parentNode.replaceChild(newline, line);
-    formatTable(newline, dpwidth());
-    setStartPositionInLine(newline, position);
-    console.log('onedit fin');
-}
-
-function onkeydown(e) {
-    if (e.key != 'Tab') {
-        return true;
-    }
-
-    e.preventDefault();
-    let key = ' ';
-    let ret = getStartPositionInLine();
-    let line = ret[0];
-    let position = ret[1];
-    let txt = line.innerText;
-    if (position == 0) {
-        line.innerHTML = key + txt;    // 4 espaces =>  
-    } else {
-        line.innerHTML = txt.substring(0, position) + key + txt.substring(position, txt.length);
-    }
-    setStartPositionInLine(line, position + 1);
-    onedit(e);
-    return false;
-}
-
-function onkeypress(e) {
-    if (e.key == 'Escape') {
-        e.preventDefault();
-        document.getElementById('mdnotes').blur();
-        if (saveButton.disabled == false) {
-            onsave();
-        }
-        return false;
-    }
-    if (e.key == 'Enter') {
-
-    }
-}
-
-function onkeyup(e) {
-    if (e.key == 'Escape') {
-        e.preventDefault();
-        document.getElementById('mdnotes').blur();
-        if (saveButton.disabled == false) {
-            onsave();
-        }
-        return false;
-    }
-}
-
-function onpaste(e) {
-    e.preventDefault();
-    timeoutSave();
-    let data = e.clipboardData.getData('text/plain');
-    appendData(document.getElementById('mdnotes'), data);
-    saveButton.disabled = false;
-    return false;
-}
-
-function oncopy(e) {
-    //alert(e.clipboardData.getData('text/plain'));
-}
-
-function onlockbutton(e) {
-    let lockButton = document.getElementById('lockButton');
-    let mdnotes = document.getElementById('mdnotes');
-    if (lockButton.checked) {
-        mdnotes.contentEditable = false;
-    } else {
-        mdnotes.contentEditable = true;
-    }
-}
-
-function ondrag(e) {
-    // alert('drag');
-}
-
-function ondragenter(e) {
-    // alert('enter');
-}
-
-function ondragleave(e) {
-    // alert('leave')
-}
-
-function init(pagename = null) {
-    /*if (pagename != null) {
-        window.history.replaceState(null, '', '/page/' + pagename);
-    }*/
-    let mdnotesdiv = document.getElementById('mdnotes');
-
-    dpwidth(mdnotesdiv);
-
-    mdnotesdiv.addEventListener('input', onedit);
-    mdnotesdiv.addEventListener('keyup', onkeyup);
-    mdnotesdiv.addEventListener('keypress', onkeypress);
-    mdnotesdiv.addEventListener('keydown', onkeydown);
-    mdnotesdiv.addEventListener('paste', onpaste);
-    mdnotesdiv.addEventListener('copy', oncopy);
-    mdnotesdiv.addEventListener('blur', () => {redrawTables(mdnotesdiv); onsave()});
-    mdnotesdiv.addEventListener('focus', () => {redrawTables(mdnotesdiv, dpwidth());});
-    mdnotesdiv.addEventListener('drag', ondrag);
-    mdnotesdiv.addEventListener('dragenter', ondragenter);
-    mdnotesdiv.addEventListener('dragleave', ondragleave);
-
-    let saveButton = document.getElementById('saveButton');
-    saveButton.disabled = true;
-    saveButton.addEventListener('click', onsave);
-    let taButton = document.getElementById('taButton');
-    taButton.addEventListener('click', ontextarea);
-    let lockButton = document.getElementById('lockButton');
-    lockButton.addEventListener('click', onlockbutton);
-    onload();
-}
-
-export { init };

static/modules/position.js

@@ -1,74 +0,0 @@
-function getStartPositionInLine() {
-  let selection = window.getSelection();
-  if (selection.rangeCount == 0) {
-    return [null, 0];
-  }
-  let range = selection.getRangeAt(0).cloneRange();
-  let obj = range.startContainer;
-
-  let position = range.startOffset;
-
-  if (obj.nodeName == 'DIV' && obj.classList.contains('mdnotes_line')) {
-    return [obj, position];
-  }
-
-  let line = null;
-
-  while (obj != null) {
-    if (obj.previousSibling != null) {
-      obj = obj.previousSibling;
-      if (obj.innerText != null) {
-        position += obj.innerText.length;
-      } else if (obj.length != null) {
-        position += obj.length;
-      }
-    } else if (obj.parentNode != null && obj.parentNode.classList != null && !obj.parentNode.classList.contains('mdnotes_line')) {
-      obj = obj.parentNode;
-    } else if (obj.parentNode != null && obj.parentNode.classList != null && obj.parentNode.classList.contains('mdnotes_line')) {
-      line = obj.parentNode;
-      obj = null;
-    } else {
-      obj = null;
-    }
-  }
-  return [line, position];
-}
-
-function setStartPositionInLine(line, position) {
-  setStartPositionInDiv(line, position)
-}
-
-function setStartPositionInDiv(obj, position) {
-  let temppos = position;
-  if (temppos > obj.innerText.length) {
-    return temppos - obj.innerText.length;
-  }
-  let children = obj.childNodes;
-  for (let i = 0; i < children.length; i++) {
-    let child = children[i];
-    if (child.nodeType == 3) {
-      temppos = setStartPositionInText(child, temppos);
-    } else {
-      temppos = setStartPositionInDiv(child, temppos);
-    }
-    if (temppos == 0) {
-      return temppos;
-    }
-  }
-  return temppos;
-}
-
-function setStartPositionInText(obj, position) {
-  if (position > obj.length) {
-    return position - obj.length;
-  }
-
-  let selection = window.getSelection();
-  selection.removeAllRanges();
-  let range = document.createRange();
-  range.setStart(obj, position);
-  selection.addRange(range);
-  return 0;
-}
-
-export { getStartPositionInLine, setStartPositionInLine };  

templates/index.html

@@ -8,7 +8,7 @@
         <meta name="mobile-web-app-capable" content="yes">
         <meta name="apple-mobile-web-app-status-bar-style" content="black">
         <title>{{name}}</title>
-        <link rel="stylesheet" href="../static/mdnotes.css">
+        <link rel="stylesheet" href="{{ root|safe }}static/cheezenotes.css">
     </head>
     <body>
         <h1></h1>

templates/page.html

@@ -8,16 +8,22 @@
         <meta name="mobile-web-app-capable" content="yes">
         <meta name="apple-mobile-web-app-status-bar-style" content="black">
         <title>{{name}}</title>
-        <link rel="stylesheet" href="/static/mdnotes.css">
-        <script type="module" src="/static/modules/mdnotes.js"></script>
+        <link rel="stylesheet" href="{{ root|safe }}static/cheezenotes.css">
+        <script type="module" src="{{ root|safe }}static/modules/cheezenotes.js"></script>
     </head>
     <body>
-        <div id="buttons"><button id="saveButton">💾</button> <input type="checkbox" id="taButton" /><label id="taButtonLabel" for="taButton">📋</label> <input type="checkbox" id="lockButton" /><label id="lockButtonLabel" for="lockButton">&#128065</label></div>
-        <div class="ta"><textarea id="ta" class="mdnotes" spellcheck="false">{{md}}</textarea></body><div>
-        <div id="mdnotes" class="mdnotes" contenteditable="true" spellcheck="false"></div>
-        
+        <div id="buttons">
+            <button id="saveButton">💾</button>
+            <input type="checkbox" id="taButton" /><label id="taButtonLabel" for="taButton">📋</label>
+            <input type="checkbox" id="lockButton" /><label id="lockButtonLabel" for="lockButton" class="material-icons">visibility_off</label>
+            <button id="boldButton"><b>B</b></button>
+            <button id="italicButton"><i>I</i></button>
+            <button id="strikeButton"><s>S</s></button>
+        </div>
+        <div class="ta"><textarea id="ta" class="cheezenotes" spellcheck="false">{{md}}</textarea></body><div>
+        <div id="cheezenotes" class="cheezenotes" contenteditable="true" spellcheck="false"></div>
         <script type="module">
-            import { init } from '/static/modules/mdnotes.js';
+            import { init } from '{{ root|safe }}static/modules/cheezenotes.js';
             {{ init|safe }}
         </script>
     </body>