You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

209 lines
6.4 KiB
HTML

2 years ago
<!DOCTYPE html>
<html lang="en">
<head>
<title>MEGASTUDIO 🎯</title>
<link rel="stylesheet" type="text/css" href="/static/style.css" />
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width,initial-scale=1" />
<meta name="description" content="" />
</head>
<body>
<div id="layer_dark"></div>
<button id="close_all">X</button>
<button id="instruction_button">INSTRUCTION</button>
<div class="popup" id="instruction">dai è semplice, prova</div>
<button id="info_button">INFO</button>
<div class="popup" id="info">{{stack|safe}}</div>
<!-- <form action="/print" method="POST">
<input id="output" type="submit" value="PRINT"/>
</form> -->
<input id="output" type="submit" form="2print" value="PRINT" />
<button id="nav_button"></button>
<button id="custom_button"></button>
<div class="slider">
<input type="range" min="0" max="100" oninput="scivolo(this.value)">
<!-- <p id="rangeValue">100</p> -->
</div>
<div id="customizer">
<button id="darkbck">Dark</button>
<button onclick="">tema</button>
<button onclick="">tema</button>
<button onclick="">tema</button>
<button onclick="">tema</button>
</div>
<div id="navbar">
{% for key in data %}
<ul>
<li><a href="#{{key}}">{{key}}</a></li>
<ul>
<li>Box</li>
<ul>
{% for z in data[key][box]%}
<li><a href="{{rut}}{{key}}/{{box}}/{{z}}" download>{{z}}</a></li>
{% endfor %}
</ul>
</ul>
<ul>
<li>Showbar</li>
<ul>
{% for z in data[key][box]%}
<li><a href="{{rut}}{{key}}/{{showbar}}/{{z}}" download>{{z}}</a></li>
{% endfor %}
</ul>
</ul>
</ul>
{% endfor %}
<ul>
<li><a href="#(DE)Tour">(DE)Tour</a></li>
{% for key in dataDetour %}
<ul>
<li>{{key}}</li>
<ul>
<li>Box</li>
<ul>
{% for z in dataDetour[key][box]%}
<li><a href="{{rutDetour}}{{key}}/{{box}}/{{z}}" download>{{z}}</a></li>
{% endfor %}
</ul>
</ul>
<ul>
<li>Showbar</li>
<ul>
{% for z in dataDetour[key][box]%}
<li><a href="{{rutDetour}}{{key}}/{{showbar}}/{{z}}" download>{{z}}</a></li>
{% endfor %}
</ul>
</ul>
</ul>
{% endfor %}
</ul>
</div>
<form action="/print/" id="2print" method="POST">
</form>
<div class="container">
<input class="selector2print" type="checkbox" name="test" form="2print" value="(DE)Tour">
<input class="sliderLayout" id="(DE)TourL" type="range" name="(DE)Tour" form="2print" min="0" max="4" value="0"
oninput="layout(this.value,this.id)">
<div class="box (DE)Tour" id="(DE)Tour">
{% for key in dataDetour %}
{% for z in dataDetour[key][box]%}
{% if z.endswith("jpg") or z.endswith("jpeg") or z.endswith("png") or z.endswith("JPG") or z.endswith("JPEG") %}
<img src="{{rutDetour}}{{key}}/{{box}}/{{z}}">
{% elif z.endswith("tif")%}
<span></span>
{% else %}
<div>{{z|safe}}</div>
{% endif %}
{% endfor %}
{% endfor %}
</div>
</div>
{% for key in data %}
<div class="container">
<input class="selector2print" type="checkbox" name="test" form="2print" value="{{key}}">
<input class="sliderLayout" id="{{key}}L" type="range" name="{{key}}" form="2print" min="0" max="4" value="0" oninput="layout(this.value,this.id)">
<div class="showbar {{key}}">
{% for z in data[key][showbar]%}
{% if z.endswith("jpg") or z.endswith("jpeg") or z.endswith("png") or z.endswith("JPG") or z.endswith("JPEG") %}
<img src="{{rut}}{{key}}/{{showbar}}/{{z}}">
{% elif z.endswith("tif")%}
<span></span>
{% else %}
<div>{{z|safe}}</div>
{% endif %}
{% endfor %}
</div>
<div class="box {{key}}" id="{{key}}">
{% for z in data[key][box]%}
{% if z.endswith("jpg") or z.endswith("jpeg") or z.endswith("png") or z.endswith("JPG") or z.endswith("JPEG") %}
<img src="{{rut}}{{key}}/{{box}}/{{z}}">
{% elif z.endswith("tif")%}
<span></span>
{% else %}
<div>{{z|safe}}</div>
{% endif %}
{% endfor %}
</div>
<span class="title">{{key}}</span>
</div>
{% endfor %}
<script>
var container = [...document.getElementsByClassName("container")]
var showbar = [...document.getElementsByClassName("showbar")];
let slider = ''
if (localStorage.getItem("slider")){
storedValue = localStorage.getItem("slider")
slider = storedValue
document.querySelector(".showbar.Commensality").style.display = "block"
scivolo(slider)
}
else {
slider = 75
document.querySelector(".showbar.Commensality").style.display = "block"
scivolo(slider)
}
document.querySelector(".slider input").value = slider
function scivolo(value) {
localStorage.setItem('slider', value)
// console.log(value)
showbar.forEach(bar => {
bar.style.width = (100 - value) + '%'
});
container.forEach(current => {
current.style.width = value + '%';
});
}
function layout(val,which){
let currentClass = " containers"+val
let currentEl = which.slice(0, which.length - 1)
document.getElementById(currentEl).className = currentClass + ' box ' + currentEl
localStorage.setItem(currentEl, currentClass + ' box ' + currentEl)
console.log(which)
console.log(val)
}
</script>
<script src="/static/app.js"></script>
</body>
</html>