object-list-view.js

var css = require('dom-css'),
    tmpl = require('../../views/client/object-list.jade'),
    watchProperty = require('watch-property');



class ObjectListView {

    constructor(title){
        this.title = title;
        this.domElement = document.createElement('div');
        this.domElement.classList.add('object-list');


        css(this.domElement, {
            position: 'fixed',
            bottom: 0,
            right: 10,
            minWidth: 150,
            color: 'white',
            fontSize: '50%',
            backgroundColor: 'rgba(0,0,0,0.75)'
        });
    }

    css(styles) {
        css(this.domElement, styles);
        return this;
    }

    set(object) {
        this.domElement.innerHTML = tmpl({
            title: this.title,
            object: object
        });
        return this;
    }
}

module.exports = ()=> ObjectListView.apply({}, arguments);
exports.ObjectListView = ObjectListView;

object-list.jade

mixin list(object, level, maxLevels)
    - level = level || 0 
    - maxLevels = maxLevels || 2;
    each val, key in object
        if typeof val !== 'function'
            tr
                td= key
                - val = typeof val === 'number' ? Math.floor(val*10000) / 10000 : val;
                td #{typeof val !== 'object' ? val : ''}
                if typeof val === 'object' && level < maxLevels
                    +list(val, level++)

if title
    h3= title
table
    +list(object)