blasten / turn.js

The page flip effect for HTML5
www.turnjs.com
Other
7.21k stars 2.47k forks source link

pagesInDOM limitation & buttons hide issue #73

Closed warmth closed 12 years ago

warmth commented 12 years ago

Hi Emmanuel, as you already should know I did an integration of turn.js with Magic Zoom (first I tried jQZoom & Cloud Zoom but none of them gives me as much features as Magic Zoom & I really needed a activate/deactivate the zoom by clicking the page).

I make this intro because I found that all the three zoom scripts got disabled after the sixth page of the catalog. On my first attempts I replaced the zoom activation of jQZoom & Cloud Zoom when hovering with a click but the issue was still there after clicking the seventh page. I temporary solved this issue by enabling a live clicking on the jQuery code but after acquiring the Magic Zoom script their support found that the problem lied on the pagesInDOM number.

Increasing this number solved the zoom problem but introduced a new one. Normally my catalogs will have 12 pages, as you can see here: http://grosmercat.iritec.es/digitalizacion/visualizacionPDF.php?file_name=horeca_05_centro_04-_04-30-2012_22-16-44, but I don't wanna limit my system to work with 12 only but to work as an standard that dynamically auto-adjust its size. I use turnjs.com scripting to solve IE issue and to recreate the shadow & side-buttons features but modified it a bit to include another buttons trying to simulate what happens here: http://issuu.com/folleto_oferta_gm/docs/gm09_catalunyaislas?mode=window&pageNumber=1 here you have the modified code: http://grosmercat.iritec.es/digitalizacion/js/prueba.js (compare with yours using Notepad++ or Araxis Merge to easily see the changes)

For some reason after changing the pagesInDOM number to 40 to test, when the catalog has less that 12 and finish with an even page the shadow appears wrongly when the catalog moves to close: http://grosmercat.iritec.es/digitalizacion/visualizacionPDF.php?file_name=euroleafletes_05-02-2012_18-45-06#8 Is there any way to change this number dynamically to avoid this issue? Are my changes correct? I also have problems hiding the secondary buttons I made. I hope you can help me. Thanks in advance.

warmth commented 12 years ago

Solved the issue with $(this).data().totalPages but I still wanna know if there is any way to dynamically modify the pagesInDOM because if a catalog of more than 40 pages is submitted my zoom system won't support it.

devolved commented 12 years ago

I side stepped the issue by having a dynamicBind() function, which [re]sets the events each time the book is updated (page turned)

bit of a bodge certainly, but seems to work fine.

would probs start lagging out if you have too many handlers it

blasten commented 12 years ago

@warmth and @devolved a new option will automatically disable the cache. Your changes were right, but I saw that issue with v3, I believe an option like cache: false would be more suitable for these cases.

warmth commented 12 years ago

Great!

blasten commented 12 years ago

Hey @warmth I figured out that it's not necessary to add a new option because turn.js 4 already has a CSS class called fixed, which keeps the page in the DOM. So that if you execute something like

$("#flipbook > div").addClass("fixed")

before calling turn.js, all the pages will be in the DOM tree. Therefore a new option doesn't quite fit here.

warmth commented 12 years ago

turn.js 4 is not gonna be available on github?

blasten commented 12 years ago

@warmth private repository.

warmth commented 12 years ago

I see...

jedahan commented 12 years ago

can you add people who paid as collaborators so we can more easily keep track of development?

warmth commented 12 years ago

Great idea, how about beta testers?

blasten commented 12 years ago

@jedahan you are