projet: améliore le projet
- Améliore l'usage des polices, pour se passer de TheSans. - Utilise une version des scripts JS servis par le projet. Co-Authored-by: iGor milhit <igor@milhit.ch>
parent
2687b0e0bc
commit
32c72779a2
|
@ -2,3 +2,4 @@ example.html
|
||||||
example.pdf
|
example.pdf
|
||||||
test.*
|
test.*
|
||||||
release/
|
release/
|
||||||
|
watched-files.txt
|
||||||
|
|
|
@ -31,10 +31,11 @@ Au terme de cet atelier, vous serez en mesure de :
|
||||||
|
|
||||||
|
|
||||||
:::{#licence}
|
:::{#licence}
|
||||||
![Logo de la licence CC BY-SA 4.0](../static/by-sa.svg) \
|
![Logo de la licence CC BY-SA 4.0][logo] \
|
||||||
[CC BY-SA 4.0][cc-by-sa] --- [Sources][sources]
|
[CC BY-SA 4.0][cc-by-sa] --- [Sources][sources]
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
[logo]: ../static/by-sa.svg
|
||||||
[cc-by-sa]: https://creativecommons.org/licenses/by-sa/4.0/deed.fr "Texte de la licence en français"
|
[cc-by-sa]: https://creativecommons.org/licenses/by-sa/4.0/deed.fr "Texte de la licence en français"
|
||||||
[sources]: https://git.milhit.ch/igor/bunige-pagedjs-template
|
[sources]: https://git.milhit.ch/igor/bunige-pagedjs-template
|
||||||
|
|
||||||
|
@ -123,16 +124,20 @@ par exemple un livre.</p>
|
||||||
|
|
||||||
## Police
|
## Police
|
||||||
|
|
||||||
Pour que la police *TheSans* puisse s'appliquer correctement, elle doit être
|
Bien que la police *TheSans* face partie de la charte de l'UNIGE et de la
|
||||||
installée sur votre système d'exploitation. Malheureusement, elle n'est pas
|
Bibliothèque de l'Université, je trouve qu'elle n'est pas des plus lisible,
|
||||||
publiée avec une licence libre, ce qui en réduit l'usage. Les polices de
|
notamment sur les titres. De plus, la licence de cette police, sauf erreur,
|
||||||
remplacement sont dans l'ordre *Open Sans*, *Arial*, *Helvetica*, ou la police
|
n'est pas libre, ce qui en limite l'usage. C'est pourquoi je préfère spécifier
|
||||||
|
ici les polices *Noto Sans*, *Open Sans*, *Arial*, *Helvetica*, ou la police
|
||||||
*sans-serif* par défaut de votre système ou de votre navigateur.
|
*sans-serif* par défaut de votre système ou de votre navigateur.
|
||||||
|
|
||||||
La police peut être facilement configurable au moyen du sélecteur `body` dans
|
La police peut être facilement configurable au moyen du sélecteur `body` dans
|
||||||
le fichier `style.css` (règle déjà existante, dans la section *Définitions
|
le fichier `style.css` (règle déjà existante, dans la section *Définitions
|
||||||
globales*).
|
globales*).
|
||||||
|
|
||||||
|
Pour les éléments verbatim (`pre`, `code`), la police est *Lilex*, *Courier
|
||||||
|
New*, *Courier*, *monospace*.
|
||||||
|
|
||||||
## Titres
|
## Titres
|
||||||
|
|
||||||
Il y a une particularité avec les titres, qui découlent de l'usage de
|
Il y a une particularité avec les titres, qui découlent de l'usage de
|
||||||
|
|
File diff suppressed because it is too large
Load Diff
|
@ -0,0 +1,117 @@
|
||||||
|
// Reload-in-place v2.0
|
||||||
|
// Nicolas Taffin + Sameh Chafik - 2020
|
||||||
|
// MIT License https://opensource.org/licenses/MIT
|
||||||
|
// A simple script to add your pagedjs project. On reload, it will make the web browser scroll to the place it was before reload.
|
||||||
|
// Useful when styling or proof correcting your book. Multi docs compatible and doesn't wait for complete compilation to go.
|
||||||
|
|
||||||
|
|
||||||
|
console.log("reload in place");
|
||||||
|
|
||||||
|
|
||||||
|
// separate human / machine scroll
|
||||||
|
var machineScroll = false;
|
||||||
|
|
||||||
|
// check pagedJS ended compilation
|
||||||
|
var pagedjsEnd = false;
|
||||||
|
|
||||||
|
class pagedjsEnded extends Paged.Handler {
|
||||||
|
constructor(chunker, polisher, caller) {
|
||||||
|
super(chunker, polisher, caller);
|
||||||
|
}
|
||||||
|
afterRendered(pages) {
|
||||||
|
pagedjsEnd = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Paged.registerHandlers(pagedjsEnded);
|
||||||
|
|
||||||
|
// set a "unique" filename based on title element, in case several books are opened
|
||||||
|
var fileTitle = document.getElementsByTagName("title")[0].text;
|
||||||
|
|
||||||
|
function getDocHeight() {
|
||||||
|
var D = document;
|
||||||
|
return Math.max(
|
||||||
|
D.body.scrollHeight, D.documentElement.scrollHeight,
|
||||||
|
D.body.offsetHeight, D.documentElement.offsetHeight,
|
||||||
|
D.body.clientHeight, D.documentElement.clientHeight
|
||||||
|
)
|
||||||
|
}
|
||||||
|
function saveAmountScrolled(){
|
||||||
|
var scrollArray = [];
|
||||||
|
var scrollTop = window.pageYOffset || (document.documentElement || document.body.parentNode || document.body).scrollTop
|
||||||
|
if (!machineScroll) {
|
||||||
|
var scrollLeft = window.pageXOffset || (document.documentElement || document.body.parentNode || document.body).scrollLeft
|
||||||
|
scrollArray.push({ X: Math.round(scrollLeft), Y: Math.round(scrollTop) });
|
||||||
|
console.log("Saved ", scrollArray);
|
||||||
|
localStorage[fileTitle] = JSON.stringify(scrollArray);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// on Load, blur or opacify the page, and try to join ASAP
|
||||||
|
// last saved position, or at least last compiled page
|
||||||
|
|
||||||
|
|
||||||
|
window.onload = moveFast;
|
||||||
|
|
||||||
|
function moveFast() {
|
||||||
|
machineScroll= true;
|
||||||
|
var styleEl = document.createElement('style');
|
||||||
|
document.head.appendChild(styleEl);
|
||||||
|
var styleSheet = styleEl.sheet;
|
||||||
|
styleSheet.insertRule('.pagedjs_pages { filter: blur(10px); }', 0);
|
||||||
|
//styleSheet.insertRule('.pagedjs_pages { opacity: 0.1; }', 0);
|
||||||
|
var savedData = localStorage.getItem(fileTitle);
|
||||||
|
if (savedData) {
|
||||||
|
var scrollArray = JSON.parse(savedData);
|
||||||
|
var scrollTop = scrollArray[0].Y;
|
||||||
|
var scrollLeft = scrollArray[0].X;
|
||||||
|
} else {
|
||||||
|
var scrollTop = 0;
|
||||||
|
var scrollLeft = 0;
|
||||||
|
}
|
||||||
|
var winheight= window.innerHeight || (document.documentElement || document.body).clientHeight
|
||||||
|
window.currentInterval = setInterval(function(){
|
||||||
|
var docheight = getDocHeight();
|
||||||
|
|
||||||
|
if ( scrollTop > 0 && scrollTop > docheight - winheight && !pagedjsEnd) {
|
||||||
|
window.scrollTo(scrollLeft,docheight);
|
||||||
|
} else {
|
||||||
|
window.scrollTo(scrollLeft,scrollTop);
|
||||||
|
clearInterval(window.currentInterval);
|
||||||
|
setTimeout(function(){
|
||||||
|
window.scrollTo(scrollLeft,scrollTop);
|
||||||
|
machineScroll = false;
|
||||||
|
styleSheet.deleteRule(0);
|
||||||
|
}, 500); // Delay to start
|
||||||
|
}
|
||||||
|
}, 50); // refresh frequency
|
||||||
|
};
|
||||||
|
|
||||||
|
// slow down a bit save position pace
|
||||||
|
|
||||||
|
var slowSave = debounce(function() {
|
||||||
|
if(!machineScroll) {
|
||||||
|
saveAmountScrolled();
|
||||||
|
}
|
||||||
|
}, 100); // save frequency
|
||||||
|
|
||||||
|
function debounce(func, wait, immediate) {
|
||||||
|
var timeout;
|
||||||
|
return function() {
|
||||||
|
var context = this, args = arguments;
|
||||||
|
var later = function() {
|
||||||
|
timeout = null;
|
||||||
|
if (!immediate) func.apply(context, args);
|
||||||
|
};
|
||||||
|
var callNow = immediate && !timeout;
|
||||||
|
clearTimeout(timeout);
|
||||||
|
timeout = setTimeout(later, wait);
|
||||||
|
if (callNow) func.apply(context, args);
|
||||||
|
};
|
||||||
|
};
|
||||||
|
|
||||||
|
// Scroll triggers save, but not immediately on load
|
||||||
|
|
||||||
|
setTimeout(function(){
|
||||||
|
window.addEventListener('scroll', slowSave);
|
||||||
|
}, 1000); // wait a bit before starting position save
|
||||||
|
|
14
style.css
14
style.css
|
@ -28,7 +28,7 @@
|
||||||
* bibliothèque de l'UNIGE. */
|
* bibliothèque de l'UNIGE. */
|
||||||
@top-right {
|
@top-right {
|
||||||
content: "";
|
content: "";
|
||||||
background-image: url("./static/bibliotheque-logo.svg");
|
background-image: url("static/bibliotheque-logo.svg");
|
||||||
background-position: right;
|
background-position: right;
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 25%;
|
background-size: 25%;
|
||||||
|
@ -56,7 +56,8 @@
|
||||||
* ************************ */
|
* ************************ */
|
||||||
|
|
||||||
body {
|
body {
|
||||||
font-family: "TheSansOsF", "Open Sans", Arial, Helvetica, sans-serif;
|
font-family: "Noto Sans", "Open Sans",
|
||||||
|
Arial, Helvetica, sans-serif;
|
||||||
/* Définit les trois variables de compteur nécessaires */
|
/* Définit les trois variables de compteur nécessaires */
|
||||||
counter-reset: figureNumber toc tableNumber;
|
counter-reset: figureNumber toc tableNumber;
|
||||||
}
|
}
|
||||||
|
@ -158,8 +159,9 @@
|
||||||
padding: none;
|
padding: none;
|
||||||
}
|
}
|
||||||
code {
|
code {
|
||||||
font-family:'Courier New', Courier, monospace;
|
font-family: 'Lilex Nerd Font', 'Courier New', Courier, monospace;
|
||||||
font-size: 90%;
|
font-size: 90%;
|
||||||
|
line-height: 1.4;
|
||||||
background-color: #f2f1f1;
|
background-color: #f2f1f1;
|
||||||
padding: 2px;
|
padding: 2px;
|
||||||
border-radius: 5px;
|
border-radius: 5px;
|
||||||
|
@ -173,6 +175,12 @@
|
||||||
}
|
}
|
||||||
.footnote-ref {
|
.footnote-ref {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
padding-left: 2px;
|
||||||
|
}
|
||||||
|
.footnote-back {
|
||||||
|
font-size: small;
|
||||||
|
text-decoration: none;
|
||||||
|
padding-left: .5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
figure {
|
figure {
|
||||||
|
|
|
@ -27,7 +27,8 @@ $for(css)$
|
||||||
<link rel="stylesheet" href="$css$" />
|
<link rel="stylesheet" href="$css$" />
|
||||||
$endfor$
|
$endfor$
|
||||||
<link href="/interface.css" rel="stylesheet" type="text/css" />
|
<link href="/interface.css" rel="stylesheet" type="text/css" />
|
||||||
<script src="https://unpkg.com/pagedjs/dist/paged.polyfill.js"></script>
|
<script src="/paged.polyfill.js"></script>
|
||||||
|
<script src="/reload-in-place.js"></script>
|
||||||
$for(header-includes)$
|
$for(header-includes)$
|
||||||
$header-includes$
|
$header-includes$
|
||||||
$endfor$
|
$endfor$
|
||||||
|
|
Loading…
Reference in New Issue