Julie/decor-6-site
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

figures simples + outdoor computer club

Browse source
This commit is contained in:
Julie Blanc 2026-04-11 17:49:46 +02:00
parent 76dc174fca
commit 868a5b702c
18 changed files with 531 additions and 352 deletions
Download patch file Download diff file Expand all files Collapse all files

60
assets/css/figures.css
View file

@ -5,12 +5,27 @@ figure{
}
figcaption{
font-size: 0.8em;
margin-top: 0.5em;
margin-top: calc(var(--baseline)*0.25);
}
figcaption::before{
content: "/";
font-family: var(--sign-family);
display: block;
text-align: center;
}
figcaption p{
margin: 0;
text-indent: 0!important;
text-align: center!important;
font-size: var(--fs-notes);
line-height: 14px;
font-weight: 500;
}
figcaption p::before{
display: none;
}
figure[data-ratio] {
@ -33,7 +48,6 @@ figure[data-crop="false"] img {
}
<<<<<<< HEAD
/* --- INTERPAGE ---- */
.interpage figure {
/*background-color: var(--copper);*/
@ -43,8 +57,40 @@ figure[data-crop="false"] img {
.interpage figure img {
filter: grayscale(100%);
mix-blend-mode: screen;
=======
#f4c52433-bf53-4933-b207-b845153ad93d{
background-color: red;
>>>>>>> af9785e4361ed41252a42b30a658359475f05d7b
}
/* SPECIFIC */
#fig-outdoor-computer-club-1{
margin: 0;
width: calc(var(--unit) * 5);
break-before: page;
break-after: page;
position: absolute;
bottom: 2px;
}
#fig-outdoor-computer-club-2,
#fig-outdoor-computer-club-3{
margin: 0;
width: calc(var(--unit) * 6.5);
height: var(--pagedjs-height);
position: absolute;
}
#fig-outdoor-computer-club-2{
top: -11px;
break-after: page;
}
#fig-outdoor-computer-club-3{
break-before: page;
break-after: page;
top: 6px;
}

18
assets/css/text.css
View file

@ -3,8 +3,8 @@
hyphens: auto;
hyphenate-limit-chars: 7 3 2;
/* position: relative; */
orphans: 2;
hyphens: 2;
/* orphans: 2;
hyphens: 2; */
text-indent: calc(var(--unit) * 0.75);
position: relative;
}
@ -37,11 +37,11 @@ p::before {
}
.first-p,
.following-title,
.following-h3,
.following-h4{
text-indent: 0!important;
.chapter p.first-p,
.chapter p.following-title,
.chapter p.following-h3,
.chapter p.following-h4{
text-indent: 0;
}
.first-p::before,
@ -61,8 +61,8 @@ p::before {
line-height: 14px;
font-weight: 500;
text-align: left;
padding-left: calc(var(--unit)*2);
text-indent: calc(var(--unit)*-0.75);
padding-left: calc(var(--unit)*1.5);
text-indent: calc(var(--unit)*-0.5)!important;
break-inside: avoid;
position: relative;
}

23
assets/css/typesetting.css Normal file
View file

@ -0,0 +1,23 @@
/* Outdoor computer club */
#tv-communales-televisions-populaires-au-venezuela{
margin-top: 0px;
}
#la-politisation-des-quartiers{
margin-top: 0px;
}
#une-television-rhizomatique{
padding-top: 5px;
}
[data-unique-id="p-lrnspsdlrd"]{
letter-spacing: -0.005rem;
}
#des-medias-autonomes-en-2026{
break-before: page;
margin-top: 0px;
}

21
assets/js/handlers.js
View file

@ -185,6 +185,27 @@ class asciiTextFill extends Paged.Handler {
// Paged.registerHandlers(asciiTextFill);
function slugify(text) {
return text.trim()
.toLowerCase()
.normalize('NFD').replace(/[\u0300-\u036f]/g, '')
.replace(/[^a-z0-9\s-]/g, '')
.replace(/\s+/g, '-')
.replace(/-+/g, '-');
}
class addHeadingIds extends Paged.Handler {
beforeParsed(content) {
content.querySelectorAll('h3, h4').forEach(heading => {
if (!heading.id) {
heading.id = slugify(heading.textContent);
}
});
}
}
Paged.registerHandlers(addHeadingIds);
class removeFullPageClass extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);

