turn.js 72 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881288228832884288528862887288828892890289128922893289428952896289728982899290029012902290329042905290629072908290929102911291229132914291529162917291829192920292129222923292429252926292729282929293029312932293329342935293629372938293929402941294229432944294529462947294829492950295129522953295429552956295729582959296029612962296329642965296629672968296929702971297229732974297529762977297829792980298129822983298429852986298729882989299029912992299329942995299629972998299930003001300230033004300530063007300830093010301130123013301430153016301730183019302030213022302330243025302630273028302930303031303230333034303530363037303830393040304130423043304430453046304730483049305030513052305330543055305630573058305930603061306230633064306530663067306830693070307130723073307430753076307730783079308030813082308330843085308630873088308930903091309230933094309530963097309830993100310131023103310431053106310731083109311031113112311331143115311631173118311931203121312231233124312531263127312831293130313131323133313431353136313731383139314031413142314331443145314631473148314931503151315231533154315531563157315831593160316131623163316431653166316731683169317031713172317331743175317631773178317931803181318231833184318531863187318831893190319131923193319431953196319731983199320032013202320332043205320632073208320932103211321232133214321532163217321832193220322132223223322432253226322732283229323032313232323332343235323632373238323932403241324232433244324532463247324832493250325132523253325432553256325732583259326032613262326332643265326632673268326932703271327232733274327532763277327832793280328132823283328432853286328732883289329032913292329332943295329632973298329933003301330233033304330533063307330833093310331133123313331433153316331733183319332033213322332333243325332633273328332933303331333233333334333533363337333833393340334133423343334433453346334733483349335033513352
  1. /**
  2. * turn.js 4th release
  3. * turnjs.com
  4. * turnjs.com/license.txt
  5. *
  6. * Copyright (C) 2012 Emmanuel Garcia
  7. * All rights reserved
  8. **/
  9. (function($) {
  10. 'use strict';
  11. var has3d,
  12. hasRot,
  13. vendor = '',
  14. version = '4.1.0',
  15. PI = Math.PI,
  16. A90 = PI/2,
  17. isTouch = 'ontouchstart' in window,
  18. mouseEvents = (isTouch) ?
  19. {
  20. down: 'touchstart',
  21. move: 'touchmove',
  22. up: 'touchend',
  23. over: 'touchstart',
  24. out: 'touchend'
  25. }
  26. :
  27. {
  28. down: 'mousedown',
  29. move: 'mousemove',
  30. up: 'mouseup',
  31. over: 'mouseover',
  32. out: 'mouseout'
  33. },
  34. // Contansts used for each corner
  35. // | tl * tr |
  36. // l | * * | r
  37. // | bl * br |
  38. corners = {
  39. backward: ['bl', 'tl'],
  40. forward: ['br', 'tr'],
  41. all: ['tl', 'bl', 'tr', 'br', 'l', 'r']
  42. },
  43. // Display values
  44. displays = ['single', 'double'],
  45. // Direction values
  46. directions = ['ltr', 'rtl'],
  47. // Default options
  48. turnOptions = {
  49. // Enables hardware acceleration
  50. acceleration: true,
  51. // Display
  52. display: 'double',
  53. // Duration of transition in milliseconds
  54. duration: 600,
  55. // First page
  56. page: 1,
  57. // Enables gradients
  58. gradients: true,
  59. // Corners used when turning the page
  60. turnCorners: 'bl,br',
  61. // Events
  62. when: null
  63. },
  64. flipOptions = {
  65. // Size of the active zone of each corner
  66. cornerSize: 100
  67. },
  68. // Number of pages in the DOM, minimum value: 6
  69. pagesInDOM = 6,
  70. turnMethods = {
  71. // Singleton constructor
  72. // $('#selector').turn([options]);
  73. init: function(options) {
  74. // Define constants
  75. has3d = 'WebKitCSSMatrix' in window || 'MozPerspective' in document.body.style;
  76. hasRot = rotationAvailable();
  77. vendor = getPrefix();
  78. var i, that = this, pageNum = 0, data = this.data(), ch = this.children();
  79. // Set initial configuration
  80. options = $.extend({
  81. width: this.width(),
  82. height: this.height(),
  83. direction: this.attr('dir') || this.css('direction') || 'ltr'
  84. }, turnOptions, options);
  85. data.opts = options;
  86. data.pageObjs = {};
  87. data.pages = {};
  88. data.pageWrap = {};
  89. data.pageZoom = {};
  90. data.pagePlace = {};
  91. data.pageMv = [];
  92. data.zoom = 1;
  93. data.totalPages = options.pages || 0;
  94. data.eventHandlers = {
  95. touchStart: $.proxy(turnMethods._touchStart, this),
  96. touchMove: $.proxy(turnMethods._touchMove, this),
  97. touchEnd: $.proxy(turnMethods._touchEnd, this),
  98. start: $.proxy(turnMethods._eventStart, this)
  99. };
  100. // Add event listeners
  101. if (options.when)
  102. for (i in options.when)
  103. if (has(i, options.when))
  104. this.bind(i, options.when[i]);
  105. // Set the css
  106. this.css({position: 'relative', width: options.width, height: options.height});
  107. // Set the initial display
  108. this.turn('display', options.display);
  109. // Set the direction
  110. if (options.direction!=='')
  111. this.turn('direction', options.direction);
  112. // Prevent blue screen problems of switching to hardware acceleration mode
  113. // By forcing hardware acceleration for ever
  114. if (has3d && !isTouch && options.acceleration)
  115. this.transform(translate(0, 0, true));
  116. // Add pages from the DOM
  117. for (i = 0; i<ch.length; i++) {
  118. if ($(ch[i]).attr('ignore')!='1') {
  119. this.turn('addPage', ch[i], ++pageNum);
  120. }
  121. }
  122. // Event listeners
  123. $(this).bind(mouseEvents.down, data.eventHandlers.touchStart).
  124. bind('end', turnMethods._eventEnd).
  125. bind('pressed', turnMethods._eventPressed).
  126. bind('released', turnMethods._eventReleased).
  127. bind('flip', turnMethods._flip);
  128. $(this).parent().bind('start', data.eventHandlers.start);
  129. $(document).bind(mouseEvents.move, data.eventHandlers.touchMove).
  130. bind(mouseEvents.up, data.eventHandlers.touchEnd);
  131. // Set the initial page
  132. this.turn('page', options.page);
  133. // This flipbook is ready
  134. data.done = true;
  135. return this;
  136. },
  137. // Adds a page from external data
  138. addPage: function(element, page) {
  139. var currentPage,
  140. className,
  141. incPages = false,
  142. data = this.data(),
  143. lastPage = data.totalPages+1;
  144. if (data.destroying)
  145. return false;
  146. // Read the page number from the className of `element` - format: p[0-9]+
  147. if ((currentPage = /\bp([0-9]+)\b/.exec($(element).attr('class'))))
  148. page = parseInt(currentPage[1], 10);
  149. if (page) {
  150. if (page==lastPage)
  151. incPages = true;
  152. else if (page>lastPage)
  153. throw turnError('Page "'+page+'" cannot be inserted');
  154. } else {
  155. page = lastPage;
  156. incPages = true;
  157. }
  158. if (page>=1 && page<=lastPage) {
  159. if (data.display=='double')
  160. className = (page%2) ? ' odd' : ' even';
  161. else
  162. className = '';
  163. // Stop animations
  164. if (data.done)
  165. this.turn('stop');
  166. // Move pages if it's necessary
  167. if (page in data.pageObjs)
  168. turnMethods._movePages.call(this, page, 1);
  169. // Increase the number of pages
  170. if (incPages)
  171. data.totalPages = lastPage;
  172. // Add element
  173. data.pageObjs[page] = $(element).
  174. css({'float': 'left'}).
  175. addClass('page p' + page + className);
  176. if (!hasHardPage() && data.pageObjs[page].hasClass('hard')) {
  177. data.pageObjs[page].removeClass('hard');
  178. }
  179. // Add page
  180. turnMethods._addPage.call(this, page);
  181. // Remove pages out of range
  182. turnMethods._removeFromDOM.call(this);
  183. }
  184. return this;
  185. },
  186. // Adds a page
  187. _addPage: function(page) {
  188. var data = this.data(),
  189. element = data.pageObjs[page];
  190. if (element)
  191. if (turnMethods._necessPage.call(this, page)) {
  192. if (!data.pageWrap[page]) {
  193. // Wrapper
  194. data.pageWrap[page] = $('<div/>',
  195. {'class': 'page-wrapper',
  196. page: page,
  197. css: {position: 'absolute',
  198. overflow: 'hidden'}});
  199. // Append to this flipbook
  200. this.append(data.pageWrap[page]);
  201. if (!data.pagePlace[page]) {
  202. data.pagePlace[page] = page;
  203. // Move `pageObjs[page]` to wrapper
  204. data.pageObjs[page].appendTo(data.pageWrap[page]);
  205. }
  206. // Set the size of the page
  207. var prop = turnMethods._pageSize.call(this, page, true);
  208. element.css({width: prop.width, height: prop.height});
  209. data.pageWrap[page].css(prop);
  210. }
  211. if (data.pagePlace[page] == page) {
  212. // If the page isn't in another place, create the flip effect
  213. turnMethods._makeFlip.call(this, page);
  214. }
  215. } else {
  216. // Place
  217. data.pagePlace[page] = 0;
  218. // Remove element from the DOM
  219. if (data.pageObjs[page])
  220. data.pageObjs[page].remove();
  221. }
  222. },
  223. // Checks if a page is in memory
  224. hasPage: function(page) {
  225. return has(page, this.data().pageObjs);
  226. },
  227. // Centers the flipbook
  228. center: function(page) {
  229. var data = this.data(),
  230. size = $(this).turn('size'),
  231. left = 0;
  232. if (!data.noCenter) {
  233. if (data.display=='double') {
  234. var view = this.turn('view', page || data.tpage || data.page);
  235. if (data.direction=='ltr') {
  236. if (!view[0])
  237. left -= size.width/4;
  238. else if (!view[1])
  239. left += size.width/4;
  240. } else {
  241. if (!view[0])
  242. left += size.width/4;
  243. else if (!view[1])
  244. left -= size.width/4;
  245. }
  246. }
  247. $(this).css({marginLeft: left});
  248. }
  249. return this;
  250. },
  251. // Destroys the flipbook
  252. destroy: function () {
  253. var page,
  254. flipbook = this,
  255. data = this.data(),
  256. events = [
  257. 'end', 'first', 'flip', 'last', 'pressed',
  258. 'released', 'start', 'turning', 'turned',
  259. 'zooming', 'missing'];
  260. if (trigger('destroying', this)=='prevented')
  261. return;
  262. data.destroying = true;
  263. $.each(events, function(index, eventName) {
  264. flipbook.unbind(eventName);
  265. });
  266. this.parent().unbind('start', data.eventHandlers.start);
  267. $(document).unbind(mouseEvents.move, data.eventHandlers.touchMove).
  268. unbind(mouseEvents.up, data.eventHandlers.touchEnd);
  269. while (data.totalPages!==0) {
  270. this.turn('removePage', data.totalPages);
  271. }
  272. if (data.fparent)
  273. data.fparent.remove();
  274. if (data.shadow)
  275. data.shadow.remove();
  276. this.removeData();
  277. data = null;
  278. return this;
  279. },
  280. // Checks if this element is a flipbook
  281. is: function() {
  282. return typeof(this.data().pages)=='object';
  283. },
  284. // Sets and gets the zoom value
  285. zoom: function(newZoom) {
  286. var data = this.data();
  287. if (typeof(newZoom)=='number') {
  288. if (newZoom<0.001 || newZoom>100)
  289. throw turnError(newZoom+ ' is not a value for zoom');
  290. if (trigger('zooming', this, [newZoom, data.zoom])=='prevented')
  291. return this;
  292. var size = this.turn('size'),
  293. currentView = this.turn('view'),
  294. iz = 1/data.zoom,
  295. newWidth = Math.round(size.width * iz * newZoom),
  296. newHeight = Math.round(size.height * iz * newZoom);
  297. data.zoom = newZoom;
  298. $(this).turn('stop').
  299. turn('size', newWidth, newHeight);
  300. /*.
  301. css({marginTop: size.height * iz / 2 - newHeight / 2});*/
  302. if (data.opts.autoCenter)
  303. this.turn('center');
  304. /*else
  305. $(this).css({marginLeft: size.width * iz / 2 - newWidth / 2});*/
  306. turnMethods._updateShadow.call(this);
  307. for (var i = 0; i<currentView.length; i++) {
  308. if (currentView[i] && data.pageZoom[currentView[i]]!=data.zoom) {
  309. this.trigger('zoomed',[
  310. currentView[i],
  311. currentView,
  312. data.pageZoom[currentView[i]],
  313. data.zoom]);
  314. data.pageZoom[currentView[i]] = data.zoom;
  315. }
  316. }
  317. return this;
  318. } else
  319. return data.zoom;
  320. },
  321. // Gets the size of a page
  322. _pageSize: function(page, position) {
  323. var data = this.data(),
  324. prop = {};
  325. if (data.display=='single') {
  326. prop.width = this.width();
  327. prop.height = this.height();
  328. if (position) {
  329. prop.top = 0;
  330. prop.left = 0;
  331. prop.right = 'auto';
  332. }
  333. } else {
  334. var pageWidth = this.width()/2,
  335. pageHeight = this.height();
  336. if (data.pageObjs[page].hasClass('own-size')) {
  337. prop.width = data.pageObjs[page].width();
  338. prop.height = data.pageObjs[page].height();
  339. } else {
  340. prop.width = pageWidth;
  341. prop.height = pageHeight;
  342. }
  343. if (position) {
  344. var odd = page%2;
  345. prop.top = (pageHeight-prop.height)/2;
  346. if (data.direction=='ltr') {
  347. prop[(odd) ? 'right' : 'left'] = pageWidth-prop.width;
  348. prop[(odd) ? 'left' : 'right'] = 'auto';
  349. } else {
  350. prop[(odd) ? 'left' : 'right'] = pageWidth-prop.width;
  351. prop[(odd) ? 'right' : 'left'] = 'auto';
  352. }
  353. }
  354. }
  355. return prop;
  356. },
  357. // Prepares the flip effect for a page
  358. _makeFlip: function(page) {
  359. var data = this.data();
  360. if (!data.pages[page] && data.pagePlace[page]==page) {
  361. var single = data.display=='single',
  362. odd = page%2;
  363. data.pages[page] = data.pageObjs[page].
  364. css(turnMethods._pageSize.call(this, page)).
  365. flip({
  366. page: page,
  367. next: (odd || single) ? page+1 : page-1,
  368. turn: this
  369. }).
  370. flip('disable', data.disabled);
  371. // Issue about z-index
  372. turnMethods._setPageLoc.call(this, page);
  373. data.pageZoom[page] = data.zoom;
  374. }
  375. return data.pages[page];
  376. },
  377. // Makes pages within a range
  378. _makeRange: function() {
  379. var page, range,
  380. data = this.data();
  381. if (data.totalPages<1)
  382. return;
  383. range = this.turn('range');
  384. for (page = range[0]; page<=range[1]; page++)
  385. turnMethods._addPage.call(this, page);
  386. },
  387. // Returns a range of pages that should be in the DOM
  388. // Example:
  389. // - page in the current view, return true
  390. // * page is in the range, return true
  391. // Otherwise, return false
  392. //
  393. // 1 2-3 4-5 6-7 8-9 10-11 12-13
  394. // ** ** -- ** **
  395. range: function(page) {
  396. var remainingPages, left, right, view,
  397. data = this.data();
  398. page = page || data.tpage || data.page || 1;
  399. view = turnMethods._view.call(this, page);
  400. if (page<1 || page>data.totalPages)
  401. throw turnError('"'+page+'" is not a valid page');
  402. view[1] = view[1] || view[0];
  403. if (view[0]>=1 && view[1]<=data.totalPages) {
  404. remainingPages = Math.floor((pagesInDOM-2)/2);
  405. if (data.totalPages-view[1] > view[0]) {
  406. left = Math.min(view[0]-1, remainingPages);
  407. right = 2*remainingPages-left;
  408. } else {
  409. right = Math.min(data.totalPages-view[1], remainingPages);
  410. left = 2*remainingPages-right;
  411. }
  412. } else {
  413. left = pagesInDOM-1;
  414. right = pagesInDOM-1;
  415. }
  416. return [Math.max(1, view[0]-left),
  417. Math.min(data.totalPages, view[1]+right)];
  418. },
  419. // Detects if a page is within the range of `pagesInDOM` from the current view
  420. _necessPage: function(page) {
  421. if (page===0)
  422. return true;
  423. var range = this.turn('range');
  424. return this.data().pageObjs[page].hasClass('fixed') ||
  425. (page>=range[0] && page<=range[1]);
  426. },
  427. // Releases memory by removing pages from the DOM
  428. _removeFromDOM: function() {
  429. var page, data = this.data();
  430. for (page in data.pageWrap)
  431. if (has(page, data.pageWrap) &&
  432. !turnMethods._necessPage.call(this, page))
  433. turnMethods._removePageFromDOM.call(this, page);
  434. },
  435. // Removes a page from DOM and its internal references
  436. _removePageFromDOM: function(page) {
  437. var data = this.data();
  438. if (data.pages[page]) {
  439. var dd = data.pages[page].data();
  440. flipMethods._moveFoldingPage.call(data.pages[page], false);
  441. if (dd.f && dd.f.fwrapper)
  442. dd.f.fwrapper.remove();
  443. data.pages[page].removeData();
  444. data.pages[page].remove();
  445. delete data.pages[page];
  446. }
  447. if (data.pageObjs[page])
  448. data.pageObjs[page].remove();
  449. if (data.pageWrap[page]) {
  450. data.pageWrap[page].remove();
  451. delete data.pageWrap[page];
  452. }
  453. turnMethods._removeMv.call(this, page);
  454. delete data.pagePlace[page];
  455. delete data.pageZoom[page];
  456. },
  457. // Removes a page
  458. removePage: function(page) {
  459. var data = this.data();
  460. // Delete all the pages
  461. if (page=='*') {
  462. while (data.totalPages!==0) {
  463. this.turn('removePage', data.totalPages);
  464. }
  465. } else {
  466. if (page<1 || page>data.totalPages)
  467. throw turnError('The page '+ page + ' doesn\'t exist');
  468. if (data.pageObjs[page]) {
  469. // Stop animations
  470. this.turn('stop');
  471. // Remove `page`
  472. turnMethods._removePageFromDOM.call(this, page);
  473. delete data.pageObjs[page];
  474. }
  475. // Move the pages
  476. turnMethods._movePages.call(this, page, -1);
  477. // Resize the size of this flipbook
  478. data.totalPages = data.totalPages-1;
  479. // Check the current view
  480. if (data.page>data.totalPages) {
  481. data.page = null;
  482. turnMethods._fitPage.call(this, data.totalPages);
  483. } else {
  484. turnMethods._makeRange.call(this);
  485. this.turn('update');
  486. }
  487. }
  488. return this;
  489. },
  490. // Moves pages
  491. _movePages: function(from, change) {
  492. var page,
  493. that = this,
  494. data = this.data(),
  495. single = data.display=='single',
  496. move = function(page) {
  497. var next = page + change,
  498. odd = next%2,
  499. className = (odd) ? ' odd ' : ' even ';
  500. if (data.pageObjs[page])
  501. data.pageObjs[next] = data.pageObjs[page].
  502. removeClass('p' + page + ' odd even').
  503. addClass('p' + next + className);
  504. if (data.pagePlace[page] && data.pageWrap[page]) {
  505. data.pagePlace[next] = next;
  506. if (data.pageObjs[next].hasClass('fixed'))
  507. data.pageWrap[next] = data.pageWrap[page].
  508. attr('page', next);
  509. else
  510. data.pageWrap[next] = data.pageWrap[page].
  511. css(turnMethods._pageSize.call(that, next, true)).
  512. attr('page', next);
  513. if (data.pages[page])
  514. data.pages[next] = data.pages[page].
  515. flip('options', {
  516. page: next,
  517. next: (single || odd) ? next+1 : next-1
  518. });
  519. if (change) {
  520. delete data.pages[page];
  521. delete data.pagePlace[page];
  522. delete data.pageZoom[page];
  523. delete data.pageObjs[page];
  524. delete data.pageWrap[page];
  525. }
  526. }
  527. };
  528. if (change>0)
  529. for (page=data.totalPages; page>=from; page--)
  530. move(page);
  531. else
  532. for (page=from; page<=data.totalPages; page++)
  533. move(page);
  534. },
  535. // Sets or Gets the display mode
  536. display: function(display) {
  537. var data = this.data(),
  538. currentDisplay = data.display;
  539. if (display===undefined) {
  540. return currentDisplay;
  541. } else {
  542. if ($.inArray(display, displays)==-1)
  543. throw turnError('"'+display + '" is not a value for display');
  544. switch(display) {
  545. case 'single':
  546. // Create a temporal page to use as folded page
  547. if (!data.pageObjs[0]) {
  548. this.turn('stop').
  549. css({'overflow': 'hidden'});
  550. data.pageObjs[0] = $('<div />',
  551. {'class': 'page p-temporal'}).
  552. css({width: this.width(), height: this.height()}).
  553. appendTo(this);
  554. }
  555. this.addClass('shadow');
  556. break;
  557. case 'double':
  558. // Remove the temporal page
  559. if (data.pageObjs[0]) {
  560. this.turn('stop').css({'overflow': ''});
  561. data.pageObjs[0].remove();
  562. delete data.pageObjs[0];
  563. }
  564. this.removeClass('shadow');
  565. break;
  566. }
  567. data.display = display;
  568. if (currentDisplay) {
  569. var size = this.turn('size');
  570. turnMethods._movePages.call(this, 1, 0);
  571. this.turn('size', size.width, size.height).
  572. turn('update');
  573. }
  574. return this;
  575. }
  576. },
  577. // Gets and sets the direction of the flipbook
  578. direction: function(dir) {
  579. var data = this.data();
  580. if (dir===undefined) {
  581. return data.direction;
  582. } else {
  583. dir = dir.toLowerCase();
  584. if ($.inArray(dir, directions)==-1)
  585. throw turnError('"' + dir + '" is not a value for direction');
  586. if (dir=='rtl') {
  587. $(this).attr('dir', 'ltr').
  588. css({direction: 'ltr'});
  589. }
  590. data.direction = dir;
  591. if (data.done)
  592. this.turn('size', $(this).width(), $(this).height());
  593. return this;
  594. }
  595. },
  596. // Detects animation
  597. animating: function() {
  598. return this.data().pageMv.length>0;
  599. },
  600. // Gets the current activated corner
  601. corner: function() {
  602. var corner,
  603. page,
  604. data = this.data();
  605. for (page in data.pages) {
  606. if (has(page, data.pages))
  607. if ((corner = data.pages[page].flip('corner'))) {
  608. return corner;
  609. }
  610. }
  611. return false;
  612. },
  613. // Gets the data stored in the flipbook
  614. data: function() {
  615. return this.data();
  616. },
  617. // Disables and enables the effect
  618. disable: function(disable) {
  619. var page,
  620. data = this.data(),
  621. view = this.turn('view');
  622. data.disabled = disable===undefined || disable===true;
  623. for (page in data.pages) {
  624. if (has(page, data.pages))
  625. data.pages[page].flip('disable',
  626. (data.disabled) ? true : $.inArray(parseInt(page, 10), view)==-1);
  627. }
  628. return this;
  629. },
  630. // Disables and enables the effect
  631. disabled: function(disable) {
  632. if (disable===undefined) {
  633. return this.data().disabled===true;
  634. } else {
  635. return this.turn('disable', disable);
  636. }
  637. },
  638. // Gets and sets the size
  639. size: function(width, height) {
  640. if (width===undefined || height===undefined) {
  641. return {width: this.width(), height: this.height()};
  642. } else {
  643. this.turn('stop');
  644. var page, prop,
  645. data = this.data(),
  646. pageWidth = (data.display=='double') ? width/2 : width;
  647. this.css({width: width, height: height});
  648. if (data.pageObjs[0])
  649. data.pageObjs[0].css({width: pageWidth, height: height});
  650. for (page in data.pageWrap) {
  651. if (!has(page, data.pageWrap)) continue;
  652. prop = turnMethods._pageSize.call(this, page, true);
  653. data.pageObjs[page].css({width: prop.width, height: prop.height});
  654. data.pageWrap[page].css(prop);
  655. if (data.pages[page])
  656. data.pages[page].css({width: prop.width, height: prop.height});
  657. }
  658. this.turn('resize');
  659. return this;
  660. }
  661. },
  662. // Resizes each page
  663. resize: function() {
  664. var page, data = this.data();
  665. if (data.pages[0]) {
  666. data.pageWrap[0].css({left: -this.width()});
  667. data.pages[0].flip('resize', true);
  668. }
  669. for (page = 1; page <= data.totalPages; page++)
  670. if (data.pages[page])
  671. data.pages[page].flip('resize', true);
  672. turnMethods._updateShadow.call(this);
  673. if (data.opts.autoCenter)
  674. this.turn('center');
  675. },
  676. // Removes an animation from the cache
  677. _removeMv: function(page) {
  678. var i, data = this.data();
  679. for (i=0; i<data.pageMv.length; i++)
  680. if (data.pageMv[i]==page) {
  681. data.pageMv.splice(i, 1);
  682. return true;
  683. }
  684. return false;
  685. },
  686. // Adds an animation to the cache
  687. _addMv: function(page) {
  688. var data = this.data();
  689. turnMethods._removeMv.call(this, page);
  690. data.pageMv.push(page);
  691. },
  692. // Gets indexes for a view
  693. _view: function(page) {
  694. var data = this.data();
  695. page = page || data.page;
  696. if (data.display=='double')
  697. return (page%2) ? [page-1, page] : [page, page+1];
  698. else
  699. return [page];
  700. },
  701. // Gets a view
  702. view: function(page) {
  703. var data = this.data(),
  704. view = turnMethods._view.call(this, page);
  705. if (data.display=='double')
  706. return [(view[0]>0) ? view[0] : 0,
  707. (view[1]<=data.totalPages) ? view[1] : 0];
  708. else
  709. return [(view[0]>0 && view[0]<=data.totalPages) ? view[0] : 0];
  710. },
  711. // Stops animations
  712. stop: function(ignore, animate) {
  713. if (this.turn('animating')) {
  714. var i, opts, page,
  715. data = this.data();
  716. if (data.tpage) {
  717. data.page = data.tpage;
  718. delete data['tpage'];
  719. }
  720. for (i = 0; i<data.pageMv.length; i++) {
  721. if (!data.pageMv[i] || data.pageMv[i]===ignore)
  722. continue;
  723. page = data.pages[data.pageMv[i]];
  724. opts = page.data().f.opts;
  725. page.flip('hideFoldedPage', animate);
  726. if (!animate)
  727. flipMethods._moveFoldingPage.call(page, false);
  728. if (opts.force) {
  729. opts.next = (opts.page%2===0) ? opts.page-1 : opts.page+1;
  730. delete opts['force'];
  731. }
  732. }
  733. }
  734. this.turn('update');
  735. return this;
  736. },
  737. // Gets and sets the number of pages
  738. pages: function(pages) {
  739. var data = this.data();
  740. if (pages) {
  741. if (pages<data.totalPages) {
  742. for (var page = data.totalPages; page>pages; page--)
  743. this.turn('removePage', page);
  744. }
  745. data.totalPages = pages;
  746. turnMethods._fitPage.call(this, data.page);
  747. return this;
  748. } else
  749. return data.totalPages;
  750. },
  751. // Checks missing pages
  752. _missing : function(page) {
  753. var data = this.data();
  754. if (data.totalPages<1)
  755. return;
  756. var p,
  757. range = this.turn('range', page),
  758. missing = [];
  759. for (p = range[0]; p<=range[1]; p++) {
  760. if (!data.pageObjs[p])
  761. missing.push(p);
  762. }
  763. if (missing.length>0)
  764. this.trigger('missing', [missing]);
  765. },
  766. // Sets a page without effect
  767. _fitPage: function(page) {
  768. var data = this.data(),
  769. newView = this.turn('view', page);
  770. turnMethods._missing.call(this, page);
  771. if (!data.pageObjs[page])
  772. return;
  773. data.page = page;
  774. this.turn('stop');
  775. for (var i = 0; i<newView.length; i++) {
  776. if (newView[i] && data.pageZoom[newView[i]]!=data.zoom) {
  777. this.trigger('zoomed',[
  778. newView[i],
  779. newView,
  780. data.pageZoom[newView[i]],
  781. data.zoom]);
  782. data.pageZoom[newView[i]] = data.zoom;
  783. }
  784. }
  785. turnMethods._removeFromDOM.call(this);
  786. turnMethods._makeRange.call(this);
  787. turnMethods._updateShadow.call(this);
  788. this.trigger('turned', [page, newView]);
  789. this.turn('update');
  790. if (data.opts.autoCenter)
  791. this.turn('center');
  792. },
  793. // Turns the page
  794. _turnPage: function(page) {
  795. var current,
  796. next,
  797. data = this.data(),
  798. place = data.pagePlace[page],
  799. view = this.turn('view'),
  800. newView = this.turn('view', page);
  801. if (data.page!=page) {
  802. var currentPage = data.page;
  803. if (trigger('turning', this, [page, newView])=='prevented') {
  804. if (currentPage==data.page && $.inArray(place, data.pageMv)!=-1)
  805. data.pages[place].flip('hideFoldedPage', true);
  806. return;
  807. }
  808. if ($.inArray(1, newView)!=-1)
  809. this.trigger('first');
  810. if ($.inArray(data.totalPages, newView)!=-1)
  811. this.trigger('last');
  812. }
  813. if (data.display=='single') {
  814. current = view[0];
  815. next = newView[0];
  816. } else if (view[1] && page>view[1]) {
  817. current = view[1];
  818. next = newView[0];
  819. } else if (view[0] && page<view[0]) {
  820. current = view[0];
  821. next = newView[1];
  822. }
  823. var optsCorners = data.opts.turnCorners.split(','),
  824. flipData = data.pages[current].data().f,
  825. opts = flipData.opts,
  826. actualPoint = flipData.point;
  827. turnMethods._missing.call(this, page);
  828. if (!data.pageObjs[page])
  829. return;
  830. this.turn('stop');
  831. data.page = page;
  832. turnMethods._makeRange.call(this);
  833. data.tpage = next;
  834. if (opts.next!=next) {
  835. opts.next = next;
  836. opts.force = true;
  837. }
  838. this.turn('update');
  839. flipData.point = actualPoint;
  840. if (flipData.effect=='hard')
  841. if (data.direction=='ltr')
  842. data.pages[current].flip('turnPage',
  843. (page>current) ? 'r' : 'l');
  844. else
  845. data.pages[current].flip('turnPage',
  846. (page>current) ? 'l' : 'r');
  847. else {
  848. if (data.direction=='ltr')
  849. data.pages[current].flip('turnPage',
  850. optsCorners[(page>current) ? 1 : 0]);
  851. else
  852. data.pages[current].flip('turnPage',
  853. optsCorners[(page>current) ? 0 : 1]);
  854. }
  855. },
  856. // Gets and sets a page
  857. page: function(page) {
  858. var data = this.data();
  859. if (page===undefined) {
  860. return data.page;
  861. } else {
  862. if (!data.disabled && !data.destroying) {
  863. page = parseInt(page, 10);
  864. if (page>0 && page<=data.totalPages) {
  865. if (page!=data.page) {
  866. if (!data.done || $.inArray(page, this.turn('view'))!=-1)
  867. turnMethods._fitPage.call(this, page);
  868. else
  869. turnMethods._turnPage.call(this, page);
  870. }
  871. return this;
  872. } else {
  873. throw turnError('The page ' + page + ' does not exist');
  874. }
  875. }
  876. }
  877. },
  878. // Turns to the next view
  879. next: function() {
  880. return this.turn('page', Math.min(this.data().totalPages,
  881. turnMethods._view.call(this, this.data().page).pop() + 1));
  882. },
  883. // Turns to the previous view
  884. previous: function() {
  885. return this.turn('page', Math.max(1,
  886. turnMethods._view.call(this, this.data().page).shift() - 1));
  887. },
  888. // Shows a peeling corner
  889. peel: function(corner, animate) {
  890. var data = this.data(),
  891. view = this.turn('view');
  892. animate = (animate===undefined) ? true : animate===true;
  893. if (corner===false) {
  894. this.turn('stop', null, animate);
  895. } else {
  896. if (data.display=='single') {
  897. data.pages[data.page].flip('peel', corner, animate);
  898. } else {
  899. var page;
  900. if (data.direction=='ltr') {
  901. page = (corner.indexOf('l')!=-1) ? view[0] : view[1];
  902. } else {
  903. page = (corner.indexOf('l')!=-1) ? view[1] : view[0];
  904. }
  905. if (data.pages[page])
  906. data.pages[page].flip('peel', corner, animate);
  907. }
  908. }
  909. return this;
  910. },
  911. // Adds a motion to the internal list
  912. // This event is called in context of flip
  913. _addMotionPage: function() {
  914. var opts = $(this).data().f.opts,
  915. turn = opts.turn,
  916. dd = turn.data();
  917. turnMethods._addMv.call(turn, opts.page);
  918. },
  919. // This event is called in context of flip
  920. _eventStart: function(e, opts, corner) {
  921. var data = opts.turn.data(),
  922. actualZoom = data.pageZoom[opts.page];
  923. if (e.isDefaultPrevented()) {
  924. turnMethods._updateShadow.call(opts.turn);
  925. return;
  926. }
  927. if (actualZoom && actualZoom!=data.zoom) {
  928. opts.turn.trigger('zoomed',[
  929. opts.page,
  930. opts.turn.turn('view', opts.page),
  931. actualZoom,
  932. data.zoom]);
  933. data.pageZoom[opts.page] = data.zoom;
  934. }
  935. if (data.display=='single' && corner) {
  936. if ((corner.charAt(1)=='l' && data.direction=='ltr') ||
  937. (corner.charAt(1)=='r' && data.direction=='rtl'))
  938. {
  939. opts.next = (opts.next<opts.page) ? opts.next : opts.page-1;
  940. opts.force = true;
  941. } else {
  942. opts.next = (opts.next>opts.page) ? opts.next : opts.page+1;
  943. }
  944. }
  945. turnMethods._addMotionPage.call(e.target);
  946. turnMethods._updateShadow.call(opts.turn);
  947. },
  948. // This event is called in context of flip
  949. _eventEnd: function(e, opts, turned) {
  950. var that = $(e.target),
  951. data = that.data().f,
  952. turn = opts.turn,
  953. dd = turn.data();
  954. if (turned) {
  955. var tpage = dd.tpage || dd.page;
  956. if (tpage==opts.next || tpage==opts.page) {
  957. delete dd.tpage;
  958. turnMethods._fitPage.call(turn, tpage || opts.next, true);
  959. }
  960. } else {
  961. turnMethods._removeMv.call(turn, opts.page);
  962. turnMethods._updateShadow.call(turn);
  963. turn.turn('update');
  964. }
  965. },
  966. // This event is called in context of flip
  967. _eventPressed: function(e) {
  968. var page,
  969. data = $(e.target).data().f,
  970. turn = data.opts.turn,
  971. turnData = turn.data(),
  972. pages = turnData.pages;
  973. turnData.mouseAction = true;
  974. turn.turn('update');
  975. return data.time = new Date().getTime();
  976. },
  977. // This event is called in context of flip
  978. _eventReleased: function(e, point) {
  979. var outArea,
  980. page = $(e.target),
  981. data = page.data().f,
  982. turn = data.opts.turn,
  983. turnData = turn.data();
  984. if (turnData.display=='single') {
  985. outArea = (point.corner=='br' || point.corner=='tr') ?
  986. point.x<page.width()/2:
  987. point.x>page.width()/2;
  988. } else {
  989. outArea = point.x<0 || point.x>page.width();
  990. }
  991. if ((new Date()).getTime()-data.time<200 || outArea) {
  992. e.preventDefault();
  993. turnMethods._turnPage.call(turn, data.opts.next);
  994. }
  995. turnData.mouseAction = false;
  996. },
  997. // This event is called in context of flip
  998. _flip: function(e) {
  999. e.stopPropagation();
  1000. var opts = $(e.target).data().f.opts;
  1001. opts.turn.trigger('turn', [opts.next]);
  1002. if (opts.turn.data().opts.autoCenter) {
  1003. opts.turn.turn('center', opts.next);
  1004. }
  1005. },
  1006. //
  1007. _touchStart: function() {
  1008. var data = this.data();
  1009. for (var page in data.pages) {
  1010. if (has(page, data.pages) &&
  1011. flipMethods._eventStart.apply(data.pages[page], arguments)===false) {
  1012. return false;
  1013. }
  1014. }
  1015. },
  1016. //
  1017. _touchMove: function() {
  1018. var data = this.data();
  1019. for (var page in data.pages) {
  1020. if (has(page, data.pages)) {
  1021. flipMethods._eventMove.apply(data.pages[page], arguments);
  1022. }
  1023. }
  1024. },
  1025. //
  1026. _touchEnd: function() {
  1027. var data = this.data();
  1028. for (var page in data.pages) {
  1029. if (has(page, data.pages)) {
  1030. flipMethods._eventEnd.apply(data.pages[page], arguments);
  1031. }
  1032. }
  1033. },
  1034. // Calculate the z-index value for pages during the animation
  1035. calculateZ: function(mv) {
  1036. var i, page, nextPage, placePage, dpage,
  1037. that = this,
  1038. data = this.data(),
  1039. view = this.turn('view'),
  1040. currentPage = view[0] || view[1],
  1041. total = mv.length-1,
  1042. r = {pageZ: {}, partZ: {}, pageV: {}},
  1043. addView = function(page) {
  1044. var view = that.turn('view', page);
  1045. if (view[0]) r.pageV[view[0]] = true;
  1046. if (view[1]) r.pageV[view[1]] = true;
  1047. };
  1048. for (i = 0; i<=total; i++) {
  1049. page = mv[i];
  1050. nextPage = data.pages[page].data().f.opts.next;
  1051. placePage = data.pagePlace[page];
  1052. addView(page);
  1053. addView(nextPage);
  1054. dpage = (data.pagePlace[nextPage]==nextPage) ? nextPage : page;
  1055. r.pageZ[dpage] = data.totalPages - Math.abs(currentPage-dpage);
  1056. r.partZ[placePage] = data.totalPages*2 - total + i;
  1057. }
  1058. return r;
  1059. },
  1060. // Updates the z-index and display property of every page
  1061. update: function() {
  1062. var page,
  1063. data = this.data();
  1064. if (this.turn('animating') && data.pageMv[0]!==0) {
  1065. // Update motion
  1066. var p, apage, fixed,
  1067. pos = this.turn('calculateZ', data.pageMv),
  1068. corner = this.turn('corner'),
  1069. actualView = this.turn('view'),
  1070. newView = this.turn('view', data.tpage);
  1071. for (page in data.pageWrap) {
  1072. if (!has(page, data.pageWrap))
  1073. continue;
  1074. fixed = data.pageObjs[page].hasClass('fixed');
  1075. data.pageWrap[page].css({
  1076. display: (pos.pageV[page] || fixed) ? '' : 'none',
  1077. zIndex:
  1078. (data.pageObjs[page].hasClass('hard') ?
  1079. pos.partZ[page]
  1080. :
  1081. pos.pageZ[page]
  1082. ) || (fixed ? -1 : 0)
  1083. });
  1084. if ((p = data.pages[page])) {
  1085. p.flip('z', pos.partZ[page] || null);
  1086. if (pos.pageV[page])
  1087. p.flip('resize');
  1088. if (data.tpage) { // Is it turning the page to `tpage`?
  1089. p.flip('hover', false).
  1090. flip('disable',
  1091. $.inArray(parseInt(page, 10), data.pageMv)==-1 &&
  1092. page!=newView[0] &&
  1093. page!=newView[1]);
  1094. } else {
  1095. p.flip('hover', corner===false).
  1096. flip('disable', page!=actualView[0] && page!=actualView[1]);
  1097. }
  1098. }
  1099. }
  1100. } else {
  1101. // Update static pages
  1102. for (page in data.pageWrap) {
  1103. if (!has(page, data.pageWrap))
  1104. continue;
  1105. var pageLocation = turnMethods._setPageLoc.call(this, page);
  1106. if (data.pages[page]) {
  1107. data.pages[page].
  1108. flip('disable', data.disabled || pageLocation!=1).
  1109. flip('hover', true).
  1110. flip('z', null);
  1111. }
  1112. }
  1113. }
  1114. return this;
  1115. },
  1116. // Updates the position and size of the flipbook's shadow
  1117. _updateShadow: function() {
  1118. var view, view2, shadow,
  1119. data = this.data(),
  1120. width = this.width(),
  1121. height = this.height(),
  1122. pageWidth = (data.display=='single') ? width : width/2;
  1123. view = this.turn('view');
  1124. if (!data.shadow) {
  1125. data.shadow = $('<div />', {
  1126. 'class': 'shadow',
  1127. 'css': divAtt(0, 0, 0).css
  1128. }).
  1129. appendTo(this);
  1130. }
  1131. for (var i = 0; i<data.pageMv.length; i++) {
  1132. if (!view[0] || !view[1])
  1133. break;
  1134. view = this.turn('view', data.pages[data.pageMv[i]].data().f.opts.next);
  1135. view2 = this.turn('view', data.pageMv[i]);
  1136. view[0] = view[0] && view2[0];
  1137. view[1] = view[1] && view2[1];
  1138. }
  1139. if (!view[0]) shadow = (data.direction=='ltr') ? 1 : 2;
  1140. else if (!view[1]) shadow = (data.direction=='ltr') ? 2 : 1;
  1141. else shadow = 3;
  1142. switch (shadow) {
  1143. case 1:
  1144. data.shadow.css({
  1145. width: pageWidth,
  1146. height: height,
  1147. top: 0,
  1148. left: pageWidth
  1149. });
  1150. break;
  1151. case 2:
  1152. data.shadow.css({
  1153. width: pageWidth,
  1154. height: height,
  1155. top: 0,
  1156. left: 0
  1157. });
  1158. break;
  1159. case 3:
  1160. data.shadow.css({
  1161. width: width,
  1162. height: height,
  1163. top: 0,
  1164. left: 0
  1165. });
  1166. break;
  1167. }
  1168. },
  1169. // Sets the z-index and display property of a page
  1170. // It depends on the current view
  1171. _setPageLoc: function(page) {
  1172. var data = this.data(),
  1173. view = this.turn('view'),
  1174. loc = 0;
  1175. if (page==view[0] || page==view[1])
  1176. loc = 1;
  1177. else if (
  1178. (data.display=='single' && page==view[0]+1) ||
  1179. (data.display=='double' && page==view[0]-2 || page==view[1]+2)
  1180. )
  1181. loc = 2;
  1182. if (!this.turn('animating'))
  1183. switch (loc) {
  1184. case 1:
  1185. data.pageWrap[page].css(
  1186. {
  1187. zIndex: data.totalPages,
  1188. display: ''
  1189. });
  1190. break;
  1191. case 2:
  1192. data.pageWrap[page].css(
  1193. {
  1194. zIndex: data.totalPages-1,
  1195. display: ''
  1196. });
  1197. break;
  1198. case 0:
  1199. data.pageWrap[page].css(
  1200. {
  1201. zIndex: 0,
  1202. display: (data.pageObjs[page].hasClass('fixed')) ? '' : 'none'}
  1203. );
  1204. break;
  1205. }
  1206. return loc;
  1207. },
  1208. // Gets and sets the options
  1209. options: function(options) {
  1210. if (options===undefined) {
  1211. return this.data().opts;
  1212. } else {
  1213. var data = this.data();
  1214. // Set new values
  1215. $.extend(data.opts, options);
  1216. // Set pages
  1217. if (options.pages)
  1218. this.turn('pages', options.pages);
  1219. // Set page
  1220. if (options.page)
  1221. this.turn('page', options.page);
  1222. // Set display
  1223. if (options.display)
  1224. this.turn('display', options.display);
  1225. // Set direction
  1226. if (options.direction)
  1227. this.turn('direction', options.direction);
  1228. // Set size
  1229. if (options.width && options.height)
  1230. this.turn('size', options.width, options.height);
  1231. // Add event listeners
  1232. if (options.when)
  1233. for (var eventName in options.when)
  1234. if (has(eventName, options.when)) {
  1235. this.unbind(eventName).
  1236. bind(eventName, options.when[eventName]);
  1237. }
  1238. return this;
  1239. }
  1240. },
  1241. // Gets the current version
  1242. version: function() {
  1243. return version;
  1244. }
  1245. },
  1246. // Methods and properties for the flip page effect
  1247. flipMethods = {
  1248. // Constructor
  1249. init: function(opts) {
  1250. this.data({f: {
  1251. disabled: false,
  1252. hover: false,
  1253. effect: (this.hasClass('hard')) ? 'hard' : 'sheet'
  1254. }});
  1255. this.flip('options', opts);
  1256. flipMethods._addPageWrapper.call(this);
  1257. return this;
  1258. },
  1259. setData: function(d) {
  1260. var data = this.data();
  1261. data.f = $.extend(data.f, d);
  1262. return this;
  1263. },
  1264. options: function(opts) {
  1265. var data = this.data().f;
  1266. if (opts) {
  1267. flipMethods.setData.call(this,
  1268. {opts: $.extend({}, data.opts || flipOptions, opts)});
  1269. return this;
  1270. } else
  1271. return data.opts;
  1272. },
  1273. z: function(z) {
  1274. var data = this.data().f;
  1275. data.opts['z-index'] = z;
  1276. if (data.fwrapper)
  1277. data.fwrapper.css({
  1278. zIndex: z || parseInt(data.parent.css('z-index'), 10) || 0
  1279. });
  1280. return this;
  1281. },
  1282. _cAllowed: function() {
  1283. var data = this.data().f,
  1284. page = data.opts.page,
  1285. turnData = data.opts.turn.data(),
  1286. odd = page%2;
  1287. if (data.effect=='hard') {
  1288. return (turnData.direction=='ltr') ?
  1289. [(odd) ? 'r' : 'l'] :
  1290. [(odd) ? 'l' : 'r'];
  1291. } else {
  1292. if (turnData.display=='single') {
  1293. if (page==1)
  1294. return (turnData.direction=='ltr') ?
  1295. corners['forward'] : corners['backward'];
  1296. else if (page==turnData.totalPages)
  1297. return (turnData.direction=='ltr') ?
  1298. corners['backward'] : corners['forward'];
  1299. else
  1300. return corners['all'];
  1301. } else {
  1302. return (turnData.direction=='ltr') ?
  1303. corners[(odd) ? 'forward' : 'backward']
  1304. :
  1305. corners[(odd) ? 'backward' : 'forward'];
  1306. }
  1307. }
  1308. },
  1309. _cornerActivated: function(p) {
  1310. var data = this.data().f,
  1311. width = this.width(),
  1312. height = this.height(),
  1313. point = {x: p.x, y: p.y, corner: ''},
  1314. csz = data.opts.cornerSize;
  1315. if (point.x<=0 || point.y<=0 || point.x>=width || point.y>=height)
  1316. return false;
  1317. var allowedCorners = flipMethods._cAllowed.call(this);
  1318. switch (data.effect) {
  1319. case 'hard':
  1320. if (point.x>width-csz)
  1321. point.corner = 'r';
  1322. else if (point.x<csz)
  1323. point.corner = 'l';
  1324. else
  1325. return false;
  1326. break;
  1327. case 'sheet':
  1328. if (point.y<csz)
  1329. point.corner+= 't';
  1330. else if (point.y>=height-csz)
  1331. point.corner+= 'b';
  1332. else
  1333. return false;
  1334. if (point.x<=csz)
  1335. point.corner+= 'l';
  1336. else if (point.x>=width-csz)
  1337. point.corner+= 'r';
  1338. else
  1339. return false;
  1340. break;
  1341. }
  1342. return (!point.corner || $.inArray(point.corner, allowedCorners)==-1) ?
  1343. false : point;
  1344. },
  1345. _isIArea: function(e) {
  1346. var pos = this.data().f.parent.offset();
  1347. e = (isTouch && e.originalEvent) ? e.originalEvent.touches[0] : e;
  1348. return flipMethods._cornerActivated.call(this,
  1349. {
  1350. x: e.pageX-pos.left,
  1351. y: e.pageY-pos.top
  1352. });
  1353. },
  1354. _c: function(corner, opts) {
  1355. opts = opts || 0;
  1356. switch (corner) {
  1357. case 'tl':
  1358. return point2D(opts, opts);
  1359. case 'tr':
  1360. return point2D(this.width()-opts, opts);
  1361. case 'bl':
  1362. return point2D(opts, this.height()-opts);
  1363. case 'br':
  1364. return point2D(this.width()-opts, this.height()-opts);
  1365. case 'l':
  1366. return point2D(opts, 0);
  1367. case 'r':
  1368. return point2D(this.width()-opts, 0);
  1369. }
  1370. },
  1371. _c2: function(corner) {
  1372. switch (corner) {
  1373. case 'tl':
  1374. return point2D(this.width()*2, 0);
  1375. case 'tr':
  1376. return point2D(-this.width(), 0);
  1377. case 'bl':
  1378. return point2D(this.width()*2, this.height());
  1379. case 'br':
  1380. return point2D(-this.width(), this.height());
  1381. case 'l':
  1382. return point2D(this.width()*2, 0);
  1383. case 'r':
  1384. return point2D(-this.width(), 0);
  1385. }
  1386. },
  1387. _foldingPage: function() {
  1388. var data = this.data().f;
  1389. if (!data)
  1390. return;
  1391. var opts = data.opts;
  1392. if (opts.turn) {
  1393. data = opts.turn.data();
  1394. if (data.display == 'single')
  1395. return (opts.next>1 || opts.page>1) ? data.pageObjs[0] : null;
  1396. else
  1397. return data.pageObjs[opts.next];
  1398. }
  1399. },
  1400. _backGradient: function() {
  1401. var data = this.data().f,
  1402. turnData = data.opts.turn.data(),
  1403. gradient = turnData.opts.gradients && (turnData.display=='single' ||
  1404. (data.opts.page!=2 && data.opts.page!=turnData.totalPages-1));
  1405. if (gradient && !data.bshadow)
  1406. data.bshadow = $('<div/>', divAtt(0, 0, 1)).
  1407. css({'position': '', width: this.width(), height: this.height()}).
  1408. appendTo(data.parent);
  1409. return gradient;
  1410. },
  1411. type: function () {
  1412. return this.data().f.effect;
  1413. },
  1414. resize: function(full) {
  1415. var data = this.data().f,
  1416. turnData = data.opts.turn.data(),
  1417. width = this.width(),
  1418. height = this.height();
  1419. switch (data.effect) {
  1420. case 'hard':
  1421. if (full) {
  1422. data.wrapper.css({width: width, height: height});
  1423. data.fpage.css({width: width, height: height});
  1424. if (turnData.opts.gradients) {
  1425. data.ashadow.css({width: width, height: height});
  1426. data.bshadow.css({width: width, height: height});
  1427. }
  1428. }
  1429. break;
  1430. case 'sheet':
  1431. if (full) {
  1432. var size = Math.round(Math.sqrt(Math.pow(width, 2)+Math.pow(height, 2)));
  1433. data.wrapper.css({width: size, height: size});
  1434. data.fwrapper.css({width: size, height: size}).
  1435. children(':first-child').
  1436. css({width: width, height: height});
  1437. data.fpage.css({width: width, height: height});
  1438. if (turnData.opts.gradients)
  1439. data.ashadow.css({width: width, height: height});
  1440. if (flipMethods._backGradient.call(this))
  1441. data.bshadow.css({width: width, height: height});
  1442. }
  1443. if (data.parent.is(':visible')) {
  1444. var offset = findPos(data.parent[0]);
  1445. data.fwrapper.css({top: offset.top,
  1446. left: offset.left});
  1447. //if (data.opts.turn) {
  1448. offset = findPos(data.opts.turn[0]);
  1449. data.fparent.css({top: -offset.top, left: -offset.left});
  1450. //}
  1451. }
  1452. this.flip('z', data.opts['z-index']);
  1453. break;
  1454. }
  1455. },
  1456. // Prepares the page by adding a general wrapper and another objects
  1457. _addPageWrapper: function() {
  1458. var att,
  1459. data = this.data().f,
  1460. turnData = data.opts.turn.data(),
  1461. parent = this.parent();
  1462. data.parent = parent;
  1463. if (!data.wrapper)
  1464. switch (data.effect) {
  1465. case 'hard':
  1466. var cssProperties = {};
  1467. cssProperties[vendor + 'transform-style'] = 'preserve-3d';
  1468. cssProperties[vendor + 'backface-visibility'] = 'hidden';
  1469. data.wrapper = $('<div/>', divAtt(0, 0, 2)).
  1470. css(cssProperties).
  1471. appendTo(parent).
  1472. prepend(this);
  1473. data.fpage = $('<div/>', divAtt(0, 0, 1)).
  1474. css(cssProperties).
  1475. appendTo(parent);
  1476. if (turnData.opts.gradients) {
  1477. data.ashadow = $('<div/>', divAtt(0, 0, 0)).
  1478. hide().
  1479. appendTo(parent);
  1480. data.bshadow = $('<div/>', divAtt(0, 0, 0));
  1481. }
  1482. break;
  1483. case 'sheet':
  1484. var width = this.width(),
  1485. height = this.height(),
  1486. size = Math.round(Math.sqrt(Math.pow(width, 2)+Math.pow(height, 2)));
  1487. data.fparent = data.opts.turn.data().fparent;
  1488. if (!data.fparent) {
  1489. var fparent = $('<div/>', {css: {'pointer-events': 'none'}}).hide();
  1490. fparent.data().flips = 0;
  1491. fparent.css(divAtt(0, 0, 'auto', 'visible').css).
  1492. appendTo(data.opts.turn);
  1493. data.opts.turn.data().fparent = fparent;
  1494. data.fparent = fparent;
  1495. }
  1496. this.css({position: 'absolute', top: 0, left: 0, bottom: 'auto', right: 'auto'});
  1497. data.wrapper = $('<div/>', divAtt(0, 0, this.css('z-index'))).
  1498. appendTo(parent).
  1499. prepend(this);
  1500. data.fwrapper = $('<div/>', divAtt(parent.offset().top, parent.offset().left)).
  1501. hide().
  1502. appendTo(data.fparent);
  1503. data.fpage = $('<div/>', divAtt(0, 0, 0, 'visible')).
  1504. css({cursor: 'default'}).
  1505. appendTo(data.fwrapper);
  1506. if (turnData.opts.gradients)
  1507. data.ashadow = $('<div/>', divAtt(0, 0, 1)).
  1508. appendTo(data.fpage);
  1509. flipMethods.setData.call(this, data);
  1510. break;
  1511. }
  1512. // Set size
  1513. flipMethods.resize.call(this, true);
  1514. },
  1515. // Takes a 2P point from the screen and applies the transformation
  1516. _fold: function(point) {
  1517. var data = this.data().f,
  1518. turnData = data.opts.turn.data(),
  1519. o = flipMethods._c.call(this, point.corner),
  1520. width = this.width(),
  1521. height = this.height();
  1522. switch (data.effect) {
  1523. case 'hard':
  1524. if (point.corner=='l')
  1525. point.x = Math.min(Math.max(point.x, 0), width*2);
  1526. else
  1527. point.x = Math.max(Math.min(point.x, width), -width);
  1528. var leftPos,
  1529. shadow,
  1530. gradientX,
  1531. fpageOrigin,
  1532. parentOrigin,
  1533. totalPages = turnData.totalPages,
  1534. zIndex = data.opts['z-index'] || totalPages,
  1535. parentCss = {'overflow': 'visible'},
  1536. relX = (o.x) ? (o.x - point.x)/width : point.x/width,
  1537. angle = relX * 90,
  1538. half = angle<90;
  1539. switch (point.corner) {
  1540. case 'l':
  1541. fpageOrigin = '0% 50%';
  1542. parentOrigin = '100% 50%';
  1543. if (half) {
  1544. leftPos = 0;
  1545. shadow = data.opts.next-1>0;
  1546. gradientX = 1;
  1547. } else {
  1548. leftPos = '100%';
  1549. shadow = data.opts.page+1<totalPages;
  1550. gradientX = 0;
  1551. }
  1552. break;
  1553. case 'r':
  1554. fpageOrigin = '100% 50%';
  1555. parentOrigin = '0% 50%';
  1556. angle = -angle;
  1557. width = -width;
  1558. if (half) {
  1559. leftPos = 0;
  1560. shadow = data.opts.next+1<totalPages;
  1561. gradientX = 0;
  1562. } else {
  1563. leftPos = '-100%';
  1564. shadow = data.opts.page!=1;
  1565. gradientX = 1;
  1566. }
  1567. break;
  1568. }
  1569. parentCss[vendor+'perspective-origin'] = parentOrigin;
  1570. data.wrapper.transform('rotateY('+angle+'deg)' +
  1571. 'translate3d(0px, 0px, '+(this.attr('depth')||0)+'px)', parentOrigin);
  1572. data.fpage.transform('translateX('+width+'px) rotateY('+(180+angle)+'deg)', fpageOrigin);
  1573. data.parent.css(parentCss);
  1574. if (half) {
  1575. relX = -relX+1;
  1576. data.wrapper.css({zIndex: zIndex+1});
  1577. data.fpage.css({zIndex: zIndex});
  1578. } else {
  1579. relX = relX-1;
  1580. data.wrapper.css({zIndex: zIndex});
  1581. data.fpage.css({zIndex: zIndex+1});
  1582. }
  1583. if (turnData.opts.gradients) {
  1584. if (shadow)
  1585. data.ashadow.css({
  1586. display: '',
  1587. left: leftPos,
  1588. backgroundColor: 'rgba(0,0,0,'+(0.5*relX)+')'
  1589. }).
  1590. transform('rotateY(0deg)');
  1591. else
  1592. data.ashadow.hide();
  1593. data.bshadow.css({opacity:-relX + 1});
  1594. if (half) {
  1595. if (data.bshadow.parent()[0]!=data.wrapper[0]) {
  1596. data.bshadow.appendTo(data.wrapper);
  1597. }
  1598. } else {
  1599. if (data.bshadow.parent()[0]!=data.fpage[0]) {
  1600. data.bshadow.appendTo(data.fpage);
  1601. }
  1602. }
  1603. /*data.bshadow.css({
  1604. backgroundColor: 'rgba(0,0,0,'+(0.1)+')'
  1605. })*/
  1606. gradient(data.bshadow, point2D(gradientX * 100, 0), point2D((-gradientX + 1)*100, 0),
  1607. [[0, 'rgba(0,0,0,0.3)'],[1, 'rgba(0,0,0,0)']],2);
  1608. }
  1609. break;
  1610. case 'sheet':
  1611. var that = this,
  1612. a = 0,
  1613. alpha = 0,
  1614. beta,
  1615. px,
  1616. gradientEndPointA,
  1617. gradientEndPointB,
  1618. gradientStartVal,
  1619. gradientSize,
  1620. gradientOpacity,
  1621. shadowVal,
  1622. mv = point2D(0, 0),
  1623. df = point2D(0, 0),
  1624. tr = point2D(0, 0),
  1625. folding = flipMethods._foldingPage.call(this),
  1626. tan = Math.tan(alpha),
  1627. ac = turnData.opts.acceleration,
  1628. h = data.wrapper.height(),
  1629. top = point.corner.substr(0, 1) == 't',
  1630. left = point.corner.substr(1, 1) == 'l',
  1631. compute = function() {
  1632. var rel = point2D(0, 0);
  1633. var middle = point2D(0, 0);
  1634. rel.x = (o.x) ? o.x - point.x : point.x;
  1635. if (!hasRot) {
  1636. rel.y = 0;
  1637. } else {
  1638. rel.y = (o.y) ? o.y - point.y : point.y;
  1639. }
  1640. middle.x = (left)? width - rel.x/2 : point.x + rel.x/2;
  1641. middle.y = rel.y/2;
  1642. var alpha = A90-Math.atan2(rel.y, rel.x),
  1643. gamma = alpha - Math.atan2(middle.y, middle.x),
  1644. distance = Math.max(0, Math.sin(gamma) * Math.sqrt(Math.pow(middle.x, 2) + Math.pow(middle.y, 2)));
  1645. a = deg(alpha);
  1646. tr = point2D(distance * Math.sin(alpha), distance * Math.cos(alpha));
  1647. if (alpha > A90) {
  1648. tr.x = tr.x + Math.abs(tr.y * rel.y/rel.x);
  1649. tr.y = 0;
  1650. if (Math.round(tr.x*Math.tan(PI-alpha)) < height) {
  1651. point.y = Math.sqrt(Math.pow(height, 2)+2 * middle.x * rel.x);
  1652. if (top) point.y = height - point.y;
  1653. return compute();
  1654. }
  1655. }
  1656. if (alpha>A90) {
  1657. var beta = PI-alpha, dd = h - height/Math.sin(beta);
  1658. mv = point2D(Math.round(dd*Math.cos(beta)), Math.round(dd*Math.sin(beta)));
  1659. if (left) mv.x = - mv.x;
  1660. if (top) mv.y = - mv.y;
  1661. }
  1662. px = Math.round(tr.y/Math.tan(alpha) + tr.x);
  1663. var side = width - px,
  1664. sideX = side*Math.cos(alpha*2),
  1665. sideY = side*Math.sin(alpha*2);
  1666. df = point2D(
  1667. Math.round((left ? side -sideX : px+sideX)),
  1668. Math.round((top) ? sideY : height - sideY));
  1669. // Gradients
  1670. if (turnData.opts.gradients) {
  1671. gradientSize = side*Math.sin(alpha);
  1672. var endingPoint = flipMethods._c2.call(that, point.corner),
  1673. far = Math.sqrt(Math.pow(endingPoint.x-point.x, 2)+Math.pow(endingPoint.y-point.y, 2))/width;
  1674. shadowVal = Math.sin(A90*((far>1) ? 2 - far : far));
  1675. gradientOpacity = Math.min(far, 1);
  1676. gradientStartVal = gradientSize>100 ? (gradientSize-100)/gradientSize : 0;
  1677. gradientEndPointA = point2D(
  1678. gradientSize*Math.sin(alpha)/width*100,
  1679. gradientSize*Math.cos(alpha)/height*100);
  1680. if (flipMethods._backGradient.call(that)) {
  1681. gradientEndPointB = point2D(
  1682. gradientSize*1.2*Math.sin(alpha)/width*100,
  1683. gradientSize*1.2*Math.cos(alpha)/height*100);
  1684. if (!left) gradientEndPointB.x = 100-gradientEndPointB.x;
  1685. if (!top) gradientEndPointB.y = 100-gradientEndPointB.y;
  1686. }
  1687. }
  1688. tr.x = Math.round(tr.x);
  1689. tr.y = Math.round(tr.y);
  1690. return true;
  1691. },
  1692. transform = function(tr, c, x, a) {
  1693. var f = ['0', 'auto'], mvW = (width-h)*x[0]/100, mvH = (height-h)*x[1]/100,
  1694. cssA = {left: f[c[0]], top: f[c[1]], right: f[c[2]], bottom: f[c[3]]},
  1695. cssB = {},
  1696. aliasingFk = (a!=90 && a!=-90) ? (left ? -1 : 1) : 0,
  1697. origin = x[0] + '% ' + x[1] + '%';
  1698. that.css(cssA).
  1699. transform(rotate(a) + translate(tr.x + aliasingFk, tr.y, ac), origin);
  1700. data.fpage.css(cssA).transform(
  1701. rotate(a) +
  1702. translate(tr.x + df.x - mv.x - width*x[0]/100, tr.y + df.y - mv.y - height*x[1]/100, ac) +
  1703. rotate((180/a - 2)*a),
  1704. origin);
  1705. data.wrapper.transform(translate(-tr.x + mvW-aliasingFk, -tr.y + mvH, ac) + rotate(-a), origin);
  1706. data.fwrapper.transform(translate(-tr.x + mv.x + mvW, -tr.y + mv.y + mvH, ac) + rotate(-a), origin);
  1707. if (turnData.opts.gradients) {
  1708. if (x[0])
  1709. gradientEndPointA.x = 100-gradientEndPointA.x;
  1710. if (x[1])
  1711. gradientEndPointA.y = (100-gradientEndPointA.y);
  1712. cssB['box-shadow'] = '0 0 20px rgba(0,0,0,'+(0.5*shadowVal)+')';
  1713. folding.css(cssB);
  1714. gradient(data.ashadow,
  1715. point2D(left?100:0, top?0:100),
  1716. point2D(gradientEndPointA.x, gradientEndPointA.y),
  1717. [[gradientStartVal, 'rgba(0,0,0,0)'],
  1718. [((1-gradientStartVal)*0.8)+gradientStartVal, 'rgba(0,0,0,'+(0.2*gradientOpacity)+')'],
  1719. [1, 'rgba(255,255,255,'+(0.2*gradientOpacity)+')']],
  1720. 3,
  1721. alpha);
  1722. if (flipMethods._backGradient.call(that))
  1723. gradient(data.bshadow,
  1724. point2D(left?0:100, top?0:100),
  1725. point2D(gradientEndPointB.x, gradientEndPointB.y),
  1726. [[0.6, 'rgba(0,0,0,0)'],
  1727. [0.8, 'rgba(0,0,0,'+(0.3*gradientOpacity)+')'],
  1728. [1, 'rgba(0,0,0,0)']
  1729. ],
  1730. 3);
  1731. }
  1732. };
  1733. switch (point.corner) {
  1734. case 'l' :
  1735. break;
  1736. case 'r' :
  1737. break;
  1738. case 'tl' :
  1739. point.x = Math.max(point.x, 1);
  1740. compute();
  1741. transform(tr, [1,0,0,1], [100, 0], a);
  1742. break;
  1743. case 'tr' :
  1744. point.x = Math.min(point.x, width-1);
  1745. compute();
  1746. transform(point2D(-tr.x, tr.y), [0,0,0,1], [0, 0], -a);
  1747. break;
  1748. case 'bl' :
  1749. point.x = Math.max(point.x, 1);
  1750. compute();
  1751. transform(point2D(tr.x, -tr.y), [1,1,0,0], [100, 100], -a);
  1752. break;
  1753. case 'br' :
  1754. point.x = Math.min(point.x, width-1);
  1755. compute();
  1756. transform(point2D(-tr.x, -tr.y), [0,1,1,0], [0, 100], a);
  1757. break;
  1758. }
  1759. break;
  1760. }
  1761. data.point = point;
  1762. },
  1763. _moveFoldingPage: function(move) {
  1764. var data = this.data().f;
  1765. if (!data)
  1766. return;
  1767. var turn = data.opts.turn,
  1768. turnData = turn.data(),
  1769. place = turnData.pagePlace;
  1770. if (move) {
  1771. var nextPage = data.opts.next;
  1772. if (place[nextPage]!=data.opts.page) {
  1773. if (data.folding)
  1774. flipMethods._moveFoldingPage.call(this, false);
  1775. var folding = flipMethods._foldingPage.call(this);
  1776. folding.appendTo(data.fpage);
  1777. place[nextPage] = data.opts.page;
  1778. data.folding = nextPage;
  1779. }
  1780. turn.turn('update');
  1781. } else {
  1782. if (data.folding) {
  1783. if (turnData.pages[data.folding]) {
  1784. // If we have flip available
  1785. var flipData = turnData.pages[data.folding].data().f;
  1786. turnData.pageObjs[data.folding].
  1787. appendTo(flipData.wrapper);
  1788. } else if (turnData.pageWrap[data.folding]) {
  1789. // If we have the pageWrapper
  1790. turnData.pageObjs[data.folding].
  1791. appendTo(turnData.pageWrap[data.folding]);
  1792. }
  1793. if (data.folding in place) {
  1794. place[data.folding] = data.folding;
  1795. }
  1796. delete data.folding;
  1797. }
  1798. }
  1799. },
  1800. _showFoldedPage: function(c, animate) {
  1801. var folding = flipMethods._foldingPage.call(this),
  1802. dd = this.data(),
  1803. data = dd.f,
  1804. visible = data.visible;
  1805. if (folding) {
  1806. if (!visible || !data.point || data.point.corner!=c.corner) {
  1807. var corner = (
  1808. data.status=='hover' ||
  1809. data.status=='peel' ||
  1810. data.opts.turn.data().mouseAction) ?
  1811. c.corner : null;
  1812. visible = false;
  1813. if (trigger('start', this, [data.opts, corner])=='prevented')
  1814. return false;
  1815. }
  1816. if (animate) {
  1817. var that = this,
  1818. point = (data.point && data.point.corner==c.corner) ?
  1819. data.point : flipMethods._c.call(this, c.corner, 1);
  1820. this.animatef({
  1821. from: [point.x, point.y],
  1822. to: [c.x, c.y],
  1823. duration: 500,
  1824. frame: function(v) {
  1825. c.x = Math.round(v[0]);
  1826. c.y = Math.round(v[1]);
  1827. flipMethods._fold.call(that, c);
  1828. }
  1829. });
  1830. } else {
  1831. flipMethods._fold.call(this, c);
  1832. if (dd.effect && !dd.effect.turning)
  1833. this.animatef(false);
  1834. }
  1835. if (!visible) {
  1836. switch(data.effect) {
  1837. case 'hard':
  1838. data.visible = true;
  1839. flipMethods._moveFoldingPage.call(this, true);
  1840. data.fpage.show();
  1841. if (data.opts.shadows)
  1842. data.bshadow.show();
  1843. break;
  1844. case 'sheet':
  1845. data.visible = true;
  1846. data.fparent.show().data().flips++;
  1847. flipMethods._moveFoldingPage.call(this, true);
  1848. data.fwrapper.show();
  1849. if (data.bshadow)
  1850. data.bshadow.show();
  1851. break;
  1852. }
  1853. }
  1854. return true;
  1855. }
  1856. return false;
  1857. },
  1858. hide: function() {
  1859. var data = this.data().f,
  1860. turnData = data.opts.turn.data(),
  1861. folding = flipMethods._foldingPage.call(this);
  1862. switch (data.effect) {
  1863. case 'hard':
  1864. if (turnData.opts.gradients) {
  1865. data.bshadowLoc = 0;
  1866. data.bshadow.remove();
  1867. data.ashadow.hide();
  1868. }
  1869. data.wrapper.transform('');
  1870. data.fpage.hide();
  1871. break;
  1872. case 'sheet':
  1873. if ((--data.fparent.data().flips)===0)
  1874. data.fparent.hide();
  1875. this.css({left: 0, top: 0, right: 'auto', bottom: 'auto'}).
  1876. transform('');
  1877. data.wrapper.transform('');
  1878. data.fwrapper.hide();
  1879. if (data.bshadow)
  1880. data.bshadow.hide();
  1881. folding.transform('');
  1882. break;
  1883. }
  1884. data.visible = false;
  1885. return this;
  1886. },
  1887. hideFoldedPage: function(animate) {
  1888. var data = this.data().f;
  1889. if (!data.point) return;
  1890. var that = this,
  1891. p1 = data.point,
  1892. hide = function() {
  1893. data.point = null;
  1894. data.status = '';
  1895. that.flip('hide');
  1896. that.trigger('end', [data.opts, false]);
  1897. };
  1898. if (animate) {
  1899. var p4 = flipMethods._c.call(this, p1.corner),
  1900. top = (p1.corner.substr(0,1)=='t'),
  1901. delta = (top) ? Math.min(0, p1.y-p4.y)/2 : Math.max(0, p1.y-p4.y)/2,
  1902. p2 = point2D(p1.x, p1.y+delta),
  1903. p3 = point2D(p4.x, p4.y-delta);
  1904. this.animatef({
  1905. from: 0,
  1906. to: 1,
  1907. frame: function(v) {
  1908. var np = bezier(p1, p2, p3, p4, v);
  1909. p1.x = np.x;
  1910. p1.y = np.y;
  1911. flipMethods._fold.call(that, p1);
  1912. },
  1913. complete: hide,
  1914. duration: 800,
  1915. hiding: true
  1916. });
  1917. } else {
  1918. this.animatef(false);
  1919. hide();
  1920. }
  1921. },
  1922. turnPage: function(corner) {
  1923. var that = this,
  1924. data = this.data().f,
  1925. turnData = data.opts.turn.data();
  1926. corner = {corner: (data.corner) ?
  1927. data.corner.corner :
  1928. corner || flipMethods._cAllowed.call(this)[0]};
  1929. var p1 = data.point ||
  1930. flipMethods._c.call(this,
  1931. corner.corner,
  1932. (data.opts.turn) ? turnData.opts.elevation : 0),
  1933. p4 = flipMethods._c2.call(this, corner.corner);
  1934. this.trigger('flip').
  1935. animatef({
  1936. from: 0,
  1937. to: 1,
  1938. frame: function(v) {
  1939. var np = bezier(p1, p1, p4, p4, v);
  1940. corner.x = np.x;
  1941. corner.y = np.y;
  1942. flipMethods._showFoldedPage.call(that, corner);
  1943. },
  1944. complete: function() {
  1945. that.trigger('end', [data.opts, true]);
  1946. },
  1947. duration: turnData.opts.duration,
  1948. turning: true
  1949. });
  1950. data.corner = null;
  1951. },
  1952. moving: function() {
  1953. return 'effect' in this.data();
  1954. },
  1955. isTurning: function() {
  1956. return this.flip('moving') && this.data().effect.turning;
  1957. },
  1958. corner: function() {
  1959. return this.data().f.corner;
  1960. },
  1961. _eventStart: function(e) {
  1962. var data = this.data().f,
  1963. turn = data.opts.turn;
  1964. if (!data.corner && !data.disabled && !this.flip('isTurning') &&
  1965. data.opts.page==turn.data().pagePlace[data.opts.page])
  1966. {
  1967. data.corner = flipMethods._isIArea.call(this, e);
  1968. if (data.corner && flipMethods._foldingPage.call(this)) {
  1969. this.trigger('pressed', [data.point]);
  1970. flipMethods._showFoldedPage.call(this, data.corner);
  1971. return false;
  1972. } else
  1973. data.corner = null;
  1974. }
  1975. },
  1976. _eventMove: function(e) {
  1977. var data = this.data().f;
  1978. if (!data.disabled) {
  1979. e = (isTouch) ? e.originalEvent.touches : [e];
  1980. if (data.corner) {
  1981. var pos = data.parent.offset();
  1982. data.corner.x = e[0].pageX-pos.left;
  1983. data.corner.y = e[0].pageY-pos.top;
  1984. flipMethods._showFoldedPage.call(this, data.corner);
  1985. } else if (data.hover && !this.data().effect && this.is(':visible')) {
  1986. var point = flipMethods._isIArea.call(this, e[0]);
  1987. if (point) {
  1988. if ((data.effect=='sheet' && point.corner.length==2) || data.effect=='hard') {
  1989. data.status = 'hover';
  1990. var origin = flipMethods._c.call(this, point.corner, data.opts.cornerSize/2);
  1991. point.x = origin.x;
  1992. point.y = origin.y;
  1993. flipMethods._showFoldedPage.call(this, point, true);
  1994. }
  1995. } else {
  1996. if (data.status=='hover') {
  1997. data.status = '';
  1998. flipMethods.hideFoldedPage.call(this, true);
  1999. }
  2000. }
  2001. }
  2002. }
  2003. },
  2004. _eventEnd: function() {
  2005. var data = this.data().f,
  2006. corner = data.corner;
  2007. if (!data.disabled && corner) {
  2008. if (trigger('released', this, [data.point || corner])!='prevented') {
  2009. flipMethods.hideFoldedPage.call(this, true);
  2010. }
  2011. }
  2012. data.corner = null;
  2013. },
  2014. disable: function(disable) {
  2015. flipMethods.setData.call(this, {'disabled': disable});
  2016. return this;
  2017. },
  2018. hover: function(hover) {
  2019. flipMethods.setData.call(this, {'hover': hover});
  2020. return this;
  2021. },
  2022. peel: function (corner, animate) {
  2023. var data = this.data().f;
  2024. if (corner) {
  2025. if ($.inArray(corner, corners.all)==-1)
  2026. throw turnError('Corner '+corner+' is not permitted');
  2027. if ($.inArray(corner, flipMethods._cAllowed.call(this))!=-1) {
  2028. var point = flipMethods._c.call(this, corner, data.opts.cornerSize/2);
  2029. data.status = 'peel';
  2030. flipMethods._showFoldedPage.call(this,
  2031. {
  2032. corner: corner,
  2033. x: point.x,
  2034. y: point.y
  2035. }, animate);
  2036. }
  2037. } else {
  2038. data.status = '';
  2039. flipMethods.hideFoldedPage.call(this, animate);
  2040. }
  2041. return this;
  2042. }
  2043. };
  2044. // Processes classes
  2045. function dec(that, methods, args) {
  2046. if (!args[0] || typeof(args[0])=='object')
  2047. return methods.init.apply(that, args);
  2048. else if (methods[args[0]])
  2049. return methods[args[0]].apply(that, Array.prototype.slice.call(args, 1));
  2050. else
  2051. throw turnError(args[0] + ' is not a method or property');
  2052. }
  2053. // Attributes for a layer
  2054. function divAtt(top, left, zIndex, overf) {
  2055. return {'css': {
  2056. position: 'absolute',
  2057. top: top,
  2058. left: left,
  2059. 'overflow': overf || 'hidden',
  2060. zIndex: zIndex || 'auto'
  2061. }
  2062. };
  2063. }
  2064. // Gets a 2D point from a bezier curve of four points
  2065. function bezier(p1, p2, p3, p4, t) {
  2066. var a = 1 - t,
  2067. b = a * a * a,
  2068. c = t * t * t;
  2069. return point2D(Math.round(b*p1.x + 3*t*a*a*p2.x + 3*t*t*a*p3.x + c*p4.x),
  2070. Math.round(b*p1.y + 3*t*a*a*p2.y + 3*t*t*a*p3.y + c*p4.y));
  2071. }
  2072. // Converts an angle from degrees to radians
  2073. function rad(degrees) {
  2074. return degrees/180*PI;
  2075. }
  2076. // Converts an angle from radians to degrees
  2077. function deg(radians) {
  2078. return radians/PI*180;
  2079. }
  2080. // Gets a 2D point
  2081. function point2D(x, y) {
  2082. return {x: x, y: y};
  2083. }
  2084. // Webkit 534.3 on Android wrongly repaints elements that use overflow:hidden + rotation
  2085. function rotationAvailable() {
  2086. var parts;
  2087. if ((parts = /AppleWebkit\/([0-9\.]+)/i.exec(navigator.userAgent))) {
  2088. var webkitVersion = parseFloat(parts[1]);
  2089. return (webkitVersion>534.3);
  2090. } else {
  2091. return true;
  2092. }
  2093. }
  2094. // Returns the traslate value
  2095. function translate(x, y, use3d) {
  2096. return (has3d && use3d) ? ' translate3d(' + x + 'px,' + y + 'px, 0px) '
  2097. : ' translate(' + x + 'px, ' + y + 'px) ';
  2098. }
  2099. // Returns the rotation value
  2100. function rotate(degrees) {
  2101. return ' rotate(' + degrees + 'deg) ';
  2102. }
  2103. // Checks if a property belongs to an object
  2104. function has(property, object) {
  2105. return Object.prototype.hasOwnProperty.call(object, property);
  2106. }
  2107. // Gets the CSS3 vendor prefix
  2108. function getPrefix() {
  2109. var vendorPrefixes = ['Moz','Webkit','Khtml','O','ms'],
  2110. len = vendorPrefixes.length,
  2111. vendor = '';
  2112. while (len--)
  2113. if ((vendorPrefixes[len] + 'Transform') in document.body.style)
  2114. vendor='-'+vendorPrefixes[len].toLowerCase()+'-';
  2115. return vendor;
  2116. }
  2117. // Detects the transitionEnd Event
  2118. function getTransitionEnd() {
  2119. var t,
  2120. el = document.createElement('fakeelement'),
  2121. transitions = {
  2122. 'transition':'transitionend',
  2123. 'OTransition':'oTransitionEnd',
  2124. 'MSTransition':'transitionend',
  2125. 'MozTransition':'transitionend',
  2126. 'WebkitTransition':'webkitTransitionEnd'
  2127. };
  2128. for (t in transitions) {
  2129. if (el.style[t] !== undefined) {
  2130. return transitions[t];
  2131. }
  2132. }
  2133. }
  2134. // Gradients
  2135. function gradient(obj, p0, p1, colors, numColors) {
  2136. var j, cols = [];
  2137. if (vendor=='-webkit-') {
  2138. for (j = 0; j<numColors; j++)
  2139. cols.push('color-stop('+colors[j][0]+', '+colors[j][1]+')');
  2140. obj.css({'background-image':
  2141. '-webkit-gradient(linear, '+
  2142. p0.x+'% '+
  2143. p0.y+'%,'+
  2144. p1.x+'% '+
  2145. p1.y+'%, '+
  2146. cols.join(',') + ' )'});
  2147. } else {
  2148. p0 = {x:p0.x/100 * obj.width(), y:p0.y/100 * obj.height()};
  2149. p1 = {x:p1.x/100 * obj.width(), y:p1.y/100 * obj.height()};
  2150. var dx = p1.x-p0.x,
  2151. dy = p1.y-p0.y,
  2152. angle = Math.atan2(dy, dx),
  2153. angle2 = angle - Math.PI/2,
  2154. diagonal = Math.abs(obj.width()*Math.sin(angle2))+Math.abs(obj.height()*Math.cos(angle2)),
  2155. gradientDiagonal = Math.sqrt(dy*dy + dx*dx),
  2156. corner = point2D((p1.x<p0.x) ? obj.width() : 0, (p1.y<p0.y) ? obj.height() : 0),
  2157. slope = Math.tan(angle),
  2158. inverse = -1/slope,
  2159. x = (inverse*corner.x - corner.y - slope*p0.x + p0.y)/(inverse-slope),
  2160. c = {x: x, y: inverse*x - inverse*corner.x + corner.y},
  2161. segA = (Math.sqrt( Math.pow(c.x-p0.x,2) + Math.pow(c.y-p0.y,2)));
  2162. for (j = 0; j<numColors; j++)
  2163. cols.push(' '+colors[j][1]+' '+((segA + gradientDiagonal*colors[j][0])*100/diagonal)+'%');
  2164. obj.css({'background-image': vendor+'linear-gradient(' + (-angle) + 'rad,' + cols.join(',') + ')'});
  2165. }
  2166. }
  2167. // Triggers an event
  2168. function trigger(eventName, context, args) {
  2169. var event = $.Event(eventName);
  2170. context.trigger(event, args);
  2171. if (event.isDefaultPrevented())
  2172. return 'prevented';
  2173. else if (event.isPropagationStopped())
  2174. return 'stopped';
  2175. else
  2176. return '';
  2177. }
  2178. // JS Errors
  2179. function turnError(message) {
  2180. function TurnJsError(message) {
  2181. this.name = "TurnJsError";
  2182. this.message = message;
  2183. }
  2184. TurnJsError.prototype = new Error();
  2185. TurnJsError.prototype.constructor = TurnJsError;
  2186. return new TurnJsError(message);
  2187. }
  2188. // Find the offset of an element ignoring its transformation
  2189. function findPos(obj) {
  2190. var offset = {top: 0, left: 0};
  2191. do{
  2192. offset.left += obj.offsetLeft;
  2193. offset.top += obj.offsetTop;
  2194. } while ((obj = obj.offsetParent));
  2195. return offset;
  2196. }
  2197. // Checks if there's hard page compatibility
  2198. // IE9 is the only browser that does not support hard pages
  2199. function hasHardPage() {
  2200. return (navigator.userAgent.indexOf('MSIE 9.0')==-1);
  2201. }
  2202. // Request an animation
  2203. window.requestAnim = (function() {
  2204. return window.requestAnimationFrame ||
  2205. window.webkitRequestAnimationFrame ||
  2206. window.mozRequestAnimationFrame ||
  2207. window.oRequestAnimationFrame ||
  2208. window.msRequestAnimationFrame ||
  2209. function(callback) {
  2210. window.setTimeout(callback, 1000 / 60);
  2211. };
  2212. })();
  2213. // Extend $.fn
  2214. $.extend($.fn, {
  2215. flip: function() {
  2216. return dec($(this[0]), flipMethods, arguments);
  2217. },
  2218. turn: function() {
  2219. return dec($(this[0]), turnMethods, arguments);
  2220. },
  2221. transform: function(transform, origin) {
  2222. var properties = {};
  2223. if (origin)
  2224. properties[vendor+'transform-origin'] = origin;
  2225. properties[vendor+'transform'] = transform;
  2226. return this.css(properties);
  2227. },
  2228. animatef: function(point) {
  2229. var data = this.data();
  2230. if (data.effect)
  2231. data.effect.stop();
  2232. if (point) {
  2233. if (!point.to.length) point.to = [point.to];
  2234. if (!point.from.length) point.from = [point.from];
  2235. var diff = [],
  2236. len = point.to.length,
  2237. animating = true,
  2238. that = this,
  2239. time = (new Date()).getTime(),
  2240. frame = function() {
  2241. if (!data.effect || !animating)
  2242. return;
  2243. var v = [],
  2244. timeDiff = Math.min(point.duration, (new Date()).getTime() - time);
  2245. for (var i = 0; i < len; i++)
  2246. v.push(data.effect.easing(1, timeDiff, point.from[i], diff[i], point.duration));
  2247. point.frame((len==1) ? v[0] : v);
  2248. if (timeDiff==point.duration) {
  2249. delete data['effect'];
  2250. that.data(data);
  2251. if (point.complete)
  2252. point.complete();
  2253. } else {
  2254. window.requestAnim(frame);
  2255. }
  2256. };
  2257. for (var i = 0; i < len; i++)
  2258. diff.push(point.to[i] - point.from[i]);
  2259. data.effect = $.extend({
  2260. stop: function() {
  2261. animating = false;
  2262. },
  2263. easing: function (x, t, b, c, data) {
  2264. return c * Math.sqrt(1 - (t=t/data-1)*t) + b;
  2265. }
  2266. }, point);
  2267. this.data(data);
  2268. frame();
  2269. } else {
  2270. delete data['effect'];
  2271. }
  2272. }
  2273. });
  2274. // Export some globals
  2275. $.isTouch = isTouch;
  2276. $.mouseEvents = mouseEvents;
  2277. $.cssPrefix = getPrefix;
  2278. $.cssTransitionEnd = getTransitionEnd;
  2279. $.findPos = findPos;
  2280. })(jQuery);