/* DivBox v1.3 Website: http://jquery.phpbasic.com Download: http://code.google.com/p/divbox Visit http://code.google.com/p/divbox/source/browse/trunk/divbox/divbox.js for lastest version. Released under the MIT, BSD, and GPL Licenses */ (function($){ $.fn.divbox = function(opt,clickObj){ var _cfg = { width: null, height: null, speed: 500, animate: 'default', // currently we are only support: default & explore & none left: null, top: null, type: null, src: 'href', scrollbar: 'auto', btn_closed: '#divbox_frame .closed', btn_prev: '#divbox_frame .prev', btn_next: '#divbox_frame .next', btn_number: '#divbox_frame .number', path: 'players/', full_drag_handle: false, resize_large_image: true, click_full_image: true, overlay: true, caption: true, caption_control: true, caption_number: false, event: 'click', container: document.body, download_able:['pdf','zip','gz','rar','doc','docx','xls','xslx','ppt','pptx','csv'], languages: { btn_close: 'Close', btn_next: 'Next', btn_prev: 'Prev', click_full_image: 'Click on here to view full image', error_not_youtube: 'This is not a youtube link', error_cannot_load: "We can't load this page\nError: " }, api:{ start: null, beginLoad: null, afterLoad: null, closed: null } } if(opt) $.extend(_cfg,opt); var oMatch = this; var objArr = []; $(oMatch).each(function(i,o){ objArr[i] = o; }); function _run(index,init){ var fn = {} fn.closed = function(){ $('#divbox_frame').animate({ 'top': _click.top, 'left': _click.left, width: '0px', height: '0px' },_cfg.speed,function(){ $(this).remove(); $('#divbox').remove(); fn.toggleObj('body','show'); if(typeof(_cfg.api.closed)=='function') _cfg.api.closed(this); }); } fn.toggleObj = function(o,act){ if(ie6){ if(act=='show') $(o).find('embed,object,select').show(); else $(o).find('embed,object,select').hide(); } } fn.init = function(){ if(typeof(_cfg.api.start)=='function') _cfg.api.start(obj); var requires = '#divbox,#divbox_frame,#divbox_content,#divbox_ajax'; $(requires).remove(); $(_cfg.container).prepend('
10/10
'); $(_cfg.btn_closed+','+_cfg.btn_next+','+_cfg.btn_prev+','+_cfg.btn_number).hide(); if(_cfg.overlay){ $('#divbox').css({ 'width': sizesystem[0]+'px', 'height': sizesystem[1]+'px', 'position':'absolute', 'zIndex':'10001', 'left':'0', 'top':'0' }).click(function(){ fn.closed(); }); } $('#divbox_frame').css({ 'position':'absolute', 'top': _click.top, 'left': _click.left, 'zIndex':'10002', 'width': 0, 'height': 0 }); if(_cfg.animate != 'none') $('#divbox_frame').animate({ width: 50, height: 50, top: _cfg.top?sizesystem[3] + _cfg.top: sizesystem[3] + Math.round(sizesystem[5]/2), left: _cfg.left?sizesystem[2] +_cfg.left:Math.round(sizesystem[4]/2) }); } fn.resizeWindow = function(resizeW){ var sizesystem = pageSize(ie); $('#divbox').css({ 'width': sizesystem[0]+'px', 'height': sizesystem[1]+'px' }); var w = $(oFrame).outerWidth(); var h = $(oFrame).outerHeight(); $(oFrame).css({ top: _cfg.top?sizesystem[3] + _cfg.top: sizesystem[3] + Math.round((sizesystem[5] - h)/2), left: _cfg.left?sizesystem[2] +_cfg.left:Math.round((sizesystem[4] - w)/2) }); } fn.resize = function(w,h){ var sizesystem = pageSize(ie); $(oFrame).css({ 'width': w+'px', 'height': h+'px', top: _cfg.top?sizesystem[3] + _cfg.top: sizesystem[3] + Math.round((sizesystem[5] - h)/2), left: _cfg.left?sizesystem[2] +_cfg.left:Math.round((sizesystem[4] - w)/2) }); } fn.animate = function(t,l,w,h,fncallback,fnclosed, caption){ $('#divbox').unbind('click'); $(document).unbind('keydown'); $(_cfg.btn_closed+','+_cfg.btn_next+','+_cfg.btn_prev+','+_cfg.btn_number).hide(); var border = ie?parseInt($(oFrame).css('border-left-width'))+parseInt($(oFrame).css('border-right-width')):0; var _l = _cfg.left?_cfg.left:l; var _w = _cfg.width?_cfg.width+border:w+border; var _t = _cfg.top?sizesystem[3] + _cfg.top:t; var _h = _cfg.height?_cfg.height:h; if(_cfg.animate == 'default'){ $(oFrame).removeClass('white').animate({ left: _l, width: _w },_cfg.speed).animate({ top: _t, height: _h },_cfg.speed,function(){ fn.main(t,l,w,h,fncallback,fnclosed, caption);}); }else if(_cfg.animate == 'explore'){ $(oFrame).removeClass('white').animate({ left:_l, width:_w, top: _t, height: _h },_cfg.speed,function(){ fn.main(t,l,w,h,fncallback,fnclosed, caption);}); }else if(_cfg.animate == 'none'){ $(oFrame).removeClass('white').css({ left:_l, top: _t, width:_w, height: _h }).fadeIn(_cfg.speed,function(){ fn.main(t,l,w,h,fncallback,fnclosed, caption);}) } } fn.main = function(t,l,w,h,fncallback,fnclosed, caption){ fn.toggleObj('body'); var oContent = $('#divbox_content'); oContent.closed = function(){ fn.closed();} oContent.resize = function(w,h){ fn.resize(w,h);} if(typeof(_cfg.api.beginLoad)=='function') _cfg.api.beginLoad(oContent); if(typeof(fncallback) == 'function') fncallback(oContent); if(typeof(_cfg.api.afterLoad) == 'function') _cfg.api.afterLoad(oContent); $(_cfg.btn_closed).show().click(function(){ if(typeof(fnclosed) == 'function') fnclosed(oContent); fn.closed(); }); $('#divbox').bind('click',function(){ if(typeof(fnclosed) == 'function') fnclosed(oContent); fn.closed(); }); $(oFrame).addClass('white'); var c = $(oFrame).find('.caption'); if(_cfg.caption != false && (caption != '' || _cfg.caption_control == true)){ var cH = c.outerHeight(true); $(oFrame).animate({height: h + cH}).find('.caption').show(); if(_cfg.caption_control == true){// caption control var btn_top = h + parseInt(c.css('padding-top')); // 12 = 1/2 height of button prev/next icon $(_cfg.btn_prev+','+_cfg.btn_next+','+_cfg.btn_number).css({top: btn_top}).show(); if(index*1>0){ $(_cfg.btn_prev).removeClass('prevDisabled').bind('click',function(){ fn.prevItem(index); }); }else{ $(_cfg.btn_prev).addClass('prevDisabled').unbind('click'); } if(_cfg.caption_number){ $(_cfg.btn_number).html((index*1+1)+'/'+total) }else{ $(_cfg.btn_number).remove(); } if(index*10) _run(index*1 - 1); } fn.nextItem = function(index){ if(index*1').find('img').hide(); //$('#divbox_content img').attr('src',src); var imgW = Img.width; var imgH = Img.height; imgW = fn.setwidth(imgW); imgH = fn.setheight(imgH); var zoom = 0; if(_cfg.resize_large_image){ if(imgW >= sizesystem[4] - 100 || imgH >= sizesystem[5] - 100 || Img.width > imgW || Img.height > imgH){ if(imgW >= sizesystem[4] - 100 ){ imgW = sizesystem[4] - 100; imgH = Math.round(imgW*Img.height/Img.width); } if(imgH >= sizesystem[5] - 100){ tH = sizesystem[5] - 100; imgW = Math.round(imgW*tH/imgH); imgH = tH; } if(_cfg.click_full_image) zoom = 1; } } var top = sizesystem[3] + Math.round((sizesystem[5] - imgH)/2); var left = Math.round((sizesystem[4] - imgW)/2); fn.animate(top,left,imgW,imgH,function(o){ if(ie6 && ext == 'png'){ $(o).find('img').wrap(''); }else{ $(o).find('img').css({'width': imgW,'height': imgH,'display':'block'}).fadeIn(); } if(zoom) $(o).find('img').addClass('zoom').attr({'title': _cfg.languages.click_full_image}).click(function(){ window.open(src,'wDivBox'); }); },false,caption) //IE Img.onload=function(){}; } Img.src = src; } fn.flashEmbedString = function(file,w,h,type){ // default type is FLV var flashvar = '&provider=video'; var swf_file = type=='swf'? file : _cfg.path+'jwplayer.swf'; if(type=='mp3') flashvar = '&provider=sound'; var str = ''; str += ''; str += ''; if(type!='swf') str += ''; str += ''; fn.animate(top,left,winW,winH,function(o){ $(o).html(str); },function(){ $('#movMeida').each(function(){ try { this.Stop(); } catch(e) {} // quicktime try { this.controls.stop(); } catch(e) {} // windows media player $(this).hide().remove(); }); fn.closed(); },caption); } fn.viewWMV = function(src,caption){ var winW = fn.setwidth(400); var winH = fn.setheight(300); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = Math.round((sizesystem[4] - winW)/2); var str = ''; fn.animate(top,left,winW,winH,function(o){ $(o).html(str); },function(){ $('#wmwMedia').each(function(){ try { this.Stop(); } catch(e) {} // quicktime try { this.controls.stop(); } catch(e) {} // windows media player $(this).hide().remove(); }); fn.closed(); },caption); } fn.viewSWF = function(src,caption){ var winW = fn.setwidth(400); var winH = fn.setheight(300); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = Math.round((sizesystem[4] - winW)/2); var str = fn.flashEmbedString(src,winW,winH,'swf'); fn.animate(top,left,winW,winH,function(o){ $(o).html(str); },false,caption); } fn.viewElement = function(caption){ var e = '#'+$(obj).attr('rel'); var winW = fn.setwidth($(e).outerWidth()); var winH = fn.setheight($(e).outerHeight()); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = Math.round((sizesystem[4] - winW)/2); fn.animate(top,left,winW,winH,function(o){ $(o).html($(e).html()); fn.toggleObj(o,'show'); $(e).html(''); },function(o){ $(e).html($(o).html()); },caption); } fn.viewAjax = function(src,caption){ $.ajax({ url: src, success:function(data){ if(_cfg.width) $('#divbox_ajax').css({'width': _cfg.width}); if(_cfg.height) $('#divbox_ajax').css({'height': _cfg.height}); $('#divbox_ajax').html(data); var winW = fn.setwidth($('#divbox_ajax').outerWidth()); var winH = fn.setheight($('#divbox_ajax').outerHeight()); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = Math.round((sizesystem[4] - winW)/2); fn.animate(top,left,winW,winH,function(o){ $(o).html(data); $('#divbox_ajax').remove(); },false,caption); } , error: function(x,e){ fn.error(_cfg.languages.error_cannot_load); } }); } fn.viewDefault = function(src,caption){ var winW = fn.setwidth(sizesystem[4]-100); var winH = fn.setheight(sizesystem[5]-100); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = sizesystem[2] + Math.round((sizesystem[4] - winW)/2); fn.animate(top,left,winW,winH,function(o){ $(o).html(''); },false,caption); } fn.viewYouTube = function(src,caption){ if (!src.match(/youtube\.com\/watch/i)){ alert(_cfg.languages.error_not_youtube); return false; } var vidId = src.split('v=')[1].split('&')[0]; var vidSrc = "http://www.youtube.com/v/" + vidId + "&hl=en&fs=1&autoplay=1&rel=0"; var winW = fn.setwidth(640); var winH = fn.setheight(385); var top = sizesystem[3] + Math.round((sizesystem[5] - winH)/2); var left = Math.round((sizesystem[4] - winW)/2); var str = ''; //var str = fn.flashEmbedString(src,winW,winH,'youtube'); fn.animate(top,left,winW,winH,function(o){ $(o).html(str); },false,caption); } fn.setwidth = function(w){ return _cfg.width?_cfg.width:w; } fn.setheight = function(h){ return _cfg.height?_cfg.height:h; } var obj = clickObj?clickObj:objArr[index]; var ie = $.browser.msie; var ie6 = (ie && parseInt($.browser.version) == 6)?true:false; var sizesystem = pageSize(ie); var total = $(oMatch).length; var _click = $(obj).offset(); var src = $(obj).attr(_cfg.src).toString(); var ext = fn.parseType(src); // Download able for(var i in _cfg.download_able) if(ext==_cfg.download_able[i]){ return window.open(src); } // var caption = ''; if(typeof(_cfg.caption)=='function'){ caption = _cfg.caption(obj); }else if(_cfg.caption === true){ caption = $(obj).attr('title'); } if(init) fn.init(); $(_cfg.btn_prev).unbind('click'); $(_cfg.btn_next).unbind('click'); var oFrame = $('#divbox_frame'); $(oFrame).find('.caption').hide().html(caption); switch(ext){ case 'jpg': case 'jpeg': case 'gif': case 'png': fn.viewImage(src,caption);break; case 'flv':fn.viewFLV(src,caption);break; case 'wmv': fn.viewWMV(src,caption);break; case 'mov': fn.viewMOV(src,caption);break; case 'mp3': fn.viewMP3(src,caption);break; case 'mp4': fn.viewMP4(src,caption);break; case 'swf': fn.viewSWF(src,caption);break; case 'element': fn.viewElement(caption); break; case 'ajax': fn.viewAjax(src,caption); break; case 'youtube': fn.viewYouTube(src,caption); break; default: fn.viewDefault(src,caption);break; } return false; } if(clickObj){ //var index = 0; _run(0,true); return false; } $(oMatch).bind(_cfg.event,function(){ var index = 0; for(var i in objArr) if(objArr[i] === this) index = i; _run(index,true); return false; }); } $.divbox = function(clk, cfg){ if(!cfg) cfg = {} cfg.caption_control = false; cfg.caption_number = false; $(clk).divbox(cfg,clk); return false; } function pageSize(ie){ var de = document.documentElement; var winW = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth; winW -= 18; var winH = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight; var x = window.pageXOffset || self.pageXOffset || (de&&de.scrollLeft) || document.body.scrollLeft; var y = window.pageYOffset || self.pageYOffset || (de&&de.scrollTop) || document.body.scrollTop; var pW = window.innerWidth || document.body.scrollWidth || document.body.offsetWidth; var pH = window.innerHeight+window.scrollMaxY || document.body.scrollHeight || document.body.offsetHeight; var w = pW