support for drag and drop
This commit is contained in:
parent
9ea5cce853
commit
5d454f0a80
8 changed files with 39 additions and 11 deletions
|
@ -1222,9 +1222,7 @@ Lists
|
||||||
.OxTextList .OxPage {
|
.OxTextList .OxPage {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
}
|
}
|
||||||
.OxTextList.OxDrop .OxItem .OxCell {
|
|
||||||
color: green;
|
|
||||||
}
|
|
||||||
.OxTreeList .OxItem .OxCell {
|
.OxTreeList .OxItem .OxCell {
|
||||||
border-right-width: 0
|
border-right-width: 0
|
||||||
}
|
}
|
||||||
|
@ -2094,7 +2092,7 @@ Miscellaneous
|
||||||
|
|
||||||
.OxTooltip {
|
.OxTooltip {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
padding: 1px 2px 1px 2px;
|
padding: 1px 3px 1px 3px;
|
||||||
font-size: 9px;
|
font-size: 9px;
|
||||||
//opacity: 0;
|
//opacity: 0;
|
||||||
z-index: 1001;
|
z-index: 1001;
|
||||||
|
|
|
@ -77,7 +77,12 @@ Ox.IconList = function(options, self) {
|
||||||
type: 'icon',
|
type: 'icon',
|
||||||
unique: self.options.unique
|
unique: self.options.unique
|
||||||
}, $.extend({}, self)) // pass event handler
|
}, $.extend({}, self)) // pass event handler
|
||||||
.addClass('OxIconList Ox' + Ox.toTitleCase(self.options.orientation));
|
.addClass('OxIconList Ox' + Ox.toTitleCase(self.options.orientation))
|
||||||
|
.bindEvent({
|
||||||
|
select: function() {
|
||||||
|
self.options.selected = that.$element.options('selected');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
updateKeys();
|
updateKeys();
|
||||||
|
|
||||||
|
|
|
@ -164,6 +164,7 @@ Ox.List = function(options, self) {
|
||||||
0, 60, 60, 60, 60, 60, 60, 63, 64, 63, 60, 66, 60, 65, 70, 60, 64, 68, 72, 76, 60
|
0, 60, 60, 60, 60, 60, 60, 63, 64, 63, 60, 66, 60, 65, 70, 60, 64, 68, 72, 76, 60
|
||||||
];
|
];
|
||||||
}
|
}
|
||||||
|
/*
|
||||||
if (self.options.draggable) {
|
if (self.options.draggable) {
|
||||||
that.bind({
|
that.bind({
|
||||||
dragstart: function(e) {
|
dragstart: function(e) {
|
||||||
|
@ -172,6 +173,7 @@ Ox.List = function(options, self) {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
*/
|
||||||
|
|
||||||
if (!self.isAsync) {
|
if (!self.isAsync) {
|
||||||
self.listLength = self.options.items.length;
|
self.listLength = self.options.items.length;
|
||||||
|
@ -839,7 +841,13 @@ Ox.List = function(options, self) {
|
||||||
} else if (self.selected.length > 1) {
|
} else if (self.selected.length > 1) {
|
||||||
// this could be the first click
|
// this could be the first click
|
||||||
// of a double click on multiple items
|
// of a double click on multiple items
|
||||||
|
// or the mousedown of a drag of multiple items
|
||||||
selectTimeout = true;
|
selectTimeout = true;
|
||||||
|
that.$content.one({
|
||||||
|
mousemove: function() {
|
||||||
|
self.clickTimeout && clearTimeout(self.clickTimeout);
|
||||||
|
}
|
||||||
|
});
|
||||||
} else if (self.options.type == 'text' && hadFocus) {
|
} else if (self.options.type == 'text' && hadFocus) {
|
||||||
var $cell = findCell(e),
|
var $cell = findCell(e),
|
||||||
$element = $cell || self.$items[pos];
|
$element = $cell || self.$items[pos];
|
||||||
|
|
|
@ -48,6 +48,7 @@ Ox.TextList = function(options, self) {
|
||||||
columnsResizable: false,
|
columnsResizable: false,
|
||||||
columnsVisible: false,
|
columnsVisible: false,
|
||||||
columnWidth: [40, 800],
|
columnWidth: [40, 800],
|
||||||
|
droppable: null,
|
||||||
id: '',
|
id: '',
|
||||||
items: null, // function() {} {sort, range, keys, callback} or array
|
items: null, // function() {} {sort, range, keys, callback} or array
|
||||||
max: -1,
|
max: -1,
|
||||||
|
@ -380,7 +381,7 @@ Ox.TextList = function(options, self) {
|
||||||
|
|
||||||
function constructItem(data) {
|
function constructItem(data) {
|
||||||
var $item = $('<div>')
|
var $item = $('<div>')
|
||||||
.addClass('OxTarget')
|
.addClass('OxTarget' + (data.droppable ? ' OxDroppable' : ''))
|
||||||
.css({
|
.css({
|
||||||
width: getItemWidth(true) + 'px'
|
width: getItemWidth(true) + 'px'
|
||||||
});
|
});
|
||||||
|
@ -516,7 +517,7 @@ Ox.TextList = function(options, self) {
|
||||||
}
|
}
|
||||||
|
|
||||||
function getCell(id, key) {
|
function getCell(id, key) {
|
||||||
Ox.print('getCell', id, key)
|
//Ox.print('getCell', id, key)
|
||||||
var $item = getItem(id);
|
var $item = getItem(id);
|
||||||
key = key || '';
|
key = key || '';
|
||||||
return $($item.find('.OxCell.OxColumn' + Ox.toTitleCase(key))[0]);
|
return $($item.find('.OxCell.OxColumn' + Ox.toTitleCase(key))[0]);
|
||||||
|
@ -847,7 +848,7 @@ Ox.TextList = function(options, self) {
|
||||||
|
|
||||||
that.value = function(id, key, value) {
|
that.value = function(id, key, value) {
|
||||||
// fixme: make this accept id, {k: v, ...}
|
// fixme: make this accept id, {k: v, ...}
|
||||||
Ox.print('value', id, key, value)
|
//Ox.print('value', id, key, value)
|
||||||
var $item = getItem(id),
|
var $item = getItem(id),
|
||||||
$cell = getCell(id, key),
|
$cell = getCell(id, key),
|
||||||
column = self.options.columns[getColumnIndexById(key)];
|
column = self.options.columns[getColumnIndexById(key)];
|
||||||
|
|
|
@ -63,8 +63,8 @@ Ox.VideoPanelPlayer = function(options, self) {
|
||||||
});
|
});
|
||||||
|
|
||||||
self.$video = Ox.VideoPlayer({
|
self.$video = Ox.VideoPlayer({
|
||||||
controlsTop: ['fullscreen', 'scale', 'title', 'find'],
|
controlsTop: ['fullscreen', 'title', 'find'],
|
||||||
controlsBottom: ['play', 'volume', 'timeline', 'position', 'resolution'],
|
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'position', 'resolution'],
|
||||||
enableFind: true,
|
enableFind: true,
|
||||||
enableKeyboard: true,
|
enableKeyboard: true,
|
||||||
enableMouse: true,
|
enableMouse: true,
|
||||||
|
|
|
@ -14,7 +14,7 @@ Ox.Tooltip = function(options, self) {
|
||||||
self = self || {};
|
self = self || {};
|
||||||
var that = Ox.Element({}, self)
|
var that = Ox.Element({}, self)
|
||||||
.defaults({
|
.defaults({
|
||||||
animate: true,
|
animate: true, // fixme: shouldn't booleans be false by default?
|
||||||
title: ''
|
title: ''
|
||||||
})
|
})
|
||||||
.options(options || {})
|
.options(options || {})
|
||||||
|
|
|
@ -295,6 +295,20 @@ Lists
|
||||||
.OxThemeModern .OxTextList .OxFocus .OxItem.OxSelected:nth-child(even) {
|
.OxThemeModern .OxTextList .OxFocus .OxItem.OxSelected:nth-child(even) {
|
||||||
background: rgb(66, 66, 66);
|
background: rgb(66, 66, 66);
|
||||||
}
|
}
|
||||||
|
.OxThemeModern .OxTextList .OxItem.OxDrop:nth-child(odd) .OxCell {
|
||||||
|
background: rgb(78, 78, 78);
|
||||||
|
}
|
||||||
|
.OxThemeModern .OxTextList .OxItem.OxDrop:nth-child(even) .OxCell {
|
||||||
|
background: rgb(82, 82, 82);
|
||||||
|
}
|
||||||
|
.OxThemeModern .OxTextList .OxItem.OxDragover:nth-child(odd) .OxCell {
|
||||||
|
background: rgb(94, 94, 94);
|
||||||
|
}
|
||||||
|
.OxThemeModern .OxTextList .OxItem.OxDragover:nth-child(even) .OxCell {
|
||||||
|
background: rgb(98, 98, 98);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
.OxThemeModern .OxTextList .OxBar .OxSelected {
|
.OxThemeModern .OxTextList .OxBar .OxSelected {
|
||||||
background: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48));
|
background: -moz-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48));
|
||||||
background: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48));
|
background: -webkit-linear-gradient(top, rgb(80, 80, 80), rgb(48, 48, 48));
|
||||||
|
|
|
@ -425,6 +425,7 @@ Ox.find <f> Returns array elements that match a string
|
||||||
> Ox.find(['foo', 'bar', 'foobar', 'barfoo'], 'foo')
|
> Ox.find(['foo', 'bar', 'foobar', 'barfoo'], 'foo')
|
||||||
[['foo', 'foobar'], ['barfoo']]
|
[['foo', 'foobar'], ['barfoo']]
|
||||||
@*/
|
@*/
|
||||||
|
// fixme: wouldn't it make more sense to return just one array?
|
||||||
Ox.find = function(arr, str) {
|
Ox.find = function(arr, str) {
|
||||||
var ret = [[], []];
|
var ret = [[], []];
|
||||||
str = str.toLowerCase();
|
str = str.toLowerCase();
|
||||||
|
@ -4006,6 +4007,7 @@ Ox.loadFile <f> Loads a file (image, script or stylesheet)
|
||||||
Ox.loadFile = (function() {
|
Ox.loadFile = (function() {
|
||||||
// fixme: this doesn't handle errors yet
|
// fixme: this doesn't handle errors yet
|
||||||
// fixme: rename to getFile?
|
// fixme: rename to getFile?
|
||||||
|
// fixme: what about array of files?
|
||||||
var cache = {};
|
var cache = {};
|
||||||
return function (file, callback) {
|
return function (file, callback) {
|
||||||
var element,
|
var element,
|
||||||
|
|
Loading…
Reference in a new issue