jquery.colorbox.js 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942
  1. // ColorBox v1.3.20.1 - jQuery lightbox plugin
  2. // (c) 2011 Jack Moore - jacklmoore.com
  3. // License: http://www.opensource.org/licenses/mit-license.php
  4. (function ($, document, window) {
  5. var
  6. // Default settings object.
  7. // See http://jacklmoore.com/colorbox for details.
  8. defaults = {
  9. transition: "elastic",
  10. speed: 300,
  11. width: false,
  12. initialWidth: "600",
  13. innerWidth: false,
  14. maxWidth: false,
  15. height: false,
  16. initialHeight: "450",
  17. innerHeight: false,
  18. maxHeight: false,
  19. scalePhotos: true,
  20. scrolling: true,
  21. inline: false,
  22. html: false,
  23. iframe: false,
  24. fastIframe: true,
  25. photo: false,
  26. href: false,
  27. title: false,
  28. rel: false,
  29. opacity: 0.9,
  30. preloading: true,
  31. current: "image {current} of {total}",
  32. previous: "previous",
  33. next: "next",
  34. close: "close",
  35. xhrError: "This content failed to load.",
  36. imgError: "This image failed to load.",
  37. open: false,
  38. returnFocus: true,
  39. reposition: true,
  40. loop: true,
  41. slideshow: false,
  42. slideshowAuto: true,
  43. slideshowSpeed: 2500,
  44. slideshowStart: "start slideshow",
  45. slideshowStop: "stop slideshow",
  46. onOpen: false,
  47. onLoad: false,
  48. onComplete: false,
  49. onCleanup: false,
  50. onClosed: false,
  51. overlayClose: true,
  52. escKey: true,
  53. arrowKey: true,
  54. top: false,
  55. bottom: false,
  56. left: false,
  57. right: false,
  58. fixed: false,
  59. data: undefined
  60. },
  61. // Abstracting the HTML and event identifiers for easy rebranding
  62. colorbox = 'colorbox',
  63. prefix = 'cbox',
  64. boxElement = prefix + 'Element',
  65. // Events
  66. event_open = prefix + '_open',
  67. event_load = prefix + '_load',
  68. event_complete = prefix + '_complete',
  69. event_cleanup = prefix + '_cleanup',
  70. event_closed = prefix + '_closed',
  71. event_purge = prefix + '_purge',
  72. // Special Handling for IE
  73. isIE = !$.support.opacity && !$.support.style, // IE7 & IE8
  74. isIE6 = isIE && !window.XMLHttpRequest, // IE6
  75. event_ie6 = prefix + '_IE6',
  76. // Cached jQuery Object Variables
  77. $overlay,
  78. $box,
  79. $wrap,
  80. $content,
  81. $topBorder,
  82. $leftBorder,
  83. $rightBorder,
  84. $bottomBorder,
  85. $related,
  86. $window,
  87. $loaded,
  88. $loadingBay,
  89. $loadingOverlay,
  90. $title,
  91. $current,
  92. $slideshow,
  93. $next,
  94. $prev,
  95. $close,
  96. $groupControls,
  97. // Variables for cached values or use across multiple functions
  98. settings,
  99. interfaceHeight,
  100. interfaceWidth,
  101. loadedHeight,
  102. loadedWidth,
  103. element,
  104. index,
  105. photo,
  106. open,
  107. active,
  108. closing,
  109. loadingTimer,
  110. publicMethod,
  111. div = "div",
  112. init;
  113. // ****************
  114. // HELPER FUNCTIONS
  115. // ****************
  116. // Convience function for creating new jQuery objects
  117. function $tag(tag, id, css) {
  118. var element = document.createElement(tag);
  119. if (id) {
  120. element.id = prefix + id;
  121. }
  122. if (css) {
  123. element.style.cssText = css;
  124. }
  125. return $(element);
  126. }
  127. // Determine the next and previous members in a group.
  128. function getIndex(increment) {
  129. var
  130. max = $related.length,
  131. newIndex = (index + increment) % max;
  132. return (newIndex < 0) ? max + newIndex : newIndex;
  133. }
  134. // Convert '%' and 'px' values to integers
  135. function setSize(size, dimension) {
  136. return Math.round((/%/.test(size) ? ((dimension === 'x' ? winWidth() : winHeight()) / 100) : 1) * parseInt(size, 10));
  137. }
  138. // Checks an href to see if it is a photo.
  139. // There is a force photo option (photo: true) for hrefs that cannot be matched by this regex.
  140. function isImage(url) {
  141. return settings.photo || /\.(gif|png|jp(e|g|eg)|bmp|ico)((#|\?).*)?$/i.test(url);
  142. }
  143. function winWidth() {
  144. // $(window).width() is incorrect for some mobile browsers, but
  145. // window.innerWidth is unsupported in IE8 and lower.
  146. return window.innerWidth || $window.width();
  147. }
  148. function winHeight() {
  149. return window.innerHeight || $window.height();
  150. }
  151. // Assigns function results to their respective properties
  152. function makeSettings() {
  153. var i,
  154. data = $.data(element, colorbox);
  155. if (data == null) {
  156. settings = $.extend({}, defaults);
  157. if (console && console.log) {
  158. console.log('Error: cboxElement missing settings object');
  159. }
  160. } else {
  161. settings = $.extend({}, data);
  162. }
  163. for (i in settings) {
  164. if ($.isFunction(settings[i]) && i.slice(0, 2) !== 'on') { // checks to make sure the function isn't one of the callbacks, they will be handled at the appropriate time.
  165. settings[i] = settings[i].call(element);
  166. }
  167. }
  168. settings.rel = settings.rel || element.rel || $(element).data('rel') || 'nofollow';
  169. settings.href = settings.href || $(element).attr('href');
  170. settings.title = settings.title || element.title;
  171. if (typeof settings.href === "string") {
  172. settings.href = $.trim(settings.href);
  173. }
  174. }
  175. function trigger(event, callback) {
  176. $.event.trigger(event);
  177. if (callback) {
  178. callback.call(element);
  179. }
  180. }
  181. // Slideshow functionality
  182. function slideshow() {
  183. var
  184. timeOut,
  185. className = prefix + "Slideshow_",
  186. click = "click." + prefix,
  187. start,
  188. stop,
  189. clear;
  190. if (settings.slideshow && $related[1]) {
  191. start = function () {
  192. $slideshow
  193. .text(settings.slideshowStop)
  194. .unbind(click)
  195. .bind(event_complete, function () {
  196. if (settings.loop || $related[index + 1]) {
  197. timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
  198. }
  199. })
  200. .bind(event_load, function () {
  201. clearTimeout(timeOut);
  202. })
  203. .one(click + ' ' + event_cleanup, stop);
  204. $box.removeClass(className + "off").addClass(className + "on");
  205. timeOut = setTimeout(publicMethod.next, settings.slideshowSpeed);
  206. };
  207. stop = function () {
  208. clearTimeout(timeOut);
  209. $slideshow
  210. .text(settings.slideshowStart)
  211. .unbind([event_complete, event_load, event_cleanup, click].join(' '))
  212. .one(click, function () {
  213. publicMethod.next();
  214. start();
  215. });
  216. $box.removeClass(className + "on").addClass(className + "off");
  217. };
  218. if (settings.slideshowAuto) {
  219. start();
  220. } else {
  221. stop();
  222. }
  223. } else {
  224. $box.removeClass(className + "off " + className + "on");
  225. }
  226. }
  227. function launch(target) {
  228. if (!closing) {
  229. element = target;
  230. makeSettings();
  231. $related = $(element);
  232. index = 0;
  233. if (settings.rel !== 'nofollow') {
  234. $related = $('.' + boxElement).filter(function () {
  235. var data = $.data(this, colorbox),
  236. relRelated;
  237. if (data) {
  238. relRelated = $(this).data('rel') || data.rel || this.rel;
  239. }
  240. return (relRelated === settings.rel);
  241. });
  242. index = $related.index(element);
  243. // Check direct calls to ColorBox.
  244. if (index === -1) {
  245. $related = $related.add(element);
  246. index = $related.length - 1;
  247. }
  248. }
  249. if (!open) {
  250. open = active = true; // Prevents the page-change action from queuing up if the visitor holds down the left or right keys.
  251. $box.show();
  252. if (settings.returnFocus) {
  253. $(element).blur().one(event_closed, function () {
  254. $(this).focus();
  255. });
  256. }
  257. // +settings.opacity avoids a problem in IE when using non-zero-prefixed-string-values, like '.5'
  258. $overlay.css({"opacity": +settings.opacity, "cursor": settings.overlayClose ? "pointer" : "auto"}).show();
  259. // Opens inital empty ColorBox prior to content being loaded.
  260. settings.w = setSize(settings.initialWidth, 'x');
  261. settings.h = setSize(settings.initialHeight, 'y');
  262. publicMethod.position();
  263. if (isIE6) {
  264. $window.bind('resize.' + event_ie6 + ' scroll.' + event_ie6, function () {
  265. $overlay.css({width: winWidth(), height: winHeight(), top: $window.scrollTop(), left: $window.scrollLeft()});
  266. }).trigger('resize.' + event_ie6);
  267. }
  268. trigger(event_open, settings.onOpen);
  269. $groupControls.add($title).hide();
  270. $close.html(settings.close).show();
  271. }
  272. publicMethod.load(true);
  273. }
  274. }
  275. // ColorBox's markup needs to be added to the DOM prior to being called
  276. // so that the browser will go ahead and load the CSS background images.
  277. function appendHTML() {
  278. if (!$box && document.body) {
  279. init = false;
  280. $window = $(window);
  281. $box = $tag(div).attr({id: colorbox, 'class': isIE ? prefix + (isIE6 ? 'IE6' : 'IE') : ''}).hide();
  282. $overlay = $tag(div, "Overlay", isIE6 ? 'position:absolute' : '').hide();
  283. $loadingOverlay = $tag(div, "LoadingOverlay").add($tag(div, "LoadingGraphic"));
  284. $wrap = $tag(div, "Wrapper");
  285. $content = $tag(div, "Content").append(
  286. $loaded = $tag(div, "LoadedContent", 'width:0; height:0; overflow:hidden'),
  287. $title = $tag(div, "Title"),
  288. $current = $tag(div, "Current"),
  289. $next = $tag(div, "Next"),
  290. $prev = $tag(div, "Previous"),
  291. $slideshow = $tag(div, "Slideshow").bind(event_open, slideshow),
  292. $close = $tag(div, "Close")
  293. );
  294. $wrap.append( // The 3x3 Grid that makes up ColorBox
  295. $tag(div).append(
  296. $tag(div, "TopLeft"),
  297. $topBorder = $tag(div, "TopCenter"),
  298. $tag(div, "TopRight")
  299. ),
  300. $tag(div, false, 'clear:left').append(
  301. $leftBorder = $tag(div, "MiddleLeft"),
  302. $content,
  303. $rightBorder = $tag(div, "MiddleRight")
  304. ),
  305. $tag(div, false, 'clear:left').append(
  306. $tag(div, "BottomLeft"),
  307. $bottomBorder = $tag(div, "BottomCenter"),
  308. $tag(div, "BottomRight")
  309. )
  310. ).find('div div').css({'float': 'left'});
  311. $loadingBay = $tag(div, false, 'position:absolute; width:9999px; visibility:hidden; display:none');
  312. $groupControls = $next.add($prev).add($current).add($slideshow);
  313. $(document.body).append($overlay, $box.append($wrap, $loadingBay));
  314. }
  315. }
  316. // Add ColorBox's event bindings
  317. function addBindings() {
  318. if ($box) {
  319. if (!init) {
  320. init = true;
  321. // Cache values needed for size calculations
  322. interfaceHeight = $topBorder.height() + $bottomBorder.height() + $content.outerHeight(true) - $content.height();//Subtraction needed for IE6
  323. interfaceWidth = $leftBorder.width() + $rightBorder.width() + $content.outerWidth(true) - $content.width();
  324. loadedHeight = $loaded.outerHeight(true);
  325. loadedWidth = $loaded.outerWidth(true);
  326. // Setting padding to remove the need to do size conversions during the animation step.
  327. $box.css({"padding-bottom": interfaceHeight, "padding-right": interfaceWidth});
  328. // Anonymous functions here keep the public method from being cached, thereby allowing them to be redefined on the fly.
  329. $next.click(function () {
  330. publicMethod.next();
  331. });
  332. $prev.click(function () {
  333. publicMethod.prev();
  334. });
  335. $close.click(function () {
  336. publicMethod.close();
  337. });
  338. $overlay.click(function () {
  339. if (settings.overlayClose) {
  340. publicMethod.close();
  341. }
  342. });
  343. // Key Bindings
  344. $(document).bind('keydown.' + prefix, function (e) {
  345. var key = e.keyCode;
  346. if (open && settings.escKey && key === 27) {
  347. e.preventDefault();
  348. publicMethod.close();
  349. }
  350. if (open && settings.arrowKey && $related[1]) {
  351. if (key === 37) {
  352. e.preventDefault();
  353. $prev.click();
  354. } else if (key === 39) {
  355. e.preventDefault();
  356. $next.click();
  357. }
  358. }
  359. });
  360. $('.' + boxElement, document).live('click', function (e) {
  361. // ignore non-left-mouse-clicks and clicks modified with ctrl / command, shift, or alt.
  362. // See: http://jacklmoore.com/notes/click-events/
  363. if (!(e.which > 1 || e.shiftKey || e.altKey || e.metaKey)) {
  364. e.preventDefault();
  365. launch(this);
  366. }
  367. });
  368. }
  369. return true;
  370. }
  371. return false;
  372. }
  373. // Don't do anything if ColorBox already exists.
  374. if ($.colorbox) {
  375. return;
  376. }
  377. // Append the HTML when the DOM loads
  378. $(appendHTML);
  379. // ****************
  380. // PUBLIC FUNCTIONS
  381. // Usage format: $.fn.colorbox.close();
  382. // Usage from within an iframe: parent.$.fn.colorbox.close();
  383. // ****************
  384. publicMethod = $.fn[colorbox] = $[colorbox] = function (options, callback) {
  385. var $this = this;
  386. options = options || {};
  387. appendHTML();
  388. if (addBindings()) {
  389. if (!$this[0]) {
  390. if ($this.selector) { // if a selector was given and it didn't match any elements, go ahead and exit.
  391. return $this;
  392. }
  393. // if no selector was given (ie. $.colorbox()), create a temporary element to work with
  394. $this = $('<a/>');
  395. options.open = true; // assume an immediate open
  396. }
  397. if (callback) {
  398. options.onComplete = callback;
  399. }
  400. $this.each(function () {
  401. $.data(this, colorbox, $.extend({}, $.data(this, colorbox) || defaults, options));
  402. }).addClass(boxElement);
  403. if (($.isFunction(options.open) && options.open.call($this)) || options.open) {
  404. launch($this[0]);
  405. }
  406. }
  407. return $this;
  408. };
  409. publicMethod.position = function (speed, loadedCallback) {
  410. var
  411. css,
  412. top = 0,
  413. left = 0,
  414. offset = $box.offset(),
  415. scrollTop,
  416. scrollLeft;
  417. $window.unbind('resize.' + prefix);
  418. // remove the modal so that it doesn't influence the document width/height
  419. $box.css({top: -9e4, left: -9e4});
  420. scrollTop = $window.scrollTop();
  421. scrollLeft = $window.scrollLeft();
  422. if (settings.fixed && !isIE6) {
  423. offset.top -= scrollTop;
  424. offset.left -= scrollLeft;
  425. $box.css({position: 'fixed'});
  426. } else {
  427. top = scrollTop;
  428. left = scrollLeft;
  429. $box.css({position: 'absolute'});
  430. }
  431. // keeps the top and left positions within the browser's viewport.
  432. if (settings.right !== false) {
  433. left += Math.max(winWidth() - settings.w - loadedWidth - interfaceWidth - setSize(settings.right, 'x'), 0);
  434. } else if (settings.left !== false) {
  435. left += setSize(settings.left, 'x');
  436. } else {
  437. left += Math.round(Math.max(winWidth() - settings.w - loadedWidth - interfaceWidth, 0) / 2);
  438. }
  439. if (settings.bottom !== false) {
  440. top += Math.max(winHeight() - settings.h - loadedHeight - interfaceHeight - setSize(settings.bottom, 'y'), 0);
  441. } else if (settings.top !== false) {
  442. top += setSize(settings.top, 'y');
  443. } else {
  444. top += Math.round(Math.max(winHeight() - settings.h - loadedHeight - interfaceHeight, 0) / 2);
  445. }
  446. $box.css({top: offset.top, left: offset.left});
  447. // setting the speed to 0 to reduce the delay between same-sized content.
  448. speed = ($box.width() === settings.w + loadedWidth && $box.height() === settings.h + loadedHeight) ? 0 : speed || 0;
  449. // this gives the wrapper plenty of breathing room so it's floated contents can move around smoothly,
  450. // but it has to be shrank down around the size of div#colorbox when it's done. If not,
  451. // it can invoke an obscure IE bug when using iframes.
  452. $wrap[0].style.width = $wrap[0].style.height = "9999px";
  453. function modalDimensions(that) {
  454. $topBorder[0].style.width = $bottomBorder[0].style.width = $content[0].style.width = that.style.width;
  455. $content[0].style.height = $leftBorder[0].style.height = $rightBorder[0].style.height = that.style.height;
  456. }
  457. css = {width: settings.w + loadedWidth, height: settings.h + loadedHeight, top: top, left: left};
  458. if(speed===0){ // temporary workaround to side-step jQuery-UI 1.8 bug (http://bugs.jquery.com/ticket/12273)
  459. $box.css(css);
  460. }
  461. $box.dequeue().animate(css, {
  462. duration: speed,
  463. complete: function () {
  464. modalDimensions(this);
  465. active = false;
  466. // shrink the wrapper down to exactly the size of colorbox to avoid a bug in IE's iframe implementation.
  467. $wrap[0].style.width = (settings.w + loadedWidth + interfaceWidth) + "px";
  468. $wrap[0].style.height = (settings.h + loadedHeight + interfaceHeight) + "px";
  469. if (settings.reposition) {
  470. setTimeout(function () { // small delay before binding onresize due to an IE8 bug.
  471. $window.bind('resize.' + prefix, publicMethod.position);
  472. }, 1);
  473. }
  474. if (loadedCallback) {
  475. loadedCallback();
  476. }
  477. },
  478. step: function () {
  479. modalDimensions(this);
  480. }
  481. });
  482. };
  483. publicMethod.resize = function (options) {
  484. if (open) {
  485. options = options || {};
  486. if (options.width) {
  487. settings.w = setSize(options.width, 'x') - loadedWidth - interfaceWidth;
  488. }
  489. if (options.innerWidth) {
  490. settings.w = setSize(options.innerWidth, 'x');
  491. }
  492. $loaded.css({width: settings.w});
  493. if (options.height) {
  494. settings.h = setSize(options.height, 'y') - loadedHeight - interfaceHeight;
  495. }
  496. if (options.innerHeight) {
  497. settings.h = setSize(options.innerHeight, 'y');
  498. }
  499. if (!options.innerHeight && !options.height) {
  500. $loaded.css({height: "auto"});
  501. settings.h = $loaded.height();
  502. }
  503. $loaded.css({height: settings.h});
  504. publicMethod.position(settings.transition === "none" ? 0 : settings.speed);
  505. }
  506. };
  507. publicMethod.prep = function (object) {
  508. if (!open) {
  509. return;
  510. }
  511. var callback, speed = settings.transition === "none" ? 0 : settings.speed;
  512. $loaded.remove();
  513. $loaded = $tag(div, 'LoadedContent').append(object);
  514. function getWidth() {
  515. settings.w = settings.w || $loaded.width();
  516. settings.w = settings.mw && settings.mw < settings.w ? settings.mw : settings.w;
  517. return settings.w;
  518. }
  519. function getHeight() {
  520. settings.h = settings.h || $loaded.height();
  521. settings.h = settings.mh && settings.mh < settings.h ? settings.mh : settings.h;
  522. return settings.h;
  523. }
  524. $loaded.hide()
  525. .appendTo($loadingBay.show())// content has to be appended to the DOM for accurate size calculations.
  526. .css({width: getWidth(), overflow: settings.scrolling ? 'auto' : 'hidden'})
  527. .css({height: getHeight()})// sets the height independently from the width in case the new width influences the value of height.
  528. .prependTo($content);
  529. $loadingBay.hide();
  530. // floating the IMG removes the bottom line-height and fixed a problem where IE miscalculates the width of the parent element as 100% of the document width.
  531. //$(photo).css({'float': 'none', marginLeft: 'auto', marginRight: 'auto'});
  532. $(photo).css({'float': 'none'});
  533. // Hides SELECT elements in IE6 because they would otherwise sit on top of the overlay.
  534. if (isIE6) {
  535. $('select').not($box.find('select')).filter(function () {
  536. return this.style.visibility !== 'hidden';
  537. }).css({'visibility': 'hidden'}).one(event_cleanup, function () {
  538. this.style.visibility = 'inherit';
  539. });
  540. }
  541. callback = function () {
  542. var preload,
  543. i,
  544. total = $related.length,
  545. iframe,
  546. frameBorder = 'frameBorder',
  547. allowTransparency = 'allowTransparency',
  548. complete,
  549. src,
  550. img,
  551. data;
  552. if (!open) {
  553. return;
  554. }
  555. function removeFilter() {
  556. if (isIE) {
  557. $box[0].style.removeAttribute('filter');
  558. }
  559. }
  560. complete = function () {
  561. clearTimeout(loadingTimer);
  562. // Detaching forces Andriod stock browser to redraw the area underneat the loading overlay. Hiding alone isn't enough.
  563. $loadingOverlay.detach().hide();
  564. trigger(event_complete, settings.onComplete);
  565. };
  566. if (isIE) {
  567. //This fadeIn helps the bicubic resampling to kick-in.
  568. if (photo) {
  569. $loaded.fadeIn(100);
  570. }
  571. }
  572. $title.html(settings.title).add($loaded).show();
  573. if (total > 1) { // handle grouping
  574. if (typeof settings.current === "string") {
  575. $current.html(settings.current.replace('{current}', index + 1).replace('{total}', total)).show();
  576. }
  577. $next[(settings.loop || index < total - 1) ? "show" : "hide"]().html(settings.next);
  578. $prev[(settings.loop || index) ? "show" : "hide"]().html(settings.previous);
  579. if (settings.slideshow) {
  580. $slideshow.show();
  581. }
  582. // Preloads images within a rel group
  583. if (settings.preloading) {
  584. preload = [
  585. getIndex(-1),
  586. getIndex(1)
  587. ];
  588. while (i = $related[preload.pop()]) {
  589. data = $.data(i, colorbox);
  590. if (data && data.href) {
  591. src = data.href;
  592. if ($.isFunction(src)) {
  593. src = src.call(i);
  594. }
  595. } else {
  596. src = i.href;
  597. }
  598. if (isImage(src)) {
  599. img = new Image();
  600. img.src = src;
  601. }
  602. }
  603. }
  604. } else {
  605. $groupControls.hide();
  606. }
  607. if (settings.iframe) {
  608. iframe = $tag('iframe')[0];
  609. if (frameBorder in iframe) {
  610. iframe[frameBorder] = 0;
  611. }
  612. if (allowTransparency in iframe) {
  613. iframe[allowTransparency] = "true";
  614. }
  615. // give the iframe a unique name to prevent caching
  616. iframe.name = prefix + (+new Date());
  617. if (settings.fastIframe) {
  618. complete();
  619. } else {
  620. $(iframe).one('load', complete);
  621. }
  622. iframe.src = settings.href;
  623. if (!settings.scrolling) {
  624. iframe.scrolling = "no";
  625. }
  626. $(iframe).addClass(prefix + 'Iframe').appendTo($loaded).one(event_purge, function () {
  627. iframe.src = "//about:blank";
  628. });
  629. } else {
  630. complete();
  631. }
  632. if (settings.transition === 'fade') {
  633. $box.fadeTo(speed, 1, removeFilter);
  634. } else {
  635. removeFilter();
  636. }
  637. };
  638. if (settings.transition === 'fade') {
  639. $box.fadeTo(speed, 0, function () {
  640. publicMethod.position(0, callback);
  641. });
  642. } else {
  643. publicMethod.position(speed, callback);
  644. }
  645. };
  646. publicMethod.load = function (launched) {
  647. var href, setResize, prep = publicMethod.prep;
  648. active = true;
  649. photo = false;
  650. element = $related[index];
  651. if (!launched) {
  652. makeSettings();
  653. }
  654. trigger(event_purge);
  655. trigger(event_load, settings.onLoad);
  656. settings.h = settings.height ?
  657. setSize(settings.height, 'y') - loadedHeight - interfaceHeight :
  658. settings.innerHeight && setSize(settings.innerHeight, 'y');
  659. settings.w = settings.width ?
  660. setSize(settings.width, 'x') - loadedWidth - interfaceWidth :
  661. settings.innerWidth && setSize(settings.innerWidth, 'x');
  662. // Sets the minimum dimensions for use in image scaling
  663. settings.mw = settings.w;
  664. settings.mh = settings.h;
  665. // Re-evaluate the minimum width and height based on maxWidth and maxHeight values.
  666. // If the width or height exceed the maxWidth or maxHeight, use the maximum values instead.
  667. if (settings.maxWidth) {
  668. settings.mw = setSize(settings.maxWidth, 'x') - loadedWidth - interfaceWidth;
  669. settings.mw = settings.w && settings.w < settings.mw ? settings.w : settings.mw;
  670. }
  671. if (settings.maxHeight) {
  672. settings.mh = setSize(settings.maxHeight, 'y') - loadedHeight - interfaceHeight;
  673. settings.mh = settings.h && settings.h < settings.mh ? settings.h : settings.mh;
  674. }
  675. href = settings.href;
  676. loadingTimer = setTimeout(function () {
  677. $loadingOverlay.show().appendTo($content);
  678. }, 100);
  679. if (settings.inline) {
  680. // Inserts an empty placeholder where inline content is being pulled from.
  681. // An event is bound to put inline content back when ColorBox closes or loads new content.
  682. $tag(div).hide().insertBefore($(href)[0]).one(event_purge, function () {
  683. $(this).replaceWith($loaded.children());
  684. });
  685. prep($(href));
  686. } else if (settings.iframe) {
  687. // IFrame element won't be added to the DOM until it is ready to be displayed,
  688. // to avoid problems with DOM-ready JS that might be trying to run in that iframe.
  689. prep(" ");
  690. } else if (settings.html) {
  691. prep(settings.html);
  692. } else if (isImage(href)) {
  693. $(photo = new Image())
  694. .addClass(prefix + 'Photo')
  695. .error(function () {
  696. settings.title = false;
  697. prep($tag(div, 'Error').html(settings.imgError));
  698. })
  699. .load(function () {
  700. var percent;
  701. photo.onload = null; //stops animated gifs from firing the onload repeatedly.
  702. if (settings.scalePhotos) {
  703. setResize = function () {
  704. photo.height -= photo.height * percent;
  705. photo.width -= photo.width * percent;
  706. };
  707. if (settings.mw && photo.width > settings.mw) {
  708. percent = (photo.width - settings.mw) / photo.width;
  709. setResize();
  710. }
  711. if (settings.mh && photo.height > settings.mh) {
  712. percent = (photo.height - settings.mh) / photo.height;
  713. setResize();
  714. }
  715. }
  716. if (settings.h) {
  717. photo.style.marginTop = Math.max(settings.h - photo.height, 0) / 2 + 'px';
  718. }
  719. if ($related[1] && (settings.loop || $related[index + 1])) {
  720. photo.style.cursor = 'pointer';
  721. photo.onclick = function () {
  722. publicMethod.next();
  723. };
  724. }
  725. if (isIE) {
  726. photo.style.msInterpolationMode = 'bicubic';
  727. }
  728. setTimeout(function () { // A pause because Chrome will sometimes report a 0 by 0 size otherwise.
  729. prep(photo);
  730. }, 1);
  731. });
  732. setTimeout(function () { // A pause because Opera 10.6+ will sometimes not run the onload function otherwise.
  733. photo.src = href;
  734. }, 1);
  735. } else if (href) {
  736. $loadingBay.load(href, settings.data, function (data, status, xhr) {
  737. prep(status === 'error' ? $tag(div, 'Error').html(settings.xhrError) : $(this).contents());
  738. });
  739. }
  740. };
  741. // Navigates to the next page/image in a set.
  742. publicMethod.next = function () {
  743. if (!active && $related[1] && (settings.loop || $related[index + 1])) {
  744. index = getIndex(1);
  745. publicMethod.load();
  746. }
  747. };
  748. publicMethod.prev = function () {
  749. if (!active && $related[1] && (settings.loop || index)) {
  750. index = getIndex(-1);
  751. publicMethod.load();
  752. }
  753. };
  754. // Note: to use this within an iframe use the following format: parent.$.fn.colorbox.close();
  755. publicMethod.close = function () {
  756. if (open && !closing) {
  757. closing = true;
  758. open = false;
  759. trigger(event_cleanup, settings.onCleanup);
  760. $window.unbind('.' + prefix + ' .' + event_ie6);
  761. $overlay.fadeTo(200, 0);
  762. $box.stop().fadeTo(300, 0, function () {
  763. $box.add($overlay).css({'opacity': 1, cursor: 'auto'}).hide();
  764. trigger(event_purge);
  765. $loaded.remove();
  766. setTimeout(function () {
  767. closing = false;
  768. trigger(event_closed, settings.onClosed);
  769. }, 1);
  770. });
  771. }
  772. };
  773. // Removes changes ColorBox made to the document, but does not remove the plugin
  774. // from jQuery.
  775. publicMethod.remove = function () {
  776. $([]).add($box).add($overlay).remove();
  777. $box = null;
  778. $('.' + boxElement)
  779. .removeData(colorbox)
  780. .removeClass(boxElement)
  781. .die();
  782. };
  783. // A method for fetching the current element ColorBox is referencing.
  784. // returns a jQuery object.
  785. publicMethod.element = function () {
  786. return $(element);
  787. };
  788. publicMethod.settings = defaults;
  789. }(jQuery, document, this));