76 lines
2.7 KiB
JavaScript
76 lines
2.7 KiB
JavaScript
'use strict';
|
|
|
|
pandora.ui.clipsView = function(videoRatio) {
|
|
|
|
var $status = $('<div>')
|
|
.css({
|
|
width: '100%',
|
|
marginTop: '2px',
|
|
fontSize: '9px',
|
|
textAlign: 'center'
|
|
})
|
|
.html(Ox._('Loading...')),
|
|
|
|
that = Ox.SplitPanel({
|
|
elements: [
|
|
{
|
|
element: Ox.Bar({size: 24})
|
|
.bindEvent({
|
|
doubleclick: function(e) {
|
|
if ($(e.target).is('.OxBar')) {
|
|
pandora.$ui.clipList.animate({scrollTop: 0}, 250);
|
|
}
|
|
}
|
|
})
|
|
.append(
|
|
pandora.$ui.sortElement = pandora.ui.sortElement()
|
|
)
|
|
.append(
|
|
Ox.Input({
|
|
clear: true,
|
|
placeholder: Ox._('Find Clips'),
|
|
value: pandora.user.ui.itemFind,
|
|
width: 192
|
|
})
|
|
.css({float: 'right', margin: '4px'})
|
|
.bindEvent({
|
|
submit: function(data) {
|
|
$status.html(Ox._('Loading...'));
|
|
pandora.UI.set({itemFind: data.value});
|
|
// since this is the only way itemFind can change,
|
|
// there's no need for an event handler
|
|
that.replaceElement(1,
|
|
pandora.$ui.clipList = getClipList()
|
|
);
|
|
}
|
|
})
|
|
),
|
|
size: 24
|
|
},
|
|
{
|
|
element: pandora.$ui.clipList = getClipList()
|
|
},
|
|
{
|
|
element: Ox.Bar({size: 16}).append($status),
|
|
size: 16
|
|
}
|
|
],
|
|
orientation: 'vertical'
|
|
});
|
|
|
|
function getClipList() {
|
|
return pandora.ui.clipList(videoRatio)
|
|
.bindEvent({
|
|
init: function(data) {
|
|
var items = data.items;
|
|
$status.html(
|
|
Ox.toTitleCase(Ox.formatCount(items, 'clip'))
|
|
);
|
|
}
|
|
});
|
|
}
|
|
|
|
return that;
|
|
|
|
};
|