From 4ebdec39cba78b9e9cdf9013ebb500dbd6198731 Mon Sep 17 00:00:00 2001
From: rlx <0x0073@0x2620.org>
Date: Thu, 1 Sep 2011 07:00:35 +0000
Subject: [PATCH] make find work in list browsers
---
static/js/pandora/pandora.js | 5 +-
static/js/pandora/ui/folderBrowser.js | 2 +-
static/js/pandora/ui/folderBrowserBar.js | 49 +++++-
static/js/pandora/ui/folderBrowserList.js | 31 ++--
static/js/pandora/ui/folders.js | 3 +
static/js/pandora/ui/foldersList.js | 200 +++++++++++-----------
6 files changed, 170 insertions(+), 120 deletions(-)
diff --git a/static/js/pandora/pandora.js b/static/js/pandora/pandora.js
index 5a33e5c..978377b 100644
--- a/static/js/pandora/pandora.js
+++ b/static/js/pandora/pandora.js
@@ -221,9 +221,12 @@ pandora.resizeFolders = function() {
var i = Ox.getPositionById(pandora.site.sectionFolders[pandora.user.ui.section], id);
pandora.$ui.folder[i].css({width: width + 'px'});
$list.css({width: width + 'px'});
- Ox.print('...', width, id, $list.options())
if (pandora.user.ui.section == 'items') {
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)
.resizeColumn('name', columnWidth.name);
} else {
diff --git a/static/js/pandora/ui/folderBrowser.js b/static/js/pandora/ui/folderBrowser.js
index 4fc8fba..6cef76e 100644
--- a/static/js/pandora/ui/folderBrowser.js
+++ b/static/js/pandora/ui/folderBrowser.js
@@ -3,7 +3,7 @@ pandora.ui.folderBrowser = function(id) {
var that = Ox.SplitPanel({
elements: [
{
- element: pandora.ui.folderBrowserBar(),
+ element: pandora.ui.folderBrowserBar(id),
size: 24
},
{
diff --git a/static/js/pandora/ui/folderBrowserBar.js b/static/js/pandora/ui/folderBrowserBar.js
index 895d4da..bc6df0e 100644
--- a/static/js/pandora/ui/folderBrowserBar.js
+++ b/static/js/pandora/ui/folderBrowserBar.js
@@ -3,11 +3,54 @@ pandora.ui.folderBrowserBar = function(id) {
var that = Ox.Bar({
size: 24
});
- pandora.$ui.findListInput = Ox.Input({
- placeholder: 'Find User',
- width: 184 - Ox.UI.SCROLLBAR_SIZE
+ Ox.print('ID', id)
+ pandora.$ui.findListElement[id] = Ox.FormElementGroup({
+ 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({
+ float: 'right',
margin: '4px',
align: 'right'
})
diff --git a/static/js/pandora/ui/folderBrowserList.js b/static/js/pandora/ui/folderBrowserList.js
index 2736a72..53fd8b1 100644
--- a/static/js/pandora/ui/folderBrowserList.js
+++ b/static/js/pandora/ui/folderBrowserList.js
@@ -8,16 +8,18 @@ pandora.ui.folderBrowserList = function(id) {
columns: [
{
format: function() {
- return $('![]()
')
- .attr({
- src: Ox.UI.PATH + 'png/icon16.png'
- });
+ return $('![]()
').attr({
+ src: Ox.UI.getImageURL('symbolIcon')
+ }).css({
+ width: '10px',
+ height: '10px',
+ padding: '3px 2px 1px 2px'
+ });
},
id: 'id',
operator: '+',
- title: $('![]()
')
- .attr({
- src: Ox.UI.PATH + 'png/icon16.png'
+ title: $('![]()
').attr({
+ src: Ox.UI.getImageURL('symbolIcon')
})
.css({
width: '10px',
@@ -100,8 +102,8 @@ pandora.ui.folderBrowserList = function(id) {
height: '10px',
padding: '3px 2px 1px 2px',
opacity: id == 'favorite'
- ? (value ? 1 : 0.1)
- : (value == 'featured' ? 1 : 0.1)
+ ? (value ? 1 : 0.25)
+ : (value == 'featured' ? 1 : 0.25)
});
},
id: id == 'favorite' ? 'subscribed' : 'status',
@@ -129,13 +131,12 @@ pandora.ui.folderBrowserList = function(id) {
columnsVisible: true,
items: function(data, callback) {
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: 'featured', operator: '='}
- ], operator: '|'};
- return pandora.api.findLists($.extend(data, {
+ {key: 'user', value: pandora.user.username, operator: '!'}
+ ], operator: '&'} : {conditions: [
+ {key: 'status', value: 'private', operator: '!'}
+ ], operator: ''};
+ return pandora.api.findLists(Ox.extend(data, {
query: query
}), callback);
},
diff --git a/static/js/pandora/ui/folders.js b/static/js/pandora/ui/folders.js
index 3b0db53..a2ca9b6 100644
--- a/static/js/pandora/ui/folders.js
+++ b/static/js/pandora/ui/folders.js
@@ -12,6 +12,9 @@ pandora.ui.folders = function() {
pandora.$ui.folder = [];
pandora.$ui.folderBrowser = {};
pandora.$ui.folderList = {};
+ pandora.$ui.findListElement = {};
+ pandora.$ui.findListSelect = {};
+ pandora.$ui.findListInput = {};
if (pandora.user.ui.section == 'items') {
pandora.site.sectionFolders.items.forEach(function(folder, i) {
var extras;
diff --git a/static/js/pandora/ui/foldersList.js b/static/js/pandora/ui/foldersList.js
index e1fe191..c490a66 100644
--- a/static/js/pandora/ui/foldersList.js
+++ b/static/js/pandora/ui/foldersList.js
@@ -4,104 +4,7 @@ pandora.ui.folderList = function(id) {
that;
if (pandora.user.ui.section == 'items') {
var columns, items;
- if (id == 'volumes') {
- columns = [
- {
- format: function() {
- return $('![]()
').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 $('![]()
')
- .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 $('![]()
')
- .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 {
+ if (id != 'volumes') {
columns = [
{
format: function() {
@@ -110,7 +13,7 @@ pandora.ui.folderList = function(id) {
}).css({
width: '10px',
height: '10px',
- padding: '3px 1px 1px 3px'
+ padding: '3px 2px 1px 2px'
});
},
id: 'user',
@@ -191,7 +94,7 @@ pandora.ui.folderList = function(id) {
width: '10px',
height: '10px',
padding: '3px 2px 1px 2px',
- opacity: value == 'private' ? 0.1 : 1
+ opacity: value == 'private' ? 0.25 : 1
})
},
id: 'status',
@@ -222,6 +125,103 @@ pandora.ui.folderList = function(id) {
query: query
}), callback);
};
+ } else {
+ columns = [
+ {
+ format: function() {
+ return $('![]()
').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 $('![]()
')
+ .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 $('![]()
')
+ .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({
columns: columns,