Hola, estoy desarrollando un sitio web donde se puedan leer libros online. La duda que tengo es cómo dividir un texto en twig. Me explico: Un libro consta de varios capítulos. Quiero tomar ese capítulo y dividirlo en varios trozos, o "páginas", de tal manera que se muestre al lector una página por pantalla. Este es el sitio: http://quimera.eu1.frbit.net/web/display/la-caza-del-octubre-rojo/read
Como pueden ver, cada capítulo se muestra en una página y al pulsar la flecha de la parte superior derecha, da la sensación de que se pasa a la siguiente página de un libro, pero en realidas, se desplaza al otro capítulo, pues cada capítulo es una fila en la base de datos. Actualmente, para leer el capítulo debo desplazarme con el scroll e ir revelando el contenido. Quisiera saber como dividir, como dije anteriormente, el capítulo en trozos y así hacer que cada transición de página me lleve al resto del capítulo y no al siguiente.
Espero me hayan entendido y muchas gracias.
Respuestas
Aunque es posible resolver este problema utilizando Twig, en mi opinión es algo que debería desarrollarse con JavaScript en el propio navegador.
El principal problema que veo a la duda que planteas es que resulta muy difícil definir lo que es una página de contenido. Si consideras que una página por ejemplo está formada por 10 párrafos, si el usuario aumenta o reduce el tamaño de letra, ya no parecerá una página. Si el usuario lee el libro en un móvil, esos 10 párrafos son demasiados contenidos para considerarlos una página.
Si quieres seguir utilizando Twig, el filtro que debes utilizar es |split('', num_caracteres)
, que convierte una cadena de texto en un array cuyos elementos tienen el mismo número de caracteres. El primer argumento tiene que ser una cadena vacía, para que Twig utilice la función str_split
de PHP y el segundo argumento es el número de caracteres que tendrá cada trozo (en tu caso, cada página).
Este código Twig divide un capítulo en varias páginas y después las muestra por pantalla ocultando todas ellas salvo la primera. Después, con ayuda de JavaScript puedes añadir los controles que hacen que se vea cada página ocultando las demás:
{% set paginas = capitulo|split('', 2048) %} {% for pagina in paginas %} <div class="pagina" style="{{ loop.index > 1 ? 'display: none' : '' }}"> {{ pagina }} </div> {% endfor %}
@javiereguiluz
Hola, gracias por la respuesta, me sirvió mucho. Mencionas otra solución con JavaScript.... ¿me podrías dar pistas sobre eso?
@SakyaStelios
En realidad no tengo pistas concretas para darte sosbre el código que deberías utilizar. Lo que decía es que como nunca sabes cómo va a leerte el usuario, no creo que sea una buena solución dividir el contenido a priori desde el servidor. Creo que sería mejor usar JavaScript en el propio navegador del usuario para decidir cómo cortar los contenidos.
La parte más difícil de ese código será decidir cómo se parten los contenidos. Seguramente los contenidos del libro se mostrarán mediante código HTML, por lo que si no tienes cuidado al partir la cadena, puede que rompas las etiquetas HTML. En cualquier caso, es cuestión de utilizar algo más de código JavaScript. Aquí puedes ver un ejemplo que divide un contenido HTML en párrafos.
@javiereguiluz