/*
* zoomy 1.2 - jquery plugin
* http://redeyeops.com/plugins/zoomy
*
* copyright (c) 2010 jacob lowe (http://redeyeoperations.com)
* dual licensed under the mit (mit-license.txt)
* and gpl (gpl-license.txt) licenses.
*
* built for jquery library
* http://jquery.com
*
* addition fixes and modifications done by larry battle ( blarry@bateru.com )
* # code has been refactored and the logic has been corrected.
*
*/
(function($){
// global zoomys state, indexed, 0 = no zoom, 1 = zoom;
var zoomystate = [];
jquery.fn.zoomy = function(event, options) {
//defaults
var defaults = {
zoomsize: 200,
round: true,
glare: true,
zoomtext: 'default',
clickable: false,
attr: 'href'
}, defaultevent = 'click';
if(typeof(event) === 'object' && options === undefined){
options = event;
event = defaultevent;
}else if(event === undefined){
event = defaultevent;
}
options = $.extend(defaults, options);
// add zoomy
var addzoomy = function(ele, i) {
zoomystate.push(0);
// adds functionality with ability to zoom in and also link to another page
var attribute = function(){
if(typeof(ele.attr(options.attr)) === 'string' && options.attr !== 'href'){
return ele.attr(options.attr);
}else{
return ele.attr('href');
}
},
image = attribute(),
cursor = function(){
if($.browser.mozilla){
return '-moz-zoom-in';
}else if($.browser.webkit){
return '-webkit-zoom-in';
}else{
return 'cell';
}
};
ele.css({'position': 'relative', 'cursor': cursor}).append('
![]()
');
var zoom = $('.zoom-obj-'+i);
zoomparams(ele, zoom);
// load zoom image after params are set
loadimage(ele, image, zoom);
var eventhandler = function(){
var zoomdefaulttext = function(x){
if(options.zoomtext === 'default' || options.zoomtext === ''){
options.zoomtext = x;
};
return true;
},
clickablity = function(){
if(!options.clickable){
ele.bind('click',function(){return false;});
}
};
switch(event){
case 'dblclick' :
clickablity();
zoomdefaulttext('double click to zoom in');
break;
case 'mouseover' || 'mouseenter' :
clickablity();
zoomdefaulttext('mouse over to zoom in');
zoombarenter(ele);
break;
default:
clickablity();
zoomdefaulttext('click to zoom in');
break;
}
//case with event to initiate the zoom
//support for mouseover, mouseenter click, doubleclick,
ele.bind(event, function(){
if(zoomystate[i] === 0){
zoom.css({opacity: 1}).addclass('cursorhide').show();
zoomystate[i] = 1;
zoombarleave(ele, zoom);
settimeout(function () {
if (!zoom.find('img').length) {
zoomenter(ele, zoom, image);
}
}, 100);
}else{
zoom.css({opacity: 0}).removeclass('cursorhide');
zoomystate[i] = 0;
}
//unbind event mouse over to fix hover conflict issues
if(event === 'mouseover' || event === 'mouseenter'){
ele.unbind(event);
}
toggleclasses(ele);
return false;
});
}
eventhandler();
//todo fix issue with mouse over and mouse enter conflict with this hover statment
ele.hover(function () {
if(zoomystate[i] === 0){
zoombarenter(ele);
}else{
zoomenter(ele, zoom, image);
}
}, function (){
if(zoomystate[i] === 0){
zoombarleave(ele);
}else{
zoomleave(ele, zoom);
}
});
},
zoombarenter = function(ele){
var zb = ele.find('.zoombar');
if(zb.length ===0){
// ele.append(''+options.zoomtext+'');
}else{
// zb.html(options.zoomtext);
}
},
zoombarleave = function(ele){
// ele.find('.zoombar').html(options.zoomtext);
},
zoomenter = function(ele, zoom, image){
var isidbrokezoomy = (zoom.attr('id') === 'brokezoomy');
if ( !isidbrokezoomy ) {
//resetzoom(ele, zoom);
startzoom(ele, zoom);
toggleclasses(ele);
}
},
toggleclasses = function(ele){
var img = ele.find('img');
if(zoomystate[ele.find('.zoomy').attr('rel')] === 0){
ele.removeclass('inactive');
}else{
ele.addclass('inactive');
}
},
zoomleave = function(ele, zoom){
if (zoom.attr('id') !== 'brokezoomy' && !zoom.find('img').length ) {
settimeout(function () {
zoom.hide();
},100);
}
},
// start zoom
//includes mouse move event
startzoom = function(ele, zoom) {
var ratio = function(x, y){
var z = x/y;
return z;
},
l = ele.offset(),
zoomimgx = parseint(ele.attr('x'), 10),
zoomimgy = parseint(ele.attr('y'), 10),
tnimgx = ele.width(),
tnimgy = ele.height(),
zoomsize = options.zoomsize,
halfsize = zoomsize / 2,
ratiox = ratio(tnimgx,zoomimgx),
ratioy = ratio(tnimgy,zoomimgy),
stop = math.round(halfsize - (halfsize * ratiox)),
stoppos = function(x){
var p = (x - zoomsize) + stop;
return p;
},
rightstop = stoppos(tnimgx),
bottomstop = stoppos(tnimgy),
zoomy = zoomimgy - zoomsize,
zoomx = zoomimgx - zoomsize,
mousepos = function(x,y){
var p = x-y-halfsize;
return p;
},
zoompos = function(x,y,z){
var p = math.round((x - y) / z)-halfsize;
return p;
},
cdcreate = function(a,b,c,d,e,f){
var bgpos = a+b+'px '+c+d+'px',
o = {
backgroundposition: bgpos,
left: e,
top: f
};
return o;
};
// mouse move event
ele.mousemove(function (e) {
if(zoomystate[zoom.attr('rel')] === 1){
var posx = mousepos(e.pagex,l.left),
posy = mousepos(e.pagey,l.top),
leftx = zoompos(e.pagex,l.left,ratiox),
topy = zoompos(e.pagey,l.top,ratioy),
arrposb = [
['-', leftx,'-',topy,posx,posy],
['',0,'-',topy,-stop,posy],
['',0,'',0,-stop,-stop],
['',0,'-',zoomy,-stop,bottomstop],
['-',leftx,'',0,posx,-stop],
['-',zoomx,'',0,rightstop,-stop],
['-',zoomx,'-',topy,rightstop,posy],
['-',zoomx,'-',zoomy,rightstop,bottomstop],
['-',leftx,'-',zoomy,posx,bottomstop]
],
cssarrofobj = function(){
var ar = [];
for ( i=0; i < arrposb.length; i++) {
var ap = arrposb[i],
posb = cdcreate(ap[0],ap[1],ap[2],ap[3],ap[4],ap[5]);
ar.push(posb);
}
return ar;
},
a = -stop <= posx,
e2 = -stop > posx,
b = -stop <= posy,
f = -stop > posy,
d = bottomstop > posy,
g = bottomstop <= posy,
c = rightstop > posx,
j = rightstop <= posx,
cssarrindex = ( a && b && c && d ) ? 0 : ( e2 ) ? ( b && d ) ? 1 : ( f ) ? 2 : ( g ) ? 3 : null : ( f ) ? (c) ? 4 : 5 : ( j ) ? ( d ) ? 6 : 7 : ( g ) ? 8 : null;
zoom.show().css( cssarrofobj()[ cssarrindex ] || {} );
}
});
},
// load zoom image
loadimage = function(ele, image, zoom) {
var y = ele.children('img').height(),
x = ele.children('img').width(),
zs = options.zoomsize / 2;
//move the zoomy out of the screen view while loading img
zoom.show('').css({top:'-999999px',left:'-999999px'});
if (zoom.find('img').attr('src') !== image) {
zoom.find('img').attr('src', image).load(function(){
ele.attr({
'x': zoom.find('img').width(),
'y': zoom.find('img').height()
});
if (options.glare) {
zoom.html('').css({
'background-image': 'url(' + image + ')'
});
settimeout(function () {
setglare(zoom);
}, 100);
} else {
zoom.html('').css({
'background-image': 'url(' + image + ')'
});
}
}).each(function(){
if(this.complete || (jquery.browser.msie && parseint(jquery.browser.version, 10) === 6)){
$(this).trigger("load");
}
});
}
},
resetzoom = function(ele, zoom, x , y) {
var img = ele.children('img');
var mid = options.zoomsize/2;
if(!x){x=0;}
if(!y){y=0;}
zoom.css({
left: x-mid+'px',
top: y-mid+'px'
}).parent('a').css({
height: img.height(),
width: img.width()
});
},
zoomparams = function(ele, zoom) {
var img = ele.children('img'),
margin = img.css('margin-left'),
namepick = function(img){
var f = img.css('float');
if(f){
if(f === 'none'){
var inline = img.attr('style');
if(inline){
var incss = inline.split(';');
for(i = 0; i<= incss.length; i++){
if(incss[i]) var style = incss[i].split(':');
else var style = [0,0];
if(style[0]==='float'){
return(style[1]);
}
}
}else{
return f;
}
}else{
return f;
}
}else{
if(img.parent('*').css('text-align') === 'center'){
return 'center';
}else{
return 'unknown';
}
}
}
zoom.css({
height: options.zoomsize,
width: options.zoomsize
}).css( getborderradiuscssobj() );
if( !options.glare ){
zoom.children('span').css({
height: options.zoomsize - 10,
width: options.zoomsize - 10
});
}
if(margin === undefined || margin === ''){margin = '5px';}
var cssobj = {
'left':[{
'margin': margin,
'float': 'left'
}],
'right':[{
'margin': margin,
'float': 'right'
}],
'center':[{
'margin': margin+' auto',
'display': 'block'
}],
'unknown' : [{
'margin' : margin,
'display': 'block'
}],
'none' : [{
'margin': margin,
'display': 'block'
}]
},
cssnamepick = namepick(img);
img.css('margin', '0px');
ele.css( cssobj[ cssnamepick ][0]);
img.one("load",function(){
ele.css({
'display': 'block',
height: img.height(),
width: img.width(),
'cursor': 'normal'
});
}).each(function(){
if(this.complete || (jquery.browser.msie && parseint(jquery.browser.version, 10) === 6)){
$(this).trigger("load");
}
});
},
getborderradiuscssobj = function(x){
if( !options.round ){
return "";
}else{
var cssobj = {};
if(x === undefined){
cssobj['-webkit-border-radius'] = cssobj['-moz-border-radius'] = cssobj[ 'border-radius' ] = options.zoomsize / 2 + 'px';
}else{
cssobj['-webkit-border-radius'] = cssobj['-moz-border-radius'] = cssobj[ 'border-radius' ] = options.zoomsize / 2 + 'px '+options.zoomsize / 2 + 'px 0px 0px';
}
if(jquery.browser.msie && parseint(jquery.browser.version, 10) === 9){$('.zoomy').find('span').css('margin', '0');}
return cssobj;
}
},
setglare = function(zoom) {
zoom.children('span').css({
height: options.zoomsize/2,
width: options.zoomsize - 10
}).css( getborderradiuscssobj(0) );
};
$(this).each(function() {
addzoomy($(this), zoomystate.length);
});
};
}(jquery));