Permalink
Browse files

1. change overlay style maps into methods

2. make z-index ingerit from windwo
3. unit tests to verify

Goal of changes is to allow a client to set the 'base' z-index that a modal will use.
  • Loading branch information...
1 parent 433cf45 commit 1b0d96caf4a711071c8fe3bfc7d85bead823a1c3 @acinader committed Aug 11, 2011
Showing with 52 additions and 32 deletions.
  1. +37 −32 src/window.js
  2. +15 −0 test/unit/window.js
View
@@ -16,19 +16,19 @@ if(typeof(Draggable) != 'undefined'){
var r = Position.realOffset(this.element);
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 && this._isScrollChild)) {
pos[0] -= this.options.scroll.scrollLeft-this.originalScrollLeft;
pos[1] -= this.options.scroll.scrollTop-this.originalScrollTop;
}
-
- var p = [0,1].map(function(i){
- return (point[i]-pos[i]-this.offset[i])
+
+ var p = [0,1].map(function(i){
+ return (point[i]-pos[i]-this.offset[i])
}.bind(this));
-
+
if(this.options.snap) {
if(typeof this.options.snap == 'function') {
p = this.options.snap(p[0],p[1],this);
@@ -40,7 +40,7 @@ if(typeof(Draggable) != 'undefined'){
}
}
}
-
+
if(this.options.onDraw)
this.options.onDraw.bind(this)(p);
else{
@@ -57,17 +57,17 @@ if(typeof(Draggable) != 'undefined'){
(viewport_dimensions.width - container_dimensions.width) - margin_left,
(viewport_dimensions.height - container_dimensions.height) - margin_top
]];
- if((!this.options.constraint) || (this.options.constraint=='horizontal')){
+ if((!this.options.constraint) || (this.options.constraint=='horizontal')){
if((p[0] >= boundary[0][0]) && (p[0] <= boundary[1][0]))
this.element.style.left = p[0] + "px";
else
this.element.style.left = ((p[0] < boundary[0][0]) ? boundary[0][0] : boundary[1][0]) + "px";
- }
- if((!this.options.constraint) || (this.options.constraint=='vertical')){
+ }
+ if((!this.options.constraint) || (this.options.constraint=='vertical')){
if((p[1] >= boundary[0][1] ) && (p[1] <= boundary[1][1]))
this.element.style.top = p[1] + "px";
else
- this.element.style.top = ((p[1] <= boundary[0][1]) ? boundary[0][1] : boundary[1][1]) + "px";
+ this.element.style.top = ((p[1] <= boundary[0][1]) ? boundary[0][1] : boundary[1][1]) + "px";
}
}else{
if((!this.options.constraint) || (this.options.constraint=='horizontal'))
@@ -101,7 +101,7 @@ if(typeof(Object.Event) == "undefined")
Control.Window = Class.create({
initialize: function(container,options){
Control.Window.windows.push(this);
-
+
//attribute initialization
this.container = false;
this.isOpen = false;
@@ -119,7 +119,7 @@ Control.Window = Class.create({
fade: false,
appear: false
};
-
+
//options
this.options = Object.extend({
//lifecycle
@@ -138,7 +138,7 @@ Control.Window = Class.create({
hover: false, //element object to hover over, or if "true" only available for windows with sourceContainer (an anchor or any element already on the page with an href attribute)
indicator: false, //element to show or hide when ajax requests, images and iframes are loading
closeOnClick: false, //does not work with hover,can be: true (click anywhere), 'container' (will refer to this.container), or element (a specific element)
- iframeshim: true, //whether or not to position an iFrameShim underneath the window
+ iframeshim: true, //whether or not to position an iFrameShim underneath the window
//effects
fade: false,
fadeDuration: 0.75,
@@ -165,7 +165,7 @@ Control.Window = Class.create({
onRemoteContentLoaded: Prototype.emptyFunction,
insertRemoteContentAt: false //false will set this to this.container, can be string selector (first returned will be selected), or an Element that must be a child of this.container
},options || {});
-
+
//container setup
this.indicator = this.options.indicator ? $(this.options.indicator) : false;
if(container){
@@ -177,7 +177,7 @@ Control.Window = Class.create({
//second call made below will not create the container since the check is done inside createDefaultContainer()
this.createDefaultContainer(container);
//if an element with an href was passed in we use it to activate the window
- if(this.container && ((this.container.readAttribute('href') && this.container.readAttribute('href') != '') || (this.options.hover && this.options.hover !== true))){
+ if(this.container && ((this.container.readAttribute('href') && this.container.readAttribute('href') != '') || (this.options.hover && this.options.hover !== true))){
if(this.options.hover && this.options.hover !== true)
this.sourceContainer = $(this.options.hover);
else{
@@ -242,10 +242,10 @@ Control.Window = Class.create({
this.applyResizable();
//draggable support
this.applyDraggable();
-
+
//makes sure the window can't go out of bounds
Event.observe(window,'resize',this.outOfBoundsPositionHandler);
-
+
this.notify('afterInitialize');
},
open: function(event){
@@ -674,19 +674,24 @@ Control.Overlay = {
loaded: false,
container: false,
lastOpacity: 0,
- styles: {
- position: 'fixed',
- top: 0,
- left: 0,
- width: '100%',
- height: '100%',
- zIndex: Control.Window.baseZIndex - 1
- },
- ieStyles: {
- position: 'absolute',
- top: 0,
- left: 0,
- zIndex: Control.Window.baseZIndex - 1
+ styles: function() {
+
+ return {
+ position: 'fixed',
+ top: 0,
+ left: 0,
+ width: '100%',
+ height: '100%',
+ zIndex: Control.Window.baseZIndex - 1
+ };
+ },
+ ieStyles: function() {
+ return {
+ position: 'absolute',
+ top: 0,
+ left: 0,
+ zIndex: Control.Window.baseZIndex - 1
+ };
},
effects: {
fade: false,
@@ -706,7 +711,7 @@ Control.Overlay = {
Event.observe(window,'resize',Control.Overlay.positionOverlay);
Control.Overlay.observe('beforeShow',Control.Overlay.positionOverlay);
}else
- Control.Overlay.container.setStyle(Control.Overlay.styles);
+ Control.Overlay.container.setStyle(Control.Overlay.styles());
Control.Overlay.iFrameShim = new IframeShim();
Control.Overlay.iFrameShim.hide();
Event.observe(window,'resize',Control.Overlay.positionIFrameShim);
View
@@ -15,3 +15,18 @@ test("draggable", function () {
w.destroy();
equals(Draggables.observers.length, 0, "0 draggable observers are present after the last one is destroyed");
});
+
+test("overlay z-index", function() {
+ expect(4);
+ var setZto = 99999999;
+
+ equals(Control.Window.baseZIndex, 9999, "Z-index intitial value is set");
+ Control.Window.baseZIndex = setZto;
+ equals(Control.Window.baseZIndex, setZto, "Z-index accepted value set");
+
+ modal = new Control.Modal();
+ modal.open();
+
+ equals(Control.Overlay.ieStyles().zIndex, setZto - 1 , "Overlay inherited z-index from Window for ieStyles");
+ equals($('control_overlay').getStyles().zIndex, (String) (setZto - 1), "Overlay inherited z-index from Window for styles")
+});

0 comments on commit 1b0d96c

Please sign in to comment.