Merged in newer versions of the Prototype and Prototype Window libraries
git-svn-id: file:///home/svn/framework3/trunk@4427 4d416f70-5f16-0410-b530-b9f4589650daunstable
HD Moore
parent
52ebcde5a0
commit
0ef487587d
|
|
@ -168,7 +168,7 @@ function create_window_ajax(target_url, wid, wtitle, wwidth, wheight) {
|
|||
* Height and width are fixed, should be working values in all cases.
|
||||
*/
|
||||
function openModuleWindow(mtype, refname, wtitle) {
|
||||
var mWin = create_window_ajax("/" + mtype + "/view?refname=" + refname, mtype + "-view-" + obtainWindowId(), wtitle, 500, 350);
|
||||
var mWin = create_window_ajax("/" + mtype + "/view?refname=" + refname, mtype + "-view-" + obtainWindowId(), wtitle, 650, 350);
|
||||
mWin.setDestroyOnClose();
|
||||
mWin.showCenter();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,137 @@
|
|||
var debugWindow = null;
|
||||
function debug(text, reverse) {
|
||||
if (debugWindow == null)
|
||||
return;
|
||||
|
||||
time = "-"; //new Date();
|
||||
if (reverse) {
|
||||
$('debug').innerHTML = time + " " + text + "<br>"+ $('debug').innerHTML;
|
||||
debugWindow.getContent().scrollTop=0;
|
||||
}
|
||||
else {
|
||||
$('debug').innerHTML += time + " " + text + "<br>";
|
||||
debugWindow.getContent().scrollTop=10000; // Far away
|
||||
}
|
||||
}
|
||||
|
||||
function hideDebug() {
|
||||
if (debugWindow) {
|
||||
debugWindow.destroy();
|
||||
debugWindow = null;
|
||||
}
|
||||
}
|
||||
|
||||
function showDebug(bShow) {
|
||||
if (debugWindow == null) {
|
||||
debugWindow = new Window('debug_window', {className: 'dialog',width:250, height:100, right:4, bottom:42, zIndex:1000, opacity:1, showEffect: Element.show, resizable: true, title: "Debug"})
|
||||
debugWindow.getContent().innerHTML = "<style>#debug_window .dialog_content {background:#000;}</style> <div id='debug'></div>";
|
||||
date=new Date;
|
||||
date.setMonth(date.getMonth()+3);
|
||||
|
||||
//debugWindow.setCookie(null, date);
|
||||
}
|
||||
if( typeof bShow == 'undefined' || bShow)debugWindow.show()
|
||||
}
|
||||
|
||||
|
||||
function clearDebug() {
|
||||
if (debugWindow == null)
|
||||
return;
|
||||
$('debug').innerHTML = "";
|
||||
}
|
||||
|
||||
/**
|
||||
* document.createElement convenience wrapper
|
||||
*
|
||||
* The data parameter is an object that must have the "tag" key, containing
|
||||
* a string with the tagname of the element to create. It can optionally have
|
||||
* a "children" key which can be: a string, "data" object, or an array of "data"
|
||||
* objects to append to this element as children. Any other key is taken as an
|
||||
* attribute to be applied to this tag.
|
||||
*
|
||||
* Available under an MIT license:
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
*
|
||||
* @param {Object} data The data representing the element to create
|
||||
* @return {Element} The element created.
|
||||
*/
|
||||
function $E(data) {
|
||||
var el;
|
||||
if ('string'==typeof data) {
|
||||
el=document.createTextNode(data);
|
||||
} else {
|
||||
//create the element
|
||||
el=document.createElement(data.tag);
|
||||
delete(data.tag);
|
||||
|
||||
//append the children
|
||||
if ('undefined'!=typeof data.children) {
|
||||
if ('string'==typeof data.children ||'undefined'==typeof data.children.length) {
|
||||
//strings and single elements
|
||||
el.appendChild($E(data.children));
|
||||
} else {
|
||||
//arrays of elements
|
||||
for (var i=0, child=null; 'undefined'!=typeof (child=data.children[i]); i++) {
|
||||
el.appendChild($E(child));
|
||||
}
|
||||
}
|
||||
delete(data.children);
|
||||
}
|
||||
|
||||
//any other data is attributes
|
||||
for (attr in data) {
|
||||
el[attr]=data[attr];
|
||||
}
|
||||
}
|
||||
|
||||
return el;
|
||||
}
|
||||
|
||||
// FROM Nick Hemsley
|
||||
var Debug = {
|
||||
inspectOutput: function (container, within) {
|
||||
within = within || debugWindow.getContent()
|
||||
|
||||
if (debugWindow == null)
|
||||
return;
|
||||
|
||||
within.appendChild(container)
|
||||
},
|
||||
|
||||
inspect: function(object) {
|
||||
var cont = $E({tag: "div", className: "inspector"})
|
||||
Debug.inspectObj(object, cont)
|
||||
debugWindow.getContent().appendChild(cont)
|
||||
},
|
||||
|
||||
inspectObj: function (object, container) {
|
||||
for (prop in object) {
|
||||
Debug.inspectOutput(Debug.inspectable(object, prop), container)
|
||||
}
|
||||
},
|
||||
|
||||
inspectable: function(object, prop) {
|
||||
cont = $E({tag: 'div', className: 'inspectable', children: [prop + " value: " + object[prop] ]})
|
||||
cont.toInspect = object[prop]
|
||||
Event.observe(cont, 'click', Debug.inspectClicked, false)
|
||||
return cont
|
||||
},
|
||||
|
||||
inspectClicked: function(e) {
|
||||
Debug.inspectContained(Event.element(e))
|
||||
Event.stop(e)
|
||||
},
|
||||
|
||||
inspectContained: function(container) {
|
||||
if (container.opened) {
|
||||
container.parentNode.removeChild(container.opened)
|
||||
delete(container.opened)
|
||||
} else {
|
||||
sibling = container.parentNode.insertBefore($E({tag: "div", className: "child"}), container.nextSibling)
|
||||
if (container.toInspect)
|
||||
Debug.inspectObj(container.toInspect, sibling)
|
||||
container.opened = sibling
|
||||
}
|
||||
}
|
||||
}
|
||||
var inspect = Debug.inspect;
|
||||
|
|
@ -1,15 +1,18 @@
|
|||
// Copyright (c) 2005 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// script.aculo.us effects.js v1.7.0, Fri Jan 19 19:16:36 CET 2007
|
||||
|
||||
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// Contributors:
|
||||
// Justin Palmer (http://encytemedia.com/)
|
||||
// Mark Pilgrim (http://diveintomark.org/)
|
||||
// Martin Bialasinki
|
||||
//
|
||||
// See scriptaculous.js for full license.
|
||||
// script.aculo.us is freely distributable under the terms of an MIT-style license.
|
||||
// For details, see the script.aculo.us web site: http://script.aculo.us/
|
||||
|
||||
// converts rgb() and #xxx to #xxxxxx format,
|
||||
// returns self (or first argument) if not convertable
|
||||
String.prototype.parseColor = function() {
|
||||
var color = '#';
|
||||
var color = '#';
|
||||
if(this.slice(0,4) == 'rgb(') {
|
||||
var cols = this.slice(4,this.length-1).split(',');
|
||||
var i=0; do { color += parseInt(cols[i]).toColorPart() } while (++i<3);
|
||||
|
|
@ -41,48 +44,21 @@ Element.collectTextNodesIgnoreClass = function(element, className) {
|
|||
|
||||
Element.setContentZoom = function(element, percent) {
|
||||
element = $(element);
|
||||
Element.setStyle(element, {fontSize: (percent/100) + 'em'});
|
||||
element.setStyle({fontSize: (percent/100) + 'em'});
|
||||
if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0);
|
||||
return element;
|
||||
}
|
||||
|
||||
Element.getOpacity = function(element){
|
||||
var opacity;
|
||||
if (opacity = Element.getStyle(element, 'opacity'))
|
||||
return parseFloat(opacity);
|
||||
if (opacity = (Element.getStyle(element, 'filter') || '').match(/alpha\(opacity=(.*)\)/))
|
||||
if(opacity[1]) return parseFloat(opacity[1]) / 100;
|
||||
return 1.0;
|
||||
Element.getOpacity = function(element){
|
||||
return $(element).getStyle('opacity');
|
||||
}
|
||||
|
||||
Element.setOpacity = function(element, value){
|
||||
element= $(element);
|
||||
if (value == 1){
|
||||
Element.setStyle(element, { opacity:
|
||||
(/Gecko/.test(navigator.userAgent) && !/Konqueror|Safari|KHTML/.test(navigator.userAgent)) ?
|
||||
0.999999 : null });
|
||||
if(/MSIE/.test(navigator.userAgent))
|
||||
Element.setStyle(element, {filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'')});
|
||||
} else {
|
||||
if(value < 0.00001) value = 0;
|
||||
Element.setStyle(element, {opacity: value});
|
||||
if(/MSIE/.test(navigator.userAgent))
|
||||
Element.setStyle(element,
|
||||
{ filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'') +
|
||||
'alpha(opacity='+value*100+')' });
|
||||
}
|
||||
}
|
||||
|
||||
Element.getInlineOpacity = function(element){
|
||||
Element.setOpacity = function(element, value){
|
||||
return $(element).setStyle({opacity:value});
|
||||
}
|
||||
|
||||
Element.getInlineOpacity = function(element){
|
||||
return $(element).style.opacity || '';
|
||||
}
|
||||
|
||||
Element.childrenWithClassName = function(element, className, findFirst) {
|
||||
var classNameRegExp = new RegExp("(^|\\s)" + className + "(\\s|$)");
|
||||
var results = $A($(element).getElementsByTagName('*'))[findFirst ? 'detect' : 'select']( function(c) {
|
||||
return (c.className && c.className.match(classNameRegExp));
|
||||
});
|
||||
if(!results) results = [];
|
||||
return results;
|
||||
}
|
||||
|
||||
Element.forceRerendering = function(element) {
|
||||
|
|
@ -104,9 +80,17 @@ Array.prototype.call = function() {
|
|||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var Effect = {
|
||||
_elementDoesNotExistError: {
|
||||
name: 'ElementDoesNotExistError',
|
||||
message: 'The specified DOM element does not exist, but is required for this effect to operate'
|
||||
},
|
||||
tagifyText: function(element) {
|
||||
if(typeof Builder == 'undefined')
|
||||
throw("Effect.tagifyText requires including script.aculo.us' builder.js library");
|
||||
|
||||
var tagifyStyle = 'position:relative';
|
||||
if(/MSIE/.test(navigator.userAgent)) tagifyStyle += ';zoom:1';
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera) tagifyStyle += ';zoom:1';
|
||||
|
||||
element = $(element);
|
||||
$A(element.childNodes).each( function(child) {
|
||||
if(child.nodeType==3) {
|
||||
|
|
@ -159,33 +143,35 @@ var Effect2 = Effect; // deprecated
|
|||
|
||||
/* ------------- transitions ------------- */
|
||||
|
||||
Effect.Transitions = {}
|
||||
|
||||
Effect.Transitions.linear = function(pos) {
|
||||
return pos;
|
||||
}
|
||||
Effect.Transitions.sinoidal = function(pos) {
|
||||
return (-Math.cos(pos*Math.PI)/2) + 0.5;
|
||||
}
|
||||
Effect.Transitions.reverse = function(pos) {
|
||||
return 1-pos;
|
||||
}
|
||||
Effect.Transitions.flicker = function(pos) {
|
||||
return ((-Math.cos(pos*Math.PI)/4) + 0.75) + Math.random()/4;
|
||||
}
|
||||
Effect.Transitions.wobble = function(pos) {
|
||||
return (-Math.cos(pos*Math.PI*(9*pos))/2) + 0.5;
|
||||
}
|
||||
Effect.Transitions.pulse = function(pos) {
|
||||
return (Math.floor(pos*10) % 2 == 0 ?
|
||||
(pos*10-Math.floor(pos*10)) : 1-(pos*10-Math.floor(pos*10)));
|
||||
}
|
||||
Effect.Transitions.none = function(pos) {
|
||||
return 0;
|
||||
}
|
||||
Effect.Transitions.full = function(pos) {
|
||||
return 1;
|
||||
}
|
||||
Effect.Transitions = {
|
||||
linear: Prototype.K,
|
||||
sinoidal: function(pos) {
|
||||
return (-Math.cos(pos*Math.PI)/2) + 0.5;
|
||||
},
|
||||
reverse: function(pos) {
|
||||
return 1-pos;
|
||||
},
|
||||
flicker: function(pos) {
|
||||
return ((-Math.cos(pos*Math.PI)/4) + 0.75) + Math.random()/4;
|
||||
},
|
||||
wobble: function(pos) {
|
||||
return (-Math.cos(pos*Math.PI*(9*pos))/2) + 0.5;
|
||||
},
|
||||
pulse: function(pos, pulses) {
|
||||
pulses = pulses || 5;
|
||||
return (
|
||||
Math.round((pos % (1/pulses)) * pulses) == 0 ?
|
||||
((pos * pulses * 2) - Math.floor(pos * pulses * 2)) :
|
||||
1 - ((pos * pulses * 2) - Math.floor(pos * pulses * 2))
|
||||
);
|
||||
},
|
||||
none: function(pos) {
|
||||
return 0;
|
||||
},
|
||||
full: function(pos) {
|
||||
return 1;
|
||||
}
|
||||
};
|
||||
|
||||
/* ------------- core effects ------------- */
|
||||
|
||||
|
|
@ -212,6 +198,9 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
e.finishOn += effect.finishOn;
|
||||
});
|
||||
break;
|
||||
case 'with-last':
|
||||
timestamp = this.effects.pluck('startOn').max() || timestamp;
|
||||
break;
|
||||
case 'end':
|
||||
// start effect after last queued effect has finished
|
||||
timestamp = this.effects.pluck('finishOn').max() || timestamp;
|
||||
|
|
@ -225,7 +214,7 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
this.effects.push(effect);
|
||||
|
||||
if(!this.interval)
|
||||
this.interval = setInterval(this.loop.bind(this), 40);
|
||||
this.interval = setInterval(this.loop.bind(this), 15);
|
||||
},
|
||||
remove: function(effect) {
|
||||
this.effects = this.effects.reject(function(e) { return e==effect });
|
||||
|
|
@ -236,7 +225,8 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
},
|
||||
loop: function() {
|
||||
var timePos = new Date().getTime();
|
||||
this.effects.invoke('loop', timePos);
|
||||
for(var i=0, len=this.effects.length;i<len;i++)
|
||||
if(this.effects[i]) this.effects[i].loop(timePos);
|
||||
}
|
||||
});
|
||||
|
||||
|
|
@ -256,7 +246,7 @@ Effect.Queue = Effect.Queues.get('global');
|
|||
Effect.DefaultOptions = {
|
||||
transition: Effect.Transitions.sinoidal,
|
||||
duration: 1.0, // seconds
|
||||
fps: 25.0, // max. 25fps due to Effect.Queue implementation
|
||||
fps: 60.0, // max. 60fps due to Effect.Queue implementation
|
||||
sync: false, // true for combining
|
||||
from: 0.0,
|
||||
to: 1.0,
|
||||
|
|
@ -324,7 +314,10 @@ Effect.Base.prototype = {
|
|||
if(this.options[eventName]) this.options[eventName](this);
|
||||
},
|
||||
inspect: function() {
|
||||
return '#<Effect:' + $H(this).inspect() + ',options:' + $H(this.options).inspect() + '>';
|
||||
var data = $H();
|
||||
for(property in this)
|
||||
if(typeof this[property] != 'function') data[property] = this[property];
|
||||
return '#<Effect:' + data.inspect() + ',options:' + $H(this.options).inspect() + '>';
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -348,12 +341,24 @@ Object.extend(Object.extend(Effect.Parallel.prototype, Effect.Base.prototype), {
|
|||
}
|
||||
});
|
||||
|
||||
Effect.Event = Class.create();
|
||||
Object.extend(Object.extend(Effect.Event.prototype, Effect.Base.prototype), {
|
||||
initialize: function() {
|
||||
var options = Object.extend({
|
||||
duration: 0
|
||||
}, arguments[0] || {});
|
||||
this.start(options);
|
||||
},
|
||||
update: Prototype.emptyFunction
|
||||
});
|
||||
|
||||
Effect.Opacity = Class.create();
|
||||
Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if(!this.element) throw(Effect._elementDoesNotExistError);
|
||||
// make this work on IE on elements without 'layout'
|
||||
if(/MSIE/.test(navigator.userAgent) && (!this.element.hasLayout))
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera && (!this.element.currentStyle.hasLayout))
|
||||
this.element.setStyle({zoom: 1});
|
||||
var options = Object.extend({
|
||||
from: this.element.getOpacity() || 0.0,
|
||||
|
|
@ -370,6 +375,7 @@ Effect.Move = Class.create();
|
|||
Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if(!this.element) throw(Effect._elementDoesNotExistError);
|
||||
var options = Object.extend({
|
||||
x: 0,
|
||||
y: 0,
|
||||
|
|
@ -393,8 +399,8 @@ Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
|
|||
},
|
||||
update: function(position) {
|
||||
this.element.setStyle({
|
||||
left: this.options.x * position + this.originalLeft + 'px',
|
||||
top: this.options.y * position + this.originalTop + 'px'
|
||||
left: Math.round(this.options.x * position + this.originalLeft) + 'px',
|
||||
top: Math.round(this.options.y * position + this.originalTop) + 'px'
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
@ -408,7 +414,8 @@ Effect.MoveBy = function(element, toTop, toLeft) {
|
|||
Effect.Scale = Class.create();
|
||||
Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element, percent) {
|
||||
this.element = $(element)
|
||||
this.element = $(element);
|
||||
if(!this.element) throw(Effect._elementDoesNotExistError);
|
||||
var options = Object.extend({
|
||||
scaleX: true,
|
||||
scaleY: true,
|
||||
|
|
@ -433,7 +440,7 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
|||
this.originalLeft = this.element.offsetLeft;
|
||||
|
||||
var fontSize = this.element.getStyle('font-size') || '100%';
|
||||
['em','px','%'].each( function(fontSizeType) {
|
||||
['em','px','%','pt'].each( function(fontSizeType) {
|
||||
if(fontSize.indexOf(fontSizeType)>0) {
|
||||
this.fontSize = parseFloat(fontSize);
|
||||
this.fontSizeType = fontSizeType;
|
||||
|
|
@ -458,12 +465,12 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
|||
this.setDimensions(this.dims[0] * currentScale, this.dims[1] * currentScale);
|
||||
},
|
||||
finish: function(position) {
|
||||
if (this.restoreAfterFinish) this.element.setStyle(this.originalStyle);
|
||||
if(this.restoreAfterFinish) this.element.setStyle(this.originalStyle);
|
||||
},
|
||||
setDimensions: function(height, width) {
|
||||
var d = {};
|
||||
if(this.options.scaleX) d.width = width + 'px';
|
||||
if(this.options.scaleY) d.height = height + 'px';
|
||||
if(this.options.scaleX) d.width = Math.round(width) + 'px';
|
||||
if(this.options.scaleY) d.height = Math.round(height) + 'px';
|
||||
if(this.options.scaleFromCenter) {
|
||||
var topd = (height - this.dims[0])/2;
|
||||
var leftd = (width - this.dims[1])/2;
|
||||
|
|
@ -483,6 +490,7 @@ Effect.Highlight = Class.create();
|
|||
Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if(!this.element) throw(Effect._elementDoesNotExistError);
|
||||
var options = Object.extend({ startcolor: '#ffff99' }, arguments[1] || {});
|
||||
this.start(options);
|
||||
},
|
||||
|
|
@ -490,9 +498,11 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
|
|||
// Prevent executing on elements not in the layout flow
|
||||
if(this.element.getStyle('display')=='none') { this.cancel(); return; }
|
||||
// Disable background image during the effect
|
||||
this.oldStyle = {
|
||||
backgroundImage: this.element.getStyle('background-image') };
|
||||
this.element.setStyle({backgroundImage: 'none'});
|
||||
this.oldStyle = {};
|
||||
if (!this.options.keepBackgroundImage) {
|
||||
this.oldStyle.backgroundImage = this.element.getStyle('background-image');
|
||||
this.element.setStyle({backgroundImage: 'none'});
|
||||
}
|
||||
if(!this.options.endcolor)
|
||||
this.options.endcolor = this.element.getStyle('background-color').parseColor('#ffffff');
|
||||
if(!this.options.restorecolor)
|
||||
|
|
@ -547,8 +557,7 @@ Effect.Fade = function(element) {
|
|||
to: 0.0,
|
||||
afterFinishInternal: function(effect) {
|
||||
if(effect.options.to!=0) return;
|
||||
effect.element.hide();
|
||||
effect.element.setStyle({opacity: oldOpacity});
|
||||
effect.element.hide().setStyle({opacity: oldOpacity});
|
||||
}}, arguments[1] || {});
|
||||
return new Effect.Opacity(element,options);
|
||||
}
|
||||
|
|
@ -563,25 +572,31 @@ Effect.Appear = function(element) {
|
|||
effect.element.forceRerendering();
|
||||
},
|
||||
beforeSetup: function(effect) {
|
||||
effect.element.setOpacity(effect.options.from);
|
||||
effect.element.show();
|
||||
effect.element.setOpacity(effect.options.from).show();
|
||||
}}, arguments[1] || {});
|
||||
return new Effect.Opacity(element,options);
|
||||
}
|
||||
|
||||
Effect.Puff = function(element) {
|
||||
element = $(element);
|
||||
var oldStyle = { opacity: element.getInlineOpacity(), position: element.getStyle('position') };
|
||||
var oldStyle = {
|
||||
opacity: element.getInlineOpacity(),
|
||||
position: element.getStyle('position'),
|
||||
top: element.style.top,
|
||||
left: element.style.left,
|
||||
width: element.style.width,
|
||||
height: element.style.height
|
||||
};
|
||||
return new Effect.Parallel(
|
||||
[ new Effect.Scale(element, 200,
|
||||
{ sync: true, scaleFromCenter: true, scaleContent: true, restoreAfterFinish: true }),
|
||||
new Effect.Opacity(element, { sync: true, to: 0.0 } ) ],
|
||||
Object.extend({ duration: 1.0,
|
||||
beforeSetupInternal: function(effect) {
|
||||
effect.effects[0].element.setStyle({position: 'absolute'}); },
|
||||
Position.absolutize(effect.effects[0].element)
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.effects[0].element.hide();
|
||||
effect.effects[0].element.setStyle(oldStyle); }
|
||||
effect.effects[0].element.hide().setStyle(oldStyle); }
|
||||
}, arguments[1] || {})
|
||||
);
|
||||
}
|
||||
|
|
@ -589,13 +604,12 @@ Effect.Puff = function(element) {
|
|||
Effect.BlindUp = function(element) {
|
||||
element = $(element);
|
||||
element.makeClipping();
|
||||
return new Effect.Scale(element, 0,
|
||||
return new Effect.Scale(element, 0,
|
||||
Object.extend({ scaleContent: false,
|
||||
scaleX: false,
|
||||
restoreAfterFinish: true,
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide();
|
||||
effect.element.undoClipping();
|
||||
effect.element.hide().undoClipping();
|
||||
}
|
||||
}, arguments[1] || {})
|
||||
);
|
||||
|
|
@ -604,28 +618,25 @@ Effect.BlindUp = function(element) {
|
|||
Effect.BlindDown = function(element) {
|
||||
element = $(element);
|
||||
var elementDimensions = element.getDimensions();
|
||||
return new Effect.Scale(element, 100,
|
||||
Object.extend({ scaleContent: false,
|
||||
scaleX: false,
|
||||
scaleFrom: 0,
|
||||
scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
|
||||
restoreAfterFinish: true,
|
||||
afterSetup: function(effect) {
|
||||
effect.element.makeClipping();
|
||||
effect.element.setStyle({height: '0px'});
|
||||
effect.element.show();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.undoClipping();
|
||||
}
|
||||
}, arguments[1] || {})
|
||||
);
|
||||
return new Effect.Scale(element, 100, Object.extend({
|
||||
scaleContent: false,
|
||||
scaleX: false,
|
||||
scaleFrom: 0,
|
||||
scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
|
||||
restoreAfterFinish: true,
|
||||
afterSetup: function(effect) {
|
||||
effect.element.makeClipping().setStyle({height: '0px'}).show();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.undoClipping();
|
||||
}
|
||||
}, arguments[1] || {}));
|
||||
}
|
||||
|
||||
Effect.SwitchOff = function(element) {
|
||||
element = $(element);
|
||||
var oldOpacity = element.getInlineOpacity();
|
||||
return new Effect.Appear(element, {
|
||||
return new Effect.Appear(element, Object.extend({
|
||||
duration: 0.4,
|
||||
from: 0,
|
||||
transition: Effect.Transitions.flicker,
|
||||
|
|
@ -634,18 +645,14 @@ Effect.SwitchOff = function(element) {
|
|||
duration: 0.3, scaleFromCenter: true,
|
||||
scaleX: false, scaleContent: false, restoreAfterFinish: true,
|
||||
beforeSetup: function(effect) {
|
||||
effect.element.makePositioned();
|
||||
effect.element.makeClipping();
|
||||
effect.element.makePositioned().makeClipping();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide();
|
||||
effect.element.undoClipping();
|
||||
effect.element.undoPositioned();
|
||||
effect.element.setStyle({opacity: oldOpacity});
|
||||
effect.element.hide().undoClipping().undoPositioned().setStyle({opacity: oldOpacity});
|
||||
}
|
||||
})
|
||||
}
|
||||
});
|
||||
}, arguments[1] || {}));
|
||||
}
|
||||
|
||||
Effect.DropOut = function(element) {
|
||||
|
|
@ -663,9 +670,7 @@ Effect.DropOut = function(element) {
|
|||
effect.effects[0].element.makePositioned();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.effects[0].element.hide();
|
||||
effect.effects[0].element.undoPositioned();
|
||||
effect.effects[0].element.setStyle(oldStyle);
|
||||
effect.effects[0].element.hide().undoPositioned().setStyle(oldStyle);
|
||||
}
|
||||
}, arguments[1] || {}));
|
||||
}
|
||||
|
|
@ -687,54 +692,42 @@ Effect.Shake = function(element) {
|
|||
{ x: 40, y: 0, duration: 0.1, afterFinishInternal: function(effect) {
|
||||
new Effect.Move(effect.element,
|
||||
{ x: -20, y: 0, duration: 0.05, afterFinishInternal: function(effect) {
|
||||
effect.element.undoPositioned();
|
||||
effect.element.setStyle(oldStyle);
|
||||
effect.element.undoPositioned().setStyle(oldStyle);
|
||||
}}) }}) }}) }}) }}) }});
|
||||
}
|
||||
|
||||
Effect.SlideDown = function(element) {
|
||||
element = $(element);
|
||||
element.cleanWhitespace();
|
||||
element = $(element).cleanWhitespace();
|
||||
// SlideDown need to have the content of the element wrapped in a container element with fixed height!
|
||||
var oldInnerBottom = $(element.firstChild).getStyle('bottom');
|
||||
var oldInnerBottom = element.down().getStyle('bottom');
|
||||
var elementDimensions = element.getDimensions();
|
||||
return new Effect.Scale(element, 100, Object.extend({
|
||||
scaleContent: false,
|
||||
scaleX: false,
|
||||
scaleFrom: 0,
|
||||
scaleFrom: window.opera ? 0 : 1,
|
||||
scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
|
||||
restoreAfterFinish: true,
|
||||
afterSetup: function(effect) {
|
||||
effect.element.makePositioned();
|
||||
effect.element.firstChild.makePositioned();
|
||||
effect.element.down().makePositioned();
|
||||
if(window.opera) effect.element.setStyle({top: ''});
|
||||
effect.element.makeClipping();
|
||||
effect.element.setStyle({height: '0px'});
|
||||
effect.element.show(); },
|
||||
effect.element.makeClipping().setStyle({height: '0px'}).show();
|
||||
},
|
||||
afterUpdateInternal: function(effect) {
|
||||
effect.element.firstChild.setStyle({bottom:
|
||||
effect.element.down().setStyle({bottom:
|
||||
(effect.dims[0] - effect.element.clientHeight) + 'px' });
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.undoClipping();
|
||||
// IE will crash if child is undoPositioned first
|
||||
if(/MSIE/.test(navigator.userAgent)){
|
||||
effect.element.undoPositioned();
|
||||
effect.element.firstChild.undoPositioned();
|
||||
}else{
|
||||
effect.element.firstChild.undoPositioned();
|
||||
effect.element.undoPositioned();
|
||||
}
|
||||
effect.element.firstChild.setStyle({bottom: oldInnerBottom}); }
|
||||
effect.element.undoClipping().undoPositioned();
|
||||
effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom}); }
|
||||
}, arguments[1] || {})
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Effect.SlideUp = function(element) {
|
||||
element = $(element);
|
||||
element.cleanWhitespace();
|
||||
var oldInnerBottom = $(element.firstChild).getStyle('bottom');
|
||||
return new Effect.Scale(element, 0,
|
||||
element = $(element).cleanWhitespace();
|
||||
var oldInnerBottom = element.down().getStyle('bottom');
|
||||
return new Effect.Scale(element, window.opera ? 0 : 1,
|
||||
Object.extend({ scaleContent: false,
|
||||
scaleX: false,
|
||||
scaleMode: 'box',
|
||||
|
|
@ -742,32 +735,32 @@ Effect.SlideUp = function(element) {
|
|||
restoreAfterFinish: true,
|
||||
beforeStartInternal: function(effect) {
|
||||
effect.element.makePositioned();
|
||||
effect.element.firstChild.makePositioned();
|
||||
effect.element.down().makePositioned();
|
||||
if(window.opera) effect.element.setStyle({top: ''});
|
||||
effect.element.makeClipping();
|
||||
effect.element.show(); },
|
||||
effect.element.makeClipping().show();
|
||||
},
|
||||
afterUpdateInternal: function(effect) {
|
||||
effect.element.firstChild.setStyle({bottom:
|
||||
(effect.dims[0] - effect.element.clientHeight) + 'px' }); },
|
||||
effect.element.down().setStyle({bottom:
|
||||
(effect.dims[0] - effect.element.clientHeight) + 'px' });
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide();
|
||||
effect.element.undoClipping();
|
||||
effect.element.firstChild.undoPositioned();
|
||||
effect.element.undoPositioned();
|
||||
effect.element.setStyle({bottom: oldInnerBottom}); }
|
||||
effect.element.hide().undoClipping().undoPositioned().setStyle({bottom: oldInnerBottom});
|
||||
effect.element.down().undoPositioned();
|
||||
}
|
||||
}, arguments[1] || {})
|
||||
);
|
||||
}
|
||||
|
||||
// Bug in opera makes the TD containing this element expand for a instance after finish
|
||||
Effect.Squish = function(element) {
|
||||
return new Effect.Scale(element, window.opera ? 1 : 0,
|
||||
{ restoreAfterFinish: true,
|
||||
beforeSetup: function(effect) {
|
||||
effect.element.makeClipping(effect.element); },
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide(effect.element);
|
||||
effect.element.undoClipping(effect.element); }
|
||||
return new Effect.Scale(element, window.opera ? 1 : 0, {
|
||||
restoreAfterFinish: true,
|
||||
beforeSetup: function(effect) {
|
||||
effect.element.makeClipping();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide().undoClipping();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -823,9 +816,7 @@ Effect.Grow = function(element) {
|
|||
y: initialMoveY,
|
||||
duration: 0.01,
|
||||
beforeSetup: function(effect) {
|
||||
effect.element.hide();
|
||||
effect.element.makeClipping();
|
||||
effect.element.makePositioned();
|
||||
effect.element.hide().makeClipping().makePositioned();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
new Effect.Parallel(
|
||||
|
|
@ -836,13 +827,10 @@ Effect.Grow = function(element) {
|
|||
sync: true, scaleFrom: window.opera ? 1 : 0, transition: options.scaleTransition, restoreAfterFinish: true})
|
||||
], Object.extend({
|
||||
beforeSetup: function(effect) {
|
||||
effect.effects[0].element.setStyle({height: '0px'});
|
||||
effect.effects[0].element.show();
|
||||
effect.effects[0].element.setStyle({height: '0px'}).show();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.effects[0].element.undoClipping();
|
||||
effect.effects[0].element.undoPositioned();
|
||||
effect.effects[0].element.setStyle(oldStyle);
|
||||
effect.effects[0].element.undoClipping().undoPositioned().setStyle(oldStyle);
|
||||
}
|
||||
}, options)
|
||||
)
|
||||
|
|
@ -896,13 +884,10 @@ Effect.Shrink = function(element) {
|
|||
new Effect.Move(element, { x: moveX, y: moveY, sync: true, transition: options.moveTransition })
|
||||
], Object.extend({
|
||||
beforeStartInternal: function(effect) {
|
||||
effect.effects[0].element.makePositioned();
|
||||
effect.effects[0].element.makeClipping(); },
|
||||
effect.effects[0].element.makePositioned().makeClipping();
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.effects[0].element.hide();
|
||||
effect.effects[0].element.undoClipping();
|
||||
effect.effects[0].element.undoPositioned();
|
||||
effect.effects[0].element.setStyle(oldStyle); }
|
||||
effect.effects[0].element.hide().undoClipping().undoPositioned().setStyle(oldStyle); }
|
||||
}, options)
|
||||
);
|
||||
}
|
||||
|
|
@ -912,10 +897,10 @@ Effect.Pulsate = function(element) {
|
|||
var options = arguments[1] || {};
|
||||
var oldOpacity = element.getInlineOpacity();
|
||||
var transition = options.transition || Effect.Transitions.sinoidal;
|
||||
var reverser = function(pos){ return transition(1-Effect.Transitions.pulse(pos)) };
|
||||
var reverser = function(pos){ return transition(1-Effect.Transitions.pulse(pos, options.pulses)) };
|
||||
reverser.bind(transition);
|
||||
return new Effect.Opacity(element,
|
||||
Object.extend(Object.extend({ duration: 3.0, from: 0,
|
||||
Object.extend(Object.extend({ duration: 2.0, from: 0,
|
||||
afterFinishInternal: function(effect) { effect.element.setStyle({opacity: oldOpacity}); }
|
||||
}, options), {transition: reverser}));
|
||||
}
|
||||
|
|
@ -927,7 +912,7 @@ Effect.Fold = function(element) {
|
|||
left: element.style.left,
|
||||
width: element.style.width,
|
||||
height: element.style.height };
|
||||
Element.makeClipping(element);
|
||||
element.makeClipping();
|
||||
return new Effect.Scale(element, 5, Object.extend({
|
||||
scaleContent: false,
|
||||
scaleX: false,
|
||||
|
|
@ -936,15 +921,162 @@ Effect.Fold = function(element) {
|
|||
scaleContent: false,
|
||||
scaleY: false,
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide();
|
||||
effect.element.undoClipping();
|
||||
effect.element.setStyle(oldStyle);
|
||||
effect.element.hide().undoClipping().setStyle(oldStyle);
|
||||
} });
|
||||
}}, arguments[1] || {}));
|
||||
};
|
||||
|
||||
Effect.Morph = Class.create();
|
||||
Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if(!this.element) throw(Effect._elementDoesNotExistError);
|
||||
var options = Object.extend({
|
||||
style: {}
|
||||
}, arguments[1] || {});
|
||||
if (typeof options.style == 'string') {
|
||||
if(options.style.indexOf(':') == -1) {
|
||||
var cssText = '', selector = '.' + options.style;
|
||||
$A(document.styleSheets).reverse().each(function(styleSheet) {
|
||||
if (styleSheet.cssRules) cssRules = styleSheet.cssRules;
|
||||
else if (styleSheet.rules) cssRules = styleSheet.rules;
|
||||
$A(cssRules).reverse().each(function(rule) {
|
||||
if (selector == rule.selectorText) {
|
||||
cssText = rule.style.cssText;
|
||||
throw $break;
|
||||
}
|
||||
});
|
||||
if (cssText) throw $break;
|
||||
});
|
||||
this.style = cssText.parseStyle();
|
||||
options.afterFinishInternal = function(effect){
|
||||
effect.element.addClassName(effect.options.style);
|
||||
effect.transforms.each(function(transform) {
|
||||
if(transform.style != 'opacity')
|
||||
effect.element.style[transform.style.camelize()] = '';
|
||||
});
|
||||
}
|
||||
} else this.style = options.style.parseStyle();
|
||||
} else this.style = $H(options.style)
|
||||
this.start(options);
|
||||
},
|
||||
setup: function(){
|
||||
function parseColor(color){
|
||||
if(!color || ['rgba(0, 0, 0, 0)','transparent'].include(color)) color = '#ffffff';
|
||||
color = color.parseColor();
|
||||
return $R(0,2).map(function(i){
|
||||
return parseInt( color.slice(i*2+1,i*2+3), 16 )
|
||||
});
|
||||
}
|
||||
this.transforms = this.style.map(function(pair){
|
||||
var property = pair[0].underscore().dasherize(), value = pair[1], unit = null;
|
||||
|
||||
if(value.parseColor('#zzzzzz') != '#zzzzzz') {
|
||||
value = value.parseColor();
|
||||
unit = 'color';
|
||||
} else if(property == 'opacity') {
|
||||
value = parseFloat(value);
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera && (!this.element.currentStyle.hasLayout))
|
||||
this.element.setStyle({zoom: 1});
|
||||
} else if(Element.CSS_LENGTH.test(value))
|
||||
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/),
|
||||
value = parseFloat(components[1]), unit = (components.length == 3) ? components[2] : null;
|
||||
|
||||
var originalValue = this.element.getStyle(property);
|
||||
return $H({
|
||||
style: property,
|
||||
originalValue: unit=='color' ? parseColor(originalValue) : parseFloat(originalValue || 0),
|
||||
targetValue: unit=='color' ? parseColor(value) : value,
|
||||
unit: unit
|
||||
});
|
||||
}.bind(this)).reject(function(transform){
|
||||
return (
|
||||
(transform.originalValue == transform.targetValue) ||
|
||||
(
|
||||
transform.unit != 'color' &&
|
||||
(isNaN(transform.originalValue) || isNaN(transform.targetValue))
|
||||
)
|
||||
)
|
||||
});
|
||||
},
|
||||
update: function(position) {
|
||||
var style = $H(), value = null;
|
||||
this.transforms.each(function(transform){
|
||||
value = transform.unit=='color' ?
|
||||
$R(0,2).inject('#',function(m,v,i){
|
||||
return m+(Math.round(transform.originalValue[i]+
|
||||
(transform.targetValue[i] - transform.originalValue[i])*position)).toColorPart() }) :
|
||||
transform.originalValue + Math.round(
|
||||
((transform.targetValue - transform.originalValue) * position) * 1000)/1000 + transform.unit;
|
||||
style[transform.style] = value;
|
||||
});
|
||||
this.element.setStyle(style);
|
||||
}
|
||||
});
|
||||
|
||||
Effect.Transform = Class.create();
|
||||
Object.extend(Effect.Transform.prototype, {
|
||||
initialize: function(tracks){
|
||||
this.tracks = [];
|
||||
this.options = arguments[1] || {};
|
||||
this.addTracks(tracks);
|
||||
},
|
||||
addTracks: function(tracks){
|
||||
tracks.each(function(track){
|
||||
var data = $H(track).values().first();
|
||||
this.tracks.push($H({
|
||||
ids: $H(track).keys().first(),
|
||||
effect: Effect.Morph,
|
||||
options: { style: data }
|
||||
}));
|
||||
}.bind(this));
|
||||
return this;
|
||||
},
|
||||
play: function(){
|
||||
return new Effect.Parallel(
|
||||
this.tracks.map(function(track){
|
||||
var elements = [$(track.ids) || $$(track.ids)].flatten();
|
||||
return elements.map(function(e){ return new track.effect(e, Object.extend({ sync:true }, track.options)) });
|
||||
}).flatten(),
|
||||
this.options
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
Element.CSS_PROPERTIES = $w(
|
||||
'backgroundColor backgroundPosition borderBottomColor borderBottomStyle ' +
|
||||
'borderBottomWidth borderLeftColor borderLeftStyle borderLeftWidth ' +
|
||||
'borderRightColor borderRightStyle borderRightWidth borderSpacing ' +
|
||||
'borderTopColor borderTopStyle borderTopWidth bottom clip color ' +
|
||||
'fontSize fontWeight height left letterSpacing lineHeight ' +
|
||||
'marginBottom marginLeft marginRight marginTop markerOffset maxHeight '+
|
||||
'maxWidth minHeight minWidth opacity outlineColor outlineOffset ' +
|
||||
'outlineWidth paddingBottom paddingLeft paddingRight paddingTop ' +
|
||||
'right textIndent top width wordSpacing zIndex');
|
||||
|
||||
Element.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/;
|
||||
|
||||
String.prototype.parseStyle = function(){
|
||||
var element = Element.extend(document.createElement('div'));
|
||||
element.innerHTML = '<div style="' + this + '"></div>';
|
||||
var style = element.down().style, styleRules = $H();
|
||||
|
||||
Element.CSS_PROPERTIES.each(function(property){
|
||||
if(style[property]) styleRules[property] = style[property];
|
||||
});
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera && this.indexOf('opacity') > -1) {
|
||||
styleRules.opacity = this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1];
|
||||
}
|
||||
return styleRules;
|
||||
};
|
||||
|
||||
Element.morph = function(element, style) {
|
||||
new Effect.Morph(element, Object.extend({ style: style }, arguments[2] || {}));
|
||||
return element;
|
||||
};
|
||||
|
||||
['setOpacity','getOpacity','getInlineOpacity','forceRerendering','setContentZoom',
|
||||
'collectTextNodes','collectTextNodesIgnoreClass','childrenWithClassName'].each(
|
||||
'collectTextNodes','collectTextNodesIgnoreClass','morph'].each(
|
||||
function(f) { Element.Methods[f] = Element[f]; }
|
||||
);
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,113 @@
|
|||
var commandHistory;
|
||||
var historyIndex;
|
||||
|
||||
function showExtendedDebug() {
|
||||
if (debugWindow != null) {
|
||||
hideDebug();
|
||||
}
|
||||
|
||||
if (debugWindow == null) {
|
||||
commandHistory = new Array();
|
||||
historyIndex = 0;
|
||||
|
||||
debugWindow = new Window('debug_window', {className: 'dialog',width:250, height:100, right:4, minWidth:250, bottom:42, zIndex:1000, opacity:1, showEffect: Element.show, resizable: true, title: "Debug"})
|
||||
debugWindow.getContent().innerHTML = "<style>#debug_window .dialog_content {background:#000;}</style> <div font='monaco' id='debug' style='padding:3px;color:#0F0;font-family:monaco'></div>";
|
||||
|
||||
//create hourglass icon and attach events to it.
|
||||
var cont = "<div id=\"debug_window_inspect\" style=\"width: 15px; height: 15px; background: transparent url(themes/default/inspect.gif) no-repeat 0 0; position:absolute; top:5px; left:70px; cursor:pointer; z-index:3000;\"></div>";
|
||||
|
||||
new Insertion.After('debug_window_maximize', cont);
|
||||
Event.observe('debug_window_inspect', 'click', enterInspectionMode, false);
|
||||
|
||||
//create command text box
|
||||
cont = "Eval:<input id=\"debug_window_command\" type=\"textbox\" style=\"width:150px; height: 12px; color: black;\">"
|
||||
debugWindow.setStatusBar(cont);
|
||||
|
||||
Event.observe('debug_window_command', 'mousedown', donothing);
|
||||
Event.observe('debug_window_command', 'keypress', evalJS, false);
|
||||
}
|
||||
debugWindow.show();
|
||||
}
|
||||
|
||||
function donothing(evt){
|
||||
Field.activate('debug_window_command');
|
||||
return false;
|
||||
}
|
||||
|
||||
function evalJS(evt){
|
||||
if(evt.keyCode == Event.KEY_RETURN){
|
||||
var js = $F('debug_window_command');
|
||||
try{
|
||||
var ret = eval(js);
|
||||
if(ret != null)
|
||||
debug(ret);
|
||||
}catch(e){
|
||||
debug(e);
|
||||
}
|
||||
$('debug_window_command').value = '';
|
||||
|
||||
Field.activate('debug_window_command');
|
||||
commandHistory.push(js);
|
||||
historyIndex = 0;
|
||||
}
|
||||
|
||||
if(evt.keyCode == Event.KEY_UP){
|
||||
if(commandHistory.length > historyIndex){
|
||||
historyIndex++;
|
||||
var js = commandHistory[commandHistory.length-historyIndex];
|
||||
$('debug_window_command').value = js;
|
||||
Event.stop(evt);
|
||||
Field.activate('debug_window_command');
|
||||
}
|
||||
}
|
||||
|
||||
if(evt.keyCode == Event.KEY_DOWN){
|
||||
if(commandHistory.length >= historyIndex && historyIndex > 1){
|
||||
historyIndex--;
|
||||
var js = commandHistory[commandHistory.length-historyIndex];
|
||||
$('debug_window_command').value = js;
|
||||
Event.stop(evt);
|
||||
Field.activate('debug_window_command');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function enterInspectionMode(evt){
|
||||
//stop observing magnifying glass
|
||||
Event.stopObserving('debug_window_inspect', 'click', enterInspectionMode, false);
|
||||
//change pointer
|
||||
document.body.style.cursor='help';
|
||||
//start observing mouse clicks
|
||||
Event.observe(window, 'click', inspectItem, false);
|
||||
}
|
||||
|
||||
function inspectItem(evt){
|
||||
// the element that triggered the event
|
||||
var element = Event.element(evt);
|
||||
if(element.id!="debug_window_inspect"){
|
||||
clearDebug()
|
||||
//change pointer
|
||||
document.body.style.cursor='default';
|
||||
debug(element.id);
|
||||
inspect(element);
|
||||
//stop observing mouse clicks
|
||||
Event.stopObserving(window, 'click', inspectItem, false);
|
||||
//alert('doing something');
|
||||
//start observing mag
|
||||
Event.observe('debug_window_inspect', 'click', enterInspectionMode, false);
|
||||
}
|
||||
}
|
||||
|
||||
function clearDebug() {
|
||||
var win = $('debug');
|
||||
if (win == null)
|
||||
return;
|
||||
|
||||
win.innerHTML=" ";
|
||||
//clear inspections too
|
||||
var divs = document.getElementsByClassName('inspector');
|
||||
divs.each(function(div){
|
||||
Element.remove(div);
|
||||
});
|
||||
}
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,239 @@
|
|||
// Singleton class TooltipWindow
|
||||
// This class works with special className. The tooltip content could be in your HTML page as an hidden element or
|
||||
// can be retreive by an AJAX call.
|
||||
//
|
||||
// To work, You just need to set two class name on elements that should show tooltips
|
||||
// - One to say to TooltipManager that this element must have a tooltip ('tooltip' by default)
|
||||
// - Another to indicate how to find the tooltip content
|
||||
// It could be html_XXXX if tootltip content is somewhere hidden in your page, XXX must be DOM ID of this hidden element
|
||||
// It could be ajax_XXXX if tootltip content must be find by an ajax request, XXX will be the string send as id parameter to your server.
|
||||
// Check samples/tooltips/tooltip.html to see how it works
|
||||
//
|
||||
TooltipManager = {
|
||||
options: {cssClassName: 'tooltip', delayOver: 200, delayOut: 1000, shiftX: 10, shiftY: 10,
|
||||
className: 'alphacube', width: 200, height: null,
|
||||
draggable: false, minimizable: false, maximizable: false, showEffect: Element.show, hideEffect: Element.hide},
|
||||
ajaxInfo: null,
|
||||
elements: null,
|
||||
showTimer: null,
|
||||
hideTimer: null,
|
||||
|
||||
// Init tooltip manager
|
||||
// parameters:
|
||||
// - cssClassName (string) : CSS class name where tooltip should be shown.
|
||||
// - ajaxOptions (hash) : Ajax options for ajax tooltip.
|
||||
// For examples {url: "/tooltip/get.php", options: {method: 'get'}}
|
||||
// see Ajax.Request documentation for details
|
||||
//- tooltipOptions (hash) : available keys
|
||||
// - delayOver: int in ms (default 10) delay before showing tooltip
|
||||
// - delayOut: int in ms (default 1000) delay before hidding tooltip
|
||||
// - shiftX: int in pixels (default 10) left shift of the tooltip window
|
||||
// - shiftY: int in pixels (default 10) top shift of the tooltip window
|
||||
// and All window options like showEffect: Element.show, hideEffect: Element.hide to remove animation
|
||||
// default: {className: 'alphacube', width: 200, height: null, draggable: false, minimizable: false, maximizable: false}
|
||||
|
||||
init: function(cssClassName, ajaxInfo, tooltipOptions) {
|
||||
TooltipManager.options = Object.extend(TooltipManager.options, tooltipOptions || {});
|
||||
|
||||
cssClassName = TooltipManager.options.cssClassName || "tooltip";
|
||||
TooltipManager.ajaxInfo = ajaxInfo;
|
||||
TooltipManager.elements = $$("." + cssClassName);
|
||||
TooltipManager.elements.each(function(element) {
|
||||
element = $(element)
|
||||
var info = TooltipManager._getInfo(element);
|
||||
if (info.ajax) {
|
||||
element.ajaxId = info.id;
|
||||
element.ajaxInfo = ajaxInfo;
|
||||
}
|
||||
else {
|
||||
element.tooltipElement = $(info.id);
|
||||
}
|
||||
element.observe("mouseover", TooltipManager._mouseOver);
|
||||
element.observe("mouseout", TooltipManager._mouseOut);
|
||||
});
|
||||
Windows.addObserver(this);
|
||||
},
|
||||
|
||||
addHTML: function(element, tooltipElement) {
|
||||
element = $(element);
|
||||
tooltipElement = $(tooltipElement);
|
||||
element.tooltipElement = tooltipElement;
|
||||
|
||||
element.observe("mouseover", TooltipManager._mouseOver);
|
||||
element.observe("mouseout", TooltipManager._mouseOut);
|
||||
},
|
||||
|
||||
addAjax: function(element, ajaxInfo) {
|
||||
element = $(element);
|
||||
element.ajaxInfo = ajaxInfo;
|
||||
element.observe("mouseover", TooltipManager._mouseOver);
|
||||
element.observe("mouseout", TooltipManager._mouseOut);
|
||||
},
|
||||
|
||||
addURL: function(element, url, width, height) {
|
||||
element = $(element);
|
||||
element.url = url;
|
||||
element.frameWidth = width;
|
||||
element.frameHeight = height;
|
||||
element.observe("mouseover", TooltipManager._mouseOver);
|
||||
element.observe("mouseout", TooltipManager._mouseOut);
|
||||
},
|
||||
|
||||
close: function() {
|
||||
if (TooltipManager.tooltipWindow)
|
||||
TooltipManager.tooltipWindow.hide();
|
||||
},
|
||||
|
||||
preloadImages: function(path, images, extension) {
|
||||
if (!extension)
|
||||
extension = ".gif";
|
||||
|
||||
//preload images
|
||||
$A(images).each(function(i) {
|
||||
var image = new Image();
|
||||
image.src= path + "/" + i + extension;
|
||||
});
|
||||
},
|
||||
|
||||
_showTooltip: function(element) {
|
||||
if (this.element == element)
|
||||
return;
|
||||
// Get original element
|
||||
while (element && (!element.tooltipElement && !element.ajaxInfo && !element.url))
|
||||
element = element.parentNode;
|
||||
this.element = element;
|
||||
|
||||
TooltipManager.showTimer = null;
|
||||
if (TooltipManager.hideTimer)
|
||||
clearTimeout(TooltipManager.hideTimer);
|
||||
|
||||
var position = Position.cumulativeOffset(element);
|
||||
var dimension = element.getDimensions();
|
||||
|
||||
if (! this.tooltipWindow)
|
||||
this.tooltipWindow = new Window("__tooltip__", TooltipManager.options);
|
||||
|
||||
this.tooltipWindow.hide();
|
||||
this.tooltipWindow.setLocation(position[1] + dimension.height + TooltipManager.options.shiftY, position[0] + TooltipManager.options.shiftX);
|
||||
|
||||
Event.observe(this.tooltipWindow.element, "mouseover", function(event) {TooltipManager._tooltipOver(event, element)});
|
||||
Event.observe(this.tooltipWindow.element, "mouseout", function(event) {TooltipManager._tooltipOut(event, element)});
|
||||
|
||||
// Reset width/height for computation
|
||||
this.tooltipWindow.height = TooltipManager.options.height;
|
||||
this.tooltipWindow.width = TooltipManager.options.width;
|
||||
|
||||
// Ajax content
|
||||
if (element.ajaxInfo) {
|
||||
var p = element.ajaxInfo.options.parameters;
|
||||
var saveParam = p;
|
||||
|
||||
// Set by CSS
|
||||
if (element.ajaxId) {
|
||||
if (p)
|
||||
p += "&id=" + element.ajaxId;
|
||||
else
|
||||
p = "id=" + element.ajaxId;
|
||||
}
|
||||
element.ajaxInfo.options.parameters = p || "";
|
||||
this.tooltipWindow.setHTMLContent("");
|
||||
this.tooltipWindow.setAjaxContent(element.ajaxInfo.url, element.ajaxInfo.options);
|
||||
element.ajaxInfo.options.parameters = saveParam;
|
||||
}
|
||||
// URL content
|
||||
else if (element.url) {
|
||||
this.tooltipWindow.setURL(element.url);
|
||||
this.tooltipWindow.setSize(element.frameWidth, element.frameHeight);
|
||||
|
||||
// Set tooltip size
|
||||
this.tooltipWindow.height = element.frameHeight;
|
||||
this.tooltipWindow.width = element.frameWidth;
|
||||
}
|
||||
// HTML content
|
||||
else
|
||||
this.tooltipWindow.setHTMLContent(element.tooltipElement.innerHTML);
|
||||
|
||||
if (!element.ajaxInfo)
|
||||
this.tooltipWindow.show();
|
||||
},
|
||||
|
||||
_hideTooltip: function(element) {
|
||||
if (this.tooltipWindow) {
|
||||
this.tooltipWindow.hide();
|
||||
this.element = null;
|
||||
}
|
||||
},
|
||||
|
||||
_mouseOver: function (event) {
|
||||
var element = Event.element(event);
|
||||
if (TooltipManager.showTimer)
|
||||
clearTimeout(TooltipManager.showTimer);
|
||||
|
||||
TooltipManager.showTimer = setTimeout(function() {TooltipManager._showTooltip(element)}, TooltipManager.options.delayOver)
|
||||
},
|
||||
|
||||
_mouseOut: function(event) {
|
||||
var element = Event.element(event);
|
||||
if (TooltipManager.showTimer) {
|
||||
clearTimeout(TooltipManager.showTimer);
|
||||
TooltipManager.showTimer = null;
|
||||
return;
|
||||
}
|
||||
if (TooltipManager.tooltipWindow)
|
||||
TooltipManager.hideTimer = setTimeout(function() {TooltipManager._hideTooltip(element)}, TooltipManager.options.delayOut)
|
||||
},
|
||||
|
||||
_tooltipOver: function(event, element) {
|
||||
if (TooltipManager.hideTimer) {
|
||||
clearTimeout(TooltipManager.hideTimer);
|
||||
TooltipManager.hideTimer = null;
|
||||
}
|
||||
},
|
||||
|
||||
_tooltipOut: function(event, element) {
|
||||
if (TooltipManager.hideTimer == null)
|
||||
TooltipManager.hideTimer = setTimeout(function() {TooltipManager._hideTooltip(element)}, TooltipManager.options.delayOut)
|
||||
},
|
||||
|
||||
_getInfo: function(element) {
|
||||
// Find html_ for static content
|
||||
var id = element.className.split(' ').detect(function(name) {return name.indexOf("html_") == 0});
|
||||
var ajax = true;
|
||||
if (id)
|
||||
ajax = false;
|
||||
else
|
||||
// Find ajax_ for ajax content
|
||||
id = element.className.split(' ').detect(function(name) {return name.indexOf("ajax_") == 0});
|
||||
|
||||
id = id.substr(id.indexOf('_')+1, id.length)
|
||||
return id ? {ajax: ajax, id: id} : null;
|
||||
},
|
||||
|
||||
onBeforeShow: function(eventName, win) {
|
||||
var top = parseFloat(win.getLocation().top);
|
||||
var dim = win.element.getDimensions();
|
||||
|
||||
if (top + dim.height > TooltipManager._getScrollTop() + TooltipManager._getPageHeight()) {
|
||||
var position = Position.cumulativeOffset(this.element);
|
||||
|
||||
var top = position[1] - TooltipManager.options.shiftY - dim.height;
|
||||
win.setLocation(top, position[0] + TooltipManager.options.shiftX)
|
||||
}
|
||||
},
|
||||
|
||||
_getPageWidth: function(){
|
||||
return window.innerWidth || document.documentElement.clientWidth || 0;
|
||||
},
|
||||
|
||||
_getPageHeight: function(){
|
||||
return window.innerHeight || document.documentElement.clientHeight || 0;
|
||||
},
|
||||
|
||||
_getScrollTop: function(){
|
||||
return document.documentElement.scrollTop || window.pageYOffset || 0;
|
||||
},
|
||||
|
||||
_getScrollLeft: function(){
|
||||
return document.documentElement.scrollLeft || window.pageXOffset || 0;
|
||||
}
|
||||
};
|
||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,107 @@
|
|||
// Copyright (c) 2006 Sébastien Gruhier (http://xilinus.com, http://itseb.com)
|
||||
// YOU MUST INCLUDE window.js BEFORE
|
||||
//
|
||||
// Object to store hide/show windows status in a cookie
|
||||
// Just add at the end of your HTML file this javascript line: WindowStore.init()
|
||||
WindowStore = {
|
||||
doSetCookie: false,
|
||||
cookieName: "__window_store__",
|
||||
expired: null,
|
||||
|
||||
// Init function with two optional parameters
|
||||
// - cookieName (default = __window_store__)
|
||||
// - expiration date (default 3 years from now)
|
||||
init: function(cookieName, expired) {
|
||||
WindowStore.cookieName = cookieName || WindowStore.cookieName
|
||||
|
||||
if (! expired) {
|
||||
var today = new Date();
|
||||
today.setYear(today.getYear()+1903);
|
||||
WindowStore.expired = today;
|
||||
}
|
||||
else
|
||||
WindowStore.expired = expired;
|
||||
|
||||
Windows.windows.each(function(win) {
|
||||
win.setCookie(win.getId(), WindowStore.expired);
|
||||
});
|
||||
|
||||
// Create observer on show/hide events
|
||||
var myObserver = {
|
||||
onShow: function(eventName, win) {
|
||||
WindowStore._saveCookie();
|
||||
},
|
||||
onHide: function(eventName, win) {
|
||||
WindowStore._saveCookie();
|
||||
}
|
||||
}
|
||||
Windows.addObserver(myObserver);
|
||||
|
||||
WindowStore._restoreWindows();
|
||||
WindowStore._saveCookie();
|
||||
},
|
||||
|
||||
show: function(win) {
|
||||
eval("var cookie = " + WindowUtilities.getCookie(Windows.cookieName));
|
||||
if (cookie != null) {
|
||||
if (cookie[win.getId()])
|
||||
win.show();
|
||||
}
|
||||
else
|
||||
win.show();
|
||||
},
|
||||
|
||||
// Function to store windows show/hide status in a cookie
|
||||
_saveCookie: function() {
|
||||
if (!doSetCookie)
|
||||
return;
|
||||
|
||||
var cookieValue = "{";
|
||||
Windows.windows.each(function(win) {
|
||||
if (cookieValue != "{")
|
||||
cookieValue += ","
|
||||
cookieValue += win.getId() + ": " + win.isVisible();
|
||||
});
|
||||
cookieValue += "}"
|
||||
|
||||
WindowUtilities.setCookie(cookieValue, [WindowStore.cookieName, WindowStore.expired]);
|
||||
},
|
||||
|
||||
// Function to restore windows show/hide status from a cookie if exists
|
||||
_restoreWindows: function() {
|
||||
eval("var cookie = " + WindowUtilities.getCookie(Windows.cookieName));
|
||||
if (cookie != null) {
|
||||
doSetCookie = false;
|
||||
Windows.windows.each(function(win) {
|
||||
if (cookie[win.getId()])
|
||||
win.show();
|
||||
});
|
||||
}
|
||||
doSetCookie = true;
|
||||
}
|
||||
}
|
||||
|
||||
// Object to set a close key an all windows
|
||||
WindowCloseKey = {
|
||||
keyCode: Event.KEY_ESC,
|
||||
|
||||
init: function(keyCode) {
|
||||
if (keyCode)
|
||||
WindowCloseKey.keyCode = keyCode;
|
||||
Event.observe(document, 'keydown', this._closeCurrentWindow.bindAsEventListener(this));
|
||||
},
|
||||
|
||||
_closeCurrentWindow: function(event) {
|
||||
var e = event || window.event
|
||||
var characterCode = e.which || e.keyCode;
|
||||
var win = Windows.focusedWindow;
|
||||
if (characterCode == WindowCloseKey.keyCode && win) {
|
||||
if (win.cancelCallback)
|
||||
Dialog.cancelCallback();
|
||||
else if (win.okCallback)
|
||||
Dialog.okCallback();
|
||||
else
|
||||
Windows.close(Windows.focusedWindow.getId());
|
||||
}
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue