[44] | 1 | /*
|
---|
| 2 | * Thickbox 3.1 - One Box To Rule Them All.
|
---|
| 3 | * By Cody Lindley (http://www.codylindley.com)
|
---|
| 4 | * Copyright (c) 2007 cody lindley
|
---|
| 5 | * Licensed under the MIT License: http://www.opensource.org/licenses/mit-license.php
|
---|
| 6 | */
|
---|
| 7 |
|
---|
| 8 | var tb_pathToImage = "images/loadingAnimation.gif";
|
---|
| 9 |
|
---|
| 10 | /*!!!!!!!!!!!!!!!!! edit below this line at your own risk !!!!!!!!!!!!!!!!!!!!!!!*/
|
---|
| 11 |
|
---|
| 12 | //on page load call tb_init
|
---|
| 13 | jQuery(document).ready(function(){
|
---|
| 14 | tb_init('a.thickbox, area.thickbox, input.thickbox');//pass where to apply thickbox
|
---|
| 15 | imgLoader = new Image();// preload image
|
---|
| 16 | imgLoader.src = tb_pathToImage;
|
---|
| 17 | });
|
---|
| 18 |
|
---|
| 19 | //add thickbox to href & area elements that have a class of .thickbox
|
---|
| 20 | function tb_init(domChunk){
|
---|
| 21 | jQuery(domChunk).click(function(){
|
---|
| 22 | var t = this.title || this.name || null;
|
---|
| 23 | var a = this.href || this.alt;
|
---|
| 24 | var g = this.rel || false;
|
---|
| 25 | tb_show(t,a,g);
|
---|
| 26 | this.blur();
|
---|
| 27 | return false;
|
---|
| 28 | });
|
---|
| 29 | }
|
---|
| 30 |
|
---|
| 31 | function tb_show(caption, url, imageGroup) {//function called when the user clicks on a thickbox link
|
---|
| 32 |
|
---|
| 33 | try {
|
---|
| 34 | if (typeof document.body.style.maxHeight === "undefined") {//if IE 6
|
---|
| 35 | jQuery("body","html").css({height: "100%", width: "100%"});
|
---|
| 36 | jQuery("html").css("overflow","hidden");
|
---|
| 37 | if (document.getElementById("TB_HideSelect") === null) {//iframe to hide select elements in ie6
|
---|
| 38 | jQuery("body").append("<iframe id='TB_HideSelect'></iframe><div id='TB_overlay'></div><div id='TB_window'></div>");
|
---|
| 39 | jQuery("#TB_overlay").click(tb_remove);
|
---|
| 40 | }
|
---|
| 41 | }else{//all others
|
---|
| 42 | if(document.getElementById("TB_overlay") === null){
|
---|
| 43 | jQuery("body").append("<div id='TB_overlay'></div><div id='TB_window'></div>");
|
---|
| 44 | jQuery("#TB_overlay").click(tb_remove);
|
---|
| 45 | }
|
---|
| 46 | }
|
---|
| 47 |
|
---|
| 48 | if(tb_detectMacXFF()){
|
---|
| 49 | jQuery("#TB_overlay").addClass("TB_overlayMacFFBGHack");//use png overlay so hide flash
|
---|
| 50 | }else{
|
---|
| 51 | jQuery("#TB_overlay").addClass("TB_overlayBG");//use background and opacity
|
---|
| 52 | }
|
---|
| 53 |
|
---|
| 54 | if(caption===null){caption="";}
|
---|
| 55 | jQuery("body").append("<div id='TB_load'><img src='"+imgLoader.src+"' /></div>");//add loader to the page
|
---|
| 56 | jQuery('#TB_load').show();//show loader
|
---|
| 57 |
|
---|
| 58 | var baseURL;
|
---|
| 59 | if(url.indexOf("?")!==-1){ //ff there is a query string involved
|
---|
| 60 | baseURL = url.substr(0, url.indexOf("?"));
|
---|
| 61 | }else{
|
---|
| 62 | baseURL = url;
|
---|
| 63 | }
|
---|
| 64 |
|
---|
| 65 | var urlString = /\.jpg$|\.jpeg$|\.png$|\.gif$|\.bmp$/;
|
---|
| 66 | var urlType = baseURL.toLowerCase().match(urlString);
|
---|
| 67 |
|
---|
| 68 | if(urlType == '.jpg' || urlType == '.jpeg' || urlType == '.png' || urlType == '.gif' || urlType == '.bmp'){//code to show images
|
---|
| 69 |
|
---|
| 70 | TB_PrevCaption = "";
|
---|
| 71 | TB_PrevURL = "";
|
---|
| 72 | TB_PrevHTML = "";
|
---|
| 73 | TB_NextCaption = "";
|
---|
| 74 | TB_NextURL = "";
|
---|
| 75 | TB_NextHTML = "";
|
---|
| 76 | TB_imageCount = "";
|
---|
| 77 | TB_FoundURL = false;
|
---|
| 78 | if(imageGroup){
|
---|
| 79 | TB_TempArray = jQuery("a[@rel="+imageGroup+"]").get();
|
---|
| 80 | for (TB_Counter = 0; ((TB_Counter < TB_TempArray.length) && (TB_NextHTML === "")); TB_Counter++) {
|
---|
| 81 | var urlTypeTemp = TB_TempArray[TB_Counter].href.toLowerCase().match(urlString);
|
---|
| 82 | if (!(TB_TempArray[TB_Counter].href == url)) {
|
---|
| 83 | if (TB_FoundURL) {
|
---|
| 84 | TB_NextCaption = TB_TempArray[TB_Counter].title;
|
---|
| 85 | TB_NextURL = TB_TempArray[TB_Counter].href;
|
---|
| 86 | TB_NextHTML = "<a id='TB_next' href='#'>Next ></a>";
|
---|
| 87 | } else {
|
---|
| 88 | TB_PrevCaption = TB_TempArray[TB_Counter].title;
|
---|
| 89 | TB_PrevURL = TB_TempArray[TB_Counter].href;
|
---|
| 90 | TB_PrevHTML = "<a id='TB_prev' href='#'>< Prev</a>";
|
---|
| 91 | }
|
---|
| 92 | } else {
|
---|
| 93 | TB_FoundURL = true;
|
---|
| 94 | TB_imageCount = "Image " + (TB_Counter + 1) +" of "+ (TB_TempArray.length);
|
---|
| 95 | }
|
---|
| 96 | }
|
---|
| 97 | }
|
---|
| 98 |
|
---|
| 99 | imgPreloader = new Image();
|
---|
| 100 | imgPreloader.onload = function(){
|
---|
| 101 | imgPreloader.onload = null;
|
---|
| 102 |
|
---|
| 103 | // preload patch from: http://drupal.org/files/issues/thickbox_preloadimage.patch
|
---|
| 104 | prevImg = new Image();
|
---|
| 105 | nextImg = new Image();
|
---|
| 106 | var tb_links = jQuery('a[@class="thickbox"]');
|
---|
| 107 | var i = -1;
|
---|
| 108 | tb_links.each(function(n) { if (this.href == imgPreloader.src) { i = n; } });
|
---|
| 109 | if (i != -1) {
|
---|
| 110 | if (i > 0) { prevImg.src = tb_links[i-1].href; }
|
---|
| 111 | if (i+1 < tb_links.length) { nextImg.src = tb_links[i+1].href; }
|
---|
| 112 | }
|
---|
| 113 |
|
---|
| 114 |
|
---|
| 115 | // Resizing large images - orginal by Christian Montoya edited by me.
|
---|
| 116 | var pagesize = tb_getPageSize();
|
---|
| 117 | var x = pagesize[0] - 150;
|
---|
| 118 | var y = pagesize[1] - 170;
|
---|
| 119 | var imageWidth = imgPreloader.width;
|
---|
| 120 | var imageHeight = imgPreloader.height;
|
---|
| 121 | if (imageWidth > x) {
|
---|
| 122 | imageHeight = imageHeight * (x / imageWidth);
|
---|
| 123 | imageWidth = x;
|
---|
| 124 | if (imageHeight > y) {
|
---|
| 125 | imageWidth = imageWidth * (y / imageHeight);
|
---|
| 126 | imageHeight = y;
|
---|
| 127 | }
|
---|
| 128 | } else if (imageHeight > y) {
|
---|
| 129 | imageWidth = imageWidth * (y / imageHeight);
|
---|
| 130 | imageHeight = y;
|
---|
| 131 | if (imageWidth > x) {
|
---|
| 132 | imageHeight = imageHeight * (x / imageWidth);
|
---|
| 133 | imageWidth = x;
|
---|
| 134 | }
|
---|
| 135 | }
|
---|
| 136 | // End Resizing
|
---|
| 137 |
|
---|
| 138 |
|
---|
| 139 | /* TODO: auto-calculate heights based on jQuery.height() of elements */
|
---|
| 140 | TB_WIDTH = imageWidth + 30;
|
---|
| 141 | TB_HEIGHT = imageHeight + 130;
|
---|
| 142 | jQuery("#TB_window").append("<div id='TB_title'><div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton' title='Close'>close</a> or Esc Key</div></div><div id='TB_ImageWrapper' style='height:"+imageHeight+"px;width:"+imageWidth+"px;'><div id='TB_ImageHoverNav'>"+TB_PrevHTML+TB_NextHTML+"</div><img id='TB_Image' src='"+url+"' width='"+imageWidth+"' height='"+imageHeight+"' alt='"+caption+"'/></div><div id='TB_caption'>"+caption+"<div id='TB_secondLine'>" + TB_imageCount + "</div></div>");
|
---|
| 143 | jQuery("#TB_closeWindowButton").click(tb_remove);
|
---|
| 144 |
|
---|
| 145 | if (!(TB_PrevHTML === "")) {
|
---|
| 146 | function goPrev(){
|
---|
| 147 | if(jQuery(document).unbind("click",goPrev)){jQuery(document).unbind("click",goPrev);}
|
---|
| 148 | jQuery("#TB_window").remove();
|
---|
| 149 | jQuery("body").append("<div id='TB_window'></div>");
|
---|
| 150 | tb_show(TB_PrevCaption, TB_PrevURL, imageGroup);
|
---|
| 151 | return false;
|
---|
| 152 | }
|
---|
| 153 | jQuery("#TB_prev").click(goPrev);
|
---|
| 154 | }
|
---|
| 155 |
|
---|
| 156 | if (!(TB_NextHTML === "")) {
|
---|
| 157 | function goNext(){
|
---|
| 158 | jQuery("#TB_window").remove();
|
---|
| 159 | jQuery("body").append("<div id='TB_window'></div>");
|
---|
| 160 | tb_show(TB_NextCaption, TB_NextURL, imageGroup);
|
---|
| 161 | return false;
|
---|
| 162 | }
|
---|
| 163 | jQuery("#TB_next").click(goNext);
|
---|
| 164 |
|
---|
| 165 | }
|
---|
| 166 |
|
---|
| 167 | document.onkeydown = function(e){
|
---|
| 168 | if (e == null) { // ie
|
---|
| 169 | keycode = event.keyCode;
|
---|
| 170 | } else { // mozilla
|
---|
| 171 | keycode = e.which;
|
---|
| 172 | }
|
---|
| 173 | if(keycode == 27){ // close
|
---|
| 174 | tb_remove();
|
---|
| 175 | } else if(keycode == 190 || keycode == 39){ // display next image
|
---|
| 176 | if(!(TB_NextHTML == "")){
|
---|
| 177 | document.onkeydown = "";
|
---|
| 178 | goNext();
|
---|
| 179 | }
|
---|
| 180 | } else if(keycode == 188 || keycode == 37){ // display previous image
|
---|
| 181 | if(!(TB_PrevHTML == "")){
|
---|
| 182 | document.onkeydown = "";
|
---|
| 183 | goPrev();
|
---|
| 184 | }
|
---|
| 185 | }
|
---|
| 186 | };
|
---|
| 187 |
|
---|
| 188 | tb_position();
|
---|
| 189 | jQuery("#TB_load").remove();
|
---|
| 190 | jQuery("#TB_ImageOff").click(tb_remove);
|
---|
| 191 | jQuery("#TB_window").css({display:"block"}); //for safari using css instead of show
|
---|
| 192 | };
|
---|
| 193 |
|
---|
| 194 | imgPreloader.src = url;
|
---|
| 195 | }else{//code to show html
|
---|
| 196 |
|
---|
| 197 | var queryString = url.replace(/^[^\?]+\??/,'');
|
---|
| 198 | var params = tb_parseQuery( queryString );
|
---|
| 199 |
|
---|
| 200 | TB_WIDTH = (params['width']*1) + 30 || 630; //defaults to 630 if no paramaters were added to URL
|
---|
| 201 | TB_HEIGHT = (params['height']*1) + 40 || 440; //defaults to 440 if no paramaters were added to URL
|
---|
| 202 | ajaxContentW = TB_WIDTH - 30;
|
---|
| 203 | ajaxContentH = TB_HEIGHT - 45;
|
---|
| 204 |
|
---|
| 205 | if(url.indexOf('TB_iframe') != -1){// either iframe or ajax window
|
---|
| 206 | urlNoQuery = url.split('TB_');
|
---|
| 207 | jQuery("#TB_iframeContent").remove();
|
---|
| 208 | if(params['modal'] != "true"){//iframe no modal
|
---|
| 209 | jQuery("#TB_window").append("<div id='TB_title'><div id='TB_ajaxWindowTitle'>"+caption+"</div><div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton' title='Close'>close</a> or Esc Key</div></div><iframe frameborder='0' hspace='0' src='"+urlNoQuery[0]+"' id='TB_iframeContent' name='TB_iframeContent"+Math.round(Math.random()*1000)+"' onload='tb_showIframe()' style='width:"+(ajaxContentW + 29)+"px;height:"+(ajaxContentH + 17)+"px;' > </iframe>");
|
---|
| 210 | }else{//iframe modal
|
---|
| 211 | jQuery("#TB_overlay").unbind();
|
---|
| 212 | jQuery("#TB_window").append("<iframe frameborder='0' hspace='0' src='"+urlNoQuery[0]+"' id='TB_iframeContent' name='TB_iframeContent"+Math.round(Math.random()*1000)+"' onload='tb_showIframe()' style='width:"+(ajaxContentW + 29)+"px;height:"+(ajaxContentH + 17)+"px;'> </iframe>");
|
---|
| 213 | }
|
---|
| 214 | }else{// not an iframe, ajax
|
---|
| 215 | if(jQuery("#TB_window").css("display") != "block"){
|
---|
| 216 | if(params['modal'] != "true"){//ajax no modal
|
---|
| 217 | jQuery("#TB_window").append("<div id='TB_title'><div id='TB_ajaxWindowTitle'>"+caption+"</div><div id='TB_closeAjaxWindow'><a href='#' id='TB_closeWindowButton'>close</a> or Esc Key</div></div><div id='TB_ajaxContent' style='width:"+ajaxContentW+"px;height:"+ajaxContentH+"px'></div>");
|
---|
| 218 | }else{//ajax modal
|
---|
| 219 | jQuery("#TB_overlay").unbind();
|
---|
| 220 | jQuery("#TB_window").append("<div id='TB_ajaxContent' class='TB_modal' style='width:"+ajaxContentW+"px;height:"+ajaxContentH+"px;'></div>");
|
---|
| 221 | }
|
---|
| 222 | }else{//this means the window is already up, we are just loading new content via ajax
|
---|
| 223 | jQuery("#TB_ajaxContent")[0].style.width = ajaxContentW +"px";
|
---|
| 224 | jQuery("#TB_ajaxContent")[0].style.height = ajaxContentH +"px";
|
---|
| 225 | jQuery("#TB_ajaxContent")[0].scrollTop = 0;
|
---|
| 226 | jQuery("#TB_ajaxWindowTitle").html(caption);
|
---|
| 227 | }
|
---|
| 228 | }
|
---|
| 229 |
|
---|
| 230 | jQuery("#TB_closeWindowButton").click(tb_remove);
|
---|
| 231 |
|
---|
| 232 | if(url.indexOf('TB_inline') != -1){
|
---|
| 233 | jQuery("#TB_ajaxContent").append(jQuery('#' + params['inlineId']).children());
|
---|
| 234 | jQuery("#TB_window").unload(function () {
|
---|
| 235 | jQuery('#' + params['inlineId']).append( jQuery("#TB_ajaxContent").children() ); // move elements back when you're finished
|
---|
| 236 | });
|
---|
| 237 | tb_position();
|
---|
| 238 | jQuery("#TB_load").remove();
|
---|
| 239 | jQuery("#TB_window").css({display:"block"});
|
---|
| 240 | }else if(url.indexOf('TB_iframe') != -1){
|
---|
| 241 | tb_position();
|
---|
| 242 | if($.browser.safari){//safari needs help because it will not fire iframe onload
|
---|
| 243 | jQuery("#TB_load").remove();
|
---|
| 244 | jQuery("#TB_window").css({display:"block"});
|
---|
| 245 | }
|
---|
| 246 | }else{
|
---|
| 247 | jQuery("#TB_ajaxContent").load(url += "&random=" + (new Date().getTime()),function(){//to do a post change this load method
|
---|
| 248 | tb_position();
|
---|
| 249 | jQuery("#TB_load").remove();
|
---|
| 250 | tb_init("#TB_ajaxContent a.thickbox");
|
---|
| 251 | jQuery("#TB_window").css({display:"block"});
|
---|
| 252 | });
|
---|
| 253 | }
|
---|
| 254 |
|
---|
| 255 | }
|
---|
| 256 |
|
---|
| 257 | if(!params['modal']){
|
---|
| 258 | document.onkeyup = function(e){
|
---|
| 259 | if (e == null) { // ie
|
---|
| 260 | keycode = event.keyCode;
|
---|
| 261 | } else { // mozilla
|
---|
| 262 | keycode = e.which;
|
---|
| 263 | }
|
---|
| 264 | if(keycode == 27){ // close
|
---|
| 265 | tb_remove();
|
---|
| 266 | }
|
---|
| 267 | };
|
---|
| 268 | }
|
---|
| 269 |
|
---|
| 270 | } catch(e) {
|
---|
| 271 | //nothing here
|
---|
| 272 | }
|
---|
| 273 | }
|
---|
| 274 |
|
---|
| 275 | //helper functions below
|
---|
| 276 | function tb_showIframe(){
|
---|
| 277 | jQuery("#TB_load").remove();
|
---|
| 278 | jQuery("#TB_window").css({display:"block"});
|
---|
| 279 | }
|
---|
| 280 |
|
---|
| 281 | function tb_remove() {
|
---|
| 282 | jQuery("#TB_imageOff").unbind("click");
|
---|
| 283 | jQuery("#TB_closeWindowButton").unbind("click");
|
---|
| 284 | jQuery("#TB_window").fadeOut("fast",function(){jQuery('#TB_window,#TB_overlay,#TB_HideSelect').trigger("unload").unbind().remove();});
|
---|
| 285 | jQuery("#TB_load").remove();
|
---|
| 286 | if (typeof document.body.style.maxHeight == "undefined") {//if IE 6
|
---|
| 287 | jQuery("body","html").css({height: "auto", width: "auto"});
|
---|
| 288 | jQuery("html").css("overflow","");
|
---|
| 289 | }
|
---|
| 290 | document.onkeydown = "";
|
---|
| 291 | document.onkeyup = "";
|
---|
| 292 | return false;
|
---|
| 293 | }
|
---|
| 294 |
|
---|
| 295 | function tb_position() {
|
---|
| 296 | jQuery("#TB_window").css({marginLeft: '-' + parseInt((TB_WIDTH / 2),10) + 'px', width: TB_WIDTH + 'px'});
|
---|
| 297 | if ( !(jQuery.browser.msie && jQuery.browser.version < 7)) { // take away IE6
|
---|
| 298 | jQuery("#TB_window").css({marginTop: '-' + parseInt((TB_HEIGHT / 2),10) + 'px'});
|
---|
| 299 | }
|
---|
| 300 | }
|
---|
| 301 |
|
---|
| 302 | function tb_parseQuery ( query ) {
|
---|
| 303 | var Params = {};
|
---|
| 304 | if ( ! query ) {return Params;}// return empty object
|
---|
| 305 | var Pairs = query.split(/[;&]/);
|
---|
| 306 | for ( var i = 0; i < Pairs.length; i++ ) {
|
---|
| 307 | var KeyVal = Pairs[i].split('=');
|
---|
| 308 | if ( ! KeyVal || KeyVal.length != 2 ) {continue;}
|
---|
| 309 | var key = unescape( KeyVal[0] );
|
---|
| 310 | var val = unescape( KeyVal[1] );
|
---|
| 311 | val = val.replace(/\+/g, ' ');
|
---|
| 312 | Params[key] = val;
|
---|
| 313 | }
|
---|
| 314 | return Params;
|
---|
| 315 | }
|
---|
| 316 |
|
---|
| 317 | function tb_getPageSize(){
|
---|
| 318 | var de = document.documentElement;
|
---|
| 319 | var w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
|
---|
| 320 | var h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
|
---|
| 321 | arrayPageSize = [w,h];
|
---|
| 322 | return arrayPageSize;
|
---|
| 323 | }
|
---|
| 324 |
|
---|
| 325 | function tb_detectMacXFF() {
|
---|
| 326 | var userAgent = navigator.userAgent.toLowerCase();
|
---|
| 327 | if (userAgent.indexOf('mac') != -1 && userAgent.indexOf('firefox')!=-1) {
|
---|
| 328 | return true;
|
---|
| 329 | }
|
---|
| 330 | }
|
---|
| 331 |
|
---|
| 332 |
|
---|