').css({
background: 'rgb(0, 0, 0)', // FIXME: make themes
borderRadius: '32px',
height: '128px',
width: '128px'
}).appendTo($preview);
if (data.image) {
$image = $('
').attr({
src: data.image
}).css({
borderRadius: '32px',
height: '128px',
width: '128px'
}).appendTo($imageContainer)
}
Ox.EditableContent({
placeholder: '
' + Ox._('Title') + '',
value: data.title
})
.bindEvent({
submit: function(data) {
editItem('title', data.value);
}
}).appendTo($preview);
Ox.EditableContent({
placeholder: '
' + Ox._('Text') + '',
value: data.text
})
.bindEvent({
submit: function(data) {
editItem('text', data.value);
}
}).appendTo($preview);
return $item;
}
function renderList(items) {
console.log('LIST', items)
var $list = Ox.TableList({
columns: [
{
id: 'image',
format: function(value) {
return $('
').attr({
src: value
}).css({
borderRadius: '4px',
height: '14px',
margin: '0 0 0 -2px',
width: '14px',
})
},
visible: true,
width: 16,
},
{
id: 'title',
visible: true,
width: 224
},
{
id: 'active',
format: function(value) {
return value ? $('
').attr({
src: Ox.UI.getImageURL('symbolCheck')
}).css({
width: '10px',
height: '10px',
padding: '3px'
}) : ''
},
visible: true,
width: 16
}
],
items: items,
max: 1,
sort: [{key: 'index', operator: '+'}],
sortable: true,
unique: 'id'
})
.bindEvent({
select: function() {
}
})
.css({
width: '256px'
});
return $list;
}
return that;
};