jquery.fancybox.js 48 KB

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