changes
Before Width: | Height: | Size: 6.3 KiB After Width: | Height: | Size: 6.3 KiB |
BIN
assets/img/blackandwhite.png
Normal file
After Width: | Height: | Size: 47 KiB |
Before Width: | Height: | Size: 202 KiB After Width: | Height: | Size: 202 KiB |
Before Width: | Height: | Size: 117 KiB After Width: | Height: | Size: 117 KiB |
@ -5,7 +5,7 @@
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Rien</title>
|
||||
</head>
|
||||
<body>
|
||||
<body style="color:black ;;font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;background-color: white;">
|
||||
Choisir un manuel à afficher
|
||||
</body>
|
||||
</html>
|
26
html/cookie.html
Normal file
@ -0,0 +1,26 @@
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<script>
|
||||
document.cookie = "nom=valeur; expires=date; path=chemin";
|
||||
|
||||
|
||||
var cookies = document.cookie.split(';');
|
||||
for (var i = 0; i < cookies.length; i++) {
|
||||
var cookie = cookies[i].trim();
|
||||
if (cookie.indexOf('nom=') == 0) {
|
||||
var valeur = cookie.substring('nom='.length, cookie.length);
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
@ -1,12 +0,0 @@
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=
|
||||
, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
</head>
|
||||
<body>
|
||||
<iframe scrolling="no" class="iframe-fixed" style="visibility: visible; transform: none;" src="blob:https://biblio.nathan.fr/61523576-9168-490f-aa2e-9ad74d941856" title="EPUB" aria-label="EPUB" data-page-idref="id_Chapter_001_Page_00001_xhtml" data-page-index="0"></iframe>
|
||||
</body>
|
||||
</html>
|
112
index.html
@ -5,12 +5,17 @@
|
||||
<title>Manuel</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<link rel="shortcut icon" href="img/icone.ico" type="image/x-icon">
|
||||
<!-- <script src="js.js"></script> -->
|
||||
</head>
|
||||
|
||||
<body onload="editionchoisie()">
|
||||
<body onload="editionchoisie(), checkCookie()">
|
||||
|
||||
|
||||
<div id="firstbutton">
|
||||
<div class="changeTheme">
|
||||
<img src="img/blackandwhite.png" alt="blackandwhite" style="max-width: 50px; max-height: 50px; margin: 10px;">
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="code">Entrez le code :</label>
|
||||
<input type="text" id="code" name="code" value="9782017102106">
|
||||
@ -62,6 +67,12 @@
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div class="slider">
|
||||
<div id="glissière" onclick="taille()" class="col">
|
||||
<input id="slider" type="range" oninput="taille()" min="579" max="1200" class="slider" value="579">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="iframe">
|
||||
<iframe id="myframe1" src="html/404.html"></iframe>
|
||||
<iframe id="myframe2" src="html/404.html"></iframe>
|
||||
@ -90,33 +101,37 @@
|
||||
var page2 = 2;
|
||||
var nbpage = document.getElementById("nbpage");
|
||||
|
||||
|
||||
function editionchoisie() {
|
||||
var editionchoisie = document.getElementsByName("edition")[0].value;
|
||||
var slider = document.getElementById("slider");
|
||||
|
||||
if (editionchoisie == 'hachette') {
|
||||
console.log("hachette");
|
||||
document.getElementById("editionesthcoisieest").innerHTML = "";
|
||||
diviframe.style.display = ''
|
||||
divimg.style.display = 'none'
|
||||
diviframe.style.display = '';
|
||||
slider.style.display = '';
|
||||
divimg.style.display = 'none';
|
||||
|
||||
}
|
||||
else if ((editionchoisie == 'didier') || (editionchoisie == 'hatier')) {
|
||||
console.log("DH");
|
||||
document.getElementById("editionesthcoisieest").innerHTML = "";
|
||||
diviframe.style.display = ''
|
||||
divimg.style.display = 'none'
|
||||
diviframe.style.display = '';
|
||||
slider.style.display = '';
|
||||
divimg.style.display = 'none';
|
||||
}
|
||||
else if (editionchoisie == 'belin') {
|
||||
console.log("belin");
|
||||
document.getElementById("editionesthcoisieest").innerHTML = "ca bug encore";
|
||||
diviframe.style.display = 'none'
|
||||
divimg.style.display = ''
|
||||
diviframe.style.display = 'none';
|
||||
slider.style.display = 'none';
|
||||
divimg.style.display = '';
|
||||
}
|
||||
else {
|
||||
document.getElementById("editionesthcoisieest").innerHTML = "⚠ Cette édition n'est pas encore supportée ⚠";
|
||||
diviframe.style.display = 'none'
|
||||
divimg.style.display = 'none'
|
||||
diviframe.style.display = 'none';
|
||||
divimg.style.display = 'none';
|
||||
slider.style.display = 'none';
|
||||
}
|
||||
}
|
||||
|
||||
@ -124,7 +139,7 @@
|
||||
function urlachanger() {
|
||||
var code = document.getElementById("code").value;
|
||||
var editionchoisie = document.getElementsByName("edition")[0].value;
|
||||
changerURL(code, editionchoisie)
|
||||
changerURL(code, editionchoisie);
|
||||
}
|
||||
|
||||
function changerURL(code, editionchoisie) {
|
||||
@ -150,7 +165,6 @@
|
||||
|
||||
}
|
||||
|
||||
|
||||
url1 = newUrl1;
|
||||
url2 = newUrl2;
|
||||
page1 = 1;
|
||||
@ -160,9 +174,9 @@
|
||||
function pageachanger(delta) {
|
||||
console.log("pageachanger");
|
||||
var editionchoisie = document.getElementsByName("edition")[0].value;
|
||||
changerPage(delta, editionchoisie)
|
||||
changerPage(delta, editionchoisie);
|
||||
}
|
||||
|
||||
|
||||
function changerPage(delta, editionchoisie) {
|
||||
if (editionchoisie == 'hachette') {
|
||||
console.log("hachette");
|
||||
@ -223,10 +237,76 @@
|
||||
|
||||
function changerNBpage() {
|
||||
var nbpage = document.getElementById("nbpage").value;
|
||||
nbtochange = nbpage - page1
|
||||
changerPage(nbtochange)
|
||||
nbtochange = nbpage - page1;
|
||||
changerPage(nbtochange);
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function taille() {
|
||||
var entree = document.getElementById("slider");
|
||||
var myframe1 = document.getElementById("myframe1");
|
||||
var myframe2 = document.getElementById("myframe2");
|
||||
myframe1.style.width = entree.value + "px";
|
||||
myframe1.style.height = entree.value * 1.4 + "px";
|
||||
myframe2.style.width = entree.value + "px";
|
||||
myframe2.style.height = entree.value * 1.4 + "px";
|
||||
}
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function toggleFullScreen() {
|
||||
if (!document.fullscreenElement) {
|
||||
document.documentElement.requestFullscreen();
|
||||
} else if (document.exitFullscreen) {
|
||||
document.exitFullscreen();
|
||||
}
|
||||
}
|
||||
document.addEventListener("keydown", (e) => {
|
||||
if (e.key === "Enter") {
|
||||
toggleFullScreen();
|
||||
}
|
||||
}, false);
|
||||
</script>
|
||||
|
||||
<script>
|
||||
let toggleTheme = 0;
|
||||
var darkMode = getCookie("dark-mode");
|
||||
|
||||
function getCookie(name) {
|
||||
var value = "; " + document.cookie;
|
||||
var parts = value.split("; " + name + "=");
|
||||
if (parts.length == 2) return parts.pop().split(";").shift();
|
||||
}
|
||||
|
||||
// cookie pour le mode sombre
|
||||
function checkCookie() {
|
||||
if (darkMode == "true") {
|
||||
document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
|
||||
document.documentElement.style.setProperty('--background', '#262626');
|
||||
toggleTheme--;
|
||||
} else if (darkMode == "false") {
|
||||
document.documentElement.style.setProperty('--ecriture', '#262626');
|
||||
document.documentElement.style.setProperty('--background', '#f1f1f1');
|
||||
}
|
||||
}
|
||||
|
||||
// mode sombre
|
||||
const switchThemeBtn = document.querySelector('.changeTheme')
|
||||
switchThemeBtn.addEventListener('click', () => {
|
||||
if (toggleTheme === 0) {
|
||||
document.documentElement.style.setProperty('--ecriture', '#f1f1f1');
|
||||
document.documentElement.style.setProperty('--background', '#262626');
|
||||
document.cookie = "dark-mode=true; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
|
||||
toggleTheme--;
|
||||
} else {
|
||||
document.documentElement.style.setProperty('--ecriture', '#262626');
|
||||
document.documentElement.style.setProperty('--background', '#f1f1f1');
|
||||
document.cookie = "dark-mode=false; expires=Fri, 31 Dec 9999 23:59:59 GMT; path=/";
|
||||
toggleTheme++;
|
||||
}
|
||||
})
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
30
style.css
@ -1,20 +1,34 @@
|
||||
:root {
|
||||
--ecriture: black;
|
||||
--background: white;
|
||||
--police: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
|
||||
html {
|
||||
color-scheme: dark !important;
|
||||
background: var(--background);
|
||||
color: var(--ecriture);
|
||||
font-size: 1.5rem;
|
||||
font-family: var(--police);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
background-color: #f2f2f2;
|
||||
background-color: var(--background);
|
||||
}
|
||||
|
||||
#iframe {
|
||||
display: flex;
|
||||
height: 810px;
|
||||
margin: 5px;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
#img {
|
||||
display: flex;
|
||||
margin: 5px;
|
||||
width: 50%;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
img {
|
||||
@ -22,7 +36,8 @@ img {
|
||||
}
|
||||
|
||||
iframe {
|
||||
width: 100%;
|
||||
width: 553px;
|
||||
height: 794px;
|
||||
}
|
||||
|
||||
label {
|
||||
@ -38,6 +53,7 @@ input[type="text"] {
|
||||
font-size: 16px;
|
||||
line-height: 1.5;
|
||||
width: 300px;
|
||||
border-color: rgb(62, 68, 70);
|
||||
}
|
||||
|
||||
input[type="radio"] {
|
||||
@ -76,4 +92,8 @@ button:last-child {
|
||||
|
||||
h1 {
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #3391ff;
|
||||
}
|