18
assets/js/main.js
View file

@ -3,9 +3,27 @@ window.onload = function(){
};
function slugify(text) {
return text.trim()
.toLowerCase()
.normalize('NFD').replace(/[\u0300-\u036f]/g, '')
.replace(/[^a-z0-9\s-]/g, '')
.replace(/\s+/g, '-')
.replace(/-+/g, '-');
}
function addHeadingIds(root) {
root.querySelectorAll('h3, h4').forEach(heading => {
if (!heading.id) {
heading.id = slugify(heading.textContent);
}
});
}
function init(){
let fadeEl = document.getElementById('fade');
if (fadeEl) {
fadeEl.classList.add('loaded');
}
addHeadingIds(document);
}

31
assets/js/plugins/beforeParsed.js Normal file
View file

@ -0,0 +1,31 @@
class before extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
}
beforeParsed(content) {
paragraphId(content);
}
}
Paged.registerHandlers(before);
function paragraphId(content) {
content.querySelectorAll("p, li").forEach((paragraph, index) => {
let words = paragraph.textContent
.trim()
.split(/\s+/)
.map(word => word.replace(/[^\wÀ-ÿ]/g, "")) // Supprime la ponctuation
.filter(word => word.length > 0);
let id = words.slice(0, 10).map(word => word.charAt(0)).join("").toLowerCase();
id = "p-" + id;
if (!id) id = `para-${index}`; // Si le paragraphe est vide, on donne un id par défaut
paragraph.dataset.uniqueId = id;
});
}

296
assets/js/plugins/full-page.js
View file

