-
Notifications
You must be signed in to change notification settings - Fork 5
Amélioration page par page
Actuellement, lorsqu'un paragraphe n'est pas affiché en entier sur l'écran, il est retiré afin d'être affiché sur la page suivante/précédente. Il faudrait améliorer l'affichage des paragraphes afin de découper ceux-ci et permettre de remplir l'écran.
La solution que nous avons commencer à mettre en place est l'affichage mot à mot des derniers/premiers paragraphes afin d'afficher le paragraphe en partie pour remplir l'écran.
Deux fonctions ont été ajoutées dans le fichier "navigate.js" afin de découper le dernier/premier paragraphe affiché.
Ces fonctions sont appelées lorsqu'un paragraphe n'est pas affiché entièrement à l'écran dans :
- la fonction nextParagraphs
- la fonction previousParagraphs
function displayFirstParagraph(paragraphNumber) { var temp = document.getElementById('completeChapter').contentDocument; var ael = temp.getElementsByTagName("p");
var paragraphToDisplay = ael[paragraphNumber].cloneNode(true); var paragraphText = paragraphToDisplay.innerHTML;
var paragraphWords = paragraphText.split(" ");
var paragraph = document.createElement("p"); paragraph.id = "paragraph".concat(paragraphNumber);
for(var i = lastWord, c = paragraphWords.length ; i < c ; i++) { var word = paragraphWords[i]; paragraph.innerHTML = paragraph.innerHTML.concat(" ".concat(word)); document.getElementById("paragraphs").appendChild(paragraph);
if(paragraph instanceof Element) { var p = elementInViewport(paragraph);
if(!p) { paragraph.innerHTML = paragraph.innerHTML.replace(" ".concat(word), ""); break; } }
} }
function displayLastParagraph(paragraphNumber) { var temp = document.getElementById('completeChapter').contentDocument; var ael = temp.getElementsByTagName("p");
var paragraphToDisplay = ael[paragraphNumber].cloneNode(true); var paragraphText = paragraphToDisplay.innerHTML;
var paragraphWords = paragraphText.split(" ");
var paragraph = document.createElement("p"); paragraph.id = "paragraph".concat(paragraphNumber);
for(var i = 0, c = paragraphWords.length ; i < c ; i++) { var word = paragraphWords[i]; paragraph.innerHTML = paragraph.innerHTML.concat(" ".concat(word)); document.getElementById("paragraphs").appendChild(paragraph);
if(paragraph instanceof Element) { var p = elementInViewport(paragraph);
if(!p) { paragraph.innerHTML = paragraph.innerHTML.replace(" ".concat(word), ""); lastWord = i; break; } }
} }
Il reste à mettre en place un système de sauvegarde du dernier mot affiché dans le paragraphe découpé. Ainsi, au passage aux paragraphes suivant, le paragraphes découpé précédemment pourra reprendre où il a été découpé.