sanj/oxjs
1
0
Fork 0
forked from 0x2620/oxjs
Code Pull requests Activity

add Ox.FileButton

Browse source
This commit is contained in:
rlx 2012-03-23 17:57:12 +00:00
commit 17d92a3ff7
3 changed files with 152 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

63
source/Ox.UI/js/Form/Ox.FileInput.js
View file

@ -16,13 +16,20 @@ Ox.FileInput = function(options, self) {
.css({width: self.options.width + 'px'});
self.multiple = self.options.maxFiles != 1;
self.size = 0;
self.size = getSize();
self.$bar = Ox.Bar({size: 14})
.css({width: self.options.width - 2 + 'px'})
.css(
Ox.extend({
width: self.options.width - 2 + 'px'
}, self.multiple && self.options.value.length ? {
borderBottomLeftRadius: 0,
borderBottomRightRadius: 0
} : {})
)
.appendTo(that);
self.$text = $('<div>')
self.$title = $('<div>')
.css({
float: 'left',
width: self.options.width - 102 + 'px',
@ -30,7 +37,7 @@ Ox.FileInput = function(options, self) {
overflow: 'hidden',
textOverflow: 'ellipsis'
})
.html(getText())
.html(getTitleText())
.appendTo(self.$bar);
self.$size = $('<div>')
@ -41,6 +48,7 @@ Ox.FileInput = function(options, self) {
paddingRight: '16px',
textAlign: 'right'
})
.html(getSizeText())
.appendTo(self.$bar);
self.$button = Ox.Button({
@ -88,8 +96,8 @@ Ox.FileInput = function(options, self) {
width: self.options.width - 2 + 'px',
height: getHeight()
})
.hide()
.appendTo(that);
self.options.value.length == 0 && self.$files.hide();
self.$list = Ox.TextList({
columns: [
{
@ -134,7 +142,7 @@ Ox.FileInput = function(options, self) {
width: 28
}
],
items: [],
items: getItems(),
sort: [{key: 'name', operator: '+'}]
})
.css({
@ -157,11 +165,6 @@ Ox.FileInput = function(options, self) {
Ox.loop(filelist.length, function(i) {
files.push(filelist.item(i));
});
if (self.options.maxSize != -1) {
files.sort(function(a, b) {
return a.size - b.size;
});
}
files.sort(self.options.maxSize == -1 ? function(a, b) {
a = a.name.toLowerCase();
b = b.name.toLowerCase();
@ -174,18 +177,16 @@ Ox.FileInput = function(options, self) {
if (!exists(file) && (
self.options.maxFiles == -1
|| self.options.value.length < self.options.maxFiles
) && (
self.options.maxSize == -1
|| self.size + file.size < self.options.maxSize
)) {
if (
self.options.maxSize == -1
|| self.size + file.size < self.options.maxSize
) {
self.options.value.push(file);
self.size += file.size;
}
self.options.value.push(file);
self.size += file.size;
}
});
self.$text.html(getText());
self.$size.html(getSize());
self.$title.html(getTitleText());
self.$size.html(getSizeText());
if (self.multiple) {
self.$bar.css({
borderBottomLeftRadius: 0,
@ -209,8 +210,8 @@ Ox.FileInput = function(options, self) {
function clearFile() {
self.options.value = [];
self.size = 0;
self.$text.html(getText());
self.$size.html(getSize());
self.$title.html(getTitleText());
self.$size.html(getSizeText());
self.$button.options({title: 'add'}).attr({title: ''});
self.$input.show();
that.triggerEvent('change', {value: self.options.value});
@ -239,15 +240,21 @@ Ox.FileInput = function(options, self) {
}
function getSize() {
return self.options.value.reduce(function(prev, curr) {
return prev + curr.size;
}, 0);
}
function getSizeText() {
return self.size ? Ox.formatValue(self.size, 'B') : '';
}
function getText() {
function getTitleText() {
var length = self.options.value.length
return length == 0
? 'No file' + (self.multiple ? 's' : '') + ' selected'
: self.multiple
? length + ' file' + (length == 1 ? '' : 's') + ' selected'
? length + ' file' + (length == 1 ? '' : 's')
: self.options.value[0].name;
}
@ -255,9 +262,7 @@ Ox.FileInput = function(options, self) {
self.options.value = self.options.value.filter(function(v, i) {
return ids.indexOf(i) == -1;
});
self.size = self.options.value.reduce(function(prev, curr) {
return prev + curr.size;
}, 0);
self.size = getSize();
if (self.options.value.length == 0) {
self.$bar.css({
borderBottomLeftRadius: '8px',
@ -265,8 +270,8 @@ Ox.FileInput = function(options, self) {
});
self.$files.hide();
}
self.$text.html(getText());
self.$size.html(getSize());
self.$title.html(getTitleText());
self.$size.html(getSizeText());
self.$list.options({items: getItems(), selected: []});
self.$files.css({height: getHeight()});
that.triggerEvent('change', {value: self.options.value});