@ -1,296 +0,0 @@
let bleedFull = '6mm';
let cssFullSpread = `.pagedjs_page_fullLeft .pagedjs_full-spread_container{
margin: 0;
width: calc(var(--pagedjs-pagebox-width) + `+ bleedFull + `);
height: calc(var(--pagedjs-pagebox-height) + `+ bleedFull + `*2) !important;
position: absolute;
top: calc((var(--pagedjs-margin-top) + `+ bleedFull + `)*-1);
left: calc((var(--pagedjs-margin-left) + `+ bleedFull + `)*-1);
overflow: hidden;
}
.pagedjs_page_fullRight .pagedjs_full-spread_container{
margin: 0;
width: calc(var(--pagedjs-pagebox-width) + `+ bleedFull + `);
height: calc(var(--pagedjs-pagebox-height) + `+ bleedFull + `*2) !important;
position: absolute;
top: calc((var(--pagedjs-margin-top) + `+ bleedFull + `)*-1);
left: calc(var(--pagedjs-margin-left)*-1);
overflow: hidden;
}
.pagedjs_full-spread_content{
margin: 0;
width: calc(var(--pagedjs-pagebox-width)*2 + `+ bleedFull + `*2);
height: calc(var(--pagedjs-pagebox-height) + `+ bleedFull + `*2) !important;
position: absolute;
top: 0;
left: 0;
}
.pagedjs_page_fullLeft .pagedjs_full-spread_content{
left: calc(var(--pagedjs-fold)*-1);
}
.pagedjs_page_fullRight .pagedjs_full-spread_content{
left: calc((var(--pagedjs-pagebox-width) + `+ bleedFull + `)*-1 + var(--pagedjs-fold))
}`;
let cssFullPage = `
.pagedjs_full-page_content {
margin: 0;
position: absolute;
top: calc((var(--pagedjs-margin-top) + `+ bleedFull + `)*-1);
}
.pagedjs_left_page .pagedjs_full-page_content {
width: calc(var(--pagedjs-pagebox-width) + `+ bleedFull + `);
height: calc(var(--pagedjs-pagebox-height) + `+ bleedFull + `*2);
left: calc((var(--pagedjs-margin-left) + `+ bleedFull + `)*-1);
}
.pagedjs_right_page .pagedjs_full-page_content {
width: calc(var(--pagedjs-pagebox-width) + `+ bleedFull + `);
height: calc(var(--pagedjs-pagebox-height) + `+ bleedFull + `*2);
left: calc(var(--pagedjs-margin-left)*-1);
}
`;
class fullPageImage extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
this.selectorFullSpread = new Set();
this.fullSpreadEls = new Set();
this.selectorFullPage = new Set();
this.fullPageEls = new Set();
this.selectorFullRight = new Set();
this.fullRightEls = new Set();
this.selectorFullLeft= new Set();
this.fullLeftEls = new Set();
this.usedPagedEls = new Set();
}
onDeclaration(declaration, dItem, dList, rule) {
// Read customs properties
if (declaration.property == "--pagedjs-full-page") {
// get selector of the declaration (NOTE: need csstree.js)
let selector = csstree.generate(rule.ruleNode.prelude);
// Push selector in correct set
if (declaration.value.value.includes("page")) {
this.selectorFullPage.add(selector);
}else if(declaration.value.value.includes("spread")) {
this.selectorFullSpread.add(selector);
}else if(declaration.value.value.includes("right")) {
this.selectorFullRight.add(selector);
}else if(declaration.value.value.includes("left")) {
this.selectorFullLeft.add(selector);
}
}
}
afterParsed(parsed){
// ADD global css
addcss(cssFullSpread);
addcss(cssFullPage);
// ADD pagedjs classes to elements
for (let item of this.selectorFullPage) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-elem");
}
}
for (let item of this.selectorFullSpread) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-spread-elem");
}
}
for (let item of this.selectorFullLeft) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-left-elem");
}
}
for (let item of this.selectorFullRight) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-right-elem");
}
}
}
renderNode(clone, node) {
// FULL SPREAD
// if you find a full page element, move it in the array
if (node.nodeType == 1 && node.classList.contains("pagedjs_full-spread-elem")) {
this.fullSpreadEls.add(node);
this.usedPagedEls.add(node);
// remove the element from the flow by hiding it.
clone.style.display = "none";
}
// FULL PAGE
if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-left-elem")) {
this.fullLeftEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}else if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-right-elem")) {
this.fullRightEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}else if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-elem")) {
this.fullPageEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}
}
afterPageLayout(pageElement, page, breakToken, chunker) {
// ADD --pagedjs-fold on body if doesn't exist
if(pageElement.classList.contains("pagedjs_first_page")){
let body = document.getElementsByTagName("body")[0];
let style = window.getComputedStyle(body);
let fold = style.getPropertyValue('--pagedjs-fold');
if(!fold){
body.style.setProperty('--pagedjs-fold', '0mm')
}
}
// FULL SPREAD
// if there is an element in the fullSpreadEls Set, (goodbye arrays!)
for (let img of this.fullSpreadEls) {
if (page.element.classList.contains("pagedjs_right_page")) {
let imgLeft;
let imgRight;
if (img.nodeName == "IMG") {
/* Add outside + inside container if the element is an img */
let containerLeft = document.createElement("div");
containerLeft.classList.add("pagedjs_full-spread_container");
let containerLeftInside = document.createElement("div");
containerLeftInside.classList.add("pagedjs_full-spread_content");
containerLeft.appendChild(containerLeftInside).appendChild(img);
imgLeft = containerLeft;
let containerRight = document.createElement("div");
containerRight.classList.add("pagedjs_full-spread_container");
let containerRightInside = document.createElement("div");
containerRightInside.classList.add("pagedjs_full-spread_content");
containerRight.appendChild(containerRightInside).appendChild(img.cloneNode(true));
imgRight = containerRight;
} else {
/* Add outside container if the element is an img */
let containerLeft = document.createElement("div");
containerLeft.classList.add("pagedjs_full-spread_container");
img.classList.add("pagedjs_full-spread_content");
containerLeft.appendChild(img);
imgLeft = containerLeft;
let containerRight = document.createElement("div");
containerRight.classList.add("pagedjs_full-spread_container");
img.classList.add("pagedjs_full-spread_content");
containerRight.appendChild(img.cloneNode(true));
imgRight = containerRight;
}
// put the first element on the page
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", imgLeft);
fullPage.element.classList.add("pagedjs_page_fullLeft");
// page right
let fullPageRight = chunker.addPage();
fullPageRight.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", imgRight);
fullPageRight.element.classList.add("pagedjs_page_fullRight");
img.style.removeProperty("display");
this.fullSpreadEls.delete(img);
}
}
// FULL PAGE
// if there is an element in the fullPageEls Set
for (let img of this.fullPageEls) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullPageEls.delete(img);
}
// FULL Left PAGE
// if there is an element in the fullLeftEls Set
for (let img of this.fullLeftEls) {
if (page.element.classList.contains("pagedjs_right_page")) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullLeftEls.delete(img);
}
}
// FULL RIGHT PAGE
// if there is an element in the fullRightEls Set
for (let img of this.fullRightEls) {
if (page.element.classList.contains("pagedjs_left_page")) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullRightEls.delete(img);
}
}
}
}
Paged.registerHandlers(fullPageImage);
function addcss(css){
var head = document.getElementsByTagName('head')[0];
var s = document.createElement('style');
s.setAttribute('type', 'text/css');
if (s.styleSheet) { // IE
s.styleSheet.cssText = css;
} else {// the world
s.appendChild(document.createTextNode(css));
}
head.appendChild(s);
}

