Alien-GvaScript
view release on metacpan or search on metacpan
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
/*-------------------------------------------------------------------------*
* GvaScript - Javascript framework born in Geneva.
*
* Authors: Laurent Dami <laurent.d...@etat.ge.ch>
* Mona Remlawi
* Jean-Christophe Durand
* Sebastien Cuendet
* LICENSE
* This library is free software, you can redistribute it and/or modify
* it under the same terms as Perl's artistic license.
*
*--------------------------------------------------------------------------*/
var GvaScript = {
Version: '1.45',
REQUIRED_PROTOTYPE: '1.7',
load: function() {
function convertVersionString(versionString) {
var v = versionString.replace(/_.*|\./g, '');
v = parseInt(v + '0'.times(4-v.length));
return versionString.indexOf('_') > -1 ? v-1 : v;
}
if((typeof Prototype=='undefined') ||
(typeof Element == 'undefined') ||
(typeof Element.Methods=='undefined') ||
(convertVersionString(Prototype.Version) <
convertVersionString(GvaScript.REQUIRED_PROTOTYPE)))
throw("GvaScript requires the Prototype JavaScript framework >= " +
GvaScript.REQUIRED_PROTOTYPE);
}
};
GvaScript.load();
//----------protoExtensions.js
//-----------------------------------------------------
// Some extensions to the prototype javascript framework
//-----------------------------------------------------
// fire value:change event when setValue method
// is used to change the value of a Form Element
Form.Element.Methods.setValue = Form.Element.Methods.setValue.wrap(
function($p, element, value) {
var oldvalue = $F(element);
var _return = $p(element, value);
element.fire('value:change', {oldvalue: oldvalue, newvalue: value});
return _return;
}
);
Element.addMethods();
// adds the method flash to SPAN, DIV, INPUT, BUTTON elements
// flashes an element by adding a classname for a brief moment of time
// options: {classname: // classname to add (default: flash)
// duration: // duration in ms to keep the classname (default: 100ms)}
var _element_list = ['DIV', 'INPUT',
'BUTTON', 'TEXTAREA', 'A',
'H1', 'H2', 'H3', 'H4', 'H5'];
// for the moment, SPAN not supported on WebKit (see prototype.js bug in
// https://prototype.lighthouseapp.com/projects/8886/tickets/976-elementaddmethodsspan-fails-on-webkit)
if (!Prototype.Browser.WebKit) _element_list.push('SPAN');
Element.addMethods(_element_list, {
flash: function(element, options) {
if (element._IS_FLASHING) return;
element = $(element);
options = options || {};
var duration = options.duration || 100;
var classname = options.classname || 'flash';
element._IS_FLASHING = true;
var endFlash = function() {
this.removeClassName(classname);
this._IS_FLASHING = false;
};
element.addClassName(classname);
setTimeout(endFlash.bind(element), duration);
}
});
// utilities for hash
// expands flat hash into a multi-level deep hash
// javascript version of Perl CGI::Expand::expand_hash
Hash.expand = function(flat_hash) {
var tree = {};
// iterate on keys in the flat hash
for (var k in flat_hash) {
var parts = k.split(/\./);
var loop = {tree: tree, key: "root"};
// iterate on path parts within the key
for (var i = 0 ; i < parts.length; i++) {
var part = parts[i];
// if no subtree yet, build it (Array or Object)
if (!loop.tree[loop.key])
loop.tree[loop.key] = part.match(/^\d+$/) ? [] : {};
// walk down to subtree
loop = {tree: loop.tree[loop.key], key:part};
}
// store value in leaf
loop.tree[loop.key] = flat_hash[k];
}
return tree.root;
}
// collapses deep hash into a one level hash
Hash.flatten = function(deep_hash, prefix, tree) {
tree = tree || {};
for (var i in deep_hash) {
var v = deep_hash[i];
var new_prefix = prefix? prefix + '.' + i : i;
switch (typeof(v)) {
case "function": continue; break;
case "object" : Hash.flatten(v, new_prefix, tree); break;
case "string" :
case "number" : tree["" + new_prefix + ""] = v; break;
default : break;
}
}
return tree;
}
// utilities for string
Object.extend(String.prototype, {
chomp: function() {
return this.replace(/(\n|\r)+$/, '');
}
});
Object.extend(Element, {
classRegExp : function(wanted_classes) {
if (typeof wanted_classes != "string" &&
wanted_classes instanceof Array)
wanted_classes = wanted_classes.join("|");
return new RegExp("\\b(" + wanted_classes + ")\\b");
},
hasAnyClass: function (elem, wanted_classes) {
return Element.classRegExp(wanted_classes).test(elem.className);
},
getElementsByClassNames: function(parent, wanted_classes) {
var regexp = Element.classRegExp(wanted_classes);
var children = ($(parent) || document.body).getElementsByTagName('*');
var result = [];
for (var i = 0; i < children.length; i++) {
var child = children[i];
if (regexp.test(child.className)) result.push(child);
}
return result;
},
// start at elem, walk nav_property until find any of wanted_classes
navigateDom: function (elem, navigation_property,
wanted_classes, stop_condition) {
while (elem){
if (stop_condition && stop_condition(elem)) break;
if (elem.nodeType == 1 &&
Element.hasAnyClass(elem, wanted_classes))
return $(elem);
// else walk to next element
elem = elem[navigation_property];
}
return null;
},
autoScroll: function(elem, container, percentage) {
percentage = percentage || 20; // default
container = container || elem.offsetParent;
var offset = elem.offsetTop;
var firstElementChild = container.firstElementChild
|| $(container).firstDescendant();
if (firstElementChild) {
var first_child_offset = firstElementChild.offsetTop;
if (first_child_offset == container.offsetTop)
offset -= first_child_offset;
}
var min = offset - (container.clientHeight * (100-percentage)/100);
var max = offset - (container.clientHeight * percentage/100);
if (container.scrollTop < min) container.scrollTop = min;
else if (container.scrollTop > max) container.scrollTop = max;
},
outerHTML: function(elem) {
var tag = elem.tagName;
if (!tag)
return elem; // not an element node
if (elem.outerHTML)
return elem.outerHTML; // has builtin implementation
else {
var attrs = elem.attributes;
var str = "<" + tag;
for (var i = 0; i < attrs.length; i++) {
var val = attrs[i].value;
var delim = val.indexOf('"') > -1 ? "'" : '"';
str += " " + attrs[i].name + "=" + delim + val + delim;
}
return str + ">" + elem.innerHTML + "</" + tag + ">";
}
}
});
Class.checkOptions = function(defaultOptions, ctorOptions) {
ctorOptions = ctorOptions || {}; // options passed to the class constructor
for (var property in ctorOptions) {
if (defaultOptions[property] === undefined)
throw new Error("unexpected option: " + property);
}
return Object.extend(Object.clone(defaultOptions), ctorOptions);
};
Object.extend(Event, {
detailedStop: function(event, toStop) {
if (toStop.preventDefault) {
if (event.preventDefault) event.preventDefault();
else event.returnValue = false;
}
if (toStop.stopPropagation) {
if (event.stopPropagation) event.stopPropagation();
else event.cancelBubble = true;
}
},
stopAll: {stopPropagation: true, preventDefault: true},
stopNone: {stopPropagation: false, preventDefault: false}
});
function ASSERT (cond, msg) {
if (!cond)
throw new Error("Violated assertion: " + msg);
}
// detects if a global CSS_PREFIX has been set
// if yes, use it to prefix the css classes
// default to gva
function CSSPREFIX () {
if(typeof CSS_PREFIX != 'undefined') {
return (CSS_PREFIX)? CSS_PREFIX : 'gva';
}
return 'gva';
}
/**
*
* Cross-Browser Split 1.0.1
* (c) Steven Levithan <stevenlevithan.com>; MIT License
* in order to fix a bug with String.prototype.split(RegExp) and Internet Explorer
* [http://blog.stevenlevithan.com/archives/cross-browser-split]
* An ECMA-compliant, uniform cross-browser split method
*
* */
var cbSplit;
// avoid running twice, which would break `cbSplit._nativeSplit`'s reference to the native `split`
if (!cbSplit) {
cbSplit = function (str, separator, limit) {
// if `separator` is not a regex, use the native `split`
if (Object.prototype.toString.call(separator) !== "[object RegExp]") {
return cbSplit._nativeSplit.call(str, separator, limit);
}
var output = [],
lastLastIndex = 0,
flags = (separator.ignoreCase ? "i" : "") +
(separator.multiline ? "m" : "") +
(separator.sticky ? "y" : ""),
separator = RegExp(separator.source, flags + "g"), // make `global` and avoid `lastIndex` issues by working with a copy
separator2, match, lastIndex, lastLength;
str = str + ""; // type conversion
if (!cbSplit._compliantExecNpcg) {
separator2 = RegExp("^" + separator.source + "$(?!\\s)", flags); // doesn't need /g or /y, but they don't hurt
}
/* behavior for `limit`: if it's...
- `undefined`: no limit.
- `NaN` or zero: return an empty array.
- a positive number: use `Math.floor(limit)`.
- a negative number: no limit.
- other: type-convert, then use the above rules. */
if (limit === undefined || +limit < 0) {
limit = Infinity;
} else {
limit = Math.floor(+limit);
if (!limit) {
return [];
}
}
while (match = separator.exec(str)) {
lastIndex = match.index + match[0].length; // `separator.lastIndex` is not reliable cross-browser
if (lastIndex > lastLastIndex) {
output.push(str.slice(lastLastIndex, match.index));
// fix browsers whose `exec` methods don't consistently return `undefined` for nonparticipating capturing groups
if (!cbSplit._compliantExecNpcg && match.length > 1) {
match[0].replace(separator2, function () {
for (var i = 1; i < arguments.length - 2; i++) {
if (arguments[i] === undefined) {
match[i] = undefined;
}
}
});
}
if (match.length > 1 && match.index < str.length) {
Array.prototype.push.apply(output, match.slice(1));
}
lastLength = match[0].length;
lastLastIndex = lastIndex;
if (output.length >= limit) {
break;
}
}
if (separator.lastIndex === match.index) {
separator.lastIndex++; // avoid an infinite loop
}
}
if (lastLastIndex === str.length) {
if (lastLength || !separator.test("")) {
output.push("");
}
} else {
output.push(str.slice(lastLastIndex));
}
return output.length > limit ? output.slice(0, limit) : output;
};
cbSplit._compliantExecNpcg = /()??/.exec("")[1] === undefined; // NPCG: nonparticipating capturing group
cbSplit._nativeSplit = String.prototype.split;
} // end `if (!cbSplit)`
// for convenience...
String.prototype.split = function (separator, limit) {
return cbSplit(this, separator, limit);
};
/**
* Event Delegation
* Based on http://code.google.com/p/protolicious/source/browse/trunk/src/event.register.js
* modified to support focus/blur event capturing
* [http://www.quirksmode.org/blog/archives/2008/04/delegating_the.html]
*
* Prototype core is supposed to have this in v 1.7 !
* Naming might differ, Event.register -> Event.delegate but at least
* will have the same syntax
*/
// wrap in an anonymous function to avoid any variable conflict
(function() {
var rules = { };
var exprSplit = function(expression) {
var expressions = [];
expression.scan(/(([\w#:.~>+()\s-]+|\*|\[.*?\])+)\s*(,|$)/, function(m) {
expressions.push(m[1].strip());
});
return expressions;
}
var eventManager = function(o_id, event) {
// IE sometimes fires some events
// while reloading (after unregister)
if(! rules[o_id]) return;
var element = event.target;
var eventType = (event.memo)? event.eventName : event.type;
do {
if (element.nodeType == 1) {
element = Element.extend(element);
for (var selector in rules[o_id][eventType]) {
if (_match = matches(rules[o_id][eventType][selector]._selector, element)) {
for (var i=0, handlers=rules[o_id][eventType][selector], l=handlers.length; i<l; ++i) {
handlers[i].call(element, Object.extend(event, { _target: element, _match: _match }));
}
}
}
}
} while (element = element.parentNode)
}
var matches = function(selectors, element) {
for (var i=0, l=selectors.length; i<l; ++i) {
if (Prototype.Selector.match(element, selectors[i])) return selectors[i];
}
return undefined;
}
Event.register = function(observer, selector, eventName, handler) {
var use_capture = (eventName == 'focus' || eventName == 'blur');
if(use_capture && Prototype.Browser.IE) {
eventName = (eventName == 'focus')? 'focusin' : 'focusout';
}
var observer_id = observer.identify ? observer.identify() : 'document';
// create entry in cache for rules per observer
if(! rules[observer_id]) {
rules[observer_id] = { };
}
// observe event only once on the same observer
if(! rules[observer_id][eventName]) {
rules[observer_id][eventName] = { };
if(use_capture) {
if(Prototype.Browser.IE)
Event.observe(observer, eventName, eventManager.curry(observer_id));
else
observer.addEventListener(eventName, eventManager.curry(observer_id), true);
}
else
Event.observe(observer, eventName, eventManager.curry(observer_id));
}
var _selector = [ ], expr = selector.strip();
// instantiate Selector's
exprSplit(selector).each(function(s) { _selector.push(s) })
// store instantiated Selector for faster matching
if (!rules[observer_id][eventName][expr]) {
rules[observer_id][eventName][expr] = Object.extend([ ], { _selector: _selector });
}
// associate handler with expression
rules[observer_id][eventName][expr].push(handler);
}
// unregistering an event on an elemment
Event.unregister = function(elt, selector, eventName) {
var _id = (typeof elt == 'string')? elt :
(elt.identify)? elt.identify() : 'document';
// unregister event identified by name and selector
if (eventName) {
rules[_id][eventName][selector] = null;
delete rules[_id][eventName][selector];
}
else {
for (var eventName in rules[_id]) {
// unregister all events identified by selector
if(selector) {
rules[_id][eventName][selector] = null;
delete rules[_id][eventName][selector];
}
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
script.remove();
script = null;
delete window[token];
};
head.appendChild(script);
// callback name should be unique
id++;
}
})();
//----------event.js
// array holding fired events that are pending to be executed
// useful for avoiding accidental double firing of events
// events in queue are unique per eventType&eventTarget
GvaScript.eventsQueue = Class.create();
Object.extend(GvaScript.eventsQueue, {
_queue: $A([]),
hasEvent: function(target, name) {
return (typeof this._queue.find(function(e) {
return (e.target == target && e.name == name);
}) == 'object');
},
pushEvent: function(target, name) {
this._queue.push({target: target, name: name});
},
popEvent: function(target, name) {
this._queue = this._queue.reject(function(e) {
return (e.target == target && e.name == name);
});
}
});
// fireEvent : should be COPIED into controller objects, so that
// 'this' is properly bound to the controller
GvaScript.fireEvent = function(/* type, elem1, elem2, ... */) {
var event;
switch (typeof arguments[0]) {
case "string" :
event = {type: arguments[0]};
break;
case "object" :
event = arguments[0];
break;
default:
throw new Error("invalid first argument to fireEvent()");
}
var propName = "on" + event.type;
var handler;
var target = arguments[1]; // first element where the event is triggered
var currentTarget; // where the handler is found
// event already fired and executing
if(GvaScript.eventsQueue.hasEvent(target, event.type)) return;
// try to find the handler, first in the HTML elements, then in "this"
for (var i = 1, len = arguments.length; i < len; i++) {
var elem = arguments[i];
if (handler = elem.getAttribute(propName)) {
currentTarget = elem;
break;
}
}
if (currentTarget === undefined)
if (handler = this[propName])
currentTarget = this;
if (handler) {
// build context and copy into event structure
var controller = this;
if (!event.target) event.target = target;
if (!event.srcElement) event.srcElement = target;
if (!event.currentTarget) event.currentTarget = currentTarget;
if (!event.controller) event.controller = controller;
// add the event to the queue, it's about to be fired
GvaScript.eventsQueue.pushEvent(target, event.type);
var event_return = null; // return value of event execution
if (typeof(handler) == "string") {
// string will be eval-ed in a closure context where 'this', 'event',
// 'target' and 'controller' are defined.
var eval_handler = function(){return eval( handler ) };
handler = eval_handler.call(currentTarget); // target bound to 'this'
}
if (handler instanceof Function) {
// now call the eval-ed or pre-bound handler
event_return = handler(event);
}
else {
// whatever was returned by the string evaluation
event_return = handler;
}
// event executed, pop from the queue
// keep a safety margin of 1sec before allowing
// the same event on the same element to be refired
// TODO: is 1sec reasonable
window.setTimeout(function() {
GvaScript.eventsQueue.popEvent(target, event.type)
}, 1000);
return event_return;
}
else
return null; // no handler found
};
//----------keyMap.js
//constructor
GvaScript.KeyMap = function (rules) {
if (!(rules instanceof Object)) throw "KeyMap: invalid argument";
this.rules = [rules];
return this;
};
GvaScript.KeyMap.prototype = {
destroy: function() {
Event.stopObserving(this.elem, this.eventType, this.eventHandler);
},
eventHandler: function(event) {
var keymap = this;
// translate key code into key name
event.keyName = GvaScript.KeyMap.KEYS.BUILTIN_NAMES[event.keyCode]
|| String.fromCharCode(event.keyCode);
// add Control|Shift|Alt modifiers
event.keyModifiers = "";
if (event.ctrlKey && !this.options.ignoreCtrl) event.keyModifiers += "C_";
if (event.shiftKey && !this.options.ignoreShift) event.keyModifiers += "S_";
if (event.altKey && !this.options.ignoreAlt) event.keyModifiers += "A_";
// but cancel all modifiers if main key is Control|Shift|Alt
if (event.keyName.search(/^(CTRL|SHIFT|ALT)$/) == 0)
event.keyModifiers = "";
// try to get the corresponding handler, and call it if found
var handler = keymap._findInStack(event, keymap.rules);
if (handler) {
var toStop = handler.call(keymap, event);
Event.detailedStop(event, toStop || this.options);
}
},
observe: function(eventType, elem, options) {
this.eventType = eventType || 'keydown';
this.elem = elem || document;
// "Shift" modifier usually does not make sense for keypress events
if (eventType == 'keypress' && !options)
options = {ignoreShift: true};
this.options = Class.checkOptions(Event.stopNone, this.options || {});
this.eventHandler = this.eventHandler.bindAsEventListener(this);
Event.observe(this.elem, this.eventType, this.eventHandler);
},
_findInStack: function(event, stack) {
for (var i = stack.length - 1; i >= 0; i--) {
var rules = stack[i];
// trick to differentiate between C_9 (digit) and C_09 (TAB)
var keyCode = event.keyCode>9 ? event.keyCode : ("0"+event.keyCode);
var handler = rules[event.keyModifiers + event.keyName]
|| rules[event.keyModifiers + keyCode]
|| this._regex_handler(event, rules.REGEX, true)
|| this._regex_handler(event, rules.ANTIREGEX, false);
if (handler)
return handler;
}
return null;
},
_regex_handler: function(event, regex_rules, want_match) {
if (!regex_rules) return null;
for (var j = 0; j < regex_rules.length; j++) {
var rule = regex_rules[j];
var modifiers = rule[0];
var regex = rule[1];
var handler = rule[2];
var same_modifiers = modifiers == null
|| modifiers == event.keyModifiers;
// build regex if it was passed as a string
if (typeof(regex) == "string")
regex = new RegExp("^(" + regex + ")$");
var match = same_modifiers && regex.test(event.keyName);
if ((match && want_match) || (!match && !want_match))
return handler;
}
return null;
}
};
GvaScript.KeyMap.MapAllKeys = function(handler) {
return {REGEX:[[null, /.*/, handler]]}
};
GvaScript.KeyMap.Prefix = function(rules) {
// create a specific handler for the next character ...
var one_time_handler = function (event) {
this.rules.pop(); // cancel prefix
var handler = this._findInStack(event, [rules]);
if (handler) handler.call(this, event);
}
// ... and push that handler on top of the current rules
return function(event) {
this.rules.push(GvaScript.KeyMap.MapAllKeys(one_time_handler));
}
};
// helpers for identifying keys
GvaScript.KeyMap.KEYS = {
BUILTIN_NAMES : {
8: "BACKSPACE",
9: "TAB",
10: "LINEFEED",
13: "RETURN",
16: "SHIFT",
17: "CTRL",
18: "ALT",
19: "PAUSE",
20: "CAPS_LOCK",
27: "ESCAPE",
32: "SPACE",
33: "PAGE_UP",
34: "PAGE_DOWN",
35: "END",
36: "HOME",
37: "LEFT",
38: "UP",
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
= this._jumpToPage.bindAsEventListener(this, 0);
this.reuse.navigationRules.C_END
= this._jumpToPage.bindAsEventListener(this, 99999);
}
};
GvaScript.ChoiceList.prototype = {
//----------------------------------------------------------------------
// PUBLIC METHODS
//----------------------------------------------------------------------
destroy: function() {
// test that element still in DOM
if(this.container) Event.stopObserving(this.container);
},
fillContainer: function(containerElem) {
this.container = containerElem;
this.container.choiceList = this;
Element.update(this.container, this.htmlForChoices());
// mouse events on choice items will bubble up to the container
if(this.options.mouseovernavi) {
Event.observe(this.container, "mouseover", this.reuse.onmouseover);
}
Event.observe(this.container, "click" , this.reuse.onclick);
Event.observe(this.container, "dblclick" , this.reuse.ondblclick);
if (this.options.keymap) {
this.keymap = this.options.keymap;
this.keymap.rules.push(this.reuse.navigationRules);
}
else {
this.keymap = new GvaScript.KeyMap(this.reuse.navigationRules);
var target = this.container.tabIndex == undefined
? document
: this.container;
this.keymap.observe("keydown", target);
}
// POTENTIAL PROBLEM HERE : the keymap may stay active
// even after the choiceList is deleted (may yield memory leaks and
// inconsistent behaviour). But we have no "destructor", so how
// can we unregister the keymap ?
// highlight the initial value or the first choice
this._highlightChoiceNum(this.currentHighlightedIndex || 0, true);
},
updateContainer: function(container, list) {
this.choices = list;
Element.update(this.container, this.htmlForChoices());
this._highlightChoiceNum(0, true);
},
htmlForChoices: function(){ // creates the innerHTML
var html = "";
for (var i = 0; i < this.choices.length; i++) {
var choice = this.choices[i];
var label =
typeof choice == "string" ? choice : choice[this.options.labelField];
var id = this.container.id ? this.container.id + "." : '';
id += this.options.idForChoices + "." + i;
html += this.choiceElementHTML(label, id);
}
return this.options.htmlWrapper(html);
},
choiceElementHTML: function(label, id) {
return "<" + this.options.choiceItemTagName + " class='"
+ this.classes.choiceItem + "' id='" + id + "'>"
+ label + "</" + this.options.choiceItemTagName + ">";
},
fireEvent: GvaScript.fireEvent, // must be copied here for binding "this"
//----------------------------------------------------------------------
// PRIVATE METHODS
//----------------------------------------------------------------------
//----------------------------------------------------------------------
// conversion index <=> HTMLElement
//----------------------------------------------------------------------
_choiceElem: function(index) { // find DOM element from choice index
var prefix = this.container.id ? this.container.id + "." : '';
return $(prefix + this.options.idForChoices + "." + index);
},
_choiceIndex: function(elem) {
return parseInt(elem.id.match(/\.(\d+)$/)[1], 10);
},
//----------------------------------------------------------------------
// highlighting
//----------------------------------------------------------------------
_highlightChoiceNum: function(newIndex, autoScroll) {
// do nothing if newIndex is invalid
if (newIndex > this.choices.length - 1) return;
Element.removeClassName(this._choiceElem(this.currentHighlightedIndex),
this.classes.choiceHighlight);
this.currentHighlightedIndex = newIndex;
var elem = this._choiceElem(newIndex);
// not to throw an arrow when user is holding an UP/DN keys while
// paginating
if(! $(elem)) return;
Element.addClassName(elem, this.classes.choiceHighlight);
if (autoScroll)
Element.autoScroll(elem, this.container, 30); // 30%
this.fireEvent({type: "Highlight", index: newIndex}, elem, this.container);
},
// this method restricts navigation to the current page
_jumpToIndex: function(event, nextIndex) {
var autoScroll = event && event.keyName; // autoScroll only for key events
this._highlightChoiceNum(
Math.max(0, Math.min(this.choices.length-1, nextIndex)),
autoScroll
);
if (event) Event.stop(event);
},
// TODO: jump to page numbers would be a nice addition
_jumpToPage: function(event, pageIndex) {
if(pageIndex <=1) return this.options.paginator.getFirstPage();
if(pageIndex == 99999) return this.options.paginator.getLastPage();
if (event) Event.stop(event);
},
// would navigate through pages if index goes out of bound
_highlightDelta: function(event, deltax, deltay) {
var currentIndex = this.currentHighlightedIndex;
var nextIndex = currentIndex + deltax;
// first try to flip a page
// if first page -> go top of list
if (nextIndex < 0) {
if(this.hasPaginator) {
if(this.options.paginator.getPrevPage()) return;
}
nextIndex = 0;
}
if (nextIndex >= this.choices.length) {
if(this.hasPaginator) {
if(this.options.paginator.getNextPage()) return;
}
nextIndex = this.choices.length -1;
}
// we're still on the same page
this._jumpToIndex(event, nextIndex);
},
//----------------------------------------------------------------------
// navigation
//----------------------------------------------------------------------
_findChoiceItem: function(event) { // walk up DOM to find mouse target
var stop_condition = function(elem){return elem === this.container};
return Element.navigateDom(Event.element(event), "parentNode",
this.classes.choiceItem,
stop_condition);
},
_listOverHandler: function(event) {
var elem = this._findChoiceItem(event);
if (elem) {
this._highlightChoiceNum(this._choiceIndex(elem), false);
if (this.options.grabfocus)
this.container.focus();
Event.stop(event);
}
},
// no _listOutHandler needed
_dblclickHandler: function(event) {
var elem = this._findChoiceItem(event);
if (elem) {
var newIndex = this._choiceIndex(elem);
this._highlightChoiceNum(newIndex, false);
this._clickHandler(event);
}
},
_clickHandler: function(event) {
var elem = this._findChoiceItem(event);
if (elem) {
var newIndex = this._choiceIndex(elem);
// check if choice is selected
if (this.currentHighlightedIndex == newIndex) {
// selected -> fire ping event
var toStop = this.fireEvent({type : "Ping",
index: this._choiceIndex(elem)},
elem,
this.container);
Event.detailedStop(event, toStop || Event.stopAll);
}
else {
// not selected -> select
this._highlightChoiceNum(newIndex, false);
}
}
},
_returnHandler: function(event) {
var index = this.currentHighlightedIndex;
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
}
},
_updateChoices : function (continuation) {
var value = this._getValueToComplete();
// if (window.console) console.log('updateChoices', value);
this._updateChoicesHandler(value, continuation);
},
// does the reverse of "autocomplete()"
// doesnot fire if input blurred from click on choice list
_blurHandler: function(event) {
// remove choice list
if (this.dropdownDiv) this._removeDropdownDiv();
// xhr is still active: waiting for response from server
if (_xhr = this._runningAjax[this.inputElement.name]) {
// if autocompleter is strict, need to wait for xhr to
// finish before calling the _blurHandler to fire the
// autocompleter's finalState
if (this.options.strict) {
_xhr['blurAfterSuccess'] = true;
return;
}
_xhr.transport.abort();
_xhr = null;
Element.removeClassName(this.inputElement, this.classes.loading);
}
// if strict mode, inform client about the final status
if (this.options.strict) {
var value = this._getValueToComplete();
// if value has changed, invalidate previous list of choices
if (value != this.lastValue) {
this.choices = null;
}
// if blank and blankOK, this is a legal value
if (!value && this.options.blankOK) {
this._updateDependentFields(this.inputElement, "");
this.fireEvent({ type : "LegalValue",
value : "",
choice : null,
controller : null }, this.inputElement);
}
// if choices are known, just inspect status
else if (this.choices) {
this._fireFinalStatus(this.inputElement, this.choices);
}
// if not enough chars to get valid choices, this is illegal
else if (value.length < this.options.minimumChars) {
var return_value = this.fireEvent({
type: "IllegalValue", value: value
}, this.inputElement);
if(! return_value) {
this.inputElement.style.backgroundColor = this.options.colorIllegal;
this._updateDependentFields(this.inputElement, null);
}
}
// otherwise get choices and then inspect status (maybe asynchronously)
else {
this._updateChoices(this._fireFinalStatus.bind(this,
this.inputElement));
}
}
this.fireEvent("Leave", this.inputElement);
this.inputElement = null;
},
_fireFinalStatus: function (inputElement, choices) {
// NOTE: takes inputElement and choices as arguments, because it might be
// called asynchronously, after "this" has been detached from the input
// element and the choices array, so we cannot call the object properties.
var input_val = this._getValueToComplete(inputElement.value);
var index = null;
// inspect the choice list to automatically choose the appropriate candidate
for (var i=0; i < choices.length; i++) {
var val = this._valueFromChoiceItem(choices[i]);
if (val == input_val) {
index = i;
break; // break the loop because this is the best choice
}
else if (val.toUpperCase() == input_val.toUpperCase()) {
index = i; // is a candidate, but we may find a better one
}
}
// if automatic choice did not work, but we have only 1 choice, and this is
// not blank on purpose, then force it into the field
if (index === null && choices.length == 1
&& (input_val || !this.options.blankOK ))
index = 0;
if (index !== null) {
var choice = choices[index];
var val = this._valueFromChoiceItem(choice);
// put canonical value back into input field
this._setValue(val, inputElement);
// for backwards compatibility, we generate a "Complete" event, but
// with a fake controller (because the real controller might be in a
// diffent state).
this.fireEvent({ type : "Complete",
referrer : "blur", // input blur fired this event
index : index,
choice : choice,
controller: {choices: choices} }, inputElement);
// update dependent fields
this._updateDependentFields(inputElement, choice);
// for new code : generate a "LegalValue" event
this.fireEvent({ type : "LegalValue",
value : val,
choice : choice,
controller : null }, inputElement);
}
else {
var return_value = this.fireEvent({
type : "IllegalValue",
value : input_val,
controller : null
}, inputElement);
if(! return_value) {
inputElement.style.backgroundColor = this.options.colorIllegal;
this._updateDependentFields(inputElement, null);
}
}
},
_updateDependentFields: function(inputElement, choice) {
// "choice" might be
// - an object or nonempty string ==> update dependent fields
// - an empty string ==> clear dependent fields
// - null ==> put "ILLEGAL_***"
var attr = inputElement.getAttribute('ac:dependentFields');
var dep_fields = attr ? eval("("+attr+")")
: this.options.dependentFields;
if (!dep_fields) return;
var form = inputElement.form;
var name_parts = inputElement.name.split(/\./);
for (var k in dep_fields) {
name_parts[name_parts.length - 1] = k;
var related_name = name_parts.join('.');
var related_field = form[related_name];
var value_in_choice = dep_fields[k];
if (related_field) {
related_field.value
= (value_in_choice == "") ? ""
: (choice === null) ? "!!ILLEGAL_" + k + "!!"
: (typeof choice == "object") ?
(choice[value_in_choice] ? choice[value_in_choice] : "")
: (typeof choice == "string") ? choice
: "!!UNEXPECTED SOURCE FOR RELATED FIELD!!";
}
}
},
// if clicking in the 20px right border of the input element, will display
// or hide the drowpdown div (like pressing ARROWDOWN or ESC)
_clickHandler: function(event) {
var x = event.offsetX || event.layerX; // MSIE || FIREFOX
if (x > Element.getDimensions(this.inputElement).width - 20) {
if ( this.dropdownDiv ) {
this._removeDropdownDiv();
Event.stop(event);
}
else
this._ArrowDownHandler(event);
}
},
_ArrowDownHandler: function(event) {
var value = this._getValueToComplete();
var valueLength = (value || "").length;
if (valueLength < this.options.minimumChars)
this.displayMessage("liste de choix à partir de "
+ this.options.minimumChars + " caractères");
else
this._displayChoices();
Event.stop(event);
},
_keyDownHandler: function(event) {
// invalidate previous lists of choices because value may have changed
this.choices = null;
this._removeDropdownDiv();
// cancel pending timeouts because we create a new one
if (this._timeoutId) clearTimeout(this._timeoutId);
this._timeLastKeyDown = (new Date()).getTime();
// if (window.console) console.log('keyDown', this._timeLastKeyDown, event.keyCode);
this._timeoutId = setTimeout(this._checkNewValue.bind(this),
this.options.checkNewValDelay);
// do NOT stop the event here : give back control so that the standard
// browser behaviour can update the value; then come back through a
// timeout to update the Autocompleter
},
_checkNewValue: function() {
// abort if the timeout occurs after a blur (no input element)
if (!this.inputElement) {
// if (window.console) console.log('_checkNewValue ... no input elem');
return;
}
// several calls to this function may be queued by setTimeout,
// so we perform some checks to avoid doing the work twice
if (this._timeLastCheck > this._timeLastKeyDown) {
// if (window.console) console.log('_checkNewValue ... done already ',
// this._timeLastCheck, this._timeLastKeyDown);
return; // the work was done already
}
var now = (new Date()).getTime();
var deltaTime = now - this._timeLastKeyDown;
if (deltaTime + this.options.deltaTime_tolerance
< this.options.checkNewValDelay) {
// if (window.console) console.log('_checkNewValue ... too young ',
// now, this._timeLastKeyDown);
return; // too young, let olders do the work
}
this._timeLastCheck = now;
var value = this._getValueToComplete();
// if (window.console)
// console.log('_checkNewValue ... real work [value = %o] - [lastValue = %o] ',
// value, this.lastValue);
this.lastValue = this.lastTypedValue = value;
// create a list of choices if we have enough chars
if (value.length >= this.options.minimumChars) {
// first create a "continuation function"
var continuation = function (choices) {
// if, meanwhile, another keyDown occurred, then abort
if (this._timeLastKeyDown > this._timeLastCheck) {
// if (window.console)
// console.log('after updateChoices .. abort because of keyDown',
// now, this._timeLastKeyDown);
return;
}
this.choices = choices;
if (choices && choices.length > 0) {
this.inputElement.style.backgroundColor = ""; // remove colorIllegal
if (this.options.autoSuggest)
this._displayChoices();
}
else if (this.options.strict && (!this.options.blankOK)) {
this.inputElement.style.backgroundColor = this.options.colorIllegal;
}
};
// now call updateChoices (which then will call the continuation)
this._updateChoices(continuation.bind(this));
}
},
// return the value to be completed
// TODO : for multivalued, should return the value under the cursor,
// instead returning sytematically the last value
_getValueToComplete : function(value) {
// NOTE: the explicit value as argument is only used from
//_fireFinalStatus(), when we can no longer rely on
// this.inputElement.value
value = value || this.inputElement.value;
if (this.options.multivalued) {
var vals = value.split(this.options.multivalue_separator);
value = vals[vals.length-1];
}
return value;
},
_setValue : function(value, inputElement) {
// NOTE: the explicit inputElement as argument is only used from
// _fireFinalStatus(), when we can no longer rely on this.inputElement
// default inputElement is the one bound to this autocompleter
if (!inputElement) inputElement = this.inputElement;
// if multivalued, the completed value replaces the last one in the list
if (this.options.multivalued) {
var _sep = inputElement.value.match(this.options.multivalue_separator);
if (_sep) {
var vals = inputElement.value.split(this.options.multivalue_separator);
vals[vals.length-1] = value;
value = vals.join(_sep[0]); // join all vals with first separator found
}
}
// setting value in input field
inputElement.value = this.lastValue = value;
},
_typeAhead : function () {
var curLen = this.lastTypedValue.length;
var index = this.choiceList.currentHighlightedIndex;
var suggestion = this._valueFromChoice(index);
var newLen = suggestion.length;
this._setValue(suggestion);
if (this.inputElement.createTextRange){ // MSIE
var range = this.inputElement.createTextRange();
range.moveStart("character", curLen); // no need to moveEnd
range.select(); // will call focus();
}
else if (this.inputElement.setSelectionRange){ // Mozilla
this.inputElement.setSelectionRange(curLen, newLen);
}
},
//----------------------------------------------------------------------
// methods for the dropdown list of choices
//----------------------------------------------------------------------
_mkDropdownDiv : function() {
this._removeDropdownDiv();
// the autocompleter has been blurred ->
// do not display the div
if(!this.inputElement) return null;
// if observed element for scroll, reposition
var movedUpBy = 0;
var movedLeftBy = 0;
if (this.observed_scroll) {
movedUpBy = this.observed_scroll.scrollTop;
movedLeftBy = this.observed_scroll.scrollLeft;
}
// create div
var div = new Element('div');
div.className = this.classes.dropdown;
// positioning
var coords = Position.cumulativeOffset(this.inputElement);
var dim = Element.getDimensions(this.inputElement);
div.style.left = coords[0] + this.options.offsetX - movedLeftBy + "px";
div.style.top = coords[1] + dim.height -movedUpBy + "px";
div.style.maxHeight = this.options.maxHeight + "px";
div.style.minWidth = this.options.minWidth + "px";
div.style.zIndex = 32767; //Seems to be the highest valid value
// insert into DOM
document.body.appendChild(div);
// simulate minWidth on old MSIE (must be AFTER appendChild())
// maxHeight cannot be simulated untill displayChoices
if (navigator.userAgent.match(/\bMSIE [456]\b/)) {
div.style.width = this.options.minWidth + "px";
}
// mouseenter and mouseleave events to control
// whether autocompleter has been blurred
var elem = this.inputElement;
div.observe('mouseenter', function(e) {
Element.stopObserving(elem, "blur", this.reuse.onblur);
}.bind(this));
div.observe('mouseleave', function(e) {
Element.observe(elem, "blur", this.reuse.onblur);
}.bind(this));
return this.dropdownDiv = div;
},
_displayChoices: function() {
// if no choices are ready, can't display anything
if (!this.choices) return;
var toCompleteVal = this._getValueToComplete();
if (this.choices.length > 0) {
var ac = this;
// create a choiceList
var cl = this.choiceList = new GvaScript.ChoiceList(this.choices, {
labelField : this.options.labelField,
scrollCount : this.options.scrollCount,
choiceItemTagName : this.options.choiceItemTagName,
htmlWrapper : this.options.htmlWrapper
});
cl.currentHighlightedIndex = ac._idx_to_hilite;
// TODO: explain and publish method "choiceElementHTML", or redesign
// and make it a private method
if ( this.choiceElementHTML ) {
cl.choiceElementHTML = this.choiceElementHTML;
}
cl.onHighlight = function(event) {
if (ac.options.typeAhead)
ac._typeAhead();
ac.fireEvent(event, ac.inputElement);
};
cl.onPing = function(event) {
ac._completeFromChoiceElem(event.target);
};
cl.onCancel = function(event) {
ac._removeDropdownDiv();
};
// append div to DOM
var choices_div = this._mkDropdownDiv();
// fill div now so that the keymap gets initialized
cl.fillContainer(choices_div);
// set height of div for IE6 (no suppport for maxHeight!)
if (navigator.userAgent.match(/\bMSIE [456]\b/)) {
choices_div.style.height =
(choices_div.scrollHeight > this.options.maxHeight)?
this.options.maxHeight + 'px' :
'auto';
}
// determine if there is a space to dislay
// the choices list under the input
// if not, display above.
// onscreen height needed for displaying the choices list
var _h_needed = Element.viewportOffset(this.inputElement)[1]
+ this.inputElement.offsetHeight
+ choices_div.offsetHeight;
var _h_avail = document.viewport.getHeight();
// move choices list on top of the input element
if(_h_needed >= _h_avail) {
var div_top = choices_div.offsetTop
- choices_div.offsetHeight
- this.inputElement.offsetHeight;
if (div_top >= 0)
choices_div.style.top = div_top + 'px';
}
// catch keypress on TAB while choiceList has focus
cl.keymap.rules[0].TAB = cl.keymap.rules[0].S_TAB = function(event) {
var index = cl.currentHighlightedIndex;
if (index != undefined) {
var elem = cl._choiceElem(index);
// generate a "Ping" on the choiceList, like if user had
// pressed RETURN to select the current highlighted item
cl.fireEvent({type : "Ping",
index: index}, elem, cl.container);
// NO Event.stop() here, because the navigator should
// do the tabbing (pass focus to next/previous element)
}
};
// more key handlers when the suggestion list is displayed
this.keymap.rules.push(cl.keymap.rules[0]);
}
else
this.displayMessage("pas de suggestion");
},
_removeDropdownDiv: function() {
// remove the dropdownDiv that was added previously by _mkDropdownDiv();
// that div contained either a menu of choices or a message to the user
if (this.dropdownDiv) {
// remove mouseenter and mouseleave observers
this.dropdownDiv.stopObserving();
Element.remove(this.dropdownDiv);
this.dropdownDiv = null;
}
// if applicable, also remove rules previously pushed by _displayChoices
if (this.keymap.rules.length > 1)
this.keymap.rules.pop();
},
_valueFromChoice: function(index) {
if (!this.choices) return null;
var choice = this.choices[index];
return (choice !== null) ? this._valueFromChoiceItem(choice) : null;
},
_valueFromChoiceItem: function(choice) {
return (typeof choice == "string") ? choice
: choice[this.options.valueField];
},
//triggered by the onPing event on the choicelist, i.e. when the user selects
//one of the choices in the list
_completeFromChoiceElem: function(elem) {
// identify the selected line and handle it
var num = parseInt(elem.id.match(/\.(\d+)$/)[1], 10);
// add the value to the input element
var value = this._valueFromChoice(num);
if (value !== null) {
this._setValue(value)
this._removeDropdownDiv();
// ADDED LEMOINEJ 26.09.13
this._timeLastCheck = this._timeLastKeyDown = 0;
this._checkNewValue();
if (!this.options.multivalued) {
this.inputElement.select();
}
this._updateDependentFields(this.inputElement, this.choices[num]);
// fire events: "Complete" for backwards compatibility, "LegalValue"
// for regular use
var eventNames = ["Complete", "LegalValue"];
// for loop : can't use .each() from prototype.js because it alters "this"
for (var i = 0; i < eventNames.length; i++) {
this.fireEvent({
type : eventNames[i],
referrer : "select", // choice selection fired this event
index : num,
choice : this.choices[num],
controller: {choices: this.choices}
}, elem, this.inputElement);
}
}
}
}
//----------customButtons.js
// depends: keyMap.js
GvaScript.CustomButtons = {};
GvaScript.CustomButtons.Button = Class.create();
// Renders Buttons in the following HTML structure
// <span class="gva-btn-container">
// <span class="left"/>
// <span class="center">
// <button class="btn" style="width: auto;" id="btn_1227001526005">
// Créer
// </button>
// </span>
// <span class="right"/>
// </span>
Object.extend(GvaScript.CustomButtons.Button.prototype, function() {
var bcss = CSSPREFIX();
function _extendCss(button_options) {
// basic class
var button_css = bcss+'-btn-container';
// extended classes
switch (typeof button_options.css) {
case 'object': button_css += (' ' + button_options.css.join(' ')); break;
case 'string': button_css += (' ' + button_options.css); break;
default: break;
}
button_options.button_css = button_css;
}
var _button_template = new Template(
'<span class="#{button_css}" id="#{id}">'
+ '<span class="left"></span>'
+ '<span class="center">'
+ '<button type="#{type}" style="width:#{width}" '
+ ' class="btn">#{label}'
+ '</button>'
+ '</span>'
+ '<span class="right"></span>'
+ '</span>'
);
function _render(button_options) {
_extendCss(button_options);
return _button_template.evaluate(button_options);
}
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
this.actionButtons = new GvaScript.CustomButtons.ButtonNavigation(this.actionsbar_container, {
selectFirstBtn: false,
className: bcss+'-btn-container'
});
},
// wrapping the recordset in a table with column headers
gridWrapper: function(html) {
return '<table class="'+bcss+'-grid '+this.options.css+'">' +
'<thead><tr>' +
'<th class="grid-marker"> </th>' +
(this.columns.collect(function(e) {
if(_evalCondition(e, this))
return '<th class="grid-header'+_compileCss(e)+'"'+_compileWidth(e)+_compileTitle(e)+'>'+e.label+'</th>'
else return '';
}, this).join('')) +
'</tr></thead>' +
'<tbody>'+html+'</tbody>'+
'</table>';
},
// called by the paginator
receiveRequest: function(response_json) {
this.records = response_json.liste;
this.total = response_json.total;
this.rights = response_json.rights || {can_create: 1};
var list_records = $A(this.records).collect(function(e, index) {
return '<td class="grid-marker"> </td>' +
this.columns.collect(function(c) {
if(_evalCondition(c, this))
return '<td class="grid-cell index_'+(index%2)+_compileCss(c)+'" valign="top">' +
_getColumnValue(c, e) +
'</td>';
else return '';
}, this).join('');
}, this);
// TODO not elegant !
if(this.choiceList_initialized) {
this.choiceList.updateContainer(this.grid_container, list_records);
}
else {
this.choiceList.choices = list_records;
this.choiceList.fillContainer(this.grid_container);
this.choiceList_initialized = true;
}
if(this.options.grabfocus) {
try {this.grid_container.focus();}
catch(e) {}
}
if(typeof this.actionButtons == 'undefined')
this.addActionButtons();
if(!(this.total > 0)) this.options.onEmpty.apply(this);
(this.options.onShow || Prototype.emptyFunction).call();
return this.records.length;
}
}
}());
// registers all grids
GvaScript.Grids = {
grids: $A(),
register: function(grid) {
this.unregister(grid);
this.grids.push(grid);
},
unregister: function(grid) {
// nothing to unregister
if(!grid) return;
if(typeof grid == 'string') grid = this.get(grid);
// nothing to unregister
if(!grid) return false;
// remove the reference from array
this.grids = this.grids.reject(function(g) { return g.getId() == grid.getId() });
return true;
},
get: function(id) {
return this.grids.find(function(g) {return g.getId() == id});
}
}
//----------repeat.js
/* TODO :
- invent syntax for IF blocks (first/last, odd/even)
*/
GvaScript.Repeat = {
//-----------------------------------------------------
// Public methods
//-----------------------------------------------------
init: function(elem) {
this._init_repeat_elements(elem);
},
add: function(repeat_name, count) {
if (count == undefined) count = 1;
// get repeat properties
var placeholder = this._find_placeholder(repeat_name);
var repeat = placeholder.repeat;
var path_ini = repeat.path;
// regex substitutions to build html for the new repetition block (can't
// use Template.replace() because we need structured namespaces)
var regex = new RegExp("#{" + repeat.name + "\\.(\\w+)}", "g");
var replacement = function ($0, $1){var s = repeat[$1];
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
repeat.path = path_ini;
}
return repeat.count;
},
remove: function(repetition_block, live_update) {
// default behavior to live update all blocks below
// the removed block
if(typeof live_update == 'undefined') live_update = true;
// find element, placeholder and repeat info
var elem = $(repetition_block);
elem.id.match(/(.*)\.(\d+)$/);
var repeat_name = RegExp.$1;
var remove_ix = RegExp.$2;
var placeholder = this._find_placeholder(repeat_name);
var max = placeholder.repeat.count;
// fire onRemove event
// remove block from DOM
var block = $(repeat_name + "." + remove_ix);
placeholder.fireEvent("Remove", block);
block.remove();
// if live_update
if(live_update) {
// update repeat.count as first block has been deleted
placeholder.repeat.count -= 1;
// remove all blocks below
var _start_ix = remove_ix;
while(++_start_ix < max) {
block = $(repeat_name + "." + _start_ix);
block.remove();
placeholder.repeat.count -= 1;
}
// re-add the blocks above so that they will be renumbered
var n_add = max - remove_ix - 1;
if (n_add > 0) this.add(placeholder, n_add);
}
},
//-----------------------------------------------------
// Private methods
//-----------------------------------------------------
_find_placeholder: function(name) {
if (typeof name == "string" && !name.match(/.placeholder$/))
name += ".placeholder";
var placeholder = $(name);
if (!placeholder) throw new Error("no such element: " + name);
return placeholder;
},
_init_repeat_elements: function(elem, path) {
elem = $(elem);
if (elem) {
var elements = this._find_repeat_elements(elem);
for (var i = 0; i < elements.length; i++) {
this._init_repeat_element(elements[i], path);
}
}
},
_find_repeat_elements: function(elem) {
var result = [];
// navigate DOM, do not recurse under "repeat" nodes
for (var child = elem.firstChild; child; child = child.nextSibling) {
var has_repeat = child.nodeType == 1 && child.getAttribute('repeat');
result.push(has_repeat ? child : this._find_repeat_elements(child));
}
return result.flatten();
},
_init_repeat_element: function(element, path) {
element = $(element);
path = path || element.getAttribute('repeat-prefix');
// number of initial repetition blocks
var n_blocks = element.getAttribute('repeat-start');
if (n_blocks == undefined) n_blocks = 1;
// hash to hold all properties of the repeat element
var repeat = {};
repeat.name = element.getAttribute('repeat');
repeat.min = element.getAttribute('repeat-min') || 0;
repeat.max = element.getAttribute('repeat-max') || 99;
repeat.count = 0;
repeat.path = (path ? path + "." : "") + repeat.name;
// create a new element (placeholder for new insertion blocks)
var placeholder_tag = element.tagName.match(/^(TR|TD|TBODY|THEAD|TH)$/i)
? element.tagName
: 'SPAN';
var placeholder = document.createElement(placeholder_tag);
placeholder.id = repeat.path + ".placeholder";
placeholder.fireEvent = GvaScript.fireEvent;
element.parentNode.insertBefore(placeholder, element);
// take this elem out of the DOM and into a string ...
{
// a) force the id that will be needed in the template)
element.id = "#{" + repeat.name + ".path}";
// b) remove "repeat*" attributes (don't want them in the template)
var attrs = element.attributes;
var repeat_attrs = [];
for (var i = 0; i < attrs.length; i++) {
var name = attrs[i].name;
if (name.match(/^repeat/i)) repeat_attrs.push(name);
}
repeat_attrs.each(function(name){element.removeAttribute(name, 0)});
// c) keep it as a template string and remove from DOM
repeat.template = Element.outerHTML(element);
element.remove();
}
// store all properties within the placeholder
placeholder.repeat = repeat;
// create initial repetition blocks
this.add(placeholder, n_blocks);
}
};
//----------form.js
/* TODO
- submit attrs on buttons
- action / method / enctype / replace / target / novalidate
- after_submit:
- 204 NO CONTENT : leave doc, apply metadata
- 205 RESET CONTENT : reset form
- replace="document" (new page)
- replace="values" (fill form with new tree)
- relace element
- others ?
- "onreceive" event (response after submit)
- check prototype.js serialize on multivalues
*/
GvaScript.Form = Class.create();
GvaScript.Form.Methods = {
to_hash: function(form) {
form = $(form);
return form.serialize({hash:true});
},
to_tree: function(form) {
form = $(form);
return Hash.expand(GvaScript.Form.to_hash(form));
},
fill_from_tree : (function() {
var doc = document; // local variable is faster than global 'document'
// IMPLEMENTATION NOTE : Form.Element.setValue() is quite similar,
// but our treatment of arrays is different, so we have to reimplement
var _fill_from_value = function(form, elem, val, is_init) {
// force val into an array
if (!(val instanceof Array)) val = [val];
var old_value = null; // needed for value:change custom event
var new_value = null;
switch (elem.type) {
case "text" :
case "textarea" :
case "hidden" :
old_value = elem.value;
elem.value = new_value = val.join(",");
break;
case "checkbox" :
case "radio":
var elem_val = elem.value;
old_value = elem.checked ? elem_val : null;
// hand-crafted loop through val array (because val.include() is too slow)
elem.checked = false;
for (var count = val.length; count--;) {
if (val[count] == elem_val) {
elem.checked = true;
break;
}
}
new_value = elem.checked ? elem_val : null;
break;
case "select-one" :
case "select-multiple" :
var options = elem.options;
var old_values = [],
new_values = [];
for (var i=0, len=options.length; i<len; i++) {
var opt = options[i];
var opt_value = opt.value || opt.text;
if (opt.selected) old_values.push(opt_value);
// hand-crafted loop through val array (because val.include() is too slow
opt.selected = false;
for (var count = val.length; count--;) {
if (val[count] == opt_value) {
new_values.push(opt_value);
opt.selected = true;
break;
}
}
}
old_value = old_values.join(",");
new_value = new_values.join(",");
break;
default:
// if no element type, might be a node list
var elem_length = elem.length;
if (elem_length !== undefined) {
for (var i=0; i < elem_length; i++) {
_fill_from_value(form, elem.item(i), val, is_init);
}
}
else
throw new Error("unexpected elem type : " + elem.type);
break;
} // end switch
// if initializing form
// and form has an init handler registered to its inputs
// and elem has a new_value set
// => fire the custom 'value:init' event
if (is_init) {
if (form.has_init_registered)
if (new_value)
Element.fire(elem, 'value:init', {newvalue: new_value});
}
else {
if (new_value != old_value)
Element.fire(elem, 'value:change', {oldvalue: old_value, newvalue: new_value});
}
}
var _fill_from_array = function (form, field_prefix, array, is_init) {
for (var i=0, len=array.length; i < len; i++) {
var new_prefix = field_prefix + "." + i;
// if form has a corresponding named element, fill it
var elem = form[new_prefix];
if (elem) {
_fill_from_value(form, elem, array[i], is_init);
continue;
}
// otherwise try to walk down to a repetition block
// try to find an existing repetition block
elem = doc.getElementById(new_prefix); // TODO : check: is elem in form ?
// no repetition block found, try to instanciate one
if (!elem) {
var placeholder = doc.getElementById(field_prefix + ".placeholder");
if (placeholder && placeholder.repeat) {
GvaScript.Repeat.add(placeholder, i + 1 - placeholder.repeat.count);
elem = doc.getElementById(new_prefix);
}
}
// recurse to the repetition block
// mremlawi: sometimes multi-value fields are filled without
// passing by the repeat moduleearly
// -> no id's on repeatable blocks are set but need to recurse anyway
// if (elem)
GvaScript.Form.fill_from_tree(form, new_prefix, array[i], is_init);
}
}
function fill_from_tree(form, field_prefix, tree, is_init) {
if (Object.isString(form)) form = $(form);
for (var key in tree) {
if (!tree.hasOwnProperty(key)) continue;
var val = tree[key];
var new_prefix = field_prefix ? field_prefix+'.'+key : key;
switch (typeof(val)) {
case "boolean" :
val = val ? "true" : "";
// NO break here
case "string":
case "number":
var elem = form[new_prefix];
if (elem)
_fill_from_value(form, elem, val, is_init);
break;
case "object":
if (val instanceof Array) {
var elem = form[new_prefix];
// value is an array but to be filled
// in one form element =>
// join array into one value using multival separator
if (elem)
_fill_from_value(
form, elem, val.join(GvaScript.Forms.multival_sep), is_init
);
else
_fill_from_array(form, new_prefix, val, is_init);
}
else
this.fill_from_tree(form, new_prefix, val, is_init);
break;
case "function":
case "undefined":
// do nothing
}
}
}
return fill_from_tree;
})(),
autofocus: function(container) {
if (Object.isString(container))
container = document.getElementById(container);
// replace prototype's down selector
// as it performs slowly on IE6
var _find_autofocus = function(p_node) {
var _kids = p_node.childNodes;
for(var _idx = 0, len = _kids.length; _idx < len; ) {
_kid = _kids[_idx ++];
if(_kid.nodeType == 1) {
if(Element.hasAttribute(_kid, 'autofocus')) {
return _kid;
}
else {
var _look_in_descendants = _find_autofocus(_kid);
if(_look_in_descendants) return _look_in_descendants;
}
}
}
}
if(container) {
//slow on IE6
//var target = container.down('[autofocus]');
var target = _find_autofocus(container);
// TODO : check if target is visible
if (target) try {target.activate()}
catch(e){}
}
},
/**
* wrapper around Element.register method.
* method wrapped for special handling of form inputs
* 'change' and 'init' events
*
* all handlers will receive 'event' object as a first argument.
* 'change' handler will also receive input's oldvalue/newvalue as
* second and third arguments respectively.
* 'init' handler will also receive input's newvalue as a
* second argument.
*
* @param {string} query : css selector to match elements
* to watch
* @param {string} eventname : standard event name that can be triggered
* by form inputs + the custom 'init' event
* that is triggerd on form initialization
* @param {Function} handler : function to execute.
*
* @return undefined
*/
register: function(form, query, eventname, handler) {
form = $(form);
switch(eventname) {
// change event doesnot bubble in IE
// rely on blur event to check for change
// and fire value:change event
case 'change':
form.register(query, 'focus', function(event) {
var elt = event._target;
elt.store('value', elt.getValue());
});
form.register(query, 'blur', function(event) {
var elt = event._target;
var oldvalue = elt.retrieve('value');
lib/Alien/GvaScript/lib/GvaScript.js view on Meta::CPAN
}
}
// GvaScript.Form helpers and methods
Object.extend(GvaScript.Form, GvaScript.Form.Methods);
Object.extend(GvaScript.Form, {
init: function(form, tree, field_prefix, skipAutofocus) {
form = $(form);
GvaScript.Repeat.init(form);
GvaScript.Form.fill_from_tree(form,
field_prefix || "",
tree || {},
true);
if (!skipAutofocus)
GvaScript.Form.autofocus(form);
},
add: function(repeat_name, count) {
var n_blocks = GvaScript.Repeat.add(repeat_name, count);
var last_block = repeat_name + "." + (n_blocks - 1);
GvaScript.Form.autofocus(last_block);
// get form owner of block
if(_block = $(last_block)) {
_form = _block.up('form');
// check if form has a GvaSCript.Form instance
// wrapped around it
if(_form) {
if(_gva_form = GvaScript.Forms.get(_form.identify())) {
_gva_form.fire('RepeatBlockAdd', [repeat_name.split('.').last(), last_block]);
_gva_form.fire('Change');
}
}
}
return n_blocks;
},
remove: function(repetition_block, live_update) {
// default behavior to live update all blocks below
// the removed block
if(typeof live_update == 'undefined') live_update = true;
// find element and repeat info
var elem = $(repetition_block);
elem.id.match(/(.*)\.(\d+)$/);
var repeat_name = RegExp.$1;
var remove_ix = RegExp.$2;
var form = elem.up('form');
var tree = {}; // form deserialized as a tree
// only relevant if live_update
// need to update the data for blocks below
// as they have been reproduced
if(live_update) {
// get form data corresponding to the repeated section (should be an array)
tree = GvaScript.Form.to_tree(form);
var parts = repeat_name.split(/\./);
for (var i = 0, len=parts.length ; i < len; i++) {
if (!tree) break;
tree = tree[parts[i]];
}
// remove rows below, and shift rows above
if (tree && tree instanceof Array) {
tree.splice(remove_ix, 1);
for (var i = 0 ; i < remove_ix; i++) {
delete tree[i];
}
}
}
// call Repeat.remove() to remove from DOM
// and if live_update, to remove and reproduce
// the blocks below with correct renumerations
GvaScript.Repeat.remove(repetition_block, live_update);
// after form tree has been updated
// and dom re-populated
if(live_update) {
// re-populate blocks below
GvaScript.Form.fill_from_tree(form, repeat_name, tree);
}
// check if form has a GvaSCript.Form instance
// wrapped around it
if(_gva_form = GvaScript.Forms.get(form.identify())) {
_gva_form.fire('RepeatBlockRemove', [repeat_name.split('.').last(), repeat_name + '.' + remove_ix]);
_gva_form.fire('Change');
}
}
});
// copy GvaScript.Form methods into GvaScript.Form.prototype
// set the first argument of methods to this.formElt
(function() {
var update = function (array, args) {
var arrayLength = array.length, length = args.length;
while (length--) array[arrayLength + length] = args[length];
return array;
}
for(var m_name in GvaScript.Form.Methods) {
var method = GvaScript.Form.Methods[m_name];
if (Object.isFunction(method)) {
GvaScript.Form.prototype[m_name] = (function() {
var __method = method;
return function() {
var a = update([this.formElt], arguments);
return __method.apply(null, a);
}
})();
}
}
})();
( run in 0.786 second using v1.01-cache-2.11-cpan-02777c243ea )