make list info editable, and update it if list data changes
This commit is contained in:
rolux
parent
7dff4fa402
commit
61e6e097be
|
|
@ -95,7 +95,7 @@ class List(models.Model):
|
|||
|
||||
def json(self, keys=None, user=None):
|
||||
if not keys:
|
||||
keys=['id', 'name', 'user', 'type', 'query', 'status', 'subscribed', 'posterFrames']
|
||||
keys=['id', 'name', 'user', 'type', 'query', 'status', 'subscribed', 'posterFrames', 'description']
|
||||
response = {}
|
||||
for key in keys:
|
||||
if key == 'items':
|
||||
|
|
|
|||
|
|
@ -30,11 +30,9 @@ pandora.ui.folderList = function(id) {
|
|||
width: 16
|
||||
},
|
||||
{
|
||||
/*
|
||||
format: function(value) {
|
||||
return value.split('/').join(': ');
|
||||
return value.split(':').join(': ');
|
||||
},
|
||||
*/
|
||||
id: 'id',
|
||||
operator: '+',
|
||||
unique: true,
|
||||
|
|
@ -386,14 +384,8 @@ pandora.ui.folderList = function(id) {
|
|||
data_[data.key] = data.value;
|
||||
pandora.api.editList(data_, function(result) {
|
||||
if (result.data.id != data.id) {
|
||||
pandora.$ui.folderList[id].value(data.id, 'name', result.data.name);
|
||||
pandora.$ui.folderList[id].value(data.id, 'id', result.data.id);
|
||||
pandora.UI.set({
|
||||
find: {
|
||||
conditions: [{key: 'list', value: result.data.id, operator: '=='}],
|
||||
operator: '&'
|
||||
}
|
||||
}, false);
|
||||
pandora.renameList(data.id, result.data.id, result.data.name, id);
|
||||
pandora.$ui.info.updateListInfo();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
|||
|
|
@ -117,9 +117,9 @@ pandora.ui.info = function() {
|
|||
that.resizeInfo = function() {
|
||||
var view = getView();
|
||||
if (view == 'list') {
|
||||
pandora.$ui.listInfo.resizeIcon();
|
||||
pandora.$ui.listInfo.resizeInfo();
|
||||
} else if (view == 'poster') {
|
||||
pandora.$ui.posterInfo.resizePoster();
|
||||
pandora.$ui.posterInfo.resizeInfo();
|
||||
} else if (view == 'video') {
|
||||
pandora.$ui.videoPreview.options({
|
||||
height: pandora.getInfoHeight(true),
|
||||
|
|
@ -128,6 +128,12 @@ pandora.ui.info = function() {
|
|||
}
|
||||
};
|
||||
|
||||
that.updateListInfo = function() {
|
||||
getView() == 'list' && that.empty().append(
|
||||
pandora.$ui.listInfo = pandora.ui.listInfo()
|
||||
);
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
|
@ -147,7 +153,8 @@ pandora.ui.listInfo = function() {
|
|||
: '/static/png/icon256.png'
|
||||
})
|
||||
.css(getIconCSS())
|
||||
.appendTo(that);
|
||||
.appendTo(that),
|
||||
$title, $description;
|
||||
|
||||
that.append($('<div>').css({height: '16px'}));
|
||||
|
||||
|
|
@ -162,10 +169,10 @@ pandora.ui.listInfo = function() {
|
|||
if (result.data.items.length) {
|
||||
var item = result.data.items[0];
|
||||
that.append(
|
||||
Ox.Editable({
|
||||
$title = Ox.Editable({
|
||||
editable: item.user == pandora.user.username,
|
||||
format: function(value) {
|
||||
return Ox.encodeHTML(item.user + ':' + value)
|
||||
return Ox.encodeHTML(item.user + ': ' + value)
|
||||
},
|
||||
tooltip: item.user == pandora.user.username
|
||||
? 'Doubleclick to edit title' : '',
|
||||
|
|
@ -173,21 +180,54 @@ pandora.ui.listInfo = function() {
|
|||
width: pandora.user.ui.sidebarSize - 32
|
||||
})
|
||||
.css({fontWeight: 'bold', textAlign: 'center'})
|
||||
.bindEvent({
|
||||
submit: function(data) {
|
||||
if (data.value != item.name) {
|
||||
pandora.api.editList({
|
||||
id: list,
|
||||
name: data.value
|
||||
}, function(result) {
|
||||
if (result.data.id != list) {
|
||||
pandora.renameList(list, result.data.id, result.data.name);
|
||||
list = result.data.id;
|
||||
item.name = result.data.name;
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
).append(
|
||||
$('<div>').css({height: '8px'})
|
||||
).append(
|
||||
Ox.Editable({
|
||||
editable: item.user == pandora.user.username,
|
||||
$description = Ox.Editable({
|
||||
format: function(value) {
|
||||
return Ox.encodeHTML(value)
|
||||
return '<div style="color: rgb(128, 128, 128); text-align: center">'
|
||||
+ value + '</div>';
|
||||
},
|
||||
placeholder: '<div style="color: rgb(128, 128, 128); text-align: center">No description</span>',
|
||||
tooltip: 'Doubleclick to edit description',
|
||||
editable: item.user == pandora.user.username,
|
||||
height: pandora.user.ui.sidebarSize - 32,
|
||||
placeholder: item.user == pandora.user.username
|
||||
? '<div style="color: rgb(128, 128, 128); text-align: center">No description</span>'
|
||||
: '',
|
||||
tooltip: item.user == pandora.user.username
|
||||
? 'Doubleclick to edit description' : '',
|
||||
type: 'textarea',
|
||||
value: item.description,
|
||||
width: pandora.user.ui.sidebarSize - 32
|
||||
})
|
||||
.css({textAlign: 'left'})
|
||||
.css({textAlign: 'center'})
|
||||
.bindEvent({
|
||||
submit: function(data) {
|
||||
if (data.value != item.description) {
|
||||
pandora.api.editList({
|
||||
id: list,
|
||||
description: data.value
|
||||
}, function(result) {
|
||||
item.description = result.data.description;
|
||||
});
|
||||
}
|
||||
}
|
||||
})
|
||||
);
|
||||
} else {
|
||||
that.append(
|
||||
|
|
@ -200,7 +240,7 @@ pandora.ui.listInfo = function() {
|
|||
} else {
|
||||
that.append(
|
||||
$('<div>')
|
||||
.css({paddingTop: '16px', fontWeight: 'bold'})
|
||||
.css({fontWeight: 'bold'})
|
||||
.html('All ' + pandora.site.itemName.plural)
|
||||
);
|
||||
}
|
||||
|
|
@ -213,8 +253,16 @@ pandora.ui.listInfo = function() {
|
|||
borderRadius: Math.round(size / 4) + 'px',
|
||||
};
|
||||
}
|
||||
that.resizeIcon = function() {
|
||||
that.resizeInfo = function() {
|
||||
$icon.css(getIconCSS());
|
||||
$title.options({
|
||||
width: that.width()
|
||||
//width: pandora.user.ui.sidebarSize - 32
|
||||
});
|
||||
$description.options({
|
||||
height: that.height(),
|
||||
width: that.width()
|
||||
});
|
||||
};
|
||||
return that;
|
||||
};
|
||||
|
|
@ -266,7 +314,7 @@ pandora.ui.posterInfo = function(data) {
|
|||
return value + 'px';
|
||||
});
|
||||
}
|
||||
that.resizePoster = function() {
|
||||
that.resizeInfo = function() {
|
||||
$poster.css(getPosterCSS());
|
||||
$text.css({width: pandora.user.ui.sidebarSize - 8 + 'px'})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -495,8 +495,8 @@ pandora.getInfoHeight = function(includeHidden) {
|
|||
);
|
||||
height = Math.min(
|
||||
isVideoPreview
|
||||
? Math.round(pandora.user.ui.sidebarSize / (16/9)) + 16
|
||||
: pandora.user.ui.sidebarSize,
|
||||
? Math.round(pandora.user.ui.sidebarSize / (16/9)) + 16
|
||||
: pandora.user.ui.sidebarSize,
|
||||
window.innerHeight - 109 // 20 menu + 24 bar + 64 (4 closed folders) + 1 resizebar
|
||||
);
|
||||
}
|
||||
|
|
@ -746,6 +746,19 @@ pandora.reloadList = function() {
|
|||
.reloadList();
|
||||
};
|
||||
|
||||
pandora.renameList = function(oldId, newId, newName, folder) {
|
||||
folder = folder || pandora.getListData(oldId).folder;
|
||||
Ox.print('RENAME LIST', oldId, newId, newName, folder)
|
||||
pandora.$ui.folderList[folder].value(oldId, 'name', newName);
|
||||
pandora.$ui.folderList[folder].value(oldId, 'id', newId);
|
||||
pandora.UI.set({
|
||||
find: {
|
||||
conditions: [{key: 'list', value: newId, operator: '=='}],
|
||||
operator: '&'
|
||||
}
|
||||
}, false);
|
||||
};
|
||||
|
||||
pandora.resizeFilters = function(width) {
|
||||
pandora.user.ui.filterSizes = pandora.getFilterSizes();
|
||||
pandora.$ui.browser
|
||||
|
|
@ -792,6 +805,7 @@ pandora.resizeFolders = function() {
|
|||
};
|
||||
|
||||
pandora.resizeWindow = function() {
|
||||
pandora.$ui.leftPanel.size(2, pandora.getInfoHeight(true));
|
||||
pandora.resizeFolders();
|
||||
/*
|
||||
var infoHeight = pandora.getInfoHeight(true);
|
||||
|
|
@ -880,6 +894,7 @@ pandora.selectList = function() {
|
|||
};
|
||||
|
||||
pandora.unloadWindow = function() {
|
||||
/*
|
||||
// fixme: ajax request has to have async set to false for this to work
|
||||
pandora.user.ui.section == 'items'
|
||||
&& pandora.user.ui.item
|
||||
|
|
@ -890,6 +905,7 @@ pandora.unloadWindow = function() {
|
|||
pandora.user.ui.itemView == 'video' ? 'player' : 'editor'
|
||||
].options('position')
|
||||
);
|
||||
*/
|
||||
};
|
||||
|
||||
(function() {
|
||||
|
|
|
|||
Loading…
Reference in New Issue