typo styles ok, text mode ok with close bouton, bugfixes
This commit is contained in:
@@ -41,12 +41,22 @@ var _Dot = {
|
||||
this.text = vn.attrs.text || '';
|
||||
this.rendered_text = markdown.render(this.text);
|
||||
|
||||
// construct summary
|
||||
// TODO: summary needs more work (strip tags, markdown render)
|
||||
this.summary = this.text.match('([^ ]*[ ]{0,1}){1,6}')[0];
|
||||
this.summary = this.summary.trim().replace(/_([^_]+)$/g, "_$1_");
|
||||
this.summary = this.summary.replace(/\[([^\]]+)$/g, "$1");
|
||||
this.summary = markdown.renderInline(this.summary) + " …";
|
||||
if(this.dottype == "preface"){
|
||||
this.summary = this.rendered_text;
|
||||
}else{
|
||||
// construct summary
|
||||
// TODO: summary needs more work (strip tags, markdown render)
|
||||
// remove img
|
||||
this.summary = this.text.replace(/!\[[^\]]+\]\([^\)]+\)/g, "");
|
||||
// get portion of text
|
||||
this.summary = this.summary.match('([^ ]*[ ]{0,1}){1,6}')[0];
|
||||
// end underscores (italic)
|
||||
this.summary = this.summary.trim().replace(/_([^_]+)$/g, "_$1_");
|
||||
// end brackets (links)
|
||||
this.summary = this.summary.replace(/\[([^\]]+)$/g, "$1");
|
||||
// render the marckdown
|
||||
this.summary = markdown.renderInline(this.summary) + " …";
|
||||
}
|
||||
|
||||
},
|
||||
oninit(vn){
|
||||
@@ -89,73 +99,15 @@ var _Dot = {
|
||||
this.setupTitle(vn);
|
||||
}
|
||||
},
|
||||
view(vn){
|
||||
if (this.active && this.opened) {
|
||||
// full view of dot with linked dots
|
||||
// console.log('_Dot view '+this.id+' parents :',this.parents);
|
||||
var dot_content = [
|
||||
// links to
|
||||
this.links.to.length
|
||||
? m('nav', {'class':'links to'}, this.links.to.map(id => {
|
||||
// console.log(id);
|
||||
if(typeof _dbs.data_byid[_dbs.lang][id] !== 'undefined'){
|
||||
var obj = _dbs.data_byid[_dbs.lang][id];
|
||||
// console.log('link to : obj', obj);
|
||||
return m(_Dot, {
|
||||
"id":id,
|
||||
'text':obj.text,
|
||||
'dottype':obj.dottype,
|
||||
'type':obj.type,
|
||||
// passe the memory of crossed dots plus the current one
|
||||
'parents':vn.state.parents.concat([vn.state.id]),
|
||||
// activate link only if not in parents (already went through it)
|
||||
'active':vn.state.parents.indexOf(id) == -1 ? true:false
|
||||
});
|
||||
}
|
||||
})
|
||||
)
|
||||
: null, // if no links to, add nothing
|
||||
// id
|
||||
// m('span', {'class':'id'}, this.id), // this.type+' '+
|
||||
// bullet
|
||||
// m('span', {'class':'bullet'}, m.trust('⚫')),
|
||||
// Title
|
||||
m('span', {'class':'title'}, m.trust(this.title)),
|
||||
// full text
|
||||
m('section', {
|
||||
'class':'text',
|
||||
onmouseover(e){
|
||||
e.preventDefault();
|
||||
if(e.target.nodeName == "A" ){
|
||||
// console.log("over e.target", e.target);
|
||||
// console.log('over vn', vn);
|
||||
var id = e.target.getAttribute("href");
|
||||
// add highlight class
|
||||
vn.dom.querySelector('nav.links>div[uid="'+id+'"]').classList.add('highlight');
|
||||
}else{
|
||||
// remove all hilight class
|
||||
for (link of vn.dom.querySelectorAll('nav.links>div.dot')) {
|
||||
link.classList.remove('highlight');
|
||||
}
|
||||
}
|
||||
},
|
||||
onclick(e){
|
||||
e.preventDefault();
|
||||
if(e.target.nodeName == "A" ){
|
||||
// console.log("over e.target", e.target);
|
||||
// console.log('over vn', vn);
|
||||
var id = e.target.getAttribute("href");
|
||||
// add highlight class
|
||||
vn.dom.querySelector('nav.links>div[uid="'+id+'"]>.summary').click();
|
||||
}
|
||||
}
|
||||
}, m.trust(this.rendered_text)),
|
||||
// links from
|
||||
this.links.from.length
|
||||
? m('nav', {'class':'links from'}, this.links.from.map(id => {
|
||||
setOpenedContent(vn){
|
||||
this.dot_content = [
|
||||
// links to
|
||||
this.links.to.length
|
||||
? m('nav', {'class':'links to'}, this.links.to.map(id => {
|
||||
// console.log(id);
|
||||
if(typeof _dbs.data_byid[_dbs.lang][id] !== 'undefined'){
|
||||
var obj = _dbs.data_byid[_dbs.lang][id];
|
||||
// console.log('link from : obj', obj);
|
||||
// return a dot
|
||||
// console.log('link to : obj', obj);
|
||||
return m(_Dot, {
|
||||
"id":id,
|
||||
'text':obj.text,
|
||||
@@ -166,41 +118,100 @@ var _Dot = {
|
||||
// activate link only if not in parents (already went through it)
|
||||
'active':vn.state.parents.indexOf(id) == -1 ? true:false
|
||||
});
|
||||
})
|
||||
)
|
||||
: null, // if no links from, add nothing
|
||||
];
|
||||
}
|
||||
})
|
||||
)
|
||||
: null, // if no links to, add nothing
|
||||
// id
|
||||
// m('span', {'class':'id'}, this.id), // this.type+' '+
|
||||
// bullet
|
||||
// m('span', {'class':'bullet'}, m.trust('⚫')),
|
||||
// Title
|
||||
m('span', {'class':'title'}, m.trust(this.title)),
|
||||
// full text
|
||||
m('section', {
|
||||
'class':'text',
|
||||
onmouseover(e){
|
||||
e.preventDefault();
|
||||
if(e.target.nodeName == "A" ){
|
||||
// console.log("over e.target", e.target);
|
||||
// console.log('over vn', vn);
|
||||
var id = e.target.getAttribute("href");
|
||||
// add highlight class
|
||||
vn.dom.querySelector('nav.links>div[uid="'+id+'"]').classList.add('highlight');
|
||||
}else{
|
||||
// remove all hilight class
|
||||
for (link of vn.dom.querySelectorAll('nav.links>div.dot')) {
|
||||
link.classList.remove('highlight');
|
||||
}
|
||||
}
|
||||
},
|
||||
onclick(e){
|
||||
e.preventDefault();
|
||||
if(e.target.nodeName == "A" ){
|
||||
// console.log("over e.target", e.target);
|
||||
// console.log('over vn', vn);
|
||||
var id = e.target.getAttribute("href");
|
||||
// add highlight class
|
||||
vn.dom.querySelector('nav.links>div[uid="'+id+'"]>.summary').click();
|
||||
}
|
||||
}
|
||||
}, m.trust(this.rendered_text)),
|
||||
// links from
|
||||
this.links.from.length
|
||||
? m('nav', {'class':'links from'}, this.links.from.map(id => {
|
||||
var obj = _dbs.data_byid[_dbs.lang][id];
|
||||
// console.log('link from : obj', obj);
|
||||
// return a dot
|
||||
return m(_Dot, {
|
||||
"id":id,
|
||||
'text':obj.text,
|
||||
'dottype':obj.dottype,
|
||||
'type':obj.type,
|
||||
// passe the memory of crossed dots plus the current one
|
||||
'parents':vn.state.parents.concat([vn.state.id]),
|
||||
// activate link only if not in parents (already went through it)
|
||||
'active':vn.state.parents.indexOf(id) == -1 ? true:false
|
||||
});
|
||||
})
|
||||
)
|
||||
: null, // if no links from, add nothing
|
||||
];
|
||||
},
|
||||
setPreviewContent(vn){
|
||||
this.dot_content = [
|
||||
// m('span', {'class':'id'}, this.id), // this.type+' '+
|
||||
// m('span', {'class':'bullet'}, m.trust('•')),
|
||||
m('span', {
|
||||
'class':'title',
|
||||
onclick(e){
|
||||
// TODO: animate openening (text and links separatly)
|
||||
vn.state.opened = true;
|
||||
}
|
||||
}, m.trust(this.title)), // TODO: on nested dot add full description : Part 1, Prop 8, scolie
|
||||
m('p', {
|
||||
'class':'summary',
|
||||
onclick(e){
|
||||
// TODO: animate openening (text and links separatly)
|
||||
vn.state.opened = true;
|
||||
}
|
||||
}, m.trust(this.summary))
|
||||
];
|
||||
},
|
||||
view(vn){
|
||||
if (this.active && this.opened) {
|
||||
// full view of dot with linked dots
|
||||
this.setOpenedContent(vn);
|
||||
}else{
|
||||
// preview dot
|
||||
var dot_content = [
|
||||
// m('span', {'class':'id'}, this.id), // this.type+' '+
|
||||
// m('span', {'class':'bullet'}, m.trust('•')),
|
||||
m('span', {
|
||||
'class':'title',
|
||||
onclick(e){
|
||||
// TODO: animate openening (text and links separatly)
|
||||
vn.state.opened = true;
|
||||
}
|
||||
}, m.trust(this.title)), // TODO: on nested dot add full description : Part 1, Prop 8, scolie
|
||||
m('p', {
|
||||
'class':'summary',
|
||||
onclick(e){
|
||||
// TODO: animate openening (text and links separatly)
|
||||
vn.state.opened = true;
|
||||
}
|
||||
}, m.trust(this.summary))
|
||||
];
|
||||
this.setPreviewContent(vn);
|
||||
}
|
||||
|
||||
return m('div',{
|
||||
'uid':this.id,
|
||||
'class':`dot ${this.dottype}`,
|
||||
// onclick(e){
|
||||
// // TODO: animate openening (text and links separatly)
|
||||
// vn.state.opened = true;
|
||||
// }
|
||||
},
|
||||
dot_content
|
||||
this.dot_content
|
||||
);
|
||||
},
|
||||
onupdate(vn){
|
||||
|
||||
+38
-24
@@ -16,6 +16,7 @@ var _Ui = require('./ui.js');
|
||||
// / /___/ / / / / ,<
|
||||
// /_____/_/_/ /_/_/|_|
|
||||
var _Link = {
|
||||
parent_id:null,
|
||||
tid:"",
|
||||
opened:false,
|
||||
oninit(vn){
|
||||
@@ -29,16 +30,28 @@ var _Link = {
|
||||
view(vn){
|
||||
this.tid_known = typeof _dbs.data_byid[_dbs.lang][this.tid] === 'undefined' ? false : true;
|
||||
if (!this.tid_known) {
|
||||
// console.log('!! target id '+this.tid+' unkonwn !!');
|
||||
// console.log(`!! in ${this.id}, target id ${this.tid} is unkonwn !!`);
|
||||
}
|
||||
if(this.opened && this.tid_known){
|
||||
// console.log('this.tid', vn.state);
|
||||
// traget object
|
||||
this.tob = Object.assign({"nested":true},_dbs.data_byid[_dbs.lang][this.tid]);
|
||||
|
||||
return m('div', {'class':'opened-link'},
|
||||
[
|
||||
m('span', {'class':"link text"}, vn.children),
|
||||
m('div', {
|
||||
'class':'close-link-btn',
|
||||
onclick(e){
|
||||
// e.preventDefault();
|
||||
console.log('click close btn', this);
|
||||
vn.state.opened = false;
|
||||
// return false;
|
||||
}
|
||||
}, m('span', m.trust("🗙"))),
|
||||
typeof _dbs.data_byid[_dbs.lang][this.tid].childs != "undefined"
|
||||
? m(_Enonce, _dbs.data_byid[_dbs.lang][this.tid])
|
||||
: m(_Item, _dbs.data_byid[_dbs.lang][this.tid])
|
||||
? m(_Enonce, this.tob)
|
||||
: m(_Item, this.tob)
|
||||
]
|
||||
);
|
||||
}else{
|
||||
@@ -93,7 +106,7 @@ function parseTextDom(nodes){
|
||||
// again parse node's childs
|
||||
n.childs = parseTextDom(nodes[i].childNodes);
|
||||
}
|
||||
}else if (nodes[i].textContent.length > 1){
|
||||
}else if (nodes[i].textContent.length > 0){
|
||||
// if node has no localName it is probably a #text node
|
||||
// we record it if it's not empty
|
||||
n.tag='#text';
|
||||
@@ -133,15 +146,10 @@ var _Text = {
|
||||
// !! we need to convert markdown to html here because parseTextDom() is recursive through nodes tree
|
||||
// convert markdown to html
|
||||
this.texthtml = markdown.render(this.text)
|
||||
// TODO: fixe number link text disapear [3](1d3) ( in 104d )
|
||||
// TODO: fixe parenthèse disparait _(par les Défin. [test 3](1d3) et [test 5](1d5))_ ( in 104d )
|
||||
// parse html string to virtual dom
|
||||
// convert html string to virtual dom
|
||||
this.textdom = new DOMParser().parseFromString(this.texthtml, "text/html");
|
||||
// get the text nodes (avoid html document extra)
|
||||
// get the text nodes (avoid html document extra) and apply some transformations
|
||||
this.textchilds = parseTextDom(this.textdom.getElementsByTagName('body')[0].childNodes);
|
||||
if(this.id == "115sc"){
|
||||
// console.log(this.textchilds);
|
||||
}
|
||||
},
|
||||
oninit(vn){
|
||||
this.id = vn.attrs.id;
|
||||
@@ -179,6 +187,7 @@ var _Item = {
|
||||
// vn.state.part = vn.state.slug.match(/^(\d)(.+)/)[1];
|
||||
this.text = vn.attrs.text;
|
||||
this.nested = vn.attrs.nested || false;
|
||||
this.dottype = vn.attrs.dottype || null;
|
||||
},
|
||||
onbeforeupdate(vn, old){
|
||||
this.nested = vn.attrs.nested || false;
|
||||
@@ -186,18 +195,22 @@ var _Item = {
|
||||
this.text = vn.attrs.text;
|
||||
},
|
||||
view(vn){
|
||||
// if(this.id == "340c2"){
|
||||
// console.log(`${this.id} vn.attrs `,vn.attrs);
|
||||
// }
|
||||
return m("section", {
|
||||
'id':this.id,
|
||||
'class':'item'+(this.nested ? ' nested':'')
|
||||
// 'class':'item'+(this.nested ? ' nested':'')
|
||||
'class' :`item${this.nested ? ' nested':''} ${this.dottype}`
|
||||
},
|
||||
[
|
||||
// create title node
|
||||
m("h3", {
|
||||
// create title node (only if not nested)
|
||||
!this.nested ? m("h3", {
|
||||
// 'ref':vn.attrs.href,
|
||||
onclick(e){
|
||||
vn.state.active = vn.state.active ? 0 : 1;
|
||||
}
|
||||
}, m.trust(markdown.renderInline(this.type))),
|
||||
// onclick(e){ WHAT IS THIS STATE ACTIVE ???
|
||||
// vn.state.active = vn.state.active ? 0 : 1;
|
||||
// }
|
||||
}, m.trust(markdown.renderInline(this.type))) : null,
|
||||
// create text node
|
||||
m(_Text, {'text':this.text, 'id':this.id})
|
||||
]
|
||||
@@ -225,6 +238,7 @@ var _Enonce = {
|
||||
this.text = vn.attrs.text;
|
||||
this.childs = vn.attrs.childs || [];
|
||||
this.nested = vn.attrs.nested || false;
|
||||
this.dottype = vn.attrs.dottype || "no-dottype";
|
||||
},
|
||||
onbeforeupdate(vn, old) {
|
||||
// console.log(vn.attrs.childs);
|
||||
@@ -238,15 +252,15 @@ var _Enonce = {
|
||||
// if(vn.attrs.id == '1d1') console.log('_Enonce VIEW, text :', vn.attrs.text);
|
||||
return m("section", {
|
||||
'id' :this.id,
|
||||
'class' :'enonce'+(this.nested ? ' nested':'')
|
||||
'class' :`enonce${this.nested ? ' nested':''} ${this.dottype}`
|
||||
},
|
||||
[
|
||||
// create title node
|
||||
m("h2", {}, m.trust(markdown.renderInline(this.title))),
|
||||
// create title node (only if not nested)
|
||||
!this.nested ? m("h2", {}, m.trust(markdown.renderInline(this.title))) : null,
|
||||
// create text node
|
||||
m(_Text, {'text':this.text, 'id':this.id}),
|
||||
// addd children
|
||||
this.childs.map(c => { return m(_Item, c); })
|
||||
// add children (only if not nested)
|
||||
!this.nested ? this.childs.map(c => { return m(_Item, c); }) : null
|
||||
])
|
||||
}
|
||||
}
|
||||
@@ -268,7 +282,7 @@ var _Part = {
|
||||
this.enonces = vn.attrs.enonces;
|
||||
},
|
||||
view(vn){
|
||||
console.log("part enonces", vn.attrs.enonces);
|
||||
// console.log("part enonces", vn.attrs.enonces);
|
||||
return m("section", {
|
||||
'id' :this.id,
|
||||
'class' :'part'
|
||||
|
||||
+5
-32
@@ -120,75 +120,48 @@ module.exports = {
|
||||
var m = id.match(rx_id);
|
||||
if(m){
|
||||
switch(true){
|
||||
case /^\d{2}$/.test(m[2]):
|
||||
case /^\d{2}$/.test(m[2]): // proposition
|
||||
switch(true){
|
||||
case /^cd$/.test(m[3]) : return 'corollaire-demo';
|
||||
case /^cd$/.test(m[3]) : return 'corollaire-demo';
|
||||
case /^sc$/.test(m[3]) : return 'scolie';
|
||||
case /^sc$/.test(m[3]) : return 'scolie';
|
||||
case /^d$/.test(m[3]) : return 'demonstration';
|
||||
case /^d$/.test(m[3]) : return 'demonstration';
|
||||
case /^c$/.test(m[3]) :
|
||||
switch(true){
|
||||
case /^sc$/.test(m[4]): return 'scolie';
|
||||
case /^sc$/.test(m[4]): return 'scolie';
|
||||
case /^d$/.test(m[4]) : return 'demonstration';
|
||||
case /^d$/.test(m[4]) : return 'demonstration';
|
||||
case /^d$/.test(m[5]) : return 'demonstration';
|
||||
case /^d$/.test(m[5]) : return 'demonstration';
|
||||
case /^sc$/.test(m[5]): return 'scolie';
|
||||
case /^sc$/.test(m[5]): return 'scolie';
|
||||
case /^\d$/.test(m[4]): return 'corollaire';
|
||||
case /^\d$/.test(m[4]): return 'corollaire';
|
||||
case !m[4] : return 'corollaire';
|
||||
case !m[4] : return 'corollaire';
|
||||
}
|
||||
case /^a$/.test(m[3]) : return 'axiom';
|
||||
case /^a$/.test(m[3]) : return 'axiom';
|
||||
case /^a$/.test(m[3]) : return 'prop-axiom';
|
||||
case /^l$/.test(m[3]) :
|
||||
switch(true){
|
||||
case /^d$/.test(m[5]) : return 'demonstration';
|
||||
case /^d$/.test(m[5]) : return 'demonstration';
|
||||
case /^sc$/.test(m[5]): return 'scolie';
|
||||
case /^sc$/.test(m[5]): return 'scolie';
|
||||
case !m[5] : return 'lemme';
|
||||
case /^d$/.test(m[5]) : return 'lemme-demonstration';
|
||||
case /^sc$/.test(m[5]): return 'lemme-scolie';
|
||||
case /^c$/.test(m[5]) : return 'lemme-corrollaire';
|
||||
case !m[5] : return 'lemme';
|
||||
}
|
||||
case /^p$/.test(m[3]) : return 'postulat';
|
||||
case /^p$/.test(m[3]) : return 'postulat';
|
||||
case /^\d$/.test(m[3]) : return '??';
|
||||
case /^\d$/.test(m[3]) : return '??';
|
||||
case /^\d{2}$/.test(m[3]) : return '??';
|
||||
case /^\d{2}$/.test(m[3]) : return '??';
|
||||
case !m[3] : return 'proposition';
|
||||
case !m[3] : return 'proposition';
|
||||
}
|
||||
case /^app|ap$/.test(m[2]) : return 'appendice';
|
||||
case /^app|ap$/.test(m[2]) : return 'appendice';
|
||||
case /^agd$/.test(m[2]) : return 'def-gen-affect';
|
||||
case /^agd$/.test(m[2]) : return 'def-gen-affect';
|
||||
case /^pr$/.test(m[2]) : return 'preface';
|
||||
case /^pr$/.test(m[2]) : return 'preface';
|
||||
case /^ad$/.test(m[2]) :
|
||||
switch(true){
|
||||
case /^e$/.test(m[4]) :return 'explication';
|
||||
case /^e$/.test(m[4]) :return 'explication';
|
||||
case !m[4] :return 'def-affect';
|
||||
case !m[4] :return 'def-affect';
|
||||
}
|
||||
case /^c$/.test(m[2]) : return 'chapitre';
|
||||
case /^c$/.test(m[2]) : return 'chapitre';
|
||||
case /^p$/.test(m[2]) : return 'postulat';
|
||||
case /^p$/.test(m[2]) : return 'postulat';
|
||||
case /^d$/.test(m[2]) :
|
||||
switch(true){
|
||||
case /^e$/.test(m[4]) : return 'explication';
|
||||
case /^e$/.test(m[4]) : return 'explication';
|
||||
case !m[4] : return 'definition';
|
||||
case !m[4] : return 'definition';
|
||||
}
|
||||
case /^a$/.test(m[2]) : return 'axiom';
|
||||
case /^a$/.test(m[2]) : return 'axiom';
|
||||
}
|
||||
// }
|
||||
}
|
||||
|
||||
@@ -28,12 +28,15 @@ module.exports = {
|
||||
// console.log(header_height);
|
||||
|
||||
// create the stkd titles wrapper block
|
||||
let stkd_wrapper = document.createElement('div');
|
||||
stkd_wrapper.classList.add('sticky-clone-wrapper');
|
||||
document.body.append(stkd_wrapper);
|
||||
var stkd_wrapper = document.querySelector('.sticky-clone-wrapper');
|
||||
if(!stkd_wrapper){
|
||||
var stkd_wrapper = document.createElement('div');
|
||||
stkd_wrapper.classList.add('sticky-clone-wrapper');
|
||||
document.body.append(stkd_wrapper);
|
||||
}
|
||||
|
||||
// get all part title
|
||||
let part_titles = new Array();
|
||||
var part_titles = new Array();
|
||||
Array.from(document.querySelectorAll('h1.part-title')).forEach(function(e){
|
||||
e._part = e.getAttribute('part');
|
||||
part_titles.push(e)
|
||||
|
||||
Reference in New Issue
Block a user