97 lines
No EOL
2.9 KiB
JavaScript
97 lines
No EOL
2.9 KiB
JavaScript
Ox.load('UI', {debug: true}, function() {
|
|
|
|
var $box = Ox.Element()
|
|
.css({width: '512px', height: '512px', margin: '8px'})
|
|
.appendTo(Ox.UI.$body);
|
|
|
|
/*
|
|
$container.append(
|
|
Ox.Input({
|
|
height: 64,
|
|
style: 'square',
|
|
type: 'textarea',
|
|
width: 256
|
|
})
|
|
);
|
|
$container.append($('<br>'))
|
|
*/
|
|
|
|
var data = {
|
|
country: ['France'],
|
|
director: ['Jean-Luc Godard'],
|
|
language: ['French', 'English'],
|
|
runtime: '90 min',
|
|
title: 'Deux ou trois choses que je sais d\'elle',
|
|
year: '1967'
|
|
};
|
|
|
|
Ox.Editable({
|
|
value: data.title
|
|
})
|
|
.css({
|
|
height: '16px',
|
|
fontWeight: 'bold',
|
|
fontSize: '13px'
|
|
})
|
|
.appendTo($box);
|
|
|
|
Ox.Editable({
|
|
format: function(value) {
|
|
return value ? value.split(', ').map(function(value) {
|
|
return '<a href="/?find=' + value + '">' + value + '</a>'
|
|
}).join(', ') : 'Unknown Director'
|
|
},
|
|
value: data.director.join(', ')
|
|
})
|
|
.css({
|
|
height: '16px',
|
|
fontWeight: 'bold',
|
|
fontSize: '13px'
|
|
})
|
|
.appendTo($box);
|
|
|
|
var $div = $('<div>').appendTo($box.$element);
|
|
|
|
['country', 'year', 'language', 'runtime'].forEach(function(key, i) {
|
|
var $div_ = $('<div>')
|
|
.css({float: 'left', margin: '1px 0 0 1px'})
|
|
.append(
|
|
$('<div>')
|
|
.css({float: 'left', fontWeight: 'bold'})
|
|
.html((i ? '; ' : '') + Ox.toTitleCase(key) + ': ')
|
|
)
|
|
.appendTo($div);
|
|
Ox.Editable({
|
|
format: function(value) {
|
|
return (value ? (
|
|
Ox.isArray(data[key]) ? value.split(', ').map(function(value) {
|
|
return '<a href="/?find=' + value + '">' + value + '</a>'
|
|
}).join(', ') : value
|
|
) : 'unknown');// + (i == 3 ? '' : ';');
|
|
},
|
|
value: Ox.isArray(data[key]) ? data[key].join(', ') : data[key]
|
|
})
|
|
.css({
|
|
float: 'left'
|
|
})
|
|
.appendTo($div_);
|
|
});
|
|
|
|
|
|
$div = $('<div>').css({clear: 'both', marginTop: '16px', textAlign: 'justify'}).appendTo($box.$element);
|
|
Ox.Editable({
|
|
format: function(value) {
|
|
return '<span style="font-weight: bold">Keywords:</span> '
|
|
+ value.split(', ').map(function(value) {
|
|
return '<a href="/?find=' + value + '">' + value + '</a>'
|
|
}).join(', ')
|
|
},
|
|
type: 'textarea',
|
|
value: 'Sex, Crime, Car, Spoiler in Keywords, Genre in Keywords, Director Cameo, One Or More Meta Keywords',
|
|
width: 512
|
|
})
|
|
.css({
|
|
})
|
|
.appendTo($div);
|
|
|
|
}); |