turn.js 73 KB

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