changes to dialogs, events, forms
This commit is contained in:
parent
3d136c4657
commit
d1dee61a5f
5 changed files with 256 additions and 162 deletions
|
@ -116,6 +116,9 @@ Forms
|
|||
.OxThemeClassic .OxButton.OxTab.OxSelected {
|
||||
border-bottom: 1px solid rgb(192, 192, 192);
|
||||
}
|
||||
.OxThemeClassic .OxFormMessage {
|
||||
color: rgb(192, 64, 64);
|
||||
}
|
||||
|
||||
.OxThemeClassic .OxButton.OxDisabled,
|
||||
.OxThemeClassic .OxLabel.OxDisabled {
|
||||
|
|
|
@ -466,7 +466,7 @@ OxPicker
|
|||
*/
|
||||
.OxPicker {
|
||||
position: absolute;
|
||||
z-index: 11;
|
||||
z-index: 13;
|
||||
-moz-border-radius: 0 8px 8px 8px;
|
||||
-webkit-border-radius: 0 8px 8px 8px;
|
||||
-moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.75);
|
||||
|
@ -655,7 +655,17 @@ Layers
|
|||
top: 20px;
|
||||
bottom: 0px;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
z-index: 12;
|
||||
}
|
||||
.OxMenuLayer {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
opacity: 0;
|
||||
overflow: hidden;
|
||||
z-index: 12;
|
||||
}
|
||||
|
||||
/*
|
||||
|
@ -948,7 +958,7 @@ Menus
|
|||
.OxMenu {
|
||||
position: absolute;
|
||||
display: none;
|
||||
z-index: 11;
|
||||
z-index: 12;
|
||||
-moz-border-radius-bottomleft: 4px;
|
||||
-moz-border-radius-bottomright: 4px;
|
||||
-webkit-border-bottom-left-radius: 4px;
|
||||
|
@ -1396,7 +1406,11 @@ Miscellaneous
|
|||
================================================================================
|
||||
*/
|
||||
|
||||
.OxThemeModern .OxTooltip {
|
||||
.OxText {
|
||||
//line-height: 15px;
|
||||
}
|
||||
|
||||
.OxTooltip {
|
||||
position: absolute;
|
||||
padding: 1px 2px 1px 2px;
|
||||
font-size: 9px;
|
||||
|
|
|
@ -1618,6 +1618,10 @@ Ox.highlight = function(txt, str) {
|
|||
new RegExp('(' + str + ')', 'ig'),
|
||||
'<span class="OxHighlight">$1</span>'
|
||||
) : txt;
|
||||
};
|
||||
|
||||
Ox.isValidEmail = function(str) {
|
||||
return !!/^[0-9A-Z\.\+\-_]+@(?:[0-9A-Z\-]+\.)+[A-Z]{2,6}$/i(str);
|
||||
}
|
||||
|
||||
Ox.pad = function(str, len, pad, pos) {
|
||||
|
|
|
@ -100,14 +100,13 @@ requires
|
|||
white_star: '\u2606'
|
||||
}
|
||||
},
|
||||
$elements = {},
|
||||
$window, $document, $body;
|
||||
|
||||
$(function() {
|
||||
// fixme: don't use globals!
|
||||
$window = $(window),
|
||||
$document = $(document),
|
||||
$body = $('body'),
|
||||
$elements = {};
|
||||
Ox.theme(oxui.defaultTheme);
|
||||
});
|
||||
|
||||
|
@ -276,29 +275,34 @@ requires
|
|||
/**
|
||||
Ox.Event event object
|
||||
*/
|
||||
/*
|
||||
Ox.Event = function() {
|
||||
var $eventHandler = $('<div>'),
|
||||
events = {};
|
||||
function addEvent(id, type, event, callback) {
|
||||
events[id] = events[id] || {};
|
||||
events[id][type] = events[id][type] || {};
|
||||
events[id][type][event] = events[id][type][event] || [];
|
||||
events[id][type][event].push(callback);
|
||||
if (type == 'normal' || Ox.Focus.focused() == id) {
|
||||
function bindEvent(id, event, callback) {
|
||||
Ox.print('bind', id, event);
|
||||
$eventHandler.bind(event + (id ? '_' + id : ''), callback); // requestStart/requestStop currently have '' as id
|
||||
events[id] = events[id] || {};
|
||||
events[id][event] = events[id][event] || [];
|
||||
if ($.map(events[id][event], function(fn) {
|
||||
return fn.toString();
|
||||
}).indexOf(callback.toString()) == -1) {
|
||||
events[id][event].push(callback);
|
||||
if (!isKeyboardEvent(event) || Ox.Focus.focused() == id) {
|
||||
$eventHandler.bind(event + '_' + id, callback); // requestStart/requestStop currently have '' as id
|
||||
}
|
||||
}
|
||||
function removeEvent(id, type, event, callback) {
|
||||
var focused = type == 'normal' || Ox.Focus.focused() == id,
|
||||
toString = (callback || '').toString();
|
||||
Ox.print('removeEvent', id, type, event/*, callback*/);
|
||||
if (events[id] && events[id][type] && (!event || events[id][type][event])) {
|
||||
$.each(events[id][type], function(e, fns) {
|
||||
}
|
||||
function unbindEvent(id, event, callback) {
|
||||
Ox.print('unbind', id, event);
|
||||
var toString = (callback || '').toString(),
|
||||
unbind = !event || (event && !isKeyboardEvent(event)) || Ox.Focus.focused() == id;
|
||||
if (events[id] && (!event || events[id][event])) {
|
||||
$.each(events[id], function(e, fns) {
|
||||
if (!event || event == e) {
|
||||
events[id][type][e] = $.map(events[id][type][e], function(fn, i) {
|
||||
events[id][e] = $.map(events[id][e], function(fn, i) {
|
||||
if (!callback || toString == fn.toString()) {
|
||||
focused && $eventHandler.unbind(e + '_' + id, fn);
|
||||
Ox.print(unbind, 'eventHandler.unbind', e, id)
|
||||
unbind && $eventHandler.unbind(e + '_' + id, fn);
|
||||
return null;
|
||||
} else {
|
||||
return fn;
|
||||
|
@ -306,32 +310,25 @@ requires
|
|||
});
|
||||
}
|
||||
});
|
||||
Ox.print(id, type, events)
|
||||
if (!callback || (event && events[id][type][event].length == 0)) {
|
||||
delete events[id][type][event];
|
||||
Ox.print('id/events', id, events, events[id])
|
||||
if (!callback || (event && events[id][event].length == 0)) {
|
||||
delete events[id][event];
|
||||
}
|
||||
if (!event || Ox.length(events[id].normal) == 0) {
|
||||
delete events[id][type];
|
||||
}
|
||||
if (Ox.length(events[id]) == 0) {
|
||||
if (!event || Ox.length(events[id]) == 0) {
|
||||
delete events[id];
|
||||
}
|
||||
}
|
||||
}
|
||||
function isKeyboardEvent(event) { // fixme: currently unused
|
||||
function isKeyboardEvent(event) {
|
||||
return event.substr(0, 4) == 'key_';
|
||||
}
|
||||
return {
|
||||
_print: function() {
|
||||
Ox.print(events);
|
||||
},
|
||||
add: function(id, event, callback) {
|
||||
// add keyboard event
|
||||
addEvent(id, 'keyboard', event, callback);
|
||||
},
|
||||
bind: function(id, event, callback) {
|
||||
// bind event
|
||||
addEvent(id, 'normal', event, callback);
|
||||
bindEvent(id, event, callback);
|
||||
},
|
||||
bindKeyboard: function(id) {
|
||||
// bind all keyboard events
|
||||
|
@ -339,37 +336,42 @@ requires
|
|||
$.each(events[id], function(k, v) {
|
||||
Ox.print('|' + k + '|');
|
||||
})
|
||||
events[id] && events[id].keyboard && $.each(events[id].keyboard, function(event, callbacks) {
|
||||
$.each(callbacks, function(i, callback) {
|
||||
events[id] && $.each(events[id], function(event, callbacks) {
|
||||
Ox.print('BIND ID EVENT', id, event)
|
||||
isKeyboardEvent(event) && $.each(callbacks, function(i, callback) {
|
||||
Ox.print('bind', id, event);
|
||||
$eventHandler.bind(event, callback);
|
||||
});
|
||||
});
|
||||
},
|
||||
changeId: function(oldId, newId) {
|
||||
// fixme: would it be better to pass that.id instead of self.options.id?
|
||||
// then this renaming wouldn't be necessary
|
||||
// we need to reference events by options('id'),
|
||||
// not by that.id, since textlist events fire on list,
|
||||
// new lists have new that.ids, etc.
|
||||
// so this renaming is necessary
|
||||
Ox.print('changeId', oldId, newId, events[oldId]);
|
||||
$.each($.extend({}, events[oldId] || {}), function(type, events_) {
|
||||
var bind = type == 'normal' ? 'bind' : 'add',
|
||||
unbind = type == 'normal' ? 'unbind' : 'remove';
|
||||
$.each(events_, function(event, callbacks) {
|
||||
$.each($.extend({}, events[oldId] || {}), function(event, callbacks) {
|
||||
$.each(callbacks, function(i, callback) {
|
||||
Ox.Event[unbind](oldId, event, callback);
|
||||
Ox.Event[bind](newId, event, callback);
|
||||
Ox.Event.unbind(oldId, event, callback);
|
||||
Ox.Event.bind(newId, event, callback);
|
||||
});
|
||||
});
|
||||
});
|
||||
},
|
||||
remove: function(id, event, callback) {
|
||||
// remove keyboard event
|
||||
// event and callback are optional
|
||||
removeEvent(id, 'keyboard', event, callback);
|
||||
},
|
||||
unbind: function(id, event, callback) {
|
||||
// unbind event
|
||||
// event and callback are optional
|
||||
removeEvent(id, 'normal', event, callback);
|
||||
unbindEvent(id, event, callback);
|
||||
},
|
||||
unbindAll: function() {
|
||||
Ox.print('beginUnbindAll')
|
||||
$.each(events, function(id, eventsById) {
|
||||
$.each(eventsById, function(event, callbacks) {
|
||||
$.each(callbacks, function(i, callback) {
|
||||
Ox.Event.unbind(id, event, callback);
|
||||
});
|
||||
});
|
||||
});
|
||||
Ox.print('endUnbindAll')
|
||||
},
|
||||
trigger: function(id, event, data) {
|
||||
// trigger event
|
||||
|
@ -380,9 +382,10 @@ requires
|
|||
},
|
||||
unbindKeyboard: function(id) {
|
||||
// unbind all keyboard events
|
||||
Ox.print('unbinding', id /*events[id].keyboard*/)
|
||||
events[id] && events[id].keyboard && $.each(events[id].keyboard, function(event, callbacks) {
|
||||
$.each(callbacks, function(i, callback) {
|
||||
Ox.print('unbinding', id)
|
||||
events[id] && $.each(events[id], function(event, callbacks) {
|
||||
Ox.print('UNBIND ID EVENT', id, event)
|
||||
isKeyboardEvent(event) && $.each(callbacks, function(i, callback) {
|
||||
Ox.print('unbind', event)
|
||||
$eventHandler.unbind(event, callback);
|
||||
});
|
||||
|
@ -390,6 +393,7 @@ requires
|
|||
}
|
||||
}
|
||||
}();
|
||||
*/
|
||||
|
||||
/**
|
||||
Ox.Focus
|
||||
|
@ -398,13 +402,17 @@ requires
|
|||
Ox.Focus = function() {
|
||||
var stack = [];
|
||||
return {
|
||||
_print: function() {
|
||||
Ox.print(stack);
|
||||
},
|
||||
blur: function(id) {
|
||||
Ox.print('BLUR', id, stack)
|
||||
var index = stack.indexOf(id);
|
||||
if (index == stack.length - 1) {
|
||||
stack.length == 1 ? stack.pop() :
|
||||
stack.splice(stack.length - 2, 0, stack.pop());
|
||||
Ox.Event.unbindKeyboard($elements[id].options('id'));
|
||||
stack.length && Ox.Event.bindKeyboard($elements[stack[stack.length - 1]].options('id'));
|
||||
// fix later: Ox.Event.unbindKeyboard($elements[id].options('id'));
|
||||
// fix later: stack.length && Ox.Event.bindKeyboard($elements[stack[stack.length - 1]].options('id'));
|
||||
//$elements[id].removeClass('OxFocus');
|
||||
$('.OxFocus').removeClass('OxFocus'); // fixme: the above is better, and should work
|
||||
stack.length && $elements[stack[stack.length - 1]].addClass('OxFocus');
|
||||
|
@ -414,10 +422,10 @@ requires
|
|||
focus: function(id) {
|
||||
var index = stack.indexOf(id);
|
||||
if (index == -1 || index < stack.length - 1) {
|
||||
stack.length && Ox.Event.unbindKeyboard($elements[stack[stack.length - 1]].options('id'));
|
||||
// fix later: stack.length && Ox.Event.unbindKeyboard($elements[stack[stack.length - 1]].options('id'));
|
||||
index > -1 && stack.splice(index, 1);
|
||||
stack.push(id);
|
||||
Ox.Event.bindKeyboard($elements[id].options('id'));
|
||||
// fix later: Ox.Event.bindKeyboard($elements[id].options('id'));
|
||||
$('.OxFocus').removeClass('OxFocus'); // fixme: see above
|
||||
$elements[id].addClass('OxFocus');
|
||||
Ox.print('focus', id, stack);
|
||||
|
@ -612,7 +620,7 @@ requires
|
|||
buffer += key == 'SPACE' ? ' ' : key;
|
||||
bufferTime = time;
|
||||
}
|
||||
Ox.Event.trigger('', 'key_' + key);
|
||||
$elements[Ox.Focus.focused()].trigger('ox_key_' + key);
|
||||
//return false;
|
||||
/*
|
||||
$.each(stack, function(i, v) {
|
||||
|
@ -634,9 +642,6 @@ requires
|
|||
*/
|
||||
Ox.Request = function() {
|
||||
|
||||
// fixme: do we want, instead of request('find', data, callback),
|
||||
// something like api.find(data, callback)?
|
||||
|
||||
var cache = {},
|
||||
pending = {},
|
||||
requests = {},
|
||||
|
@ -692,7 +697,7 @@ requires
|
|||
|
||||
function callback(data) {
|
||||
delete requests[options.id];
|
||||
Ox.length(requests) == 0 && Ox.Event.trigger('', 'requestStop');
|
||||
Ox.length(requests) == 0 && $body.trigger('requestStop');
|
||||
options.callback(data); // fixme: doesn't work if callback hasn't been passed
|
||||
}
|
||||
|
||||
|
@ -709,7 +714,9 @@ requires
|
|||
title: 'Close'
|
||||
})
|
||||
.bindEvent({
|
||||
click: $dialog.close
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
content: $iframe,
|
||||
|
@ -733,8 +740,8 @@ requires
|
|||
} catch (err) {
|
||||
data = {
|
||||
status: {
|
||||
code: request.status,
|
||||
text: request.statusText
|
||||
code: request ? request.status : '0',
|
||||
text: request ? request.statusText : 'Unknown Error'
|
||||
}
|
||||
};
|
||||
}
|
||||
|
@ -813,7 +820,7 @@ requires
|
|||
url: options.url
|
||||
});
|
||||
Ox.print('request', options.data, Ox.length(requests));
|
||||
Ox.length(requests) == 1 && Ox.Event.trigger('', 'requestStart');
|
||||
Ox.length(requests) == 1 && $body.trigger('requestStart');
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -965,21 +972,6 @@ requires
|
|||
|
||||
// public
|
||||
|
||||
that.addEvent = function() {
|
||||
/*
|
||||
adds a keyboard event, to be bound when focused
|
||||
addEvent(event, fn) or addEvent({event0: fn0, event1: fn1, ...})
|
||||
*/
|
||||
if (arguments.length == 1) {
|
||||
$.each(arguments[0], function(event, fn) {
|
||||
Ox.Event.add(self.options.id, event, fn);
|
||||
});
|
||||
} else {
|
||||
Ox.Event.add(self.options.id, arguments[0], arguments[1]);
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
||||
that.bindEvent = function() {
|
||||
/*
|
||||
binds a function to an event triggered by this object
|
||||
|
@ -987,10 +979,12 @@ requires
|
|||
*/
|
||||
if (arguments.length == 1) {
|
||||
$.each(arguments[0], function(event, fn) {
|
||||
Ox.Event.bind(self.options.id, event, fn);
|
||||
Ox.print(that.id, 'bind', event);
|
||||
that.bind('ox_' + event, fn);
|
||||
});
|
||||
} else {
|
||||
Ox.Event.bind(self.options.id, arguments[0], arguments[1]);
|
||||
Ox.print(that.id, 'bind', arguments[0]);
|
||||
that.bind('ox_' + arguments[0], arguments[1]);
|
||||
}
|
||||
return that;
|
||||
}
|
||||
|
@ -1048,7 +1042,7 @@ requires
|
|||
// otherwise, extend options
|
||||
self.options = $.extend(self.options || self.defaults, args);
|
||||
$.each(args, function(key, value) {
|
||||
key == 'id' && id && Ox.Event.changeId(id, value);
|
||||
// key == 'id' && id && Ox.Event.changeId(id, value);
|
||||
value !== oldOptions[key] && self.onChange(key, value);
|
||||
/*
|
||||
fixme: why does this not work?
|
||||
|
@ -1068,31 +1062,31 @@ requires
|
|||
};
|
||||
|
||||
that.remove = function() {
|
||||
if (self.options && self.options.id) {
|
||||
Ox.Event.remove(self.options.id);
|
||||
Ox.Event.unbind(self.options.id);
|
||||
}
|
||||
//self.options && Ox.Event.unbind(self.options.id); // there are optionless elements, like the dialog layer
|
||||
//that.loseFocus();
|
||||
that.$element.remove();
|
||||
delete $elements[that.ox];
|
||||
return that;
|
||||
};
|
||||
|
||||
that.removeEvent = function() {
|
||||
that.triggerEvent = function() {
|
||||
/*
|
||||
removes a keyboard event
|
||||
removeEvent(event, fn) or removeEvent({event0: fn0, event1: fn1, ...})
|
||||
triggers an event
|
||||
triggerEvent(event) or triggerEvent(event, data) or triggerEvent({event0: data, event1: data, ...})
|
||||
*/
|
||||
if (arguments.length == 1) {
|
||||
$.each(arguments[0], function(event, fn) {
|
||||
Ox.Event.remove(self.options.id, event, fn);
|
||||
if (Ox.isObject(arguments[0])) {
|
||||
$.each(arguments[0], function(event, data) {
|
||||
Ox.print(that.id, 'trigger', event, data);
|
||||
that.trigger('ox_' + event, data);
|
||||
});
|
||||
} else {
|
||||
Ox.Event.remove(self.options.id, arguments[0], arguments[1]);
|
||||
Ox.print(that.id, 'trigger', arguments[0], arguments[1] || {});
|
||||
that.trigger('ox_' + arguments[0], arguments[1] || {});
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
||||
that.triggerEvent = function() {
|
||||
that.triggerEvent_ = function() {
|
||||
/*
|
||||
triggers an event
|
||||
triggerEvent(event) or triggerEvent(event, data) or triggerEvent({event0: data, event1: data, ...})
|
||||
|
@ -1108,6 +1102,23 @@ requires
|
|||
};
|
||||
|
||||
that.unbindEvent = function() {
|
||||
/*
|
||||
unbinds an event
|
||||
unbindEvent(event, fn) or unbindEvent({event0: fn0, event1: fn1, ...})
|
||||
*/
|
||||
if (arguments.length == 1) {
|
||||
$.each(arguments[0], function(event, fn) {
|
||||
Ox.print(that.id, 'unbind', arguments[0]);
|
||||
that.unbind('ox_' + event, fn);
|
||||
});
|
||||
} else {
|
||||
Ox.print(that.id, 'unbind', arguments[0]);
|
||||
that.unbind('ox_' + arguments[0], arguments[1]);
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
||||
that.unbindEvent_ = function() {
|
||||
/*
|
||||
unbinds an event
|
||||
unbindEvent(event, fn) or unbindEvent({event0: fn0, event1: fn1, ...})
|
||||
|
@ -1442,8 +1453,8 @@ requires
|
|||
clientXY: self.options.orientation == 'horizontal' ? 'clientY' : 'clientX',
|
||||
dimensions: oxui.getDimensions(self.options.orientation), // fixme: should orientation be the opposite orientation here?
|
||||
edges: oxui.getEdges(self.options.orientation),
|
||||
ids: $.map(self.options.elements, function(v, i) {
|
||||
return v.options('id');
|
||||
ids: $.map(self.options.elements, function(element) {
|
||||
return element.options('id');
|
||||
}),
|
||||
leftOrTop: self.options.edge == 'left' || self.options.edge == 'top',
|
||||
startPos: 0,
|
||||
|
@ -1578,6 +1589,7 @@ requires
|
|||
buttons: [],
|
||||
content: null,
|
||||
height: 216,
|
||||
keys: {},
|
||||
minHeight: 144,
|
||||
minWidth: 256,
|
||||
movable: true,
|
||||
|
@ -1587,9 +1599,13 @@ requires
|
|||
})
|
||||
.options(options || {})
|
||||
.addClass('OxDialog')
|
||||
.addEvent({
|
||||
.bindEvent({
|
||||
key_enter: function() {
|
||||
keypress('enter');
|
||||
},
|
||||
key_escape: function() {
|
||||
that.close();
|
||||
Ox.print('KEY ESCAPE')
|
||||
keypress('escape');
|
||||
}
|
||||
});
|
||||
|
||||
|
@ -1627,7 +1643,7 @@ requires
|
|||
.appendTo(that);
|
||||
loadButtons();
|
||||
|
||||
that.$buttons[0].focus();
|
||||
//that.$buttons[0].focus();
|
||||
|
||||
that.$layer = new Ox.Element() // fixme: Layer widget that would handle click?
|
||||
.addClass('OxLayer')
|
||||
|
@ -1677,7 +1693,8 @@ requires
|
|||
}
|
||||
|
||||
function getButtonById(id) {
|
||||
var ret = null
|
||||
var ret = null;
|
||||
Ox.print('that.$buttons', that.$buttons, id)
|
||||
$.each(that.$buttons, function(i, button) {
|
||||
if (button.options('id') == id) {
|
||||
ret = button;
|
||||
|
@ -1687,13 +1704,22 @@ requires
|
|||
return ret;
|
||||
}
|
||||
|
||||
function keypress(key) {
|
||||
var id = self.options.keys[key];
|
||||
Ox.print('X', key, self.options.keys)
|
||||
id && getButtonById(id).$element.trigger('click');
|
||||
}
|
||||
|
||||
function loadButtons() {
|
||||
Ox.print('loadButtons', $.map(self.options.buttons, function(v) {
|
||||
return v;
|
||||
}));
|
||||
if (that.$buttons) {
|
||||
that.$buttons.forEach(function($button) {
|
||||
$button.remove();
|
||||
});
|
||||
that.$resize.remove();
|
||||
//that.$buttonsbar.empty();
|
||||
// that.$buttonsbar.empty();
|
||||
}
|
||||
that.$buttons = [];
|
||||
if (!Ox.isArray(self.options.buttons[0])) {
|
||||
|
@ -1828,8 +1854,12 @@ requires
|
|||
that.animate({
|
||||
opacity: 0
|
||||
}, 200, function() {
|
||||
that.remove();
|
||||
that.$buttons.forEach(function($button) {
|
||||
$button.remove();
|
||||
});
|
||||
that.loseFocus();
|
||||
that.$layer.remove();
|
||||
that.remove();
|
||||
callback();
|
||||
});
|
||||
$window.unbind('mouseup', mouseupLayer)
|
||||
|
@ -1867,6 +1897,7 @@ requires
|
|||
};
|
||||
|
||||
that.open = function() {
|
||||
Ox.print('before open')
|
||||
that.$layer.appendTo($body);
|
||||
that.css({
|
||||
opacity: 0
|
||||
|
@ -1875,9 +1906,10 @@ requires
|
|||
}, 200);
|
||||
center();
|
||||
reset();
|
||||
// fixme: reenable, but implement preview-style dialog
|
||||
//that.gainFocus();
|
||||
// fixme: the following line prevents preview-style dialog
|
||||
that.gainFocus();
|
||||
$window.bind('mouseup', mouseupLayer)
|
||||
Ox.print('after open')
|
||||
return that;
|
||||
};
|
||||
|
||||
|
@ -1948,15 +1980,12 @@ requires
|
|||
});
|
||||
|
||||
// fixme: form isn't necessarily empty/invalid
|
||||
$.map(self.options.items, function(item, i) {
|
||||
self.itemIds[i] = item.id || item.element.options('id');
|
||||
self.itemIsValid[i] = false;
|
||||
});
|
||||
|
||||
$.each(self.options.items, function(i, item) {
|
||||
that.append(self.$items[i] = new Ox.FormItem(item))
|
||||
self.itemIds[i] = item.options('id') || item.id;
|
||||
self.itemIsValid[i] = !!item.value().length;
|
||||
that.append(self.$items[i] = new Ox.FormItem({element: item}))
|
||||
.append(self.$messages[i] = new Ox.Element().addClass('OxFormMessage'));
|
||||
item.element.bindEvent({
|
||||
item.bindEvent({
|
||||
/*
|
||||
blur: function(event, data) {
|
||||
validate(i, data.valid);
|
||||
|
@ -1967,6 +1996,15 @@ requires
|
|||
}
|
||||
},
|
||||
*/
|
||||
autovalidate: function(event, data) {
|
||||
data.valid = !!data.value.length;
|
||||
validate(i, data.valid);
|
||||
if (data.valid) {
|
||||
self.$messages[i].html('').hide();
|
||||
} else {
|
||||
//self.$messages[i].html(data.message).show();
|
||||
}
|
||||
},
|
||||
submit: function(event, data) {
|
||||
self.formIsValid && that.submit();
|
||||
},
|
||||
|
@ -1996,7 +2034,7 @@ requires
|
|||
}
|
||||
|
||||
function validate(pos, valid) {
|
||||
Ox.print('validate', pos, valid)
|
||||
Ox.print('FORM validate', pos, valid)
|
||||
self.itemIsValid[pos] = valid;
|
||||
if (Ox.every(self.itemIsValid) != self.formIsValid) {
|
||||
self.formIsValid = !self.formIsValid;
|
||||
|
@ -2022,6 +2060,7 @@ requires
|
|||
$.each(self.$items, function(i, $item) {
|
||||
values[self.itemIds[i]] = self.$items[i].value();
|
||||
});
|
||||
Ox.print('VALUES', values)
|
||||
return values;
|
||||
} else {
|
||||
$.each(arguments[0], function(key, value) {
|
||||
|
@ -2129,6 +2168,7 @@ requires
|
|||
}
|
||||
|
||||
function click() {
|
||||
if (!self.options.disabled) {
|
||||
var data = self.titles[self.selectedTitle];
|
||||
if (!self.options.selectable) {
|
||||
that.triggerEvent('click', data);
|
||||
|
@ -2143,6 +2183,7 @@ requires
|
|||
that.toggleTitle();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function mousedown(event) {
|
||||
if (self.options.type == 'image' && $.browser.safari) {
|
||||
|
@ -2376,6 +2417,10 @@ requires
|
|||
}
|
||||
};
|
||||
|
||||
that.checked = function() {
|
||||
return self.options.checked;
|
||||
}
|
||||
|
||||
that.toggleChecked = function() {
|
||||
self.$button.toggleTitle();
|
||||
return that;
|
||||
|
@ -2539,7 +2584,7 @@ requires
|
|||
})
|
||||
.options(options)
|
||||
.addClass('OxInput OxMedium')
|
||||
.addEvent($.extend(self.options.type == 'textarea' ? {} : {
|
||||
.bindEvent($.extend(self.options.type == 'textarea' ? {} : {
|
||||
key_enter: submit
|
||||
}, {
|
||||
key_escape: cancel
|
||||
|
@ -2803,16 +2848,13 @@ requires
|
|||
|
||||
function autovalidateFunction(value) {
|
||||
var regexp = new RegExp(self.options.autovalidate);
|
||||
return $.map(value.toLowerCase().split(''), function(v, i) {
|
||||
if (regexp(v)) {
|
||||
return v;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
return $.map(value.split(''), function(v) {
|
||||
return regexp(v) ? v : null;
|
||||
}).join('');
|
||||
}
|
||||
|
||||
function autovalidateTypeFunction(type, value) {
|
||||
// fixme: remove trailing zeroes on blur
|
||||
var cursor,
|
||||
regexp = type == 'float' ? /[\d\.]/ : /\d/;
|
||||
if (type == 'float') {
|
||||
|
@ -2825,6 +2867,9 @@ requires
|
|||
}
|
||||
self.autovalidateFloatFlag = false;
|
||||
}
|
||||
while (value[0] == '0' && value[1] != '.') {
|
||||
value = value.substr(1);
|
||||
}
|
||||
while (Ox.startsWith(value, '.')) {
|
||||
if (Ox.startsWith(value, '..')) {
|
||||
value = value.substr(1);
|
||||
|
@ -2839,12 +2884,8 @@ requires
|
|||
}
|
||||
}
|
||||
}
|
||||
value = $.map(value.split(''), function(v, i) {
|
||||
if (regexp(v)) {
|
||||
return v;
|
||||
} else {
|
||||
return null;
|
||||
}
|
||||
value = $.map(value.split(''), function(v) {
|
||||
return regexp(v) ? v : null;
|
||||
}).join('');
|
||||
if (type == 'integer') {
|
||||
while (value.length > 1 && Ox.startsWith(value, '0')) {
|
||||
|
@ -2949,7 +2990,7 @@ requires
|
|||
parseFloat(self.options.value) + (i == 0 ? -1 : 1) * self.options.arrowStep,
|
||||
self.options.min,
|
||||
self.options.max
|
||||
);
|
||||
).toString();
|
||||
self.$input.val(self.options.value);//.focus();
|
||||
}
|
||||
|
||||
|
@ -3216,7 +3257,8 @@ requires
|
|||
})
|
||||
.bindEvent({
|
||||
change: change,
|
||||
submit: change
|
||||
submit: change,
|
||||
validate: validate
|
||||
})
|
||||
.appendTo(that);
|
||||
});
|
||||
|
@ -3255,6 +3297,11 @@ requires
|
|||
});
|
||||
}
|
||||
|
||||
function validate(event, data) {
|
||||
Ox.print('INPUTGROUP TRIGGER VALIDATE')
|
||||
that.triggerEvent('validate', data);
|
||||
}
|
||||
|
||||
// fixme: is this used?
|
||||
that.getInputById = function(id) {
|
||||
var input = null;
|
||||
|
@ -3268,6 +3315,16 @@ requires
|
|||
return input;
|
||||
};
|
||||
|
||||
that.value = function() {
|
||||
return $.map(self.options.inputs, function(input) {
|
||||
var ret = null;
|
||||
['checked', 'selected', 'value'].forEach(function(v) {
|
||||
input[v] && (ret = input[v]());
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
@ -4205,7 +4262,7 @@ requires
|
|||
.css(self.options.width == 'auto' ? {} : {
|
||||
width: self.options.width + 'px'
|
||||
})
|
||||
.addEvent({
|
||||
.bindEvent({
|
||||
key_escape: loseFocus,
|
||||
key_down: showMenu
|
||||
});
|
||||
|
@ -4268,7 +4325,7 @@ requires
|
|||
});
|
||||
|
||||
function clickMenu(event, data) {
|
||||
|
||||
Ox.print('%% clickMenu')
|
||||
}
|
||||
|
||||
function changeMenu(event, data) {
|
||||
|
@ -4284,8 +4341,11 @@ requires
|
|||
}
|
||||
|
||||
function hideMenu() {
|
||||
Ox.print('%% hideMenu that', that, 'self', self)
|
||||
that.removeClass('OxSelected');
|
||||
self.$button.removeClass('OxSelected');
|
||||
self.$button.remove();
|
||||
// self.$button.removeClass('OxSelected');
|
||||
Ox.print('%% hideMenu end')
|
||||
}
|
||||
|
||||
function loseFocus() {
|
||||
|
@ -4349,13 +4409,16 @@ requires
|
|||
.addClass('OxInputGroup');
|
||||
|
||||
$.each(self.options.float == 'left' ? self.options.elements : self.options.elements.reverse(), function(i, $element) {
|
||||
$element.options({
|
||||
id: self.options.id + Ox.toTitleCase($element.options('id')),
|
||||
parent: that
|
||||
})
|
||||
.css({
|
||||
$element.css({
|
||||
float: self.options.float // fixme: make this a class
|
||||
})
|
||||
.bindEvent({
|
||||
validate: function(event, data) {
|
||||
that.triggerEvent({
|
||||
validate: data
|
||||
});
|
||||
}
|
||||
})
|
||||
.appendTo(that);
|
||||
});
|
||||
|
||||
|
@ -4384,6 +4447,16 @@ requires
|
|||
}
|
||||
}
|
||||
|
||||
that.value = function() {
|
||||
return $.map(self.options.elements, function(input) {
|
||||
var ret = null;
|
||||
['checked', 'selected', 'value'].forEach(function(v) {
|
||||
input[v] && (ret = input[v]());
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
};
|
||||
|
||||
return that;
|
||||
|
||||
};
|
||||
|
@ -6027,7 +6100,7 @@ requires
|
|||
|
||||
updateQuery();
|
||||
Ox.print('s.o', self.options)
|
||||
that.addEvent(self.keyboardEvents);
|
||||
that.bindEvent(self.keyboardEvents);
|
||||
$window.resize(that.size);
|
||||
|
||||
function addAboveToSelection() {
|
||||
|
@ -7342,7 +7415,7 @@ requires
|
|||
type: 'satellite'
|
||||
})
|
||||
.options(options || {})
|
||||
.addEvent({
|
||||
.bindEvent({
|
||||
key_up: function() {
|
||||
pan(0, -1);
|
||||
},
|
||||
|
@ -8093,7 +8166,7 @@ requires
|
|||
.mouseenter(mouseenter)
|
||||
.mouseleave(mouseleave)
|
||||
.mousemove(mousemove)
|
||||
.addEvent({
|
||||
.bindEvent({
|
||||
key_up: selectPreviousItem,
|
||||
key_down: selectNextItem,
|
||||
key_left: selectSupermenu,
|
||||
|
@ -8129,7 +8202,7 @@ requires
|
|||
.addClass('OxBottom')
|
||||
.appendTo(that.$element);
|
||||
that.$layer = $('<div>')
|
||||
.addClass(self.options.mainmenu ? 'OxMainMenuLayer' : 'OxLayer')
|
||||
.addClass(self.options.mainmenu ? 'OxMainMenuLayer' : 'OxMenuLayer')
|
||||
.click(click);
|
||||
|
||||
function click(event) {
|
||||
|
@ -8658,7 +8731,6 @@ requires
|
|||
scrollMenuUp();
|
||||
that.$scrollbars.up.is(':visible') && that.$scrollbars.up.hide();
|
||||
that.$scrollbars.down.is(':visible') && that.$scrollbars.down.hide();
|
||||
//that.$scrollbars.down.hide();
|
||||
if (self.options.parent) {
|
||||
//self.options.element.removeClass('OxSelected');
|
||||
self.options.parent.options({
|
||||
|
@ -9872,7 +9944,7 @@ requires
|
|||
.bindEvent('change', changeTimelineSmall)
|
||||
.appendTo(that);
|
||||
|
||||
that.addEvent({
|
||||
that.bindEvent({
|
||||
key_alt_left: function() {
|
||||
movePositionTo('cut', -1);
|
||||
},
|
||||
|
|
|
@ -714,7 +714,7 @@ $(function() {
|
|||
})
|
||||
],
|
||||
separators: [
|
||||
{title: "", width: -8}
|
||||
{title: "", width: 0}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
@ -1053,18 +1053,19 @@ $(function() {
|
|||
var value = $element.options("value"),
|
||||
$dialog = new Ox.Dialog({
|
||||
buttons: [
|
||||
{
|
||||
click: function() { $dialog.close(); },
|
||||
id: "close",
|
||||
title: "Close"
|
||||
}
|
||||
new Ox.Button({
|
||||
id: 'close',
|
||||
title: 'Close'
|
||||
}).bindEvent({
|
||||
click: function() { $dialog.close(); }
|
||||
})
|
||||
],
|
||||
content: Ox.isUndefined(value) ? "undefined" : value,
|
||||
height: 128,
|
||||
id: "value",
|
||||
title: "Value",
|
||||
width: 256
|
||||
})
|
||||
.append(Ox.isUndefined(value) ? "undefined" : value)
|
||||
.open();
|
||||
})
|
||||
.appendTo($div);
|
||||
|
|
Loading…
Reference in a new issue