Comments (8)
You could pursue two avenues: one is to have a set-up like the slider flipper, but with four iframes (left-current, right-current, left-next, right-next). But to me that seems very close to madness. Loading four iframes with content every time a component changes will be very slow, and consume a lot of memory on mobile devices.
You could try using columns, but due to your need for a spinal column gap between the two "pages", most of the existing calculations in Monocle will be invalidated. I've recently abstracted all of those calculations into a separate class (src/dimensions/columns.js), so it shouldn't be too hard to replace that piece and write a custom flipper.
To me that still leaves a few unresolved questions, more for you than me:
- What would a page turn animation look like? If you're planning to "fold" the pages in the middle in a book-like way, you pretty much have to throw out the second approach above and go back to the first.
- When someone resizes or reorients their browser window so that it is mostly portrait, what do you do? I've had "dynamically switching between flippers" in the too-hard basket since about February, and that's not likely to change. So your flipper and dimension classes are going to really earn their crust.
- Similarly, what if someone makes their browser window small (or views it on a Blackberry, for eg)? By its nature, two-page view is pretty wasteful of space. In fixed size browsers (ie, mobile browsers) arguably this is not such a problem, since you can detect them and serve them the normal slider flipper instead.
from monocle.
Thank you for your prompt reply. I will look into these issues and keep you posted.
from monocle.
2 pages can be really interested in widescreens. Does anybody made progress on this topic?
Thanks!
from monocle.
We ultimately decided to roll our own solution since further requirements came up. I therefore haven't had the chance to further investigate this issue in the context of monocle. But based on my first impressions, I would second the concerns voiced in the above post by joseph.
from monocle.
Yep, no change on this one. Happy to consider contributions of course.
@tf: are you open-sourcing your own? What were the further requirements, if I may ask?
from monocle.
Sorry for the delayed answer. We needed to build a framework of visual effects, including large images and videos. This made the iframe approach loading multiple copies of the page rather unattractive. Furthermore, we needed closer coupling between the document contents and the app framework - the opposite of what one would normally want to achieve when building a reader application.
We ended up implementing a pager. On top of that we've built functionality to load chunks of HTML on demand and place it in the pager.
All of this is part of a closed source project at the moment. I would really like to publish certain parts under an open source license. But this will have to be discussed with our customer.
from monocle.
Any update on this topic?
from monocle.
Try using the double_pages.js from the TEA-ebook project. Even though they don't give credit, it's basically the same as Monocle.js, using the same flippers, except you'll have to change the references from 'App' to 'Monocle' after you convert the whole file to normal javascript and add it to monoctrl.js at the end.
You'll have to also change the width of .monelem_page to 50% and monelem_page.right left: 50%;
from monocle.
Related Issues (20)
- EPUB Reader using Monocle Issue : HOT 6
- Bookmark documentation HOT 1
- Core files and simple start-up steps for 3.20?
- Book preview function HOT 3
- IE check HOT 1
- Get active iframe on componentchanging event? HOT 2
- Touch vertical scroll broken on mobile devices HOT 1
- It does not work in Google Chrome version 44.0.2403.89 HOT 7
- [Android 5.x] Content isn't shown HOT 2
- How to implement placesaver? HOT 3
- Placesaver on domain with multiple ebooks not working well
- Node to percent calculation is not giving expected page no
- Cutting off text HOT 1
- internal links not working
- ePub with XML content
- Domain name for test site is down
- Monocle not working in latest versions of Chrome and Firefox
- opds support
- Text selction not working in IE11
- Forked Monocle (kind of)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from monocle.