/*
* jQuery.ImageSwitch
* Version: 1.1.0
* http://www.hieu.co.uk/ImageSwitch/
*
* Copyright (c) 2009 Hieu Pham - http://www.hieu.co.uk
* COMMON DEVELOPMENT AND DISTRIBUTION LICENSE (CDDL)
* http://www.opensource.org/licenses/cddl1.php
*
* Date: 24/01/2011
* Revision: 50
*/
var Debug = function(b, a) { if (!$("#Debug")) { $("body").append("<div id='Debug'></div>") } if (a) { $("#Debug").html($("#Debug").html() + "<br/>" + b) } else { $("#Debug").html($("#Debug").html() + b) } }; var max_ImageSwitch_Effect_ID = 0; (function(a) { a.fn.ImageSwitch = function(l, d) { var f = { Type: "FadeIn", NewImage: "", EffectOriginal: true, Speed: 1000, StartLeft: 50, StartTop: 0, StartOpacity: 0, EndLeft: -50, EndTop: 0, EndOpacity: 0, Direction: "RightLeft", Door1: "", Door2: "" }; var q = a.extend(f, l); var i = this; var h = 0; var k; var p; var o; var j = function() { i.data("imageswitch", -1) }; if (a.isFunction(d)) { j = function() { d(); i.data(i, -1) } } var c = function() { i.parent().append("<img class='GrpEffectImg' id='" + k.replace("#", "") + "'/>"); a(k).attr("src", i.attr("src")); a(k).css("position", "absolute"); a(k).css("top", i.position().top); a(k).css("left", i.position().left); a(k).css("opacity", 1); i.attr("src", q.NewImage); if (q.EffectOriginal) { i.css("opacity", q.StartOpacity); i.animate({ opacity: 1 }, q.Speed) } a(k).animate({ opacity: 0 }, q.Speed, function() { a(k).remove(); j() }) }; var g = function(r) { a("body").append("<img class='GrpEffectImg' id='" + k.replace("#", "") + "'/>"); a(k).css("position", "absolute"); if (r) { a(k).attr("src", q.NewImage); a(k).css("top", i.offset().top + q.StartTop); a(k).css("left", i.offset().left + q.StartLeft); a(k).css("opacity", q.StartOpacity); EndTop = i.offset().top; EndLeft = i.offset().left; EndOpacity = 1 } else { a(k).attr("src", i.attr("src")); i.attr("src", q.NewImage); a(k).css("top", i.offset().top); a(k).css("left", i.offset().left); a(k).css("opacity", 1); EndTop = i.offset().top + q.EndTop; EndLeft = i.offset().left + q.EndLeft; EndOpacity = q.EndOpacity } a(k).animate({ opacity: EndOpacity, top: EndTop, left: EndLeft }, q.Speed, function() { i.attr("src", q.NewImage); a(k).remove(); j() }) }; var b = function(u) { var t = i.clone(true); i.wrap("<div id='GrpViewport-" + h + "'></div>"); a("#GrpViewport-" + h).css("overflow", "hidden"); a("#GrpViewport-" + h).width(i.width()); a("#GrpViewport-" + h).height(i.height()); a("#GrpViewport-" + h).append("<img class='GrpEffectImg' id='" + k.replace("#", "") + "'/>"); a(k).css("position", "absolute"); var r = 0; var s = 0; switch (q.Direction) { case "RightLeft": s = -i.width(); break; case "LeftRight": s = i.width(); break; case "TopDown": r = -i.height(); break; case "DownTop": r = i.height(); break } if (u) { a(k).attr("src", q.NewImage); a(k).css("top", r); a(k).css("left", s); a(k).css("opacity", q.StartOpacity); EndTop = 0; EndLeft = 0; EndOpacity = 1 } else { a(k).attr("src", i.attr("src")); a(k).css("left", 0); a(k).css("top", 0); i.attr("src", q.NewImage); EndTop = r; EndLeft = s; EndOpacity = q.EndOpacity } if (i.css("position") != "absolute") { a("#GrpViewport-" + h).css("position", "relative"); i.css("position", "absolute") } else { a("#GrpViewport-" + h).css("position", "absolute"); a("#GrpViewport-" + h).css("left", i.css("left")); a("#GrpViewport-" + h).css("top", i.css("top")); i.css("top", 0); i.css("left", 0) } if (q.EffectOriginal && u) { i.animate({ top: -r, left: -s }, q.Speed) } a(k).animate({ opacity: EndOpacity, top: EndTop, left: EndLeft }, q.Speed, function() { t.attr("src", q.NewImage); t.removeAttr("imageswitch"); a("#GrpViewport-" + h).replaceWith(t); j() }) }; var n = function() { var t = i.clone(true); i.wrap("<div id='GrpViewport'></div>"); a("#GrpViewport").css("overflow", "hidden"); a("#GrpViewport").width(i.width()); a("#GrpViewport").height(i.height()); a("#GrpViewport").append("<div class='GrpEffectDiv' id='" + p.replace("#", "") + "'/>"); a(p).attr("src", q.NewImage); a(p).css("position", "absolute"); a(p).css("background-color", "#FFF"); if (q.Door1.length > 0) { a(p).css("background", q.Door1) } a(p).width(i.width()); a(p).height(i.height()); var r = 0; var s = 0; switch (q.Direction) { case "RightLeft": s = -i.width(); break; case "LeftRight": s = i.width(); break; case "TopDown": r = -i.height(); break; case "DownTop": r = i.height(); break } a(p).css("top", r); a(p).css("left", s); if (i.css("position") != "absolute") { a("#GrpViewport").css("position", "relative"); i.css("position", "absolute") } else { a("#GrpViewport").css("position", "absolute"); a("#GrpViewport").css("left", i.css("left")); a("#GrpViewport").css("top", i.css("top")); i.css("top", 0); i.css("left", 0) } a(p).animate({ top: 0, left: 0 }, q.Speed, function() { i.attr("src", q.NewImage); a(p).animate({ top: r, left: s }, q.Speed, function() { t.attr("src", q.NewImage); t.removeAttr("imageswitch"); a("#GrpViewport").replaceWith(t); j() }) }) }; var e = function() { var v = i.css("position"); var r = i.css("left"); var u = i.css("top"); i.wrap("<div id='GrpViewport'></div>"); a("#GrpViewport").css("overflow", "hidden"); a("#GrpViewport").width(i.width()); a("#GrpViewport").height(i.height()); a("#GrpViewport").append("<div class='GrpEffectDiv' id='" + p.replace("#", "") + "'/>"); a(p).css("position", "absolute"); a(p).css("background-color", "#FFF"); if (q.Door1.length > 0) { a(p).css("background", q.Door1) } a(p).width(i.width()); a(p).height(i.height()); a("#GrpViewport").append("<div class='GrpEffectDiv1' id='" + o.replace("#", "") + "'/>"); a(o).css("position", "absolute"); a(o).css("background-color", "#FFF"); if (q.Door2.length > 0) { a(o).css("background", q.Door2) } a(o).width(i.width()); a(o).height(i.height()); var s = 0; var t = 0; switch (q.Direction) { case "RightLeft": t = -i.width(); break; case "LeftRight": t = i.width(); break; case "TopDown": s = -i.height(); break; case "DownTop": s = i.height(); break } a(p).css("top", s); a(p).css("left", t); a(o).css("top", -s); a(o).css("left", -t); if (!q.EffectOriginal) { a(p).css("background", "#FFF url(" + q.NewImage + ") no-repeat " + -t / 2 + "px " + -s / 2 + "px"); a(o).css("background", "#FFF url(" + q.NewImage + ") no-repeat " + t / 2 + "px " + s / 2 + "px") } if (i.css("position") != "absolute") { a("#GrpViewport").css("position", "relative"); i.css("position", "absolute") } else { a("#GrpViewport").css("position", "absolute"); a("#GrpViewport").css("left", r); a("#GrpViewport").css("top", u); i.css("position", "absolute"); i.css("top", 0); i.css("left", 0) } a(p).animate({ top: s / 2, left: t / 2 }, q.Speed, function() { i.attr("src", q.NewImage); if (!q.EffectOriginal) { i.css("position", v); i.css("top", u); i.css("left", r); a("#GrpViewport").replaceWith(i) } else { a(p).animate({ top: s, left: t }, q.Speed, function() { i.css("position", v); i.css("top", u); i.css("left", r); a("#GrpViewport").replaceWith(i) }) } }); a(o).animate({ top: -s / 2, left: -t / 2 }, q.Speed, function() { i.attr("src", q.NewImage); if (!q.EffectOriginal) { j() } else { a(o).animate({ top: -s, left: -t }, q.Speed, function() { j() }) } }) }; var m = function(s) { var r = i.clone(true); if (i.css("z-index") == "auto") { i.css("z-index", 100) } if (i.css("position") != "absolute") { i.css("position", "relative") } a("body").append("<img class='GrpEffectImg'  id='" + k.replace("#", "") + "'/>"); a(k).css("position", "absolute"); a(k).css("top", i.offset().top); a(k).css("left", i.offset().left); if (s) { a(k).css("opacity", q.StartOpacity); a(k).css("z-index", i.css("z-index") - 1); a(k).attr("src", q.NewImage) } else { a(k).css("opacity", 1); a(k).css("z-index", i.css("z-index") + 1); a(k).attr("src", i.attr("src")); i.attr("src", q.NewImage) } if (Math.abs(q.EndTop) < i.height() && Math.abs(q.EndLeft) < i.width()) { EndTop = i.offset().top; EndLeft = i.offset().left + i.width() } else { EndTop = i.offset().top + q.EndTop; EndLeft = i.offset().left + q.EndLeft } EndOpacity = 1; a(k).animate({ opacity: EndOpacity, top: EndTop, left: EndLeft }, q.Speed, function() { if (s) { a(k).css("z-index", 101) } else { EndOpacity = q.EndOpacity; a(k).css("z-index", 2) } a(k).animate({ opacity: EndOpacity, top: i.offset().top, left: i.offset().left }, q.Speed, function() { r.attr("src", q.NewImage); r.removeAttr("imageswitch"); i.replaceWith(r); a(k).remove(); j() }) }) }; return this.each(function() { i = a(this); if (!i.ImageAnimating()) { h = max_ImageSwitch_Effect_ID; max_ImageSwitch_Effect_ID += 1; i.data(i, h); k = "#GrpEffectImg-" + h; p = "#GrpEffectDiv1-" + h; o = "#GrpEffectDiv2-" + h; var r = new Image(); r.src = q.NewImage; a.ImagePreload(q.NewImage, function() { switch (q.Type) { case "FadeIn": c(); break; case "FlyIn": g(true); break; case "FlyOut": g(false); break; case "FlipIn": m(true); break; case "FlipOut": m(false); break; case "ScrollIn": b(true); break; case "ScrollOut": b(false); break; case "SingleDoor": n(); break; case "DoubleDoor": e(); break } }) } }) } })(jQuery); (function(a) { a.fn.ImageAnimating = function() { if (this.data("imageswitch") > 0) { return true } else { return false } } })(jQuery); (function(a) { a.fn.ImageStop = function(c, b, d) { return this.each(function() { if (a(this).ImageAnimating()) { var e = a.data(this, "imageswitch"); a("#GrpEffectImg-" + e).stop(c, b); a("#GrpEffectDiv-" + e).stop(c, b); a("#GrpEffectDiv1-" + e).stop(c, b); a(this).stop(c, b); a("#GrpEffectImg-" + e).remove(); a("#GrpEffectDiv-" + e).remove(); a("#GrpEffectDiv1-" + e).remove(); if (a.isFunction(d)) { d() } } }) } })(jQuery); (function(a) { a.ImageStopAll = function(c, b, d) { a(".GrpEffectImg").stop(c, b); a(".GrpEffectDiv").stop(c, b); a(".GrpEffectDiv1").stop(c, b); a(this).stop(c, b); a(".GrpEffectImg").remove(); a(".GrpEffectDiv").remove(); a(".GrpEffectDiv1").remove(); a.data(this, "imageswitch", -1); if (a.isFunction(d)) { d() } } })(jQuery); (function(a) { a.ImagePreload = function(b, d) { var c = new Image(); c.src = b; if (a.isFunction(d)) { a(c).load(d()) } } })(jQuery);