improved route strategy (url path), headers menu are working

This commit is contained in:
Bachir Soussi Chiadmi
2017-10-15 17:30:42 +02:00
parent 72602b3e12
commit e77ed37c76
15 changed files with 1196 additions and 696 deletions
+76 -25
View File
@@ -1,6 +1,8 @@
var m = require('mithril');
var _dbs = require('./dbs');
var markdown = require('markdown-it')()
.use(require('markdown-it-footnote'));
// __ __ __
@@ -12,7 +14,11 @@ module.exports = {
view: function(vn){
return m('header', [
m('h1', 'Ethica'),
m('nav', {'id':"menus"}, [
// m('nav', {'id':'parts-nav'}, [
//
// ]),
m('div', {'id':"menus"}, [
m(_PartsNav),
m(_RouteMenu),
m(_LangMenu)
])
@@ -20,15 +26,55 @@ module.exports = {
}
}
// ____ __
// / __ \____ ______/ /______ ____ ___ ___ ____ __ __
// / /_/ / __ `/ ___/ __/ ___/ / __ `__ \/ _ \/ __ \/ / / /
// / ____/ /_/ / / / /_(__ ) / / / / / / __/ / / / /_/ /
// /_/ \__,_/_/ \__/____/ /_/ /_/ /_/\___/_/ /_/\__,_/
var _PartsNav = {
view: function(vn){
var lang = m.route.param('lang');
console.log('partsmenu', lang);
return m('nav', {id:'parts-nav'}, [
// TODO: replaced labels with localized content
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)))
]);
})
)
]);
}
};
// ____ __
// / __ \____ __ __/ /____ ____ ___ ___ ____ __ __
// / /_/ / __ \/ / / / __/ _ \ / __ `__ \/ _ \/ __ \/ / / /
// / _, _/ /_/ / /_/ / /_/ __/ / / / / / / __/ / / / /_/ /
// /_/ |_|\____/\__,_/\__/\___/ /_/ /_/ /_/\___/_/ /_/\__,_/
var _RouteMenu = {
view: function(){
// create ul dom
return m('ul', {id:"routes"}, [
m('li', m('a', {'href':'#!/inline'}, "inline")),
m('li', m('a', {'href':'#!/tree'}, "tree")),
]
);
var lang = m.route.param('lang');
var path = m.route.get().match(/^(\/[^\/]+)(\/[^\/|#]+)(.*)$/);
console.log('Route menu Path', path);
return m('nav', {id:'routes'}, [
// TODO: replaced labels with localized content
m('h3', 'Routes'),
m('ul', [
m('li', m('a', {
'href':'/'+lang+'/inline'+path[3],
oncreate : m.route.link,
onupdate : m.route.link
}, "inline")),
m('li', m('a', {
'href':'/'+lang+'/tree'+path[3],
oncreate : m.route.link,
onupdate : m.route.link
}, "tree")),
])
]);
}
}
@@ -40,31 +86,36 @@ var _RouteMenu = {
// /____/
var _LangMenu = {
view: function(){
var path = m.route.get().match(/^\/[^\/]+(.+)$/);
// console.log('Lang menu Path', path);
// create ul dom
return m('ul', {id:"languages"}, _dbs.langs.map(function(lang){
return m('nav', {id:'languages'}, [
// TODO: replaced labels with localized content
m('h3', 'languages'),
m('ul', _dbs.langs.map(function(lang){
// create li dom for each lank link
return m('li',
// create a dom
m('a', {
'lang':lang.lc,
'href':'/?lang='+lang.lc,
onclick:function(e){
e.preventDefault();
// console.log('click lang', e);
var lang = e.target.getAttribute('lang');
console.log(lang);
if(lang != _dbs.lang){
// change url variable
// change db
_dbs.lang = lang;
// redraw UI
// m.redraw();
}
return false;
}
'href':'/'+lang.lc+path[1]
// onclick:function(e){
// e.preventDefault();
// // console.log('click lang', e);
// var lang = e.target.getAttribute('lang');
// // console.log(lang);
// if(lang != _dbs.lang){
// // change url variable
// // change db
// _dbs.lang = lang;
// // redraw UI
// // m.redraw();
// }
// return false;
// }
}, lang.label)
);
})
);
}))
]);
}
}