////////////////////////////////////////////////////
// jQuery Tools overlay effect: autoiframe
// Adding this effect will read the target for an
// href attribute and open the link in an iframe
// in a jQuery Tools overlay, and automatically
// resizes and repositions to fit.
// Written by Mathieu Bouchard (c) 2010
////////////////////////////////////////////////////
$( document ).ready( function()
{
if( window.parent.document === document )
{
if( $( "#autoiframe" ).length === 0 )
{
$( "body" ).append( $( "
" ) );
}
}
});
$.tools.overlay.addEffect( "autoiframe",
function( position, done )
{
var conf = this.getConf();
var overlay = this.getOverlay();
var trigger = this.getTrigger();
var iframe = $( "" );
var autoiframe = $.tools.overlay.autoiframe;
autoiframe.setOriginalCSS( { width: overlay.css( "width" ), height: overlay.css( "height" ), left: overlay.css( "left" ), top: overlay.css( "top" ) } );
$( ".iframe", overlay ).append( iframe );
iframe.attr( "src", trigger.attr( "href" ) );
iframe.load( function()
{
autoiframe.setDocuments( this.contentWindow.document, document );
if( $( "body > img", this.contentWindow.document ).length === 1 && $( "body > *", this.contentWindow.document ).length === 1 )
{
if( $.browser.mozilla )
{
this.contentWindow.document.write( "" + $( this ).attr( "src" ) + "" );
}
else if( $.browser.msie )
{
$( "body", this.contentWindow.document ).css( { padding: "0px", margin: "0px" } );
}
}
autoiframe.show();
autoiframe.autoResize();
autoiframe.autoPosition();
});
$( ".close", overlay ).css(
{
position: "absolute",
cursor: "pointer",
zIndex: 10001,
display: "none"
});
position = trigger.offset();
//if( parseInt( autoiframe.getOriginalCSS( "top" ) ) !== 0 ) position.top = autoiframe.getOriginalCSS( "top" );
//if( parseInt( autoiframe.getOriginalCSS( "left" ) ) !== 0 ) position.left = autoiframe.getOriginalCSS( "left" );
overlay.css( position ).fadeIn( conf.speed, function()
{
done.call();
});
},
function( done )
{
var conf = this.getConf();
var overlay = this.getOverlay();
var trigger = this.getTrigger();
var iframe = overlay.find( "iframe" );
var autoiframe = $.tools.overlay.autoiframe;
overlay.fadeOut( conf.closeSpeed, function()
{
iframe.remove();
overlay.css( { height: autoiframe.getOriginalCSS( "height" ), width: autoiframe.getOriginalCSS( "width" ) } );
done.call();
});
}
);
$.tools.overlay.autoiframe = function()
{
var innerDocument;
var outerDocument;
var api;
var overlay;
var conf;
var trigger;
var iframe;
var close;
var originalCSS;
var setup = function( innerDoc, outerDoc )
{
innerDocument = innerDoc;
outerDocument = outerDoc;
api = $( "*[rel=#autoiframe]", outerDocument ).data( "overlay" );
overlay = api.getOverlay();
conf = api.getConf();
trigger = api.getTrigger();
iframe = overlay.find( "iframe" );
close = overlay.find( ".close" );
$( window.top ).resize( function()
{
if( overlay.is( ":visible" ) ) reposition();
});
$( window.top ).scroll( function()
{
if( overlay.is( ":visible" ) ) reposition();
});
return this;
};
var show = function()
{
iframe.show();
close.show();
};
var resize = function( width, height )
{
var maxHeight = parseInt( iframe.css( "max-height" ) );
var maxWidth = parseInt( iframe.css( "max-width" ) );
var windowHeight = $( window ).height();
var windowWidth = $( window ).width();
maxHeight = maxHeight > windowHeight ? windowHeight : maxHeight;
maxWidth = maxWidth > windowWidth ? windowWidth : maxWidth;
height = height > maxHeight ? maxHeight : height;
width = width > maxWidth ? maxWidth : width;
var left = ( $( window ).width() - width ) / 2;
var top = ( $( window ).height() - height ) / 2;
iframe.width( width );
iframe.height( height );
overlay.animate( { height: height, width: width, left: left, top: top }, { duration: 250, queue: false } );
return this;
};
var reposition = function()
{
var top = Math.max( ( $( window.top ).height() - $( iframe ).height() ) / 2, 12 );
var left = ( $( window.top ).width() - $( iframe ).width() ) / 2;
top += $( window.top ).scrollTop();
overlay.animate( { top: top, left: left }, { duration: 250, queue: false, easing: "swing" } );
};
return {
setDocuments: function( innerDoc, outerDoc )
{
return setup( innerDoc, outerDoc );
},
show: function()
{
show();
},
autoResize: function()
{
var width = $( innerDocument ).width();
var height = $( innerDocument ).height();
return resize( width, height );
},
autoPosition: function()
{
return reposition();
},
setOriginalCSS: function( data )
{
if( originalCSS === undefined )
{
originalCSS = data;
}
},
getOriginalCSS: function( key )
{
return originalCSS[ key ];
}
};
}();