twst btn print view and column layout commented

master
grgr 3 years ago
parent 72f3eed19f
commit aac5750e25

@ -5,7 +5,7 @@ const pagedjs = document.createElement("script");
pagedjs.src = "https://unpkg.com/pagedjs/dist/paged.polyfill.js"; pagedjs.src = "https://unpkg.com/pagedjs/dist/paged.polyfill.js";
pagedjs.id ="printview" pagedjs.id ="printview"
const printLib = document.getElementById("print"); const printLib = document.getElementById("btn-print");
window.addEventListener("load", () => { window.addEventListener("load", () => {
fetchContents(); fetchContents();
@ -13,7 +13,10 @@ window.addEventListener("load", () => {
//document.getElementsByTagName("head")[0].appendChild(pagedjs); //document.getElementsByTagName("head")[0].appendChild(pagedjs);
}); });
printLib.addEventListener("click", () => printViewToggle()) printLib.addEventListener("click", () =>{
printViewToggle();
console.log(btnPrint);
});
function fetchContents() { function fetchContents() {
fetch("https://hub.xpub.nl/soupboat/atlas-api/contributions") fetch("https://hub.xpub.nl/soupboat/atlas-api/contributions")
@ -57,7 +60,9 @@ function printViewToggle() {
if (!printview) { if (!printview) {
document.getElementsByTagName("head")[0].appendChild(pagedjs); document.getElementsByTagName("head")[0].appendChild(pagedjs);
console.log("first") // sto provando sta porcata qui, ma non funzia uguale. quando la pagina si trasforma in pagedjs la variabile del btn non è più definita (????)
var btnPrint = document.getElementById("btn-print");
console.log(btnPrint);
} else { } else {
//document.getElementsByTagName("head")[0].removeChild(printview); //document.getElementsByTagName("head")[0].removeChild(printview);

@ -14,7 +14,7 @@
<body> <body>
<div class="container"> <div class="container">
<div class="atlas"> <div class="atlas">
<button id="print">libretto</button> <button id="btn-print">libretto</button>
<svg <svg
width="1000" width="1000"
height="1000" height="1000"
@ -130,7 +130,7 @@
<div class="position">04:35</div> <div class="position">04:35</div>
</div> </div>
</div> </div>
<div class="libretto"> <div class="libretto" contenteditable="true">
<header class="cover"> <header class="cover">
<div class="release">SI18 Weekly Release #3</div> <div class="release">SI18 Weekly Release #3</div>
<h1 class="title">Emergent Opera</h1> <h1 class="title">Emergent Opera</h1>

@ -62,6 +62,10 @@
display: block; display: block;
} }
.libretto {
overflow-y: hidden;
}
.contribution .title { .contribution .title {
font-size: 28px; font-size: 28px;
@ -69,9 +73,21 @@
.contribution { .contribution {
border-bottom: none; border-bottom: none;
height: 100%;
overflow: hidden; overflow: hidden;
} }
/*Sorry Gi, the multicolumn layout is too painful */
/*
.contribution .content{
column-count: 2;
column-fill: auto;
}
.contribution li{
column-span: none;
}*/
} }
Loading…
Cancel
Save