mithril-occluded-media-list

A scroll-occluded bootstrap media-list

You can see a demo here.

installation

You can get a copy with bower or npm or just download it from the dist/ folder, here.

webpack/browserify/etc

var OccludedMediaList = require('mithril-occluded-media-list');

requirejs

define(['mithril','OccludedMediaList'], function(m,OccludedMediaList){
  
});

plain browser globals

<script src="https://cdnjs.cloudflare.com/ajax/libs/mithril/0.1.30/mithril.min.js"></script>
<script src="http://konsumer.github.io/mithril-occluded-media-list/dist/OccludedMediaList.min.js"></script>

usage

Basically, there is a m.prop([]) of items, and there are 3 fields that your items optionally can implement: image, title, & text, which each can be mapped. You can also add an onclick that will be called with the item as it's argument. All these options are optional.

Demo.controller = function(){
  this.items = m.prop([]);
  m.request({method:'GET', url:'demo/shows.json'}).then(this.items);
  this.list = new OccludedMediaList.controller(this.items, {
    title:'name',
    image:'poster',
    text: 'description',
    onclick: function(item){
      console.log(item);
    }
  });
};

Demo.view = function(ctrl){
  return OccludedMediaList.view(ctrl.list);
};