LobiList initialization is simple. Just create an empty <div>
and call plugin.
<div id="todo-lists-demo"></div>
<script>
$(function(){
$('#todo-lists-demo').lobiList({
//Options
});
});
</script>
Plugin contains 2 internal classes: LobiList
and List
.
You have option to set defaults for LobiList
and all List
instances will take these options.
But if you want different option for List
you can override LobiList
option by specifying different options for List
.
$('selector').lobiList({
//Every list will have default style 'lobilist-info'
defaultStyle: 'lobilist-info',
lists: [
{
//This list will have style 'lobilist-danger' instead of 'lobilist-info'
defaultStyle: 'lobilist-danger',
...
},
... //other lists
]
});
$('selector').lobiList({
lists: [
{
title: 'TODO'
}
]
});
$('selector').lobiList({
lists: [
{
title: 'TODO',
defaultStyle: 'lobilist-info',
items: [
{
title: 'Floor cool cinders',
description: 'Thunder fulfilled travellers folly, wading, lake.',
dueDate: '2015-01-31'
},
{
title: 'Periods pride',
description: 'Accepted was mollis',
done: true
},
{
title: 'Flags better burns pigeon',
description: 'Rowed cloven frolic thereby, vivamus pining gown intruding strangers prank treacherously darkling.',
},
{
title: 'Accepted was mollis',
description: 'Rowed cloven frolic thereby, vivamus pining gown intruding strangers prank treacherously darkling.',
dueDate: '2015-02-02'
}
]
},
{
title: 'DOING',
items: [
{
title: 'Composed trays',
description: 'Hoary rattle exulting suspendisse elit paradises craft wistful. Bayonets allures prefer traits wrongs flushed. Tent wily matched bold polite slab coinage celerities gales beams.',
},
{
title: 'Chic leafy'
},
{
title: 'Guessed interdum armies chirp writhes most',
description: 'Came champlain live leopards twilight whenever warm read wish squirrel rock.',
dueDate: '2015-02-04',
done: true
}
]
}
]
});
$('selector').lobiList({
init : function(){
Lobibox.notify('success', {
size: 'mini',
delay: false,
sound: false,
msg: 'LobiList is initialized'
});
},
beforeListAdd : function(list){
Lobibox.notify('warning', {
size: 'mini',
delay: false,
sound: false,
msg: 'List added'
});
},
beforeListRemove : function(list){
Lobibox.confirm({
msg: 'Are you sure you want to delete the list',
callback: function(box, type){
if (type === 'yes'){
list.remove(true);
}
}
});
return false;
},
afterListRemove : function(){
Lobibox.notify('info', {
size: 'mini',
delay: false,
sound: false,
msg: 'List after remove'
});
},
onItemAdd : function () {
Lobibox.notify('info', {
size: 'mini',
delay: false,
sound: false,
msg: 'Before item is added'
});
},
afterItemAdd : function () {
Lobibox.notify('info', {
size: 'mini',
delay: false,
sound: false,
msg: 'After item is added'
});
},
onItemUpdate : function () {
Lobibox.notify('error', {
size: 'mini',
delay: false,
sound: false,
msg: 'Before item is updated'
});
},
afterItemUpdate : function () {
Lobibox.notify('error', {
size: 'mini',
delay: false,
sound: false,
msg: 'After item is updated'
});
},
onItemDelete : function () {
Lobibox.notify('warning', {
size: 'mini',
delay: false,
sound: false,
msg: 'Before item is deleted'
});
},
afterItemDelete : function () {
Lobibox.notify('warning', {
size: 'mini',
delay: false,
sound: false,
msg: 'After item is deleted'
});
},
lists: [
{
title: 'TODO',
defaultStyle: 'lobilist-info',
items: [
{
title: 'Floor cool cinders',
description: 'Thunder fulfilled travellers folly, wading, lake.',
dueDate: '2015-01-31'
},
{
title: 'Periods pride',
description: 'Accepted was mollis',
done: true
},
{
title: 'Flags better burns pigeon',
description: 'Rowed cloven frolic thereby, vivamus pining gown intruding strangers prank treacherously darkling.',
},
{
title: 'Accepted was mollis',
description: 'Rowed cloven frolic thereby, vivamus pining gown intruding strangers prank treacherously darkling.',
dueDate: '2015-02-02'
}
]
}
]
});
$('selector').lobiList({
lists: [
{
title: 'TODO',
defaultStyle: 'lobilist-info',
controls: ['edit', 'styleChange'],
items: [
{
title: 'Floor cool cinders',
description: 'Thunder fulfilled travellers folly, wading, lake.',
dueDate: '2015-01-31'
}
]
},
{
title: 'Disabled custom checkboxes',
defaultStyle: 'lobilist-danger',
controls: ['edit', 'add', 'remove'],
useLobicheck: false,
items: [
{
title: 'Periods pride',
description: 'Accepted was mollis',
done: true
}
]
},
{
title: 'Controls disabled',
controls: false,
items: [
{
title: 'Composed trays',
description: 'Hoary rattle exulting suspendisse elit paradises craft wistful. Bayonets allures prefer traits wrongs flushed. Tent wily matched bold polite slab coinage celerities gales beams.',
}
]
},
{
title: 'Disabled todo edit/remove',
enableTodoRemove: false,
enableTodoEdit: false,
items: [
{
title: 'Composed trays',
description: 'Hoary rattle exulting suspendisse elit paradises craft wistful. Bayonets allures prefer traits wrongs flushed. Tent wily matched bold polite slab coinage celerities gales beams.',
}
]
}
]
});