You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1983 lines
64 KiB

2 years ago
  1. /*!
  2. * fancyBox - jQuery Plugin
  3. * version: 2.1.7 (Tue, 28 Feb 2017)
  4. * requires jQuery v1.6 or later
  5. *
  6. * Examples at http://fancyapps.com/fancybox/
  7. * License: www.fancyapps.com/fancybox/#license
  8. *
  9. * Copyright 2017 fancyapps.com
  10. *
  11. */
  12. ; (function (window, document, $, undefined) {
  13. "use strict";
  14. var H = $("html"),
  15. W = $(window),
  16. D = $(document),
  17. F = $.fancybox = function () {
  18. F.open.apply(this, arguments);
  19. },
  20. IE = navigator.userAgent.match(/msie/i),
  21. didUpdate = null,
  22. isTouch = document.createTouch !== undefined,
  23. isQuery = function (obj) {
  24. return obj && obj.hasOwnProperty && obj instanceof $;
  25. },
  26. isString = function (str) {
  27. return str && $.type(str) === "string";
  28. },
  29. isPercentage = function (str) {
  30. return isString(str) && str.indexOf('%') > 0;
  31. },
  32. isScrollable = function (el) {
  33. return (el && !(el.style.overflow && el.style.overflow === 'hidden') && ((el.clientWidth && el.scrollWidth > el.clientWidth) || (el.clientHeight && el.scrollHeight > el.clientHeight)));
  34. },
  35. getScalar = function (orig, dim) {
  36. var value = parseInt(orig, 10) || 0;
  37. if (dim && isPercentage(orig)) {
  38. value = F.getViewport()[dim] / 100 * value;
  39. }
  40. return Math.ceil(value);
  41. },
  42. getValue = function (value, dim) {
  43. return getScalar(value, dim) + 'px';
  44. };
  45. $.extend(F, {
  46. // The current version of fancyBox
  47. version: '2.1.7',
  48. defaults: {
  49. padding: 15,
  50. margin: 20,
  51. width: 800,
  52. height: 600,
  53. minWidth: 100,
  54. minHeight: 100,
  55. maxWidth: 9999,
  56. maxHeight: 9999,
  57. pixelRatio: 1, // Set to 2 for retina display support
  58. autoSize: true,
  59. autoHeight: false,
  60. autoWidth: false,
  61. autoResize: true,
  62. autoCenter: !isTouch,
  63. fitToView: true,
  64. aspectRatio: false,
  65. topRatio: 0.5,
  66. leftRatio: 0.5,
  67. scrolling: 'auto', // 'auto', 'yes' or 'no'
  68. wrapCSS: '',
  69. arrows: true,
  70. closeBtn: true,
  71. closeClick: false,
  72. nextClick: false,
  73. mouseWheel: true,
  74. autoPlay: false,
  75. playSpeed: 3000,
  76. preload: 3,
  77. modal: false,
  78. loop: true,
  79. ajax: {
  80. dataType: 'html',
  81. headers: { 'X-fancyBox': true }
  82. },
  83. iframe: {
  84. scrolling: 'auto',
  85. preload: true
  86. },
  87. swf: {
  88. wmode: 'transparent',
  89. allowfullscreen: 'true',
  90. allowscriptaccess: 'always'
  91. },
  92. keys: {
  93. next: {
  94. 13: 'left', // enter
  95. 34: 'up', // page down
  96. 39: 'left', // right arrow
  97. 40: 'up' // down arrow
  98. },
  99. prev: {
  100. 8: 'right', // backspace
  101. 33: 'down', // page up
  102. 37: 'right', // left arrow
  103. 38: 'down' // up arrow
  104. },
  105. close: [27], // escape key
  106. play: [32], // space - start/stop slideshow
  107. toggle: [70] // letter "f" - toggle fullscreen
  108. },
  109. direction: {
  110. next: 'left',
  111. prev: 'right'
  112. },
  113. scrollOutside: true,
  114. // Override some properties
  115. index: 0,
  116. type: null,
  117. href: null,
  118. content: null,
  119. title: null,
  120. // HTML templates
  121. tpl: {
  122. wrap: '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div></div></div></div>',
  123. image: '<img class="fancybox-image" src="{href}" alt="" />',
  124. iframe: '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen' + (IE ? ' allowtransparency="true"' : '') + '></iframe>',
  125. error: '<p class="fancybox-error">The requested content cannot be loaded.<br/>Please try again later.</p>',
  126. closeBtn: '<a title="Close" class="fancybox-item fancybox-close" href="javascript:;"></a>',
  127. next: '<a title="Next" class="fancybox-nav fancybox-next" href="javascript:;"><span></span></a>',
  128. prev: '<a title="Previous" class="fancybox-nav fancybox-prev" href="javascript:;"><span></span></a>',
  129. loading: '<div id="fancybox-loading"><div></div></div>'
  130. },
  131. // Properties for each animation type
  132. // Opening fancyBox
  133. openEffect: 'fade', // 'elastic', 'fade' or 'none'
  134. openSpeed: 250,
  135. openEasing: 'swing',
  136. openOpacity: true,
  137. openMethod: 'zoomIn',
  138. // Closing fancyBox
  139. closeEffect: 'fade', // 'elastic', 'fade' or 'none'
  140. closeSpeed: 250,
  141. closeEasing: 'swing',
  142. closeOpacity: true,
  143. closeMethod: 'zoomOut',
  144. // Changing next gallery item
  145. nextEffect: 'elastic', // 'elastic', 'fade' or 'none'
  146. nextSpeed: 250,
  147. nextEasing: 'swing',
  148. nextMethod: 'changeIn',
  149. // Changing previous gallery item
  150. prevEffect: 'elastic', // 'elastic', 'fade' or 'none'
  151. prevSpeed: 250,
  152. prevEasing: 'swing',
  153. prevMethod: 'changeOut',
  154. // Enable default helpers
  155. helpers: {
  156. overlay: true,
  157. title: true
  158. },
  159. // Callbacks
  160. onCancel: $.noop, // If canceling
  161. beforeLoad: $.noop, // Before loading
  162. afterLoad: $.noop, // After loading
  163. beforeShow: $.noop, // Before changing in current item
  164. afterShow: $.noop, // After opening
  165. beforeChange: $.noop, // Before changing gallery item
  166. beforeClose: $.noop, // Before closing
  167. afterClose: $.noop // After closing
  168. },
  169. //Current state
  170. group: {}, // Selected group
  171. opts: {}, // Group options
  172. previous: null, // Previous element
  173. coming: null, // Element being loaded
  174. current: null, // Currently loaded element
  175. isActive: false, // Is activated
  176. isOpen: false, // Is currently open
  177. isOpened: false, // Have been fully opened at least once
  178. wrap: null,
  179. skin: null,
  180. outer: null,
  181. inner: null,
  182. player: {
  183. timer: null,
  184. isActive: false
  185. },
  186. // Loaders
  187. ajaxLoad: null,
  188. imgPreload: null,
  189. // Some collections
  190. transitions: {},
  191. helpers: {},
  192. /*
  193. * Static methods
  194. */
  195. open: function (group, opts) {
  196. if (!group) {
  197. return;
  198. }
  199. if (!$.isPlainObject(opts)) {
  200. opts = {};
  201. }
  202. // Close if already active
  203. if (false === F.close(true)) {
  204. return;
  205. }
  206. // Normalize group
  207. if (!$.isArray(group)) {
  208. group = isQuery(group) ? $(group).get() : [group];
  209. }
  210. // Recheck if the type of each element is `object` and set content type (image, ajax, etc)
  211. $.each(group, function (i, element) {
  212. var obj = {},
  213. href,
  214. title,
  215. content,
  216. type,
  217. rez,
  218. hrefParts,
  219. selector;
  220. if ($.type(element) === "object") {
  221. // Check if is DOM element
  222. if (element.nodeType) {
  223. element = $(element);
  224. }
  225. if (isQuery(element)) {
  226. obj = {
  227. href: element.data('fancybox-href') || element.attr('href'),
  228. title: $('<div/>').text(element.data('fancybox-title') || element.attr('title') || '').html(),
  229. isDom: true,
  230. element: element
  231. };
  232. if ($.metadata) {
  233. $.extend(true, obj, element.metadata());
  234. }
  235. } else {
  236. obj = element;
  237. }
  238. }
  239. href = opts.href || obj.href || (isString(element) ? element : null);
  240. title = opts.title !== undefined ? opts.title : obj.title || '';
  241. content = opts.content || obj.content;
  242. type = content ? 'html' : (opts.type || obj.type);
  243. if (!type && obj.isDom) {
  244. type = element.data('fancybox-type');
  245. if (!type) {
  246. rez = element.prop('class').match(/fancybox\.(\w+)/);
  247. type = rez ? rez[1] : null;
  248. }
  249. }
  250. if (isString(href)) {
  251. // Try to guess the content type
  252. if (!type) {
  253. if (F.isImage(href)) {
  254. type = 'image';
  255. } else if (F.isSWF(href)) {
  256. type = 'swf';
  257. } else if (href.charAt(0) === '#') {
  258. type = 'inline';
  259. } else if (isString(element)) {
  260. type = 'html';
  261. content = element;
  262. }
  263. }
  264. // Split url into two pieces with source url and content selector, e.g,
  265. // "/mypage.html #my_id" will load "/mypage.html" and display element having id "my_id"
  266. if (type === 'ajax') {
  267. hrefParts = href.split(/\s+/, 2);
  268. href = hrefParts.shift();
  269. selector = hrefParts.shift();
  270. }
  271. }
  272. if (!content) {
  273. if (type === 'inline') {
  274. if (href) {
  275. content = $(isString(href) ? href.replace(/.*(?=#[^\s]+$)/, '') : href); //strip for ie7
  276. } else if (obj.isDom) {
  277. content = element;
  278. }
  279. } else if (type === 'html') {
  280. content = href;
  281. } else if (!type && !href && obj.isDom) {
  282. type = 'inline';
  283. content = element;
  284. }
  285. }
  286. $.extend(obj, {
  287. href: href,
  288. type: type,
  289. content: content,
  290. title: title,
  291. selector: selector
  292. });
  293. group[i] = obj;
  294. });
  295. // Extend the defaults
  296. F.opts = $.extend(true, {}, F.defaults, opts);
  297. // All options are merged recursive except keys
  298. if (opts.keys !== undefined) {
  299. F.opts.keys = opts.keys ? $.extend({}, F.defaults.keys, opts.keys) : false;
  300. }
  301. F.group = group;
  302. return F._start(F.opts.index);
  303. },
  304. // Cancel image loading or abort ajax request
  305. cancel: function () {
  306. var coming = F.coming;
  307. if (coming && false === F.trigger('onCancel')) {
  308. return;
  309. }
  310. F.hideLoading();
  311. if (!coming) {
  312. return;
  313. }
  314. if (F.ajaxLoad) {
  315. F.ajaxLoad.abort();
  316. }
  317. F.ajaxLoad = null;
  318. if (F.imgPreload) {
  319. F.imgPreload.onload = F.imgPreload.onerror = null;
  320. }
  321. if (coming.wrap) {
  322. coming.wrap.stop(true, true).trigger('onReset').remove();
  323. }
  324. F.coming = null;
  325. // If the first item has been canceled, then clear everything
  326. if (!F.current) {
  327. F._afterZoomOut(coming);
  328. }
  329. },
  330. // Start closing animation if is open; remove immediately if opening/closing
  331. close: function (event) {
  332. F.cancel();
  333. if (false === F.trigger('beforeClose')) {
  334. return;
  335. }
  336. F.unbindEvents();
  337. if (!F.isActive) {
  338. return;
  339. }
  340. if (!F.isOpen || event === true) {
  341. $('.fancybox-wrap').stop(true).trigger('onReset').remove();
  342. F._afterZoomOut();
  343. } else {
  344. F.isOpen = F.isOpened = false;
  345. F.isClosing = true;
  346. $('.fancybox-item, .fancybox-nav').remove();
  347. F.wrap.stop(true, true).removeClass('fancybox-opened');
  348. F.transitions[F.current.closeMethod]();
  349. }
  350. },
  351. // Manage slideshow:
  352. // $.fancybox.play(); - toggle slideshow
  353. // $.fancybox.play( true ); - start
  354. // $.fancybox.play( false ); - stop
  355. play: function (action) {
  356. var clear = function () {
  357. clearTimeout(F.player.timer);
  358. },
  359. set = function () {
  360. clear();
  361. if (F.current && F.player.isActive) {
  362. F.player.timer = setTimeout(F.next, F.current.playSpeed);
  363. }
  364. },
  365. stop = function () {
  366. clear();
  367. D.unbind('.player');
  368. F.player.isActive = false;
  369. F.trigger('onPlayEnd');
  370. },
  371. start = function () {
  372. if (F.current && (F.current.loop || F.current.index < F.group.length - 1)) {
  373. F.player.isActive = true;
  374. D.bind({
  375. 'onCancel.player beforeClose.player': stop,
  376. 'onUpdate.player': set,
  377. 'beforeLoad.player': clear
  378. });
  379. set();
  380. F.trigger('onPlayStart');
  381. }
  382. };
  383. if (action === true || (!F.player.isActive && action !== false)) {
  384. start();
  385. } else {
  386. stop();
  387. }
  388. },
  389. // Navigate to next gallery item
  390. next: function (direction) {
  391. var current = F.current;
  392. if (current) {
  393. if (!isString(direction)) {
  394. direction = current.direction.next;
  395. }
  396. F.jumpto(current.index + 1, direction, 'next');
  397. }
  398. },
  399. // Navigate to previous gallery item
  400. prev: function (direction) {
  401. var current = F.current;
  402. if (current) {
  403. if (!isString(direction)) {
  404. direction = current.direction.prev;
  405. }
  406. F.jumpto(current.index - 1, direction, 'prev');
  407. }
  408. },
  409. // Navigate to gallery item by index
  410. jumpto: function (index, direction, router) {
  411. var current = F.current;
  412. if (!current) {
  413. return;
  414. }
  415. index = getScalar(index);
  416. F.direction = direction || current.direction[(index >= current.index ? 'next' : 'prev')];
  417. F.router = router || 'jumpto';
  418. if (current.loop) {
  419. if (index < 0) {
  420. index = current.group.length + (index % current.group.length);
  421. }
  422. index = index % current.group.length;
  423. }
  424. if (current.group[index] !== undefined) {
  425. F.cancel();
  426. F._start(index);
  427. }
  428. },
  429. // Center inside viewport and toggle position type to fixed or absolute if needed
  430. reposition: function (e, onlyAbsolute) {
  431. var current = F.current,
  432. wrap = current ? current.wrap : null,
  433. pos;
  434. if (wrap) {
  435. pos = F._getPosition(onlyAbsolute);
  436. if (e && e.type === 'scroll') {
  437. delete pos.position;
  438. wrap.stop(true, true).animate(pos, 200);
  439. } else {
  440. wrap.css(pos);
  441. current.pos = $.extend({}, current.dim, pos);
  442. }
  443. }
  444. },
  445. update: function (e) {
  446. var type = (e && e.originalEvent && e.originalEvent.type),
  447. anyway = !type || type === 'orientationchange';
  448. if (anyway) {
  449. clearTimeout(didUpdate);
  450. didUpdate = null;
  451. }
  452. if (!F.isOpen || didUpdate) {
  453. return;
  454. }
  455. didUpdate = setTimeout(function () {
  456. var current = F.current;
  457. if (!current || F.isClosing) {
  458. return;
  459. }
  460. F.wrap.removeClass('fancybox-tmp');
  461. if (anyway || type === 'load' || (type === 'resize' && current.autoResize)) {
  462. F._setDimension();
  463. }
  464. if (!(type === 'scroll' && current.canShrink)) {
  465. F.reposition(e);
  466. }
  467. F.trigger('onUpdate');
  468. didUpdate = null;
  469. }, (anyway && !isTouch ? 0 : 300));
  470. },
  471. // Shrink content to fit inside viewport or restore if resized
  472. toggle: function (action) {
  473. if (F.isOpen) {
  474. F.current.fitToView = $.type(action) === "boolean" ? action : !F.current.fitToView;
  475. // Help browser to restore document dimensions
  476. if (isTouch) {
  477. F.wrap.removeAttr('style').addClass('fancybox-tmp');
  478. F.trigger('onUpdate');
  479. }
  480. F.update();
  481. }
  482. },
  483. hideLoading: function () {
  484. D.unbind('.loading');
  485. $('#fancybox-loading').remove();
  486. },
  487. showLoading: function () {
  488. var el, viewport;
  489. F.hideLoading();
  490. el = $(F.opts.tpl.loading).click(F.cancel).appendTo('body');
  491. // If user will press the escape-button, the request will be canceled
  492. D.bind('keydown.loading', function (e) {
  493. if ((e.which || e.keyCode) === 27) {
  494. e.preventDefault();
  495. F.cancel();
  496. }
  497. });
  498. if (!F.defaults.fixed) {
  499. viewport = F.getViewport();
  500. el.css({
  501. position: 'absolute',
  502. top: (viewport.h * 0.5) + viewport.y,
  503. left: (viewport.w * 0.5) + viewport.x
  504. });
  505. }
  506. F.trigger('onLoading');
  507. },
  508. getViewport: function () {
  509. var locked = (F.current && F.current.locked) || false,
  510. rez = {
  511. x: W.scrollLeft(),
  512. y: W.scrollTop()
  513. };
  514. if (locked && locked.length) {
  515. rez.w = locked[0].clientWidth;
  516. rez.h = locked[0].clientHeight;
  517. } else {
  518. // See http://bugs.jquery.com/ticket/6724
  519. rez.w = isTouch && window.innerWidth ? window.innerWidth : W.width();
  520. rez.h = isTouch && window.innerHeight ? window.innerHeight : W.height();
  521. }
  522. return rez;
  523. },
  524. // Unbind the keyboard / clicking actions
  525. unbindEvents: function () {
  526. if (F.wrap && isQuery(F.wrap)) {
  527. F.wrap.unbind('.fb');
  528. }
  529. D.unbind('.fb');
  530. W.unbind('.fb');
  531. },
  532. bindEvents: function () {
  533. var current = F.current,
  534. keys;
  535. if (!current) {
  536. return;
  537. }
  538. // Changing document height on iOS devices triggers a 'resize' event,
  539. // that can change document height... repeating infinitely
  540. W.bind('orientationchange.fb' + (isTouch ? '' : ' resize.fb') + (current.autoCenter && !current.locked ? ' scroll.fb' : ''), F.update);
  541. keys = current.keys;
  542. if (keys) {
  543. D.bind('keydown.fb', function (e) {
  544. var code = e.which || e.keyCode,
  545. target = e.target || e.srcElement;
  546. // Skip esc key if loading, because showLoading will cancel preloading
  547. if (code === 27 && F.coming) {
  548. return false;
  549. }
  550. // Ignore key combinations and key events within form elements
  551. if (!e.ctrlKey && !e.altKey && !e.shiftKey && !e.metaKey && !(target && (target.type || $(target).is('[contenteditable]')))) {
  552. $.each(keys, function (i, val) {
  553. if (current.group.length > 1 && val[code] !== undefined) {
  554. F[i](val[code]);
  555. e.preventDefault();
  556. return false;
  557. }
  558. if ($.inArray(code, val) > -1) {
  559. F[i]();
  560. e.preventDefault();
  561. return false;
  562. }
  563. });
  564. }
  565. });
  566. }
  567. if ($.fn.mousewheel && current.mouseWheel) {
  568. F.wrap.bind('mousewheel.fb', function (e, delta, deltaX, deltaY) {
  569. var target = e.target || null,
  570. parent = $(target),
  571. canScroll = false;
  572. while (parent.length) {
  573. if (canScroll || parent.is('.fancybox-skin') || parent.is('.fancybox-wrap')) {
  574. break;
  575. }
  576. canScroll = isScrollable(parent[0]);
  577. parent = $(parent).parent();
  578. }
  579. if (delta !== 0 && !canScroll) {
  580. if (F.group.length > 1 && !current.canShrink) {
  581. if (deltaY > 0 || deltaX > 0) {
  582. F.prev(deltaY > 0 ? 'down' : 'left');
  583. } else if (deltaY < 0 || deltaX < 0) {
  584. F.next(deltaY < 0 ? 'up' : 'right');
  585. }
  586. e.preventDefault();
  587. }
  588. }
  589. });
  590. }
  591. },
  592. trigger: function (event, o) {
  593. var ret, obj = o || F.coming || F.current;
  594. if (obj) {
  595. if ($.isFunction(obj[event])) {
  596. ret = obj[event].apply(obj, Array.prototype.slice.call(arguments, 1));
  597. }
  598. if (ret === false) {
  599. return false;
  600. }
  601. if (obj.helpers) {
  602. $.each(obj.helpers, function (helper, opts) {
  603. if (opts && F.helpers[helper] && $.isFunction(F.helpers[helper][event])) {
  604. F.helpers[helper][event]($.extend(true, {}, F.helpers[helper].defaults, opts), obj);
  605. }
  606. });
  607. }
  608. }
  609. D.trigger(event);
  610. },
  611. isImage: function (str) {
  612. return isString(str) && str.match(/(^data:image\/.*,)|(\.(jp(e|g|eg)|gif|png|bmp|webp|svg)((\?|#).*)?$)/i);
  613. },
  614. isSWF: function (str) {
  615. return isString(str) && str.match(/\.(swf)((\?|#).*)?$/i);
  616. },
  617. _start: function (index) {
  618. var coming = {},
  619. obj,
  620. href,
  621. type,
  622. margin,
  623. padding;
  624. index = getScalar(index);
  625. obj = F.group[index] || null;
  626. if (!obj) {
  627. return false;
  628. }
  629. coming = $.extend(true, {}, F.opts, obj);
  630. // Convert margin and padding properties to array - top, right, bottom, left
  631. margin = coming.margin;
  632. padding = coming.padding;
  633. if ($.type(margin) === 'number') {
  634. coming.margin = [margin, margin, margin, margin];
  635. }
  636. if ($.type(padding) === 'number') {
  637. coming.padding = [padding, padding, padding, padding];
  638. }
  639. // 'modal' propery is just a shortcut
  640. if (coming.modal) {
  641. $.extend(true, coming, {
  642. closeBtn: false,
  643. closeClick: false,
  644. nextClick: false,
  645. arrows: false,
  646. mouseWheel: false,
  647. keys: null,
  648. helpers: {
  649. overlay: {
  650. closeClick: false
  651. }
  652. }
  653. });
  654. }
  655. // 'autoSize' property is a shortcut, too
  656. if (coming.autoSize) {
  657. coming.autoWidth = coming.autoHeight = true;
  658. }
  659. if (coming.width === 'auto') {
  660. coming.autoWidth = true;
  661. }
  662. if (coming.height === 'auto') {
  663. coming.autoHeight = true;
  664. }
  665. /*
  666. * Add reference to the group, so it`s possible to access from callbacks, example:
  667. * afterLoad : function() {
  668. * this.title = 'Image ' + (this.index + 1) + ' of ' + this.group.length + (this.title ? ' - ' + this.title : '');
  669. * }
  670. */
  671. coming.group = F.group;
  672. coming.index = index;
  673. // Give a chance for callback or helpers to update coming item (type, title, etc)
  674. F.coming = coming;
  675. if (false === F.trigger('beforeLoad')) {
  676. F.coming = null;
  677. return;
  678. }
  679. type = coming.type;
  680. href = coming.href;
  681. if (!type) {
  682. F.coming = null;
  683. //If we can not determine content type then drop silently or display next/prev item if looping through gallery
  684. if (F.current && F.router && F.router !== 'jumpto') {
  685. F.current.index = index;
  686. return F[F.router](F.direction);
  687. }
  688. return false;
  689. }
  690. F.isActive = true;
  691. if (type === 'image' || type === 'swf') {
  692. coming.autoHeight = coming.autoWidth = false;
  693. coming.scrolling = 'visible';
  694. }
  695. if (type === 'image') {
  696. coming.aspectRatio = true;
  697. }
  698. if (type === 'iframe' && isTouch) {
  699. coming.scrolling = 'scroll';
  700. }
  701. // Build the neccessary markup
  702. coming.wrap = $(coming.tpl.wrap).addClass('fancybox-' + (isTouch ? 'mobile' : 'desktop') + ' fancybox-type-' + type + ' fancybox-tmp ' + coming.wrapCSS).appendTo(coming.parent || 'body');
  703. $.extend(coming, {
  704. skin: $('.fancybox-skin', coming.wrap),
  705. outer: $('.fancybox-outer', coming.wrap),
  706. inner: $('.fancybox-inner', coming.wrap)
  707. });
  708. $.each(["Top", "Right", "Bottom", "Left"], function (i, v) {
  709. coming.skin.css('padding' + v, getValue(coming.padding[i]));
  710. });
  711. F.trigger('onReady');
  712. // Check before try to load; 'inline' and 'html' types need content, others - href
  713. if (type === 'inline' || type === 'html') {
  714. if (!coming.content || !coming.content.length) {
  715. return F._error('content');
  716. }
  717. } else if (!href) {
  718. return F._error('href');
  719. }
  720. if (type === 'image') {
  721. F._loadImage();
  722. } else if (type === 'ajax') {
  723. F._loadAjax();
  724. } else if (type === 'iframe') {
  725. F._loadIframe();
  726. } else {
  727. F._afterLoad();
  728. }
  729. },
  730. _error: function (type) {
  731. $.extend(F.coming, {
  732. type: 'html',
  733. autoWidth: true,
  734. autoHeight: true,
  735. minWidth: 0,
  736. minHeight: 0,
  737. scrolling: 'no',
  738. hasError: type,
  739. content: F.coming.tpl.error
  740. });
  741. F._afterLoad();
  742. },
  743. _loadImage: function () {
  744. // Reset preload image so it is later possible to check "complete" property
  745. var img = F.imgPreload = new Image();
  746. img.onload = function () {
  747. this.onload = this.onerror = null;
  748. F.coming.width = this.width / F.opts.pixelRatio;
  749. F.coming.height = this.height / F.opts.pixelRatio;
  750. F._afterLoad();
  751. };
  752. img.onerror = function () {
  753. this.onload = this.onerror = null;
  754. F._error('image');
  755. };
  756. img.src = F.coming.href;
  757. if (img.complete !== true) {
  758. F.showLoading();
  759. }
  760. },
  761. _loadAjax: function () {
  762. var coming = F.coming;
  763. F.showLoading();
  764. F.ajaxLoad = $.ajax($.extend({}, coming.ajax, {
  765. url: coming.href,
  766. error: function (jqXHR, textStatus) {
  767. if (F.coming && textStatus !== 'abort') {
  768. F._error('ajax', jqXHR);
  769. } else {
  770. F.hideLoading();
  771. }
  772. },
  773. success: function (data, textStatus) {
  774. if (textStatus === 'success') {
  775. coming.content = data;
  776. F._afterLoad();
  777. }
  778. }
  779. }));
  780. },
  781. _loadIframe: function () {
  782. var coming = F.coming,
  783. iframe = $(coming.tpl.iframe.replace(/\{rnd\}/g, new Date().getTime()))
  784. .attr('scrolling', isTouch ? 'auto' : coming.iframe.scrolling)
  785. .attr('src', coming.href);
  786. // This helps IE
  787. $(coming.wrap).bind('onReset', function () {
  788. try {
  789. $(this).find('iframe').hide().attr('src', '//about:blank').end().empty();
  790. } catch (e) { }
  791. });
  792. if (coming.iframe.preload) {
  793. F.showLoading();
  794. iframe.one('load', function () {
  795. $(this).data('ready', 1);
  796. // iOS will lose scrolling if we resize
  797. if (!isTouch) {
  798. $(this).bind('load.fb', F.update);
  799. }
  800. // Without this trick:
  801. // - iframe won't scroll on iOS devices
  802. // - IE7 sometimes displays empty iframe
  803. $(this).parents('.fancybox-wrap').width('100%').removeClass('fancybox-tmp').show();
  804. F._afterLoad();
  805. });
  806. }
  807. coming.content = iframe.appendTo(coming.inner);
  808. if (!coming.iframe.preload) {
  809. F._afterLoad();
  810. }
  811. },
  812. _preloadImages: function () {
  813. var group = F.group,
  814. current = F.current,
  815. len = group.length,
  816. cnt = current.preload ? Math.min(current.preload, len - 1) : 0,
  817. item,
  818. i;
  819. for (i = 1; i <= cnt; i += 1) {
  820. item = group[(current.index + i) % len];
  821. if (item.type === 'image' && item.href) {
  822. new Image().src = item.href;
  823. }
  824. }
  825. },
  826. _afterLoad: function () {
  827. var coming = F.coming,
  828. previous = F.current,
  829. placeholder = 'fancybox-placeholder',
  830. current,
  831. content,
  832. type,
  833. scrolling,
  834. href,
  835. embed;
  836. F.hideLoading();
  837. if (!coming || F.isActive === false) {
  838. return;
  839. }
  840. if (false === F.trigger('afterLoad', coming, previous)) {
  841. coming.wrap.stop(true).trigger('onReset').remove();
  842. F.coming = null;
  843. return;
  844. }
  845. if (previous) {
  846. F.trigger('beforeChange', previous);
  847. previous.wrap.stop(true).removeClass('fancybox-opened')
  848. .find('.fancybox-item, .fancybox-nav')
  849. .remove();
  850. }
  851. F.unbindEvents();
  852. current = coming;
  853. content = coming.content;
  854. type = coming.type;
  855. scrolling = coming.scrolling;
  856. $.extend(F, {
  857. wrap: current.wrap,
  858. skin: current.skin,
  859. outer: current.outer,
  860. inner: current.inner,
  861. current: current,
  862. previous: previous
  863. });
  864. href = current.href;
  865. switch (type) {
  866. case 'inline':
  867. case 'ajax':
  868. case 'html':
  869. if (current.selector) {
  870. content = $('<div>').html(content).find(current.selector);
  871. } else if (isQuery(content)) {
  872. if (!content.data(placeholder)) {
  873. content.data(placeholder, $('<div class="' + placeholder + '"></div>').insertAfter(content).hide());
  874. }
  875. content = content.show().detach();
  876. current.wrap.bind('onReset', function () {
  877. if ($(this).find(content).length) {
  878. content.hide().replaceAll(content.data(placeholder)).data(placeholder, false);
  879. }
  880. });
  881. }
  882. break;
  883. case 'image':
  884. content = current.tpl.image.replace(/\{href\}/g, href);
  885. break;
  886. case 'swf':
  887. content = '<object id="fancybox-swf" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="100%" height="100%"><param name="movie" value="' + href + '"></param>';
  888. embed = '';
  889. $.each(current.swf, function (name, val) {
  890. content += '<param name="' + name + '" value="' + val + '"></param>';
  891. embed += ' ' + name + '="' + val + '"';
  892. });
  893. content += '<embed src="' + href + '" type="application/x-shockwave-flash" width="100%" height="100%"' + embed + '></embed></object>';
  894. break;
  895. }
  896. if (!(isQuery(content) && content.parent().is(current.inner))) {
  897. current.inner.append(content);
  898. }
  899. // Give a chance for helpers or callbacks to update elements
  900. F.trigger('beforeShow');
  901. // Set scrolling before calculating dimensions
  902. current.inner.css('overflow', scrolling === 'yes' ? 'scroll' : (scrolling === 'no' ? 'hidden' : scrolling));
  903. // Set initial dimensions and start position
  904. F._setDimension();
  905. F.reposition();
  906. F.isOpen = false;
  907. F.coming = null;
  908. F.bindEvents();
  909. if (!F.isOpened) {
  910. $('.fancybox-wrap').not(current.wrap).stop(true).trigger('onReset').remove();
  911. } else if (previous.prevMethod) {
  912. F.transitions[previous.prevMethod]();
  913. }
  914. F.transitions[F.isOpened ? current.nextMethod : current.openMethod]();
  915. F._preloadImages();
  916. },
  917. _setDimension: function () {
  918. var viewport = F.getViewport(),
  919. steps = 0,
  920. canShrink = false,
  921. canExpand = false,
  922. wrap = F.wrap,
  923. skin = F.skin,
  924. inner = F.inner,
  925. current = F.current,
  926. width = current.width,
  927. height = current.height,
  928. minWidth = current.minWidth,
  929. minHeight = current.minHeight,
  930. maxWidth = current.maxWidth,
  931. maxHeight = current.maxHeight,
  932. scrolling = current.scrolling,
  933. scrollOut = current.scrollOutside ? current.scrollbarWidth : 0,
  934. margin = current.margin,
  935. wMargin = getScalar(margin[1] + margin[3]),
  936. hMargin = getScalar(margin[0] + margin[2]),
  937. wPadding,
  938. hPadding,
  939. wSpace,
  940. hSpace,
  941. origWidth,
  942. origHeight,
  943. origMaxWidth,
  944. origMaxHeight,
  945. ratio,
  946. width_,
  947. height_,
  948. maxWidth_,
  949. maxHeight_,
  950. iframe,
  951. body;
  952. // Reset dimensions so we could re-check actual size
  953. wrap.add(skin).add(inner).width('auto').height('auto').removeClass('fancybox-tmp');
  954. wPadding = getScalar(skin.outerWidth(true) - skin.width());
  955. hPadding = getScalar(skin.outerHeight(true) - skin.height());
  956. // Any space between content and viewport (margin, padding, border, title)
  957. wSpace = wMargin + wPadding;
  958. hSpace = hMargin + hPadding;
  959. origWidth = isPercentage(width) ? (viewport.w - wSpace) * getScalar(width) / 100 : width;
  960. origHeight = isPercentage(height) ? (viewport.h - hSpace) * getScalar(height) / 100 : height;
  961. if (current.type === 'iframe') {
  962. iframe = current.content;
  963. if (current.autoHeight && iframe && iframe.data('ready') === 1) {
  964. try {
  965. if (iframe[0].contentWindow.document.location) {
  966. inner.width(origWidth).height(9999);
  967. body = iframe.contents().find('body');
  968. if (scrollOut) {
  969. body.css('overflow-x', 'hidden');
  970. }
  971. origHeight = body.outerHeight(true);
  972. }
  973. } catch (e) { }
  974. }
  975. } else if (current.autoWidth || current.autoHeight) {
  976. inner.addClass('fancybox-tmp');
  977. // Set width or height in case we need to calculate only one dimension
  978. if (!current.autoWidth) {
  979. inner.width(origWidth);
  980. }
  981. if (!current.autoHeight) {
  982. inner.height(origHeight);
  983. }
  984. if (current.autoWidth) {
  985. origWidth = inner.width();
  986. }
  987. if (current.autoHeight) {
  988. origHeight = inner.height();
  989. }
  990. inner.removeClass('fancybox-tmp');
  991. }
  992. width = getScalar(origWidth);
  993. height = getScalar(origHeight);
  994. ratio = origWidth / origHeight;
  995. // Calculations for the content
  996. minWidth = getScalar(isPercentage(minWidth) ? getScalar(minWidth, 'w') - wSpace : minWidth);
  997. maxWidth = getScalar(isPercentage(maxWidth) ? getScalar(maxWidth, 'w') - wSpace : maxWidth);
  998. minHeight = getScalar(isPercentage(minHeight) ? getScalar(minHeight, 'h') - hSpace : minHeight);
  999. maxHeight = getScalar(isPercentage(maxHeight) ? getScalar(maxHeight, 'h') - hSpace : maxHeight);
  1000. // These will be used to determine if wrap can fit in the viewport
  1001. origMaxWidth = maxWidth;
  1002. origMaxHeight = maxHeight;
  1003. if (current.fitToView) {
  1004. maxWidth = Math.min(viewport.w - wSpace, maxWidth);
  1005. maxHeight = Math.min(viewport.h - hSpace, maxHeight);
  1006. }
  1007. maxWidth_ = viewport.w - wMargin;
  1008. maxHeight_ = viewport.h - hMargin;
  1009. if (current.aspectRatio) {
  1010. if (width > maxWidth) {
  1011. width = maxWidth;
  1012. height = getScalar(width / ratio);
  1013. }
  1014. if (height > maxHeight) {
  1015. height = maxHeight;
  1016. width = getScalar(height * ratio);
  1017. }
  1018. if (width < minWidth) {
  1019. width = minWidth;
  1020. height = getScalar(width / ratio);
  1021. }
  1022. if (height < minHeight) {
  1023. height = minHeight;
  1024. width = getScalar(height * ratio);
  1025. }
  1026. } else {
  1027. width = Math.max(minWidth, Math.min(width, maxWidth));
  1028. if (current.autoHeight && current.type !== 'iframe') {
  1029. inner.width(width);
  1030. height = inner.height();
  1031. }
  1032. height = Math.max(minHeight, Math.min(height, maxHeight));
  1033. }
  1034. // Try to fit inside viewport (including the title)
  1035. if (current.fitToView) {
  1036. inner.width(width).height(height);
  1037. wrap.width(width + wPadding);
  1038. // Real wrap dimensions
  1039. width_ = wrap.width();
  1040. height_ = wrap.height();
  1041. if (current.aspectRatio) {
  1042. while ((width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight) {
  1043. if (steps++ > 19) {
  1044. break;
  1045. }
  1046. height = Math.max(minHeight, Math.min(maxHeight, height - 10));
  1047. width = getScalar(height * ratio);
  1048. if (width < minWidth) {
  1049. width = minWidth;
  1050. height = getScalar(width / ratio);
  1051. }
  1052. if (width > maxWidth) {
  1053. width = maxWidth;
  1054. height = getScalar(width / ratio);
  1055. }
  1056. inner.width(width).height(height);
  1057. wrap.width(width + wPadding);
  1058. width_ = wrap.width();
  1059. height_ = wrap.height();
  1060. }
  1061. } else {
  1062. width = Math.max(minWidth, Math.min(width, width - (width_ - maxWidth_)));
  1063. height = Math.max(minHeight, Math.min(height, height - (height_ - maxHeight_)));
  1064. }
  1065. }
  1066. if (scrollOut && scrolling === 'auto' && height < origHeight && (width + wPadding + scrollOut) < maxWidth_) {
  1067. width += scrollOut;
  1068. }
  1069. inner.width(width).height(height);
  1070. wrap.width(width + wPadding);
  1071. width_ = wrap.width();
  1072. height_ = wrap.height();
  1073. canShrink = (width_ > maxWidth_ || height_ > maxHeight_) && width > minWidth && height > minHeight;
  1074. canExpand = current.aspectRatio ? (width < origMaxWidth && height < origMaxHeight && width < origWidth && height < origHeight) : ((width < origMaxWidth || height < origMaxHeight) && (width < origWidth || height < origHeight));
  1075. $.extend(current, {
  1076. dim: {
  1077. width: getValue(width_),
  1078. height: getValue(height_)
  1079. },
  1080. origWidth: origWidth,
  1081. origHeight: origHeight,
  1082. canShrink: canShrink,
  1083. canExpand: canExpand,
  1084. wPadding: wPadding,
  1085. hPadding: hPadding,
  1086. wrapSpace: height_ - skin.outerHeight(true),
  1087. skinSpace: skin.height() - height
  1088. });
  1089. if (!iframe && current.autoHeight && height > minHeight && height < maxHeight && !canExpand) {
  1090. inner.height('auto');
  1091. }
  1092. },
  1093. _getPosition: function (onlyAbsolute) {
  1094. var current = F.current,
  1095. viewport = F.getViewport(),
  1096. margin = current.margin,
  1097. width = F.wrap.width() + margin[1] + margin[3],
  1098. height = F.wrap.height() + margin[0] + margin[2],
  1099. rez = {
  1100. position: 'absolute',
  1101. top: margin[0],
  1102. left: margin[3]
  1103. };
  1104. if (current.autoCenter && current.fixed && !onlyAbsolute && height <= viewport.h && width <= viewport.w) {
  1105. rez.position = 'fixed';
  1106. } else if (!current.locked) {
  1107. rez.top += viewport.y;
  1108. rez.left += viewport.x;
  1109. }
  1110. rez.top = getValue(Math.max(rez.top, rez.top + ((viewport.h - height) * current.topRatio)));
  1111. rez.left = getValue(Math.max(rez.left, rez.left + ((viewport.w - width) * current.leftRatio)));
  1112. return rez;
  1113. },
  1114. _afterZoomIn: function () {
  1115. var current = F.current;
  1116. if (!current) {
  1117. return;
  1118. }
  1119. F.isOpen = F.isOpened = true;
  1120. F.wrap.css('overflow', 'visible').addClass('fancybox-opened').hide().show(0);
  1121. F.update();
  1122. // Assign a click event
  1123. if (current.closeClick || (current.nextClick && F.group.length > 1)) {
  1124. F.inner.css('cursor', 'pointer').bind('click.fb', function (e) {
  1125. if (!$(e.target).is('a') && !$(e.target).parent().is('a')) {
  1126. e.preventDefault();
  1127. F[current.closeClick ? 'close' : 'next']();
  1128. }
  1129. });
  1130. }
  1131. // Create a close button
  1132. if (current.closeBtn) {
  1133. $(current.tpl.closeBtn).appendTo(F.skin).bind('click.fb', function (e) {
  1134. e.preventDefault();
  1135. F.close();
  1136. });
  1137. }
  1138. // Create navigation arrows
  1139. if (current.arrows && F.group.length > 1) {
  1140. if (current.loop || current.index > 0) {
  1141. $(current.tpl.prev).appendTo(F.outer).bind('click.fb', F.prev);
  1142. }
  1143. if (current.loop || current.index < F.group.length - 1) {
  1144. $(current.tpl.next).appendTo(F.outer).bind('click.fb', F.next);
  1145. }
  1146. }
  1147. F.trigger('afterShow');
  1148. // Stop the slideshow if this is the last item
  1149. if (!current.loop && current.index === current.group.length - 1) {
  1150. F.play(false);
  1151. } else if (F.opts.autoPlay && !F.player.isActive) {
  1152. F.opts.autoPlay = false;
  1153. F.play(true);
  1154. }
  1155. },
  1156. _afterZoomOut: function (obj) {
  1157. obj = obj || F.current;
  1158. $('.fancybox-wrap').trigger('onReset').remove();
  1159. $.extend(F, {
  1160. group: {},
  1161. opts: {},
  1162. router: false,
  1163. current: null,
  1164. isActive: false,
  1165. isOpened: false,
  1166. isOpen: false,
  1167. isClosing: false,
  1168. wrap: null,
  1169. skin: null,
  1170. outer: null,
  1171. inner: null
  1172. });
  1173. F.trigger('afterClose', obj);
  1174. }
  1175. });
  1176. /*
  1177. * Default transitions
  1178. */
  1179. F.transitions = {
  1180. getOrigPosition: function () {
  1181. var current = F.current,
  1182. element = current.element,
  1183. orig = current.orig,
  1184. pos = {},
  1185. width = 50,
  1186. height = 50,
  1187. hPadding = current.hPadding,
  1188. wPadding = current.wPadding,
  1189. viewport = F.getViewport();
  1190. if (!orig && current.isDom && element.is(':visible')) {
  1191. orig = element.find('img:first');
  1192. if (!orig.length) {
  1193. orig = element;
  1194. }
  1195. }
  1196. if (isQuery(orig)) {
  1197. pos = orig.offset();
  1198. if (orig.is('img')) {
  1199. width = orig.outerWidth();
  1200. height = orig.outerHeight();
  1201. }
  1202. } else {
  1203. pos.top = viewport.y + (viewport.h - height) * current.topRatio;
  1204. pos.left = viewport.x + (viewport.w - width) * current.leftRatio;
  1205. }
  1206. if (F.wrap.css('position') === 'fixed' || current.locked) {
  1207. pos.top -= viewport.y;
  1208. pos.left -= viewport.x;
  1209. }
  1210. pos = {
  1211. top: getValue(pos.top - hPadding * current.topRatio),
  1212. left: getValue(pos.left - wPadding * current.leftRatio),
  1213. width: getValue(width + wPadding),
  1214. height: getValue(height + hPadding)
  1215. };
  1216. return pos;
  1217. },
  1218. step: function (now, fx) {
  1219. var ratio,
  1220. padding,
  1221. value,
  1222. prop = fx.prop,
  1223. current = F.current,
  1224. wrapSpace = current.wrapSpace,
  1225. skinSpace = current.skinSpace;
  1226. if (prop === 'width' || prop === 'height') {
  1227. ratio = fx.end === fx.start ? 1 : (now - fx.start) / (fx.end - fx.start);
  1228. if (F.isClosing) {
  1229. ratio = 1 - ratio;
  1230. }
  1231. padding = prop === 'width' ? current.wPadding : current.hPadding;
  1232. value = now - padding;
  1233. F.skin[prop](getScalar(prop === 'width' ? value : value - (wrapSpace * ratio)));
  1234. F.inner[prop](getScalar(prop === 'width' ? value : value - (wrapSpace * ratio) - (skinSpace * ratio)));
  1235. }
  1236. },
  1237. zoomIn: function () {
  1238. var current = F.current,
  1239. startPos = current.pos,
  1240. effect = current.openEffect,
  1241. elastic = effect === 'elastic',
  1242. endPos = $.extend({ opacity: 1 }, startPos);
  1243. // Remove "position" property that breaks older IE
  1244. delete endPos.position;
  1245. if (elastic) {
  1246. startPos = this.getOrigPosition();
  1247. if (current.openOpacity) {
  1248. startPos.opacity = 0.1;
  1249. }
  1250. } else if (effect === 'fade') {
  1251. startPos.opacity = 0.1;
  1252. }
  1253. F.wrap.css(startPos).animate(endPos, {
  1254. duration: effect === 'none' ? 0 : current.openSpeed,
  1255. easing: current.openEasing,
  1256. step: elastic ? this.step : null,
  1257. complete: F._afterZoomIn
  1258. });
  1259. },
  1260. zoomOut: function () {
  1261. var current = F.current,
  1262. effect = current.closeEffect,
  1263. elastic = effect === 'elastic',
  1264. endPos = { opacity: 0.1 };
  1265. if (elastic) {
  1266. endPos = this.getOrigPosition();
  1267. if (current.closeOpacity) {
  1268. endPos.opacity = 0.1;
  1269. }
  1270. }
  1271. F.wrap.animate(endPos, {
  1272. duration: effect === 'none' ? 0 : current.closeSpeed,
  1273. easing: current.closeEasing,
  1274. step: elastic ? this.step : null,
  1275. complete: F._afterZoomOut
  1276. });
  1277. },
  1278. changeIn: function () {
  1279. var current = F.current,
  1280. effect = current.nextEffect,
  1281. startPos = current.pos,
  1282. endPos = { opacity: 1 },
  1283. direction = F.direction,
  1284. distance = 200,
  1285. field;
  1286. startPos.opacity = 0.1;
  1287. if (effect === 'elastic') {
  1288. field = direction === 'down' || direction === 'up' ? 'top' : 'left';
  1289. if (direction === 'down' || direction === 'right') {
  1290. startPos[field] = getValue(getScalar(startPos[field]) - distance);
  1291. endPos[field] = '+=' + distance + 'px';
  1292. } else {
  1293. startPos[field] = getValue(getScalar(startPos[field]) + distance);
  1294. endPos[field] = '-=' + distance + 'px';
  1295. }
  1296. }
  1297. // Workaround for http://bugs.jquery.com/ticket/12273
  1298. if (effect === 'none') {
  1299. F._afterZoomIn();
  1300. } else {
  1301. F.wrap.css(startPos).animate(endPos, {
  1302. duration: current.nextSpeed,
  1303. easing: current.nextEasing,
  1304. complete: F._afterZoomIn
  1305. });
  1306. }
  1307. },
  1308. changeOut: function () {
  1309. var previous = F.previous,
  1310. effect = previous.prevEffect,
  1311. endPos = { opacity: 0.1 },
  1312. direction = F.direction,
  1313. distance = 200;
  1314. if (effect === 'elastic') {
  1315. endPos[direction === 'down' || direction === 'up' ? 'top' : 'left'] = (direction === 'up' || direction === 'left' ? '-' : '+') + '=' + distance + 'px';
  1316. }
  1317. previous.wrap.animate(endPos, {
  1318. duration: effect === 'none' ? 0 : previous.prevSpeed,
  1319. easing: previous.prevEasing,
  1320. complete: function () {
  1321. $(this).trigger('onReset').remove();
  1322. }
  1323. });
  1324. }
  1325. };
  1326. /*
  1327. * Overlay helper
  1328. */
  1329. F.helpers.overlay = {
  1330. defaults: {
  1331. closeClick: true, // if true, fancyBox will be closed when user clicks on the overlay
  1332. speedOut: 200, // duration of fadeOut animation
  1333. showEarly: true, // indicates if should be opened immediately or wait until the content is ready
  1334. css: {}, // custom CSS properties
  1335. locked: !isTouch, // if true, the content will be locked into overlay
  1336. fixed: true // if false, the overlay CSS position property will not be set to "fixed"
  1337. },
  1338. overlay: null, // current handle
  1339. fixed: false, // indicates if the overlay has position "fixed"
  1340. el: $('html'), // element that contains "the lock"
  1341. // Public methods
  1342. create: function (opts) {
  1343. var parent;
  1344. opts = $.extend({}, this.defaults, opts);
  1345. if (this.overlay) {
  1346. this.close();
  1347. }
  1348. parent = F.coming ? F.coming.parent : opts.parent;
  1349. this.overlay = $('<div class="fancybox-overlay"></div>').appendTo(parent && parent.length ? parent : 'body');
  1350. this.fixed = false;
  1351. if (opts.fixed && F.defaults.fixed) {
  1352. this.overlay.addClass('fancybox-overlay-fixed');
  1353. this.fixed = true;
  1354. }
  1355. },
  1356. open: function (opts) {
  1357. var that = this;
  1358. opts = $.extend({}, this.defaults, opts);
  1359. if (this.overlay) {
  1360. this.overlay.unbind('.overlay').width('auto').height('auto');
  1361. } else {
  1362. this.create(opts);
  1363. }
  1364. if (!this.fixed) {
  1365. W.bind('resize.overlay', $.proxy(this.update, this));
  1366. this.update();
  1367. }
  1368. if (opts.closeClick) {
  1369. this.overlay.bind('click.overlay', function (e) {
  1370. if ($(e.target).hasClass('fancybox-overlay')) {
  1371. if (F.isActive) {
  1372. F.close();
  1373. } else {
  1374. that.close();
  1375. }
  1376. return false;
  1377. }
  1378. });
  1379. }
  1380. this.overlay.css(opts.css).show();
  1381. },
  1382. close: function () {
  1383. W.unbind('resize.overlay');
  1384. if (this.el.hasClass('fancybox-lock')) {
  1385. $('.fancybox-margin').removeClass('fancybox-margin');
  1386. this.el.removeClass('fancybox-lock');
  1387. W.scrollTop(this.scrollV).scrollLeft(this.scrollH);
  1388. }
  1389. $('.fancybox-overlay').remove().hide();
  1390. $.extend(this, {
  1391. overlay: null,
  1392. fixed: false
  1393. });
  1394. },
  1395. // Private, callbacks
  1396. update: function () {
  1397. var width = '100%', offsetWidth;
  1398. // Reset width/height so it will not mess
  1399. this.overlay.width(width).height('100%');
  1400. // jQuery does not return reliable result for IE
  1401. if (IE) {
  1402. offsetWidth = Math.max(document.documentElement.offsetWidth, document.body.offsetWidth);
  1403. if (D.width() > offsetWidth) {
  1404. width = D.width();
  1405. }
  1406. } else if (D.width() > W.width()) {
  1407. width = D.width();
  1408. }
  1409. this.overlay.width(width).height(D.height());
  1410. },
  1411. // This is where we can manipulate DOM, because later it would cause iframes to reload
  1412. onReady: function (opts, obj) {
  1413. var overlay = this.overlay;
  1414. $('.fancybox-overlay').stop(true, true);
  1415. if (!overlay) {
  1416. this.create(opts);
  1417. }
  1418. if (opts.locked && this.fixed && obj.fixed) {
  1419. obj.locked = this.overlay.append(obj.wrap);
  1420. obj.fixed = false;
  1421. }
  1422. if (opts.showEarly === true) {
  1423. this.beforeShow.apply(this, arguments);
  1424. }
  1425. },
  1426. beforeShow: function (opts, obj) {
  1427. if (obj.locked && !this.el.hasClass('fancybox-lock')) {
  1428. if (this.fixPosition !== false) {
  1429. $('*:not(object)').filter(function () {
  1430. return ($(this).css('position') === 'fixed' && !$(this).hasClass("fancybox-overlay") && !$(this).hasClass("fancybox-wrap"));
  1431. }).addClass('fancybox-margin');
  1432. }
  1433. this.el.addClass('fancybox-margin');
  1434. this.scrollV = W.scrollTop();
  1435. this.scrollH = W.scrollLeft();
  1436. this.el.addClass('fancybox-lock');
  1437. W.scrollTop(this.scrollV).scrollLeft(this.scrollH);
  1438. }
  1439. this.open(opts);
  1440. },
  1441. onUpdate: function () {
  1442. if (!this.fixed) {
  1443. this.update();
  1444. }
  1445. },
  1446. afterClose: function (opts) {
  1447. // Remove overlay if exists and fancyBox is not opening
  1448. // (e.g., it is not being open using afterClose callback)
  1449. if (this.overlay && !F.coming) {
  1450. this.overlay.fadeOut(opts.speedOut, $.proxy(this.close, this));
  1451. }
  1452. }
  1453. };
  1454. /*
  1455. * Title helper
  1456. */
  1457. F.helpers.title = {
  1458. defaults: {
  1459. type: 'float', // 'float', 'inside', 'outside' or 'over',
  1460. position: 'bottom' // 'top' or 'bottom'
  1461. },
  1462. beforeShow: function (opts) {
  1463. var current = F.current,
  1464. text = current.title,
  1465. type = opts.type,
  1466. title,
  1467. target;
  1468. if ($.isFunction(text)) {
  1469. text = text.call(current.element, current);
  1470. }
  1471. if (!isString(text) || $.trim(text) === '') {
  1472. return;
  1473. }
  1474. title = $('<div class="fancybox-title fancybox-title-' + type + '-wrap">' + text + '</div>');
  1475. switch (type) {
  1476. case 'inside':
  1477. target = F.skin;
  1478. break;
  1479. case 'outside':
  1480. target = F.wrap;
  1481. break;
  1482. case 'over':
  1483. target = F.inner;
  1484. break;
  1485. default: // 'float'
  1486. target = F.skin;
  1487. title.appendTo('body');
  1488. if (IE) {
  1489. title.width(title.width());
  1490. }
  1491. title.wrapInner('<span class="child"></span>');
  1492. //Increase bottom margin so this title will also fit into viewport
  1493. F.current.margin[2] += Math.abs(getScalar(title.css('margin-bottom')));
  1494. break;
  1495. }
  1496. title[(opts.position === 'top' ? 'prependTo' : 'appendTo')](target);
  1497. }
  1498. };
  1499. // jQuery plugin initialization
  1500. $.fn.fancybox = function (options) {
  1501. var index,
  1502. that = $(this),
  1503. selector = this.selector || '',
  1504. run = function (e) {
  1505. var what = $(this).blur(), idx = index, relType, relVal;
  1506. if (!(e.ctrlKey || e.altKey || e.shiftKey || e.metaKey) && !what.is('.fancybox-wrap')) {
  1507. relType = options.groupAttr || 'data-fancybox-group';
  1508. relVal = what.attr(relType);
  1509. if (!relVal) {
  1510. relType = 'rel';
  1511. relVal = what.get(0)[relType];
  1512. }
  1513. if (relVal && relVal !== '' && relVal !== 'nofollow') {
  1514. what = selector.length ? $(selector) : that;
  1515. what = what.filter('[' + relType + '="' + relVal + '"]');
  1516. idx = what.index(this);
  1517. }
  1518. options.index = idx;
  1519. // Stop an event from bubbling if everything is fine
  1520. if (F.open(what, options) !== false) {
  1521. e.preventDefault();
  1522. }
  1523. }
  1524. };
  1525. options = options || {};
  1526. index = options.index || 0;
  1527. if (!selector || options.live === false) {
  1528. that.unbind('click.fb-start').bind('click.fb-start', run);
  1529. } else {
  1530. D.undelegate(selector, 'click.fb-start').delegate(selector + ":not('.fancybox-item, .fancybox-nav')", 'click.fb-start', run);
  1531. }
  1532. this.filter('[data-fancybox-start=1]').trigger('click');
  1533. return this;
  1534. };
  1535. // Tests that need a body at doc ready
  1536. D.ready(function () {
  1537. var w1, w2;
  1538. if ($.scrollbarWidth === undefined) {
  1539. // http://benalman.com/projects/jquery-misc-plugins/#scrollbarwidth
  1540. $.scrollbarWidth = function () {
  1541. var parent = $('<div style="width:50px;height:50px;overflow:auto"><div/></div>').appendTo('body'),
  1542. child = parent.children(),
  1543. width = child.innerWidth() - child.height(99).innerWidth();
  1544. parent.remove();
  1545. return width;
  1546. };
  1547. }
  1548. if ($.support.fixedPosition === undefined) {
  1549. $.support.fixedPosition = (function () {
  1550. var elem = $('<div style="position:fixed;top:20px;"></div>').appendTo('body'),
  1551. fixed = (elem[0].offsetTop === 20 || elem[0].offsetTop === 15);
  1552. elem.remove();
  1553. return fixed;
  1554. }());
  1555. }
  1556. $.extend(F.defaults, {
  1557. scrollbarWidth: $.scrollbarWidth(),
  1558. fixed: $.support.fixedPosition,
  1559. parent: $('body')
  1560. });
  1561. //Get real width of page scroll-bar
  1562. w1 = $(window).width();
  1563. H.addClass('fancybox-lock-test');
  1564. w2 = $(window).width();
  1565. H.removeClass('fancybox-lock-test');
  1566. $("<style type='text/css'>.fancybox-margin{margin-right:" + (w2 - w1) + "px;}</style>").appendTo("head");
  1567. });
  1568. }(window, document, jQuery));