jquery.fancybox.js 48 KB

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