var zoomObj = {
_boxId : 'zoomObjBox',
_contentId : 'zoomObjContent',
_additionalContentId : 'zoomObjAdditionalContent',
_additionalParentId : null,
_settings : {
boxWidth : 400,
boxHeight : 400,
isMobile : false
},
_data : {
content : {},
additional : {}
},
init : function (parentId, additionalParentId, isMobile) {
_this = this;
if ('undefined' !== typeof(additionalParentId)) {
_this._additionalParentId = additionalParentId;
}
if ('undefined' !== typeof(isMobile) && true == isMobile) {
_this._settings.isMobile = true;
}
jQuery('#' + parentId).empty();
jQuery('#' + parentId).append('
')
jQuery('#' + parentId).append('');
jQuery('#' + parentId).append('');
var contentList = '';
jQuery('#' + _this._contentId).append(contentList);
var contentAdditionalList = '';
jQuery('#' + _this._additionalContentId).append(contentAdditionalList);
},
configure : function (key, value)
{
if ('undefined' !== typeof(_this._settings[key]))
{
_this._settings[key] = value;
}
},
add : function (objContent) {
_this._data.content = objContent;
var first = true;
for (var i in objContent) {
var id = 'itemLi' + i;
var image = '
';
var preloadImg = '
';
var preloadBig = '';
if (false === _this._settings.isMobile) {
var preloadBig = '
';
}
var entry = '' + image + preloadImg + preloadBig + '';
jQuery('#' + _this._contentId + ' ul.contentList').append(entry);
if (true === first) {
var current = i;
window.setTimeout(function () {
_this._initBox('content', current);
}, 100);
}
first = false;
}
jQuery('li > .contentListItemImg').on('click', function () {
_this._initBox(jQuery(this).attr('data-type'), jQuery(this).attr('data-id'));
});
},
addAdditional : function (objContent) {
jQuery('#' + _this._additionalContentId + ' .contentAdditionalList').empty();
_this._data.additional = objContent;
var first = true;
for (var i in objContent) {
var id = 'itemLiAdditional' + i;
var image = '
';
var preloadImg = '
';
var preloadBig = '';
if (false === _this._settings.isMobile) {
var preloadBig = '
';
}
var entry = '' + image + preloadImg + preloadBig + '';
jQuery('#' + _this._additionalContentId + ' ul.contentAdditionalList').append(entry);
if (true === first) {
var current = i;
window.setTimeout(function () {
_this._initBox('additional', current);
}, 100);
}
first = false;
}
if (null !== _this._additionalParentId) {
jQuery('#' + _this._additionalParentId).html(jQuery('#' + _this._additionalContentId).html());
jQuery('#' + _this._additionalContentId).hide();
jQuery('.contentAdditionalList').css('clear', 'both');
}
jQuery('li > .contentAdditionalListItemImg').on('click', function () {
_this._initBox(jQuery(this).attr('data-type'), jQuery(this).attr('data-id'));
});
},
_initBox : function (type, id) {
if ('undefined' !== typeof(type) && 'undefined' !== typeof(_this._data[type])) {
var data = _this._data[type];
if ('undefined' !== typeof(data[id])) {
if (false === _this._settings.isMobile) {
var imgObj = _this._getImageDimensions(type, id);
var image = '';
var realImage = '';
jQuery('#' + _this._boxId)
.html('')
.append(image)
.append(realImage);
jQuery('#' + _this._boxId + ' .previewContainer img')
.on('mouseover', function () {
jQuery('#' + _this._boxId + ' > .realContainer').show();
jQuery(this).bind('mousemove', function (event) {
if (0 == imgObj.width || 0 == imgObj.height || 0 == imgObj.heightOriginal || 0 == imgObj.widthOriginal) {
imgObj = _this._getImageDimensions(type, id);
}
var left = event.pageX - this.offsetLeft;
var top = event.pageY - this.offsetTop;
var containerWidth = parseInt(jQuery('#' + _this._boxId + ' .realContainer').width());
var containerHeight = parseInt(jQuery('#' + _this._boxId + ' .realContainer').height());
var posLeft = left * (imgObj.widthOriginal / imgObj.width) - (containerWidth / 2);
var posTop = top * (imgObj.heightOriginal / imgObj.height) - (containerHeight / 2);
if (posLeft > (imgObj.widthOriginal - containerWidth)) {
posLeft = imgObj.widthOriginal - containerWidth;
}
if (posLeft < 0) posLeft = 0;
if (posTop > (imgObj.heightOriginal - containerHeight)) {
posTop = imgObj.heightOriginal - containerHeight;
}
if (posTop < 0) posTop = 0;
jQuery('#' + _this._boxId + ' > .realContainer')
.css('background-position', '-' + posLeft + 'px -' + posTop + 'px');
});
})
.on('mouseout', function () {
jQuery(this).unbind('mousemove');
jQuery('#' + _this._boxId + ' > .realContainer').hide();
});
jQuery("a[rel=fancybox]").fancybox({
'transitionIn' : 'none',
'transitionOut' : 'none',
'titlePosition' : 'over'
});
} else {
var image = ''
+ '
![](' + data[id]['img'] + ')
'
+ '
';
jQuery('#' + _this._boxId)
.html('')
.append(image);
}
}
}
},
_getImageDimensions : function (type, id)
{
var imgObj = new Image();
imgObj.src = _this._data[type][id]['big'];
imgObj.widthOriginal = imgObj.width;
imgObj.heightOriginal = imgObj.height;
if (imgObj.width > _this._settings.boxWidth && imgObj.height > _this._settings.boxHeight) {
var scaleX = imgObj.width / _this._settings.boxWidth;
var scaleY = imgObj.height / _this._settings.boxHeight;
if (scaleX > scaleY) {
imgObj.width = parseInt(imgObj.width / scaleX);
imgObj.height = parseInt(imgObj.height / scaleX);
} else {
imgObj.width = parseInt(imgObj.width / scaleY);
imgObj.height = parseInt(imgObj.height / scaleY);
}
} else if (imgObj.width > _this._settings.boxWidth) {
imgObj.height = parseInt(imgObj.height * (_this._settings.boxWidth / imgObj.width));
imgObj.width = _this._settings.boxWidth;
} else if (imgObj.height > _this._settings.boxHeight) {
imgObj.width = parseInt(imgObj.width * (_this._settings.boxHeight / imgObj.height));
imgObj.height = _this._settings.boxHeight;
}
return imgObj;
}
}