app.ethica-spinoza.net/assets/modules/dots.js

var m = require('mithril');

// https://github.com/markdown-it/markdown-it
var markdown =  require('markdown-it')()
                  .use(require('markdown-it-footnote'));

var _dbs = require('./dbs');
var _Header = require('./header');
var _Footer = require('./footer');

// var _lang = require('../main.js')._langs;

//     ____        __
//    / __ \____  / /_
//   / / / / __ \/ __/
//  / /_/ / /_/ / /_
// /_____/\____/\__/
var _Dot = {
  id:null,
  type:'',
  text:'',
  summary:'',
  opened:false,
  classes:['dot'],
  oninit: function(vn){
    this.id = vn.attrs.id;
    this.type = vn.attrs.type;
    this.text = markdown.render(vn.attrs.text);
    // TODO: summary needs more work (strip tags, markdown render)
    this.summary = markdown.renderInline(vn.attrs.text.match('([^ ]*[ ]{0,1}){1,8}')[0]) + "…"
  },
  onbeforeupdate: function(vn){
    if (this.opened){
      this.classes.push('opened');
    }else{
      this.classes = ['dot'];
    }
  },
  view: function(vn){
    return m('div',{
        'id':this.id,
        'class':this.classes.join(' '),
        onclick:function(e){
          vn.state.opened = true;
        }
      },
      [
        m('span', {'class':'id'}, this.id), // this.type+' '+
        m('span', {'class':'bullet'}, m.trust('⚫')),
        m('p', {'class':'summary'}, m.trust(this.summary))
    ]);
  }
}

/*

down vote
Here's full list of black dotlikes from unicode

● - ● - Black Circle
⏺ - ⏺ - Black Circle for Record
⚫ - ⚫ - Medium Black Circle
⬤ - ⬤ - Black Large Circle
⧭ - ⧭ - Black Circle with Down Arrow
🞄 - 🞄 - Black Slightly Small Circle
• - • - Bullet
∙ - ∙ - Bullet Operator
⋅ - ⋅ - Dot Operator
🌑 - 🌑 - New Moon Symbol
*/


//   _______   _ __   __
//  / ___/ /  (_) /__/ /
// / /__/ _ \/ / / _  /
// \___/_//_/_/_/\_,_/
var _Child = {
  id:null,
  part:null,
  type:null,
  // nested:false,
  text:'',
  oninit: function(vn){
    // console.log('vn.attrs', vn.attrs);
    this.id = vn.attrs.id;
    this.type = vn.attrs.type;
    // vn.state.part = vn.state.slug.match(/^(\d)(.+)/)[1];
    this.text = vn.attrs.text;
    // this.nested = vn.attrs.nested || false;
  },
  onbeforeupdate: function(vn, old){
    // this.nested = vn.attrs.nested || false;
    this.type = vn.attrs.type;
    this.text = vn.attrs.text;
  },
  view: function(vn){
    return m(_Dot, {"id":this.id, 'text':this.text, 'type':this.type});
  }
};

//     ______
//    / ____/___  ____  ____  ________
//   / __/ / __ \/ __ \/ __ \/ ___/ _ \
//  / /___/ / / / /_/ / / / / /__/  __/
// /_____/_/ /_/\____/_/ /_/\___/\___/
var _Enonce = {
  partid:null,
  id:null,
  title:null,
  text:null,
  // nested:false,
  childs:[],
  oninit:function(vn){
  //   // console.log('Enonce on init', vn);
    this.partid = vn.attrs.partid;
    this.id = vn.attrs.id;
    this.title = vn.attrs.title;
    this.text = vn.attrs.text;
    this.childs = vn.attrs.childs;
    // this.nested = vn.attrs.nested || false;
  },
  onbeforeupdate:function(vn, old) {
    // console.log(vn.attrs.childs);
    this.title = vn.attrs.title;
    this.text = vn.attrs.text;
    this.childs = vn.attrs.childs;
    // this.nested = vn.attrs.nested || false;
    // if(vn.attrs.id == '1d1') console.log('_Enonce UPDATE, text :', vn.attrs.text);
  },
  view: function(vn){
    // if(vn.attrs.id == '1d1') console.log('_Enonce VIEW, text :', vn.attrs.text);
    return [
      // create dot
      m(_Dot, {"id":this.id, 'text':this.text,'type':this.title}),
      // addd children
      this.childs.map(function(c){
        return m(_Child, c);
      })
    ]
  }
}


//     ____             __
//    / __ \____ ______/ /_
//   / /_/ / __ `/ ___/ __/
//  / ____/ /_/ / /  / /_
// /_/    \__,_/_/   \__/
var _Part = {
  oninit: function(vn){
    this.id = vn.attrs.id;
    this.title = vn.attrs.title;
    this.enonces = vn.attrs.enonces;
  },
  onbeforeupdate: function(vn, old){
    // console.log('_Part, onbeforeupdate old',old);
    this.title = vn.attrs.title;
    this.enonces = vn.attrs.enonces;
  },
  view: function(vn){
    // console.log(vn.attrs.enonces);
    return m("section", {
        'id'    :this.id,
        'class' :'part'
      },
      [
        // create title node
        m("h1", {'class':'part'}, m.trust(markdown.renderInline(this.title))),
        // create text node
        this.enonces.map(function(e){
          // console.log(e.text);
          return m(_Enonce, Object.assign({"partid":this.id},e))
        })
      ]
    )
  }
}


//     ____        __
//    / __ \____  / /______
//   / / / / __ \/ __/ ___/
//  / /_/ / /_/ / /_(__  )
// /_____/\____/\__/____/
module.exports = {
  view: function(){
    console.log('_Dots view', _dbs.lang);
    return [
      m(_Header),
      m('main', {id:"content", 'class':'dots'}, _dbs.data[_dbs.lang].map(function(p){
          return m(_Part,p);
        })
      ),
      m(_Footer)
    ];
  }
}


// function(){
//   switch(_dbs.lang){
//     case 'fr':
//       return "Hello dots !";
//       break;
//     case 'bra':
//       return '"Hola dots !"'
//       break;
//   }
// }