make find work in list browsers

This commit is contained in:
rolux 2011-09-01 07:00:35 +00:00
parent ae19191014
commit e95d30e2d1
6 changed files with 170 additions and 120 deletions

View file

@ -221,9 +221,12 @@ pandora.resizeFolders = function() {
var i = Ox.getPositionById(pandora.site.sectionFolders[pandora.user.ui.section], id); var i = Ox.getPositionById(pandora.site.sectionFolders[pandora.user.ui.section], id);
pandora.$ui.folder[i].css({width: width + 'px'}); pandora.$ui.folder[i].css({width: width + 'px'});
$list.css({width: width + 'px'}); $list.css({width: width + 'px'});
Ox.print('...', width, id, $list.options())
if (pandora.user.ui.section == 'items') { if (pandora.user.ui.section == 'items') {
if (pandora.site.sectionFolders[pandora.user.ui.section][i].showBrowser) { if (pandora.site.sectionFolders[pandora.user.ui.section][i].showBrowser) {
Ox.print('ID', id)
pandora.$ui.findListInput[id].options({
width: width - 24
});
$list.resizeColumn('user', columnWidth.user) $list.resizeColumn('user', columnWidth.user)
.resizeColumn('name', columnWidth.name); .resizeColumn('name', columnWidth.name);
} else { } else {

View file

@ -3,7 +3,7 @@ pandora.ui.folderBrowser = function(id) {
var that = Ox.SplitPanel({ var that = Ox.SplitPanel({
elements: [ elements: [
{ {
element: pandora.ui.folderBrowserBar(), element: pandora.ui.folderBrowserBar(id),
size: 24 size: 24
}, },
{ {

View file

@ -3,11 +3,54 @@ pandora.ui.folderBrowserBar = function(id) {
var that = Ox.Bar({ var that = Ox.Bar({
size: 24 size: 24
}); });
pandora.$ui.findListInput = Ox.Input({ Ox.print('ID', id)
placeholder: 'Find User', pandora.$ui.findListElement[id] = Ox.FormElementGroup({
width: 184 - Ox.UI.SCROLLBAR_SIZE elements: [
pandora.$ui.findListSelect[id] = Ox.Select({
items: [
{id: 'user', title: 'Find: User', checked: true},
{id: 'list', title: 'Find: List'}
],
overlap: 'right',
type: 'image'
})
.bindEvent({
change: function(data) {
pandora.$ui.findListInput[id].options({
placeholder: data.selected[0].title
});
}
}),
pandora.$ui.findListInput[id] = Ox.Input({
clear: true,
placeholder: 'Find: User',
width: pandora.getFoldersWidth() - 24
})
.bindEvent({
submit: function(data) {
var key = pandora.$ui.findListSelect[id].value() == 'user' ? 'user' : 'name',
value = data.value;
pandora.$ui.folderList[id].options({
items: function(data, callback) {
var query = id == 'favorite' ? {conditions: [
{key: 'status', value: 'public', operator: '='},
{key: 'user', value: pandora.user.username, operator: '!'},
{key: key, value: value, operator: ''}
], operator: '&'} : {conditions: [
{key: 'status', value: 'private', operator: '!'},
{key: key, value: value, operator: ''}
], operator: '&'};
return pandora.api.findLists(Ox.extend(data, {
query: query
}), callback);
}
});
}
})
],
}) })
.css({ .css({
float: 'right',
margin: '4px', margin: '4px',
align: 'right' align: 'right'
}) })

View file

@ -8,16 +8,18 @@ pandora.ui.folderBrowserList = function(id) {
columns: [ columns: [
{ {
format: function() { format: function() {
return $('<img>') return $('<img>').attr({
.attr({ src: Ox.UI.getImageURL('symbolIcon')
src: Ox.UI.PATH + 'png/icon16.png' }).css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px'
}); });
}, },
id: 'id', id: 'id',
operator: '+', operator: '+',
title: $('<img>') title: $('<img>').attr({
.attr({ src: Ox.UI.getImageURL('symbolIcon')
src: Ox.UI.PATH + 'png/icon16.png'
}) })
.css({ .css({
width: '10px', width: '10px',
@ -100,8 +102,8 @@ pandora.ui.folderBrowserList = function(id) {
height: '10px', height: '10px',
padding: '3px 2px 1px 2px', padding: '3px 2px 1px 2px',
opacity: id == 'favorite' opacity: id == 'favorite'
? (value ? 1 : 0.1) ? (value ? 1 : 0.25)
: (value == 'featured' ? 1 : 0.1) : (value == 'featured' ? 1 : 0.25)
}); });
}, },
id: id == 'favorite' ? 'subscribed' : 'status', id: id == 'favorite' ? 'subscribed' : 'status',
@ -129,13 +131,12 @@ pandora.ui.folderBrowserList = function(id) {
columnsVisible: true, columnsVisible: true,
items: function(data, callback) { items: function(data, callback) {
var query = id == 'favorite' ? {conditions: [ var query = id == 'favorite' ? {conditions: [
{key: 'user', value: pandora.user.username, operator: '!'},
{key: 'status', value: 'public', operator: '='}
], operator: '&'} : {conditions: [
{key: 'status', value: 'public', operator: '='}, {key: 'status', value: 'public', operator: '='},
{key: 'status', value: 'featured', operator: '='} {key: 'user', value: pandora.user.username, operator: '!'}
], operator: '|'}; ], operator: '&'} : {conditions: [
return pandora.api.findLists($.extend(data, { {key: 'status', value: 'private', operator: '!'}
], operator: ''};
return pandora.api.findLists(Ox.extend(data, {
query: query query: query
}), callback); }), callback);
}, },

View file

@ -12,6 +12,9 @@ pandora.ui.folders = function() {
pandora.$ui.folder = []; pandora.$ui.folder = [];
pandora.$ui.folderBrowser = {}; pandora.$ui.folderBrowser = {};
pandora.$ui.folderList = {}; pandora.$ui.folderList = {};
pandora.$ui.findListElement = {};
pandora.$ui.findListSelect = {};
pandora.$ui.findListInput = {};
if (pandora.user.ui.section == 'items') { if (pandora.user.ui.section == 'items') {
pandora.site.sectionFolders.items.forEach(function(folder, i) { pandora.site.sectionFolders.items.forEach(function(folder, i) {
var extras; var extras;

View file

@ -4,104 +4,7 @@ pandora.ui.folderList = function(id) {
that; that;
if (pandora.user.ui.section == 'items') { if (pandora.user.ui.section == 'items') {
var columns, items; var columns, items;
if (id == 'volumes') { if (id != 'volumes') {
columns = [
{
format: function() {
return $('<img>').attr({
src: Ox.UI.getImageURL('symbolVolume')
}).css({
width: '10px',
height: '10px',
padding: '3px 1px 1px 3px'
});
},
id: 'user',
operator: '+',
visible: true,
width: 16
},
{
editable: true,
id: 'name',
operator: '+',
tooltip: 'Edit Title',
unique: true,
visible: true,
width: pandora.user.ui.sidebarWidth - 96
},
{
align: 'right',
id: 'items',
format: {type: 'number'},
operator: '-',
visible: true,
width: 48
},
{
clickable: function(data) {
return data.mounted;
},
format: function(value, data) {
return $('<img>')
.attr({
src: Ox.UI.getImageURL(data.mounted ? 'symbolScan' : 'symbolEdit')
})
.css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px'
});
},
id: 'path',
operator: '+',
tooltip: function(data) {
return data.mounted ? 'Scan Volume' : 'Edit Path';
},
visible: true,
width: 16
},
{
clickable: true,
format: function(value, data) {
return $('<img>')
.attr({
src: Ox.UI.getImageURL('symbolMount')
})
.css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px',
opacity: data.mounted ? 1 : 0.25
});
},
id: 'mounted',
operator: '+',
tooltip: function(data) {
return data.mounted ? 'Unmount Volume' : 'Mount Volume';
},
visible: true,
width: 16
}
];
items = function(data, callback) {
var volumes = pandora.user.volumes || [
{"name": "Movies A-M", "path": "/Volumes/Movies A-M", "items": 1234},
{"name": "Movies N-Z", "path": "/Volumes/Movies N-Z", "items": 987}
];
if (!data.keys) {
data = {items: volumes.length};
} else {
data = {items: volumes.map(function(volume) {
return Ox.extend({id: volume.name, user: pandora.user.username, mounted: false}, volume);
})};
}
// fixme: ridiculous (we're binding to init too late)
setTimeout(function() {
callback({data: data});
}, 1000);
};
} else {
columns = [ columns = [
{ {
format: function() { format: function() {
@ -110,7 +13,7 @@ pandora.ui.folderList = function(id) {
}).css({ }).css({
width: '10px', width: '10px',
height: '10px', height: '10px',
padding: '3px 1px 1px 3px' padding: '3px 2px 1px 2px'
}); });
}, },
id: 'user', id: 'user',
@ -191,7 +94,7 @@ pandora.ui.folderList = function(id) {
width: '10px', width: '10px',
height: '10px', height: '10px',
padding: '3px 2px 1px 2px', padding: '3px 2px 1px 2px',
opacity: value == 'private' ? 0.1 : 1 opacity: value == 'private' ? 0.25 : 1
}) })
}, },
id: 'status', id: 'status',
@ -222,6 +125,103 @@ pandora.ui.folderList = function(id) {
query: query query: query
}), callback); }), callback);
}; };
} else {
columns = [
{
format: function() {
return $('<img>').attr({
src: Ox.UI.getImageURL('symbolVolume')
}).css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px'
});
},
id: 'user',
operator: '+',
visible: true,
width: 16
},
{
editable: true,
id: 'name',
operator: '+',
tooltip: 'Edit Title',
unique: true,
visible: true,
width: pandora.user.ui.sidebarWidth - 96
},
{
align: 'right',
id: 'items',
format: {type: 'number'},
operator: '-',
visible: true,
width: 48
},
{
clickable: function(data) {
return data.mounted;
},
format: function(value, data) {
return $('<img>')
.attr({
src: Ox.UI.getImageURL(data.mounted ? 'symbolSync' : 'symbolEdit')
})
.css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px'
});
},
id: 'path',
operator: '+',
tooltip: function(data) {
return data.mounted ? 'Scan Volume' : 'Edit Path';
},
visible: true,
width: 16
},
{
clickable: true,
format: function(value, data) {
return $('<img>')
.attr({
src: Ox.UI.getImageURL('symbolMount')
})
.css({
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px',
opacity: data.mounted ? 1 : 0.25
});
},
id: 'mounted',
operator: '+',
tooltip: function(data) {
return data.mounted ? 'Unmount Volume' : 'Mount Volume';
},
visible: true,
width: 16
}
];
items = function(data, callback) {
var volumes = pandora.user.volumes || [
{"name": "Movies A-M", "path": "/Volumes/Movies A-M", "items": 1234},
{"name": "Movies N-Z", "path": "/Volumes/Movies N-Z", "items": 987}
];
if (!data.keys) {
data = {items: volumes.length};
} else {
data = {items: volumes.map(function(volume) {
return Ox.extend({id: volume.name, user: pandora.user.username, mounted: volume.name == 'Movies A-M'}, volume);
})};
}
// fixme: ridiculous (we're binding to init too late)
setTimeout(function() {
callback({data: data});
}, 1000);
};
} }
that = Ox.TextList({ that = Ox.TextList({
columns: columns, columns: columns,