281
assets/js/plugins/fullpage.js
View file

@ -1,56 +1,291 @@
// ---- C O R R E C T P O S I T I O N O F I M A G E S ----
/**
* @name Full page
* @author Julie Blanc <contact@julie-blanc.fr>
* @see { @link https://gitlab.com/csspageweaver/plugins/fullPage }
*/
let bleedFull = '6mm';
var classElemFullPage = "full-page"; // ← class of full page images
class fullPage extends Paged.Handler {
class fullPageStuff extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
this.selectorFullSpread = new Set();
this.fullSpreadEls = new Set();
this.selectorFullPage = new Set();
this.fullPageEls = new Set();
this.selectorFullRight = new Set();
this.fullRightEls = new Set();
this.selectorFullLeft= new Set();
this.fullLeftEls = new Set();
this.usedPagedEls = new Set();
this.specificPage = new Set();
this.specificPageClone = new Set();
}
//find from the css the element you wanna have full page
onDeclaration(declaration, dItem, dList, rule) {
if (declaration.property == "position") {
if (declaration.value.children.head.data.name.includes("fullpage")) {
let sel = csstree.generate(rule.ruleNode.prelude);
sel = sel.replace('[data-id="', "#");
sel = sel.replace('"]', "");
this.floatFullPage.push(sel.split(","));
// Read customs properties
if (declaration.property == "--pagedjs-full-page") {
// get selector of the declaration (NOTE: need csstree.js)
let selector = csstree.generate(rule.ruleNode.prelude);
// Push selector in correct set
if (declaration.value.value.includes("page")) {
this.selectorFullPage.add(selector);
}else if(declaration.value.value.includes("spread")) {
this.selectorFullSpread.add(selector);
}else if(declaration.value.value.includes("right")) {
this.selectorFullRight.add(selector);
}else if(declaration.value.value.includes("left")) {
this.selectorFullLeft.add(selector);
}else{
let obj = { page: declaration.value.value, elem: selector };
this.specificPage.add(JSON.stringify(obj));
}
}
}
afterParsed(parsed){
console.log("FULL PAGE loaded");
// ADD pagedjs classes to elements
for (let item of this.selectorFullPage) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-elem");
}
}
for (let item of this.selectorFullSpread) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-spread-elem");
}
}
for (let item of this.selectorFullLeft) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-left-elem");
}
}
for (let item of this.selectorFullRight) {
let elems = parsed.querySelectorAll(item);
for (let elem of elems) {
elem.classList.add("pagedjs_full-page-right-elem");
}
}
// SPECIFIC PAGE ------------------------------------
this.specificPage.forEach(entry => {
const obj = JSON.parse(entry);
const elements = parsed.querySelectorAll(obj.elem);
if (elements.length > 0) {
// pourquoi c’est ajouté même si l’élément n’existe pas ?
elements[0].classList.add("pagedjs_full-page-specific");
const clone = elements[0].cloneNode(true);
obj.elemClone = clone.outerHTML;
elements[0].remove();
}
this.specificPageClone.add(JSON.stringify(obj));
});
}
renderNode(clone, node) {
// FULL SPREAD
// if you find a full page element, move it in the array
if (node.nodeType == 1 && node.classList.contains(classElemFullPage)) {
// console.log(node);
this.fullPageEls.add(node);
if (node.nodeType == 1 && node.classList.contains("pagedjs_full-spread-elem")) {
this.fullSpreadEls.add(node);
this.usedPagedEls.add(node);
// remove the element from the flow by hiding it.
clone.style.display = "none";
}
// FULL PAGE
if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-left-elem")) {
this.fullLeftEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}else if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-right-elem")) {
this.fullRightEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}else if (node.nodeType == 1 && node.classList.contains("pagedjs_full-page-elem")) {
this.fullPageEls.add(node);
this.usedPagedEls.add(node);
clone.style.display = "none";
}
}
afterPageLayout(pageElement, page, breakToken, chunker) {
// if there is an element in the fullPageEls Set, (goodbye arrays!)
if(page.id == "page-1"){
let allPages = document.querySelector(".pagedjs_pages");
allPages.style.setProperty('--bleed-images', bleedFull);
}
// ADD --pagedjs-fold on body if doesn't exist
if(pageElement.classList.contains("pagedjs_first_page")){
let body = document.getElementsByTagName("body")[0];
let style = window.getComputedStyle(body);
let fold = style.getPropertyValue('--pagedjs-fold');
if(!fold){
body.style.setProperty('--pagedjs-fold', '0mm')
}
}
// FULL SPREAD
// if there is an element in the fullSpreadEls Set, (goodbye arrays!)
for (let img of this.fullSpreadEls) {
if (page.element.classList.contains("pagedjs_right_page")) {
let imgLeft;
let imgRight;
if (img.nodeName == "IMG") {
/* Add outside + inside container if the element is an img */
let containerLeft = document.createElement("div");
containerLeft.classList.add("pagedjs_full-spread_container");
let containerLeftInside = document.createElement("div");
containerLeftInside.classList.add("pagedjs_full-spread_content");
containerLeft.appendChild(containerLeftInside).appendChild(img);
imgLeft = containerLeft;
let containerRight = document.createElement("div");
containerRight.classList.add("pagedjs_full-spread_container");
let containerRightInside = document.createElement("div");
containerRightInside.classList.add("pagedjs_full-spread_content");
containerRight.appendChild(containerRightInside).appendChild(img.cloneNode(true));
imgRight = containerRight;
} else {
/* Add outside container if the element is an img */
let containerLeft = document.createElement("div");
containerLeft.classList.add("pagedjs_full-spread_container");
img.classList.add("pagedjs_full-spread_content");
containerLeft.appendChild(img);
imgLeft = containerLeft;
let containerRight = document.createElement("div");
containerRight.classList.add("pagedjs_full-spread_container");
img.classList.add("pagedjs_full-spread_content");
containerRight.appendChild(img.cloneNode(true));
imgRight = containerRight;
}
// put the first element on the page
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", imgLeft);
fullPage.element.classList.add("pagedjs_page_fullLeft");
// page right
let fullPageRight = chunker.addPage();
fullPageRight.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", imgRight);
fullPageRight.element.classList.add("pagedjs_page_fullRight");
img.style.removeProperty("display");
this.fullSpreadEls.delete(img);
}
}
// FULL PAGE
// if there is an element in the fullPageEls Set
for (let img of this.fullPageEls) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", img);
fullPage.element.classList.add("addedpage");
fullPage.element.classList.add("pagedjs_named_page");
fullPage.element.classList.add("pagedjs_pagedjs-fullpage_page");
if(img.classList.contains('background-black')){
fullPage.element.classList.add("pagedjs_pagedjs-fullpageblack_page");
}
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullPageEls.delete(img);
}
// FULL Left PAGE
// if there is an element in the fullLeftEls Set
for (let img of this.fullLeftEls) {
if (page.element.classList.contains("pagedjs_right_page")) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullLeftEls.delete(img);
}
}
// FULL RIGHT PAGE
// if there is an element in the fullRightEls Set
for (let img of this.fullRightEls) {
if (page.element.classList.contains("pagedjs_left_page")) {
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.appendChild(img);
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
img.style.removeProperty("display");
this.fullRightEls.delete(img);
}
}
// SPECIFIC PAGE ------------------------------------
let pageNum = pageElement.id.split('page-')[1];
pageNum = parseInt(pageNum);
this.specificPageClone.forEach(entry => {
const obj = JSON.parse(entry);
let targetedPage = obj.page;
let prevPage = parseInt(targetedPage) - 1;
let elem = obj.elemClone;
if(prevPage == pageNum){
let container = document.createElement("div");
container.classList.add("pagedjs_full-page_content");
container.innerHTML = elem;
let fullPage = chunker.addPage();
fullPage.element
.querySelector(".pagedjs_page_content")
.insertAdjacentElement("afterbegin", container);
fullPage.element.classList.add("pagedjs_page_fullPage");
}
});
}
}
Paged.registerHandlers(fullPageStuff);
Paged.registerHandlers(fullPage);

