|
@@ -14,13 +14,14 @@ require('./fonts/opensans/opensans.css');
|
|
|
|
|
|
var m = require('mithril');
|
|
|
|
|
|
-console.log("DataItems", DataItems);
|
|
|
+// console.log("DataItems", DataItems);
|
|
|
|
|
|
var DataItemsBySlug = {};
|
|
|
-for (item of DataItems) {
|
|
|
- DataItemsBySlug[item.slug] = item;
|
|
|
+for (item in DataItems) {
|
|
|
+ // console.log(item);
|
|
|
+ DataItemsBySlug[DataItems[item].slug] = DataItems[item];
|
|
|
}
|
|
|
-console.log("DataItemsBySlug", DataItemsBySlug);
|
|
|
+// console.log("DataItemsBySlug", DataItemsBySlug);
|
|
|
|
|
|
// __ _ __
|
|
|
// / / (_)___ / /__
|
|
@@ -31,12 +32,21 @@ var _Link = {
|
|
|
targetslug:"",
|
|
|
opened:false,
|
|
|
oninit: function(vn){
|
|
|
+ // console.log("vn.attrs", vn.attrs);
|
|
|
vn.state.targetslug = vn.attrs.href.replace(/^.*\/(.+)$/, "$1").replace(/^(.+)\/$/, "$1");
|
|
|
},
|
|
|
view: function(vn){
|
|
|
if(vn.state.opened){
|
|
|
// return m('div', "Hello "+vn.state.targetslug);
|
|
|
- return m(_Item, DataItemsBySlug[vn.state.targetslug]);
|
|
|
+ // console.log('vn.state.targetslug', vn.state);
|
|
|
+ return m('div', {'class':'opened-link'},
|
|
|
+ [
|
|
|
+ m('span', {'class':"link text"}, vn.children),
|
|
|
+ m(_Item, DataItemsBySlug[vn.state.targetslug])
|
|
|
+ ]
|
|
|
+ );
|
|
|
+
|
|
|
+
|
|
|
}else{
|
|
|
return m('a', {
|
|
|
'class':'link',
|
|
@@ -64,6 +74,7 @@ var _Text = {
|
|
|
// initiaize text childNodes array
|
|
|
vn.state.textchilds = [];
|
|
|
// parse html string to virtual dom
|
|
|
+ // console.log('vn.attrs.text',vn.attrs.text);
|
|
|
var textdom = new DOMParser().parseFromString(vn.attrs.text, "text/html");
|
|
|
// get the text nodes (avoid html document extra)
|
|
|
var childs = textdom.getElementsByTagName('body')[0].childNodes;
|
|
@@ -81,18 +92,21 @@ var _Text = {
|
|
|
if(typeof childs[i].childNodes[j].localName != "undefined"){
|
|
|
switch (childs[i].childNodes[j].localName) {
|
|
|
case 'a':
|
|
|
+ // console.log('childs[i].childNodes[j]', childs[i].childNodes[j]);
|
|
|
p.childs.push({
|
|
|
tag:'a',
|
|
|
- href:childs[i].childNodes[j].href,
|
|
|
+ href:childs[i].childNodes[j].attributes.href.value,
|
|
|
text:childs[i].childNodes[j].innerHTML
|
|
|
});
|
|
|
break;
|
|
|
}
|
|
|
}else{
|
|
|
// if textnode
|
|
|
+ // console.log(childs[i].childNodes[j]);
|
|
|
+ // console.log("["+childs[i].childNodes[j].textContent+"]");
|
|
|
p.childs.push({
|
|
|
tag:'#text',
|
|
|
- text:childs[i].childNodes[j].data
|
|
|
+ text:childs[i].childNodes[j].textContent //+ (childs[i].childNodes[j].nextSibling ? " " : "")
|
|
|
});
|
|
|
}
|
|
|
}
|
|
@@ -108,6 +122,7 @@ var _Text = {
|
|
|
vn.state.textchilds.map(function(p,i){
|
|
|
// create paragraph and loop through text and link nodes
|
|
|
return m('div', {'class':'paragraph'}, p.childs.map(function(c,j) {
|
|
|
+ console.log('c',c);
|
|
|
// return p.childs.map(function(c,j) {
|
|
|
// create text and link node
|
|
|
switch (c.tag) {
|
|
@@ -118,13 +133,14 @@ var _Text = {
|
|
|
}, c.text);
|
|
|
break;
|
|
|
case '#text':
|
|
|
+ // console.log("["+c.text+"]");
|
|
|
return m.trust(c.text);
|
|
|
break;
|
|
|
}
|
|
|
}) // /map
|
|
|
- ) // /m.div.paragraph
|
|
|
+ ); // /m.div.paragraph
|
|
|
}) // /map
|
|
|
- ) // /m.div.text
|
|
|
+ ); // /m.div.text
|
|
|
} // view:
|
|
|
}
|
|
|
|
|
@@ -134,7 +150,15 @@ var _Text = {
|
|
|
// _/ // /_/ __/ / / / / /
|
|
|
// /___/\__/\___/_/ /_/ /_/
|
|
|
var _Item = {
|
|
|
+ slug:null,
|
|
|
+ part:null,
|
|
|
+ type:null,
|
|
|
active:0,
|
|
|
+ oninit: function(vn){
|
|
|
+ // console.log('vn.attrs', vn.attrs);
|
|
|
+ vn.state.slug = vn.attrs.slug;
|
|
|
+ vn.state.part = vn.state.slug.match(/^(\d)(.+)/)[1];
|
|
|
+ },
|
|
|
view: function(vn){
|
|
|
return m("section", {
|
|
|
'id':vn.attrs.slug,
|
|
@@ -147,7 +171,7 @@ var _Item = {
|
|
|
onclick: function(e){
|
|
|
vn.state.active = vn.state.active ? 0 : 1;
|
|
|
}
|
|
|
- }, vn.attrs.title),
|
|
|
+ }, "Part "+vn.state.part+" : "+vn.attrs.title),
|
|
|
// create text node
|
|
|
m(_Text, {'text':vn.attrs.text, 'slug':vn.attrs.slug})
|
|
|
]
|