From 4f68dcb035ef477ba10fc2719d0b6e612649deb0 Mon Sep 17 00:00:00 2001 From: Thomas Fuchs Date: Tue, 5 Sep 2006 10:42:41 +0000 Subject: Update to script.aculo.us 1.6.3 [Thomas Fuchs] git-svn-id: http://svn-commit.rubyonrails.org/rails/trunk@5015 5ecf4fe2-1ee6-0310-87b1-e25e094e27de --- railties/html/javascripts/controls.js | 34 +++++++---- railties/html/javascripts/dragdrop.js | 105 +++++++++++++++++++++++----------- railties/html/javascripts/effects.js | 34 ++++++++--- 3 files changed, 118 insertions(+), 55 deletions(-) (limited to 'railties/html/javascripts') diff --git a/railties/html/javascripts/controls.js b/railties/html/javascripts/controls.js index ea5ce6eacd..8672b32809 100644 --- a/railties/html/javascripts/controls.js +++ b/railties/html/javascripts/controls.js @@ -48,7 +48,7 @@ Autocompleter.Base.prototype = { this.index = 0; this.entryCount = 0; - if (this.setOptions) + if(this.setOptions) this.setOptions(options); else this.options = options || {}; @@ -58,17 +58,20 @@ Autocompleter.Base.prototype = { this.options.frequency = this.options.frequency || 0.4; this.options.minChars = this.options.minChars || 1; this.options.onShow = this.options.onShow || - function(element, update){ - if(!update.style.position || update.style.position=='absolute') { - update.style.position = 'absolute'; - Position.clone(element, update, {setHeight: false, offsetTop: element.offsetHeight}); - } - Effect.Appear(update,{duration:0.15}); - }; + function(element, update){ + if(!update.style.position || update.style.position=='absolute') { + update.style.position = 'absolute'; + Position.clone(element, update, { + setHeight: false, + offsetTop: element.offsetHeight + }); + } + Effect.Appear(update,{duration:0.15}); + }; this.options.onHide = this.options.onHide || - function(element, update){ new Effect.Fade(update,{duration:0.15}) }; + function(element, update){ new Effect.Fade(update,{duration:0.15}) }; - if (typeof(this.options.tokens) == 'string') + if(typeof(this.options.tokens) == 'string') this.options.tokens = new Array(this.options.tokens); this.observer = null; @@ -274,9 +277,14 @@ Autocompleter.Base.prototype = { } this.stopIndicator(); - this.index = 0; - this.render(); + + if(this.entryCount==1 && this.options.autoSelect) { + this.selectEntry(); + this.hide(); + } else { + this.render(); + } } }, @@ -778,6 +786,8 @@ Object.extend(Ajax.InPlaceCollectionEditor.prototype, { collection.each(function(e,i) { optionTag = document.createElement("option"); optionTag.value = (e instanceof Array) ? e[0] : e; + if((typeof this.options.value == 'undefined') && + ((e instanceof Array) ? this.element.innerHTML == e[1] : e == optionTag.value)) optionTag.selected = true; if(this.options.value==optionTag.value) optionTag.selected = true; optionTag.appendChild(document.createTextNode((e instanceof Array) ? e[1] : e)); selectTag.appendChild(optionTag); diff --git a/railties/html/javascripts/dragdrop.js b/railties/html/javascripts/dragdrop.js index 1528eced35..91088b53db 100644 --- a/railties/html/javascripts/dragdrop.js +++ b/railties/html/javascripts/dragdrop.js @@ -148,8 +148,16 @@ var Draggables = { }, activate: function(draggable) { - window.focus(); // allows keypress events if window isn't currently focused, fails for Safari - this.activeDraggable = draggable; + if(draggable.options.delay) { + this._timeout = setTimeout(function() { + Draggables._timeout = null; + window.focus(); + Draggables.activeDraggable = draggable; + }.bind(this), draggable.options.delay); + } else { + window.focus(); // allows keypress events if window isn't currently focused, fails for Safari + this.activeDraggable = draggable; + } }, deactivate: function() { @@ -163,10 +171,15 @@ var Draggables = { // the same coordinates, prevent needless redrawing (moz bug?) if(this._lastPointer && (this._lastPointer.inspect() == pointer.inspect())) return; this._lastPointer = pointer; + this.activeDraggable.updateDrag(event, pointer); }, endDrag: function(event) { + if(this._timeout) { + clearTimeout(this._timeout); + this._timeout = null; + } if(!this.activeDraggable) return; this._lastPointer = null; this.activeDraggable.endDrag(event); @@ -193,6 +206,7 @@ var Draggables = { this.observers.each( function(o) { if(o[eventName]) o[eventName](eventName, draggable, event); }); + if(draggable.options[eventName]) draggable.options[eventName](draggable, event); }, _cacheObserverCallbacks: function() { @@ -207,30 +221,25 @@ var Draggables = { /*--------------------------------------------------------------------------*/ var Draggable = Class.create(); -Draggable._revertCache = {}; Draggable._dragging = {}; Draggable.prototype = { initialize: function(element) { - var options = Object.extend({ + var defaults = { handle: false, - starteffect: function(element) { - element._opacity = Element.getOpacity(element); - Draggable._dragging[element] = true; - new Effect.Opacity(element, {duration:0.2, from:element._opacity, to:0.7}); - }, reverteffect: function(element, top_offset, left_offset) { var dur = Math.sqrt(Math.abs(top_offset^2)+Math.abs(left_offset^2))*0.02; - Draggable._revertCache[element] = - new Effect.Move(element, { x: -left_offset, y: -top_offset, duration: dur, - queue: {scope:'_draggable', position:'end'} - }); + new Effect.Move(element, { x: -left_offset, y: -top_offset, duration: dur, + queue: {scope:'_draggable', position:'end'} + }); }, endeffect: function(element) { var toOpacity = typeof element._opacity == 'number' ? element._opacity : 1.0; new Effect.Opacity(element, {duration:0.2, from:0.7, to:toOpacity, queue: {scope:'_draggable', position:'end'}, - afterFinish: function(){ Draggable._dragging[element] = false } + afterFinish: function(){ + Draggable._dragging[element] = false + } }); }, zindex: 1000, @@ -238,8 +247,20 @@ Draggable.prototype = { scroll: false, scrollSensitivity: 20, scrollSpeed: 15, - snap: false // false, or xy or [x,y] or function(x,y){ return [x,y] } - }, arguments[1] || {}); + snap: false, // false, or xy or [x,y] or function(x,y){ return [x,y] } + delay: 0 + }; + + if(arguments[1] && typeof arguments[1].endeffect == 'undefined') + Object.extend(defaults, { + starteffect: function(element) { + element._opacity = Element.getOpacity(element); + Draggable._dragging[element] = true; + new Effect.Opacity(element, {duration:0.2, from:element._opacity, to:0.7}); + } + }); + + var options = Object.extend(defaults, arguments[1] || {}); this.element = $(element); @@ -250,8 +271,10 @@ Draggable.prototype = { if(!this.handle) this.handle = $(options.handle); if(!this.handle) this.handle = this.element; - if(options.scroll && !options.scroll.scrollTo && !options.scroll.outerHTML) + if(options.scroll && !options.scroll.scrollTo && !options.scroll.outerHTML) { options.scroll = $(options.scroll); + this._isScrollChild = Element.childOf(this.element, options.scroll); + } Element.makePositioned(this.element); // fix IE @@ -277,7 +300,7 @@ Draggable.prototype = { }, initDrag: function(event) { - if(typeof Draggable._dragging[this.element] != undefined && + if(typeof Draggable._dragging[this.element] != 'undefined' && Draggable._dragging[this.element]) return; if(Event.isLeftClick(event)) { // abort on form elements, fixes a Firefox issue @@ -289,11 +312,6 @@ Draggable.prototype = { src.tagName=='BUTTON' || src.tagName=='TEXTAREA')) return; - if(Draggable._revertCache[this.element]) { - Draggable._revertCache[this.element].cancel(); - Draggable._revertCache[this.element] = null; - } - var pointer = [Event.pointerX(event), Event.pointerY(event)]; var pos = Position.cumulativeOffset(this.element); this.offset = [0,1].map( function(i) { return (pointer[i] - pos[i]) }); @@ -329,6 +347,7 @@ Draggable.prototype = { } Draggables.notify('onStart', this, event); + if(this.options.starteffect) this.options.starteffect(this.element); }, @@ -337,6 +356,7 @@ Draggable.prototype = { Position.prepare(); Droppables.show(pointer, this.element); Draggables.notify('onDrag', this, event); + this.draw(pointer); if(this.options.change) this.options.change(this); @@ -350,6 +370,10 @@ Draggable.prototype = { p = Position.page(this.options.scroll); p[0] += this.options.scroll.scrollLeft; p[1] += this.options.scroll.scrollTop; + + p[0] += (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0); + p[1] += (window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0); + p.push(p[0]+this.options.scroll.offsetWidth); p.push(p[1]+this.options.scroll.offsetHeight); } @@ -395,7 +419,7 @@ Draggable.prototype = { if(this.options.endeffect) this.options.endeffect(this.element); - + Draggables.deactivate(this); Droppables.reset(); }, @@ -415,10 +439,16 @@ Draggable.prototype = { draw: function(point) { var pos = Position.cumulativeOffset(this.element); + if(this.options.ghosting) { + var r = Position.realOffset(this.element); + window.status = r.inspect(); + pos[0] += r[0] - Position.deltaX; pos[1] += r[1] - Position.deltaY; + } + var d = this.currentDelta(); pos[0] -= d[0]; pos[1] -= d[1]; - if(this.options.scroll && (this.options.scroll != window)) { + if(this.options.scroll && (this.options.scroll != window && this._isScrollChild)) { pos[0] -= this.options.scroll.scrollLeft-this.originalScrollLeft; pos[1] -= this.options.scroll.scrollTop-this.originalScrollTop; } @@ -445,6 +475,7 @@ Draggable.prototype = { style.left = p[0] + "px"; if((!this.options.constraint) || (this.options.constraint=='vertical')) style.top = p[1] + "px"; + if(style.visibility=="hidden") style.visibility = ""; // fix gecko rendering }, @@ -482,14 +513,16 @@ Draggable.prototype = { Position.prepare(); Droppables.show(Draggables._lastPointer, this.element); Draggables.notify('onDrag', this); - Draggables._lastScrollPointer = Draggables._lastScrollPointer || $A(Draggables._lastPointer); - Draggables._lastScrollPointer[0] += this.scrollSpeed[0] * delta / 1000; - Draggables._lastScrollPointer[1] += this.scrollSpeed[1] * delta / 1000; - if (Draggables._lastScrollPointer[0] < 0) - Draggables._lastScrollPointer[0] = 0; - if (Draggables._lastScrollPointer[1] < 0) - Draggables._lastScrollPointer[1] = 0; - this.draw(Draggables._lastScrollPointer); + if (this._isScrollChild) { + Draggables._lastScrollPointer = Draggables._lastScrollPointer || $A(Draggables._lastPointer); + Draggables._lastScrollPointer[0] += this.scrollSpeed[0] * delta / 1000; + Draggables._lastScrollPointer[1] += this.scrollSpeed[1] * delta / 1000; + if (Draggables._lastScrollPointer[0] < 0) + Draggables._lastScrollPointer[0] = 0; + if (Draggables._lastScrollPointer[1] < 0) + Draggables._lastScrollPointer[1] = 0; + this.draw(Draggables._lastScrollPointer); + } if(this.options.change) this.options.change(this); }, @@ -541,6 +574,8 @@ SortableObserver.prototype = { } var Sortable = { + SERIALIZE_RULE: /^[^_\-](?:[A-Za-z0-9\-\_]*)[_](.*)$/, + sortables: {}, _findRootElement: function(element) { @@ -581,12 +616,13 @@ var Sortable = { containment: element, // also takes array of elements (or id's); or false handle: false, // or a CSS class only: false, + delay: 0, hoverclass: null, ghosting: false, scroll: false, scrollSensitivity: 20, scrollSpeed: 15, - format: /^[^_]*_(.*)$/, + format: this.SERIALIZE_RULE, onChange: Prototype.emptyFunction, onUpdate: Prototype.emptyFunction }, arguments[1] || {}); @@ -600,6 +636,7 @@ var Sortable = { scroll: options.scroll, scrollSpeed: options.scrollSpeed, scrollSensitivity: options.scrollSensitivity, + delay: options.delay, ghosting: options.ghosting, constraint: options.constraint, handle: options.handle }; diff --git a/railties/html/javascripts/effects.js b/railties/html/javascripts/effects.js index 1f3d50bb6c..8b07d0e9a3 100644 --- a/railties/html/javascripts/effects.js +++ b/railties/html/javascripts/effects.js @@ -59,13 +59,13 @@ Element.setOpacity = function(element, value){ 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)) + 0.999999 : 1.0 }); + if(/MSIE/.test(navigator.userAgent) && !window.opera) 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)) + if(/MSIE/.test(navigator.userAgent) && !window.opera) Element.setStyle(element, { filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'') + 'alpha(opacity='+value*100+')' }); @@ -104,12 +104,16 @@ 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) { @@ -354,8 +358,9 @@ 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.currentStyle.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, @@ -372,6 +377,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, @@ -410,7 +416,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, @@ -485,6 +492,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); }, @@ -573,14 +581,22 @@ Effect.Appear = function(element) { 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); } @@ -719,7 +735,7 @@ Effect.SlideDown = function(element) { afterFinishInternal: function(effect) { effect.element.undoClipping(); // IE will crash if child is undoPositioned first - if(/MSIE/.test(navigator.userAgent)){ + if(/MSIE/.test(navigator.userAgent) && !window.opera){ effect.element.undoPositioned(); effect.element.firstChild.undoPositioned(); }else{ -- cgit v1.2.3