80
assets/js/plugins/moveElems.js Executable file
View file

@ -0,0 +1,80 @@
/**
* @name Move Elems v1.0
* @author Julie Blanc <contact@julie-blanc.fr>
* @see { @link https://gitlab.com/csspageweaver/plugins/moveElems }
*/
class moveElems extends Paged.Handler {
constructor(chunker, polisher, caller) {
super(chunker, polisher, caller);
this.selectorMoveElem = new Set();
}
onDeclaration(declaration, dItem, dList, rule) {
if (declaration.property == "--x-move-elem") {
let selector = csstree.generate(rule.ruleNode.prelude);
let value = declaration.value.value
let doubleArray = [selector, value];
this.selectorMoveElem.add(doubleArray);
}
}
afterParsed(parsed){
console.log("MOVE ELEMS LOADED");
// ADD data to move elements
for (let item of this.selectorMoveElem) {
let elem = parsed.querySelector(item[0]);
if(elem){
elem.dataset.moveImg = item[1];
}
}
moveElem(parsed);
}
}
Paged.registerHandlers(moveElems);
function moveElem(parsed){
let elems = parsed.querySelectorAll('[data-move-img]');
for (let elem of elems) {
let n = parseInt(elem.getAttribute('data-move-img'));
let newPlace
if(n < 0){
newPlace = elem.previousSibling;
if (newPlace.nodeType !== Node.ELEMENT_NODE) {
newPlace = newPlace.previousSibling
}
n = n*-1 - 1;
for(let i = 0; i < n; i++){
newPlace = newPlace.previousSibling
if (newPlace.nodeType !== Node.ELEMENT_NODE) {
newPlace = newPlace.previousSibling
}
}
}else{
newPlace = elem.nextSibling;
if (newPlace.nodeType !== Node.ELEMENT_NODE) {
newPlace = newPlace.nextSibling;
}
for(let i = 0; i < n; i++){
newPlace = newPlace.nextSibling;
if (newPlace.nodeType !== Node.ELEMENT_NODE) {
newPlace = newPlace.nextSibling;
}
}
}
newPlace.parentNode.insertBefore(elem, newPlace);
// do next = next.nextSibling; while(next && next.nodeType !== 1);
}
}

2
assets/pagedjs/interface.js
View file

@ -11,7 +11,7 @@ document.addEventListener('DOMContentLoaded', (event) => {
let book_content = flowBook.content;
let paged = new Paged.Previewer();
paged.preview(book_content, ["assets/css/print-template.css", "assets/css/main.css", "assets/css/print.css", 'assets/css/blockquote.css', 'assets/css/chapter-header.css', 'assets/css/entretiens.css', 'assets/css/notes.css', 'assets/css/figures.css', 'assets/css/portfolio.css', "assets/css/running-page.css", 'assets/css/subtitles.css', 'assets/css/text.css',], document.querySelector("#renderbook")).then((flow) => {
paged.preview(book_content, ["assets/css/print-template.css", "assets/css/main.css", "assets/css/print.css", 'assets/css/blockquote.css', 'assets/css/chapter-header.css', 'assets/css/entretiens.css', 'assets/css/notes.css', 'assets/css/figures.css', 'assets/css/portfolio.css', "assets/css/running-page.css", 'assets/css/subtitles.css', 'assets/css/text.css', 'assets/css/typesetting.css',], document.querySelector("#renderbook")).then((flow) => {
});
});