Skip to content

Commit

Permalink
Removing sniffing in IFrameShim, more info in the PR
Browse files Browse the repository at this point in the history
  • Loading branch information
@kentaromiura @arian
kentaromiura authored and arian committed Apr 9, 2014
1 parent 31a9bdb commit 6dacd3a
Show file tree
Hide file tree
Showing 2 changed files with 103 additions and 96 deletions.
1 change: 1 addition & 0 deletions Docs/Utilities/IframeShim.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -37,6 +37,7 @@ IframeShim Method: constructor
* offset - (*object: {x:#, y:#}*) move the iframe up/down, left/right relative to the element
* className - (*string*) className for the shim; defaults to *"iframeShim"*
* browsers - (*boolean*) allows you to specify the browsers that the iframe should show up for; defaults to ie6 or firefox on a mac `(Browser.ie6 || (Browser.firefox && Browser.version < 3 && Browser.Platform.mac))`. Example usage: `browsers: Browser.ie6 || Browser.opera` will show for ie6 and opera
**Important note:** The *browsers* option will default to `false` from MooTools 1.5, will still be `(Browser.ie6 || (Browser.firefox && Browser.version < 3 && Browser.Platform.mac))` for 1.4-compatibility version.
* src - (*string*) this is the source of the Iframe. For the most part, you shouldn't mess with this option. We've tested it across numerous environments (particularly https environments), but if you need to, for some reason, alter it, we've exposed it as an option, as your environment may require you try an alternate string. The default is *'javascript:false;document.write("");'*.

### Events
Expand Down
198 changes: 102 additions & 96 deletions Source/Utilities/IframeShim.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,105 +25,111 @@ provides: [IframeShim]
...
*/

var IframeShim = new Class({

Implements: [Options, Events, Class.Occlude],

options: {
className: 'iframeShim',
src: 'javascript:false;document.write("");',
display: false,
zIndex: null,
margin: 0,
offset: {x: 0, y: 0},
browsers: (Browser.ie6 || (Browser.firefox && Browser.version < 3 && Browser.Platform.mac))
},

property: 'IframeShim',

initialize: function(element, options){
this.element = document.id(element);
if (this.occlude()) return this.occluded;
this.setOptions(options);
this.makeShim();
return this;
},

makeShim: function(){
if (this.options.browsers){
var zIndex = this.element.getStyle('zIndex').toInt();

if (!zIndex){
zIndex = 1;
var pos = this.element.getStyle('position');
if (pos == 'static' || !pos) this.element.setStyle('position', 'relative');
this.element.setStyle('zIndex', zIndex);
var IframeShim = (function(){
var browsers = false;
//<1.4compat>
browsers = Browser.ie6 || (Browser.firefox && Browser.version < 3 && Browser.Platform.mac);
//</1.4compat>
return new Class({

Implements: [Options, Events, Class.Occlude],

options: {
className: 'iframeShim',
src: 'javascript:false;document.write("");',
display: false,
zIndex: null,
margin: 0,
offset: {x: 0, y: 0},
browsers: browsers
},

property: 'IframeShim',

initialize: function(element, options){
this.element = document.id(element);
if (this.occlude()) return this.occluded;
this.setOptions(options);
this.makeShim();
return this;
},

makeShim: function(){
if (this.options.browsers){
var zIndex = this.element.getStyle('zIndex').toInt();

if (!zIndex){
zIndex = 1;
var pos = this.element.getStyle('position');
if (pos == 'static' || !pos) this.element.setStyle('position', 'relative');
this.element.setStyle('zIndex', zIndex);
}
zIndex = ((this.options.zIndex != null || this.options.zIndex === 0) && zIndex > this.options.zIndex) ? this.options.zIndex : zIndex - 1;
if (zIndex < 0) zIndex = 1;
this.shim = new Element('iframe', {
src: this.options.src,
scrolling: 'no',
frameborder: 0,
styles: {
zIndex: zIndex,
position: 'absolute',
border: 'none',
filter: 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)'
},
'class': this.options.className
}).store('IframeShim', this);
var inject = (function(){
this.shim.inject(this.element, 'after');
this[this.options.display ? 'show' : 'hide']();
this.fireEvent('inject');
}).bind(this);
if (!IframeShim.ready) window.addEvent('load', inject);
else inject();
} else {
this.position = this.hide = this.show = this.dispose = Function.from(this);
}
zIndex = ((this.options.zIndex != null || this.options.zIndex === 0) && zIndex > this.options.zIndex) ? this.options.zIndex : zIndex - 1;
if (zIndex < 0) zIndex = 1;
this.shim = new Element('iframe', {
src: this.options.src,
scrolling: 'no',
frameborder: 0,
styles: {
zIndex: zIndex,
position: 'absolute',
border: 'none',
filter: 'progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)'
},
'class': this.options.className
}).store('IframeShim', this);
var inject = (function(){
this.shim.inject(this.element, 'after');
this[this.options.display ? 'show' : 'hide']();
this.fireEvent('inject');
}).bind(this);
if (!IframeShim.ready) window.addEvent('load', inject);
else inject();
} else {
this.position = this.hide = this.show = this.dispose = Function.from(this);
}
},

position: function(){
if (!IframeShim.ready || !this.shim) return this;
var size = this.element.measure(function(){
return this.getSize();
});
if (this.options.margin != undefined){
size.x = size.x - (this.options.margin * 2);
size.y = size.y - (this.options.margin * 2);
this.options.offset.x += this.options.margin;
this.options.offset.y += this.options.margin;
},

position: function(){
if (!IframeShim.ready || !this.shim) return this;
var size = this.element.measure(function(){
return this.getSize();
});
if (this.options.margin != undefined){
size.x = size.x - (this.options.margin * 2);
size.y = size.y - (this.options.margin * 2);
this.options.offset.x += this.options.margin;
this.options.offset.y += this.options.margin;
}
this.shim.set({width: size.x, height: size.y}).position({
relativeTo: this.element,
offset: this.options.offset
});
return this;
},

hide: function(){
if (this.shim) this.shim.setStyle('display', 'none');
return this;
},

show: function(){
if (this.shim) this.shim.setStyle('display', 'block');
return this.position();
},

dispose: function(){
if (this.shim) this.shim.dispose();
return this;
},

destroy: function(){
if (this.shim) this.shim.destroy();
return this;
}
this.shim.set({width: size.x, height: size.y}).position({
relativeTo: this.element,
offset: this.options.offset
});
return this;
},

hide: function(){
if (this.shim) this.shim.setStyle('display', 'none');
return this;
},

show: function(){
if (this.shim) this.shim.setStyle('display', 'block');
return this.position();
},

dispose: function(){
if (this.shim) this.shim.dispose();
return this;
},

destroy: function(){
if (this.shim) this.shim.destroy();
return this;
}

});
});
})();

window.addEvent('load', function(){
IframeShim.ready = true;
Expand Down

0 comments on commit 6dacd3a

Please sign in to comment.