added intro

assets/dist/main.css

@@ -753,7 +753,7 @@ html, body {
 header {
   position: fixed;
   width: 100%;
-  height: 4em;
+  height: 5em;
   top: 0;
   z-index: 5;
   background-color: white; }
@@ -762,14 +762,21 @@ header {
     vertical-align: text-bottom; }
     header > *:last-child {
       margin-right: 1em; }
-  header > h1 {
-    font-size: 3em;
-    margin: 0 0 0 70px; }
+  header hgroup {
+    margin: 0 4em 0 70px; }
+    header hgroup h1, header hgroup h2 {
+      margin: 0;
+      padding: 0;
+      line-height: 1; }
+    header hgroup h1 {
+      font-size: 3em; }
+    header hgroup h2 {
+      line-height: 1; }
   header #menus > * {
     display: inline-block;
     vertical-align: top; }
   header #menus nav {
-    padding: 1em 1em;
+    padding: 0 1em;
     position: relative; }
     header #menus nav h3 {
       margin: 0;
@@ -815,7 +822,7 @@ header {
         color: #000; }
 
 .sticky-clone-wrapper {
-  padding-top: 4em;
+  padding-top: 5em;
   position: fixed;
   top: 0;
   left: 0;
@@ -829,7 +836,7 @@ header {
       margin: 0 0 0 70px; }
 
 main#content {
-  margin-top: 4em; }
+  margin-top: 5em; }
   main#content h1.part-title {
     font-size: 1.6em;
     width: 450px; }
@@ -839,6 +846,9 @@ main#content {
     font-size: 1em;
     width: 450px; }
 
+section.intro {
+  margin-left: 70px; }
+
 main#content.inline h1.part-title {
   margin: 1em 0 0 70px; }
 

assets/jsondb/0-LAT-ethicadb.json

@@ -1,9 +1,18 @@
 [
+	{
+		"index":0,
+		"id":"intro",
+		"text": "Ethica  \nordine geometrico demonstrata  \net  \nin quinque Partes distincta  \nin quibus agitur"
+	},
 	{
 		"index": 1,
 		"id": "p1",
-		"title": "_Pars Prima,_\n\n DE DEO.\n\n\n\n DEFINITIONES ",
+		"title": "_Pars Prima,_\n\n DE DEO.",
 		"enonces": [
+			{
+				"title":"DEFINITIONES",
+				"type":"title"
+			},
 			{
 				"id": "1d1",
 				"title": "",
@@ -5371,4 +5380,4 @@
 			}
 		]
 	}
-]
+]

assets/jsondb/2-Appuhn-FR-ethicadb.json

@@ -1,9 +1,18 @@
 [
+	{
+		"index":0,
+		"id":"intro",
+		"text": "Éthique  \ndémontrée suivant l'ordre géométrique  \net  \ndivisée en cinq Parties"
+	},
 	{
 		"index": 1,
 		"id": "p1",
 		"title": "_Première Partie,_\n\n DE DIEU.",
 		"enonces": [
+			{
+				"title":"DEFINITIONS",
+				"type":"title"
+			},
 			{
 				"id":"1d1",
 				"title":"",
@@ -717,7 +726,7 @@
 	{
 		"index": 2,
 		"id": "p2",
-		"title": "Deuxième Partie, \n\n\n\n DE _la Nature et de l'Origine de_ L'ÂME.",
+		"title": "_Deuxième Partie_, \n\n\n\n DE _la Nature et de l'Origine de_ L'ÂME.",
 		"enonces": [
 			{
 				"id": "2pr",

assets/jsondb/3-Elwes-EN-ethicadb.json

@@ -1,4 +1,9 @@
 [
+	{
+		"index":0,
+		"id":"intro",
+		"text": "Ethics  \nDemonstrated in Geometrical Order  \nand  \ndivided into five Parts"
+	},
 	{
 		"index": 1,
 		"id": "p1",
@@ -11,7 +16,7 @@
 			{
 				"id": "1d1",
 				"title": "",
-				"text": "i ; By that which is self-caused, I mean that of which the essence involves existence, or that of which the nature is only conceivable as existent.",
+				"text": "I. By that which is self-caused, I mean that of which the essence involves existence, or that of which the nature is only conceivable as existent.",
 				"childs": []
 			},
 			{
@@ -35,7 +40,7 @@
 			{
 				"id": "1d5",
 				"title": "",
-				"text": "By mode, I mean the modifications ^[\"Affectiones\"] of substance, or that which exists in, and is conceived through, something other than itself.",
+				"text": "By mode, I mean the modifications (_Affectiones_) of substance, or that which exists in, and is conceived through, something other than itself.",
 				"childs": []
 			},
 			{
@@ -5383,4 +5388,4 @@
 			}
 		]
 	}
-]
+]

assets/jsondb/ethica-bresilen.json

@@ -1,4 +1,9 @@
 [
+	{
+		"index":0,
+		"id":"intro",
+		"text": "Ética  \ndemonstrada em ordem geométrica  \ne  \ndividida em cinco Partes que tratam"
+	},
 	{
 		"index": 1,
 		"id": "P1",

assets/main.scss

@@ -21,7 +21,7 @@ html, body{
   padding:0;
 }
 
-$header_height:4em;
+$header_height:5em;
 $dot_w:500px;
 $bullet_w:40px;
 $margin_left:50px + ($bullet_w/2);
@@ -39,9 +39,14 @@ header{
     // &:first-child{ margin-left: 1em;}
     &:last-child{ margin-right: 1em;}
   }
-  >h1{
-    font-size: 3em;
-    margin: 0 0 0 $margin_left;
+  hgroup{
+    margin: 0 4em 0 $margin_left;
+    h1,h2{
+      margin:0; padding:0;
+      line-height: 1;
+    }
+    h1{font-size: 3em;}
+    h2{line-height: 1;}
   }
 
 
@@ -52,7 +57,7 @@ header{
       vertical-align: top;
     }
     nav {
-      padding:1em 1em;
+      padding:0 1em;
       position: relative;
       h3{
         margin:0; padding:0;
@@ -167,6 +172,10 @@ main#content{
 
 }
 
+section.intro{
+  margin-left: $margin_left;
+}
+
 //     ____      __    _
 //    /  _/___  / /   (_)___  ___
 //    / // __ \/ /   / / __ \/ _ \

assets/modules/dbs.js

@@ -12,7 +12,8 @@ module.exports = {
     {
       'lc':'lat',
       'label':'Latin (Carl Gebhardt)',
-      'db':'0-LAT-ethicadb.json'},
+      'db':'0-LAT-ethicadb.json'
+    },
     {
       'lc':'fr',
       'label':'Français (Traduction par Charles Appuhn)',
@@ -70,6 +71,7 @@ module.exports = {
     this.loaded_dbs ++;
     //
     if (this.loaded_dbs == this.langs.length) {
+      console.log('All db loaded : data', this.data);
       this.parseByID(callback);
     }
 
@@ -79,13 +81,15 @@ module.exports = {
       // console.log('l', l);
       this.data_byid[l] = {};
       for (p in this.data[l]) {
-        // console.log(this.data[l][p]);
-        for (e in this.data[l][p].enonces) {
-          // console.log('e',e);
-          this.data_byid[l][this.data[l][p].enonces[e].id] = this.data[l][p].enonces[e];
-          for (c in this.data[l][p].enonces[e].childs){
-            // console.log(_db[p][e][c]);
-            this.data_byid[l][this.data[l][p].enonces[e].childs[c].id] = this.data[l][p].enonces[e].childs[c];
+        if(this.data[l][p].type !== "intro"){
+          // console.log(this.data[l][p]);
+          for (e in this.data[l][p].enonces) {
+            // console.log('e',e);
+            this.data_byid[l][this.data[l][p].enonces[e].id] = this.data[l][p].enonces[e];
+            for (c in this.data[l][p].enonces[e].childs){
+              // console.log(_db[p][e][c]);
+              this.data_byid[l][this.data[l][p].enonces[e].childs[c].id] = this.data[l][p].enonces[e].childs[c];
+            }
           }
         }
       }

assets/modules/header.js

@@ -13,7 +13,10 @@ var markdown =  require('markdown-it')()
 module.exports = {
   view: function(vn){
     return m('header', [
-      m('h1', 'Ethica'),
+      m('hgroup', [
+        m('h1', 'Ethica'),
+        m('h2', 'Benedictus Spinoza')
+      ]),
       // m('nav', {'id':'parts-nav'}, [
       //
       // ]),
@@ -40,9 +43,11 @@ var _PartsNav = {
       m('h3', 'Parts'),
       m('ul', _dbs.data[lang].map(function(p){
         // console.log("anchors, part", p);
-        return m('li', [
-          m('a', {'href':'#'+p.id}, m.trust(markdown.renderInline(p.title)))
-        ]);
+        if(p.id !== "intro"){
+          return m('li', [
+            m('a', {'href':'#'+p.id}, m.trust(markdown.renderInline(p.title)))
+          ]);
+        }
       })
       )
     ]);

assets/modules/inline.js

@@ -303,6 +303,26 @@ var _Part = {
   }
 }
 
+//     ____      __
+//    /  _/___  / /__________
+//    / // __ \/ __/ ___/ __ \
+//  _/ // / / / /_/ /  / /_/ /
+// /___/_/ /_/\__/_/   \____/
+var _Intro = {
+  oninit : function(vn){
+    console.log('_Intro : oninit : vn', vn);
+    this.id = vn.attrs.id;
+    this.text = vn.attrs.text || '';
+  },
+  onbeforeupdate : function(vn, old){
+    this.id = vn.attrs.id;
+    this.text = vn.attrs.text || '';
+  },
+  view : function(vn){
+    return m("section", {'class':'intro'}, m("p",m.trust(markdown.renderInline(this.text))));
+  }
+}
+
 //     ____      __    _
 //    /  _/___  / /   (_)___  ___
 //    / // __ \/ /   / / __ \/ _ \
@@ -321,8 +341,12 @@ module.exports = {
     return [
       m(_Header),
       m('main', {id:"content", 'class':'inline'}, _dbs.data[vn.attrs.lang].map(function(p){
-          // console.log("MAP _dbs", p);
-          return m(_Part,p);
+          console.log("MAP _dbs", p);
+          if(p.id == 'intro'){
+            return m(_Intro,p);
+          }else{
+            return m(_Part,p);
+          }
         })
       ),
       m(_Footer)

assets/modules/tree.js

@@ -322,6 +322,26 @@ var _Part = {
   }
 }
 
+//     ____      __
+//    /  _/___  / /__________
+//    / // __ \/ __/ ___/ __ \
+//  _/ // / / / /_/ /  / /_/ /
+// /___/_/ /_/\__/_/   \____/
+var _Intro = {
+  oninit : function(vn){
+    console.log('_Intro : oninit : vn', vn);
+    this.id = vn.attrs.id;
+    this.text = vn.attrs.text || '';
+  },
+  onbeforeupdate : function(vn, old){
+    this.id = vn.attrs.id;
+    this.text = vn.attrs.text || '';
+  },
+  view : function(vn){
+    return m("section", {'class':'intro'}, m("p",m.trust(markdown.renderInline(this.text))));
+  }
+}
+
 
 //   ______
 //  /_  __/_______  ___
@@ -341,7 +361,11 @@ module.exports = {
     return [
       m(_Header),
       m('main', {id:"content", 'class':'tree'}, _dbs.data[vn.attrs.lang].map(function(p){
-          return m(_Part,p);
+          if(p.id == 'intro'){
+            return m(_Intro,p);
+          }else{
+            return m(_Part,p);
+          }
         })
       ),
       m(_Footer)