// jquery.jframe.js Copyright JMDNOMINAS.COM
// jframe is a small plugin for jQuery that makes DIVs work as frames.
// jframe will load any URL in the background and play a smooth transition when it's been loaded.
// There are a few options for fine tunning jframe
// action : 'load' (default). Preloads URL in the background and waits for the moment to turn it visible.
// action : 'swap'. Performs the transition between the currently visible URL and the new preloaded URL.
// swapmode : transition effect.'fade', 'push' or 'slide'.(defaults to 'fade'),
// speed : speed for swap transition. (default 1500 ms)
// timeout : Delay before automatic swap. (defaults to 1500 ms).
// Example calls
// $("myDIV").jframe(URL); // Loads URL and waits 1500 ms before performing a fadeIn.
// $("myDIV".jframe("",{action:'swap',swapmode:'slide'}); // Stops waiting and performs a slideIn of a preloaded URL
// ¿ When do I call for a swap ?
// In the caller
// function callswap{$("myDIV".jframe("",{action:'swap'}
// In the called URL
//
(function($) {var clase;
$.fn.showUrl = function(url,options) {
var opts = $.extend({}, $.fn.showUrl.defaults, options);
return this.each(function() {
$this = $(this);
var o = $.meta ? $.extend({}, opts, $this.data()) : opts;
// A ver si tenemos un div con id=backswap
var clase=$this.attr("class");
var IdBack="#backswap"+clase;
var IdFront="#frontswap"+clase;
var backswap=$(IdBack,$this);
var frontswap=$(IdFront,$this);
// Si no lo hay lo creamos
if (backswap.size()==0) { $this.html($.fn.showUrl.addSwap("backswap"+clase,clase)); var backswap=$(IdBack,$this);}
switch(opts.action)
{
case 'load':
if(url!="")
{
var visorf=$("#Visor",frontswap)
var visorb=$("#Visor",backswap)
if(visorf.attr("src")!=url)
{
visorb.attr("src",url);
timeout=setTimeout(function() { $.fn.showUrl.swap(backswap,frontswap,opts)}, opts.timeout);
}
}
break;
case 'swap':
$.fn.showUrl.swap(backswap,frontswap,opts);
break;
}
});
};
$.fn.showUrl.swap=function(backswap,frontswap,opts){
if (timeout) { clearTimeout(timeout);}
if (backswap.size())
{
// Effect Out
if (frontswap.size())
{
switch(opts.swapmode)
{
case 'push':
frontswap.animate({top:frontswap.height()},opts.speed);
frontswap.fadeOut();
break;
case 'slide':
frontswap.slideUp(opts.speed);
break;
case 'fade':
default:
frontswap.fadeOut(opts.speed);
}
frontswap.attr("id","backswap"+clase);
}
// Effect In
switch(opts.swapmode)
{
case 'push':
backswap.css("top",-backswap.height());
backswap.fadeIn();
backswap.animate({top:0},opts.speed);
break;
case 'slide':
backswap.slideDown(opts.speed);
break;
case 'fade':
default:
backswap.fadeIn(opts.speed);
}
backswap.attr("id","frontswap"+clase);
// frontswap.remove();
}
};
$.fn.showUrl.defaults = {
action: 'load',
swapmode:'fade',
timeout:1500,
speed:1500
};
$.fn.showUrl.addSwap = function(id,clase) {
// return '';
return '';
};
})(jQuery);