added filters by text type

This commit is contained in:
2018-09-18 12:21:57 +02:00
parent 30443960ab
commit 2eeceb6a60
10 changed files with 190 additions and 61 deletions
+22 -9
View File
@@ -702,14 +702,11 @@ header {
position: absolute;
margin: 0;
left: 0;
padding: 0 1em 1em;
padding: 0 1em 0;
background-color: white;
white-space: nowrap;
height: 1px;
opacity: 0;
overflow: hidden;
transition: opacity 0.3s ease-in-out; }
white-space: nowrap; }
header #menus nav ul li {
position: relative;
margin: 0;
padding: 0;
list-style: none;
@@ -717,9 +714,24 @@ header {
font-weight: 500;
font-size: 1.2em;
line-height: 1.2; }
header #menus nav ul li:not(.active) {
height: 1px;
opacity: 0;
overflow: hidden;
transition: opacity 0.3s ease-in-out; }
header #menus nav ul li a {
color: inherit;
text-decoration: none; }
text-decoration: none;
display: inline-block;
width: 100%; }
header #menus nav ul li a:active, header #menus nav ul li a:focus {
outline: none;
-moz-outline-style: none; }
header #menus nav ul li.active a:after {
content: " \1F7AC";
font-style: normal;
font-size: 0.7em;
font-weight: 300; }
header #menus:hover h3 {
color: #646464; }
header #menus:hover nav:hover {
@@ -727,10 +739,11 @@ header {
header #menus:hover nav:hover h3 {
color: #000; }
header #menus:hover nav:hover ul {
padding-bottom: 1em; }
header #menus:hover nav:hover li {
height: auto;
opacity: 1;
transition: height opacity 0.3s ease-in-out; }
header #menus:hover nav:hover li {
transition: height opacity 0.3s ease-in-out;
color: #646464; }
header #menus:hover nav:hover li:hover {
color: #000; }
+1 -1
View File
File diff suppressed because one or more lines are too long
+1 -1
View File
File diff suppressed because one or more lines are too long
+3 -1
View File
@@ -40,7 +40,9 @@ function init(){
console.log('init dbs callback');
console.log("Init _dbs.data", _dbs.data);
console.log("Init _dbs.data_byid", _dbs.data_byid);
console.log("Init _dbs.data_strct", _dbs.data_strct);
console.log("Init _dbs.data_strct", _dbs.data_strct);
console.log("Init _dbs.types", _dbs.types);
console.log("Init _dbs.data_bytype", _dbs.data_bytype);
m.route.prefix("");
m.route(document.body, "/fr/connections", {
"/:lang/text": {
+25 -6
View File
@@ -69,14 +69,12 @@ header{
ul{
position: absolute;
margin:0;
left:0; padding:0 1em 1em;
left:0; padding:0 1em 0;
background-color: rgba(255,255,255, 1);
// top:2em;
white-space: nowrap;
height:1px; opacity:0;
overflow: hidden;
transition: opacity 0.3s ease-in-out;
li{
position: relative;
margin:0;
padding:0;
list-style: none;
@@ -84,9 +82,29 @@ header{
font-weight:500;
font-size: 1.2em;
line-height: 1.2;
&:not(.active){
height:1px; opacity:0;
overflow: hidden;
transition: opacity 0.3s ease-in-out;
}
// &.active{
// z-index: 99;
// }
a{
color: inherit;
text-decoration: none;
display: inline-block;
width: 100%;
&:active,
&:focus{ outline:none; -moz-outline-style: none; }
}
&.active{
a:after{
content: " \1F7AC";
font-style: normal;
font-size: 0.7em;
font-weight: 300;
}
}
}
}
@@ -106,10 +124,11 @@ header{
color:#000;
}
ul{
height:auto; opacity: 1;
transition: height opacity 0.3s ease-in-out;
padding-bottom: 1em;
}
li{
height:auto; opacity: 1;
transition: height opacity 0.3s ease-in-out;
color: rgb(100,100,100);
&:hover{
color: #000;
+24 -12
View File
@@ -208,7 +208,12 @@ var _Dot = {
if(!vn.state.opened) vn.state.opened = 1;
}
}, m.trust(this.nested ? this.breadcrumb : this.title)),
m('p', {'class':'summary'}, m.trust(this.summary))
m('p', {
'class':'summary',
onclick(e){
if(!vn.state.opened) vn.state.opened = 1;
}
}, m.trust(this.summary))
]
);
},
@@ -242,15 +247,17 @@ var _Child = {
// onbeforeupdate(vn, old){},
view(vn){
return [
m(_Dot, vn.attrs),
!_dbs.active_type_filter || _dbs.active_type_filter == vn.attrs.dottype
? m(_Dot, vn.attrs)
: null,
// add children
typeof vn.attrs.childs !== 'undefined'
? vn.attrs.childs.map(c => {
c.lang = vn.attrs.lang;
c.level = vn.attrs.level + 1;
return m(_Child, c);
})
: null
? vn.attrs.childs.map(c => {
c.lang = vn.attrs.lang;
c.level = vn.attrs.level + 1;
return m(_Child, c);
})
: null
];
}
};
@@ -266,9 +273,11 @@ var _Enonce = {
view(vn){
vn.attrs.level = 0;
return [
!_dbs.active_type_filter || _dbs.active_type_filter == vn.attrs.dottype
// create dot
m(_Dot, vn.attrs),
// addd children
? m(_Dot, vn.attrs)
: null,
// add children
vn.attrs.childs.map(c => {
c.lang = vn.attrs.lang;
c.level = 1;
@@ -307,7 +316,9 @@ var _Part = {
switch (e.type) {
case "title":
// handle titles
return m("h2", {'class':'title'}, m.trust(markdown.renderInline(e.title)));
return !_dbs.active_type_filter
? m("h2", {'class':'title'}, m.trust(markdown.renderInline(e.title)))
: null;
break;
case "filet":
// handle filets
@@ -357,7 +368,8 @@ module.exports = {
console.log('Connection, onbeforeupdate old',old, 'vn',vn);
},
view(vn){
console.log('_ModeConnections view', vn.attrs.lang);
// console.log('_ModeConnections view', vn.attrs.lang);
console.log('_dbs.active_type_filter : ', _dbs.active_type_filter);
return m('main', {id:"content", 'class':'mode-connections'}, _dbs.data[vn.attrs.lang].map(p => {
p.lang = vn.attrs.lang;
if(p.id == 'intro'){
+35 -24
View File
@@ -224,25 +224,28 @@ var _Item = {
// 'class':'item'+(this.nested ? ' nested':'')
'class' :`item${this.nested ? ' nested':''} ${this.dottype}`
},
[
// create title node (only if not nested)
!this.nested
? m("h3", {
// 'ref':vn.attrs.href,
// 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
typeof vn.attrs.text !== "undefined"
? m(_Text, {'text':this.text, 'id':this.id, 'lang':vn.attrs.lang})
: null,
// add children (only if not nested)
// typeof vn.attrs.childs !== 'undefined' && !this.nested
// ? vn.attrs.childs.map(c => { return m(_Item, c); })
// : null
]
// filter by type if active filter
!_dbs.active_type_filter || _dbs.active_type_filter == vn.attrs.dottype
? [
// create title node (only if not nested)
!this.nested
? m("h3", {
// 'ref':vn.attrs.href,
// 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
typeof vn.attrs.text !== "undefined"
? m(_Text, {'text':this.text, 'id':this.id, 'lang':vn.attrs.lang})
: null,
// add children (only if not nested)
// typeof vn.attrs.childs !== 'undefined' && !this.nested
// ? vn.attrs.childs.map(c => { return m(_Item, c); })
// : null
]
:null
)
}
};
@@ -287,10 +290,15 @@ var _Enonce = {
'class' :`enonce${vn.attrs.nested ? ' nested':''} ${this.dottype}`
},
[
// create title node (only if not nested)
!vn.attrs.nested ? m("h2", {}, m.trust(markdown.renderInline(this.title))) : null,
// create text node
m(_Text, {'text':vn.attrs.text, 'id':vn.attrs.id, 'nested':vn.attrs.nested}),
// filter by type if active filter (but let map on children)
!_dbs.active_type_filter || _dbs.active_type_filter == vn.attrs.dottype
// create title node (only if not nested)
? !vn.attrs.nested ? m("h2", {}, m.trust(markdown.renderInline(this.title))) : null
: null,
!_dbs.active_type_filter || _dbs.active_type_filter == vn.attrs.dottype
// create text node
? m(_Text, {'text':vn.attrs.text, 'id':vn.attrs.id, 'nested':vn.attrs.nested})
: null,
// add children (only if not nested)
typeof vn.attrs.childs !== 'undefined' && !vn.attrs.nested
? vn.attrs.childs.map(c => {
@@ -335,7 +343,9 @@ var _Part = {
case "title":
// handle titles
// console.log('title');
return m("h2", {'class':'title'}, m.trust(markdown.renderInline(e.title)));
return !_dbs.active_type_filter
? m("h2", {'class':'title'}, m.trust(markdown.renderInline(e.title)))
: null ;
break;
case "filet":
// handle filets
@@ -394,6 +404,7 @@ module.exports = {
// },
view(vn){
// console.log('_ModeText view', vn.attrs.lang);
console.log('_dbs.active_type_filter : ', _dbs.active_type_filter);
return m('main', {id:"content", 'class':'mode-text'}, _dbs.data[vn.attrs.lang].map((p) => {
// console.log("MAP _dbs", p);
p.lang = vn.attrs.lang;
+33 -6
View File
@@ -32,6 +32,9 @@ module.exports = {
data:[],
loaded_dbs:0,
data_byid:[],
data_bytype:[], // not sure we'll use it ...
types:[],
active_type_filter:null,
data_strct:{},
rx_id:/^(\d)(app|agd|\d\d|pr|ad|ap|c|p|d|a)(cd|sc|\d\d|d|c|a|l|p|\d)?(e|\d|sc)?(d|c|a|sc)?$/,
id_strct:[
@@ -141,12 +144,16 @@ module.exports = {
},
parseByID(callback){
// TODO: make this function recursive to avoid code repetition
// create a id keyed array of contents
var e_id, c_id, cc_id;
// loop through laguages
var e_id, c_id, cc_id,
dottype;
// loop through languages
for(let l in this.data){
// console.log('l', l);
this.data_byid[l] = {};
this.data_bytype[l] = {};
this.types[l] = [];
// loop through parts
for (let p in this.data[l]) {
if(this.data[l][p].type !== "intro"){
@@ -158,11 +165,18 @@ module.exports = {
e_id = this.data[l][p].enonces[e].id;
// guess the type from the id
// console.log(this.data[l][p].enonces[e].id);
this.data[l][p].enonces[e].dottype = this.setupType(e_id);
dottype = this.setupType(e_id);
this.data[l][p].enonces[e].dottype = dottype;
// breadcrumb (full tree title)
this.data[l][p].enonces[e].breadcrumb = this.setupBreadcrumb(e_id);
// records childs in array keyed by ids
this.data_byid[l][e_id] = this.data[l][p].enonces[e];
// data by dottype
if (dottype) {
if(typeof this.data_bytype[l][dottype] == "undefined") this.data_bytype[l][dottype] = {};
if(this.types[l].indexOf(dottype) == -1) this.types[l].push(dottype);
this.data_bytype[l][dottype][e_id] = this.data[l][p].enonces[e];
}
}
// loop through childs
for (let c in this.data[l][p].enonces[e].childs){
@@ -170,11 +184,18 @@ module.exports = {
if(this.data[l][p].enonces[e].childs[c].id){
c_id = this.data[l][p].enonces[e].childs[c].id;
// guess the type from the id
this.data[l][p].enonces[e].childs[c].dottype = this.setupType(c_id);
dottype = this.setupType(c_id);
this.data[l][p].enonces[e].childs[c].dottype = dottype;
// breadcrumb (full tree title)
this.data[l][p].enonces[e].childs[c].breadcrumb = this.setupBreadcrumb(c_id);
// records childs in array keyed by ids
this.data_byid[l][c_id] = this.data[l][p].enonces[e].childs[c];
// data by dottype
if (dottype) {
if(typeof this.data_bytype[l][dottype] == "undefined") this.data_bytype[l][dottype] = {};
if(this.types[l].indexOf(dottype) == -1) this.types[l].push(dottype);
this.data_bytype[l][dottype][c_id] = this.data[l][p].enonces[e].childs[c];
}
}
// loop through childs of childs
for (let cc in this.data[l][p].enonces[e].childs[c].childs){
@@ -183,13 +204,19 @@ module.exports = {
cc_id = this.data[l][p].enonces[e].childs[c].childs[cc].id;
// console.log('cc_id', cc_id);
// guess the type from the id
this.data[l][p].enonces[e].childs[c].childs[cc].dottype = this.setupType(cc_id);
dottype = this.setupType(cc_id);
this.data[l][p].enonces[e].childs[c].childs[cc].dottype = dottype;
// breadcrumb (full tree title)
this.data[l][p].enonces[e].childs[c].childs[cc].breadcrumb = this.setupBreadcrumb(cc_id);
// records childs in array keyed by ids
this.data_byid[l][cc_id] = this.data[l][p].enonces[e].childs[c].childs[cc];
// data by dottype
if (dottype) {
if(typeof this.data_bytype[l][dottype] == "undefined") this.data_bytype[l][dottype] = {};
if(this.types[l].indexOf(dottype) == -1) this.types[l].push(dottype);
this.data_bytype[l][dottype][cc_id] = this.data[l][p].enonces[e].childs[c].childs[cc];
}
}
}
}
}
+39
View File
@@ -25,6 +25,7 @@ module.exports = {
]),
m('div', {'id':"menus"}, [
m(_PartsNav),
m(_Filters),
m(_RouteMenu),
m(_LangMenu)
])
@@ -57,6 +58,44 @@ var _PartsNav = {
}
};
// ___ _ _ _ __ __
// | __(_) | |_ ___ _ _ ___ | \/ |___ _ _ _ _
// | _|| | | _/ -_) '_(_-< | |\/| / -_) ' \ || |
// |_| |_|_|\__\___|_| /__/ |_| |_\___|_||_\_,_|
var _Filters = {
view(vn){
var lang = m.route.param('lang');
return m('nav', {id:'filters'}, [
m('h3', _i18n.t('Filters')),
m('ul', _dbs.types[lang].map(function(p){
// console.log("types", p);
return m('li', [
m('a', {
'href':`#filter-${p}`,
'type':`${p}`,
onclick(e){
// console.log('click filter btn', type);
e.preventDefault();
if(e.target.parentNode.classList.contains('active')){
e.target.parentNode.classList.remove('active');
_dbs.active_type_filter = null;
}else{
e.target.parentNode.classList.add('active');
let type = e.target.getAttribute("type");
_dbs.active_type_filter = type;
}
return false;
}
}, p)
]);
})
)
]);
}
}
// ____ __
// / __ \____ __ __/ /____ ____ ___ ___ ____ __ __
// / /_/ / __ \/ / / / __/ _ \ / __ `__ \/ _ \/ __ \/ / / /
+7 -1
View File
@@ -16,7 +16,7 @@ module.exports = {
this.lang = l
},
log(msg){
console.log(`i18n : ${msg}`);
console.warn(`i18n : ${msg}`);
},
fallback:'en',
lang: null,
@@ -51,5 +51,11 @@ module.exports = {
'bra':'Conexões',
'lat':'Hospites'
},
'Filters':{
'en':'Filters',
'fr':'Filtres',
'bra':'Filtros',
'lat':'Filtra'
}
}
}