KolibriOS/kolibrios.org
10
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

website: no screenshot previews

Browse Source 
git-svn-id: file:///var/kolibrios-org-repos@23 ae7b2cb0-843d-483b-9e9e-b8a90ea88d30
This commit is contained in:
leency 2021-06-22 10:57:55 +00:00
parent d5da67b88b
commit 297fde7229
15 changed files with 34 additions and 224 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
de/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

18
en/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

18
es/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

18
fr/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

BIN
i/slaid/minislaid1.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 4.0 KiB

BIN
i/slaid/minislaid2.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 9.0 KiB

BIN
i/slaid/minislaid3.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.6 KiB

BIN
i/slaid/minislaid4.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 6.6 KiB

BIN
i/slaid/minislaid5.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 8.6 KiB

BIN
i/slaid/minislaid6.png
View File

Binary file not shown.
Side by Side

Before

Width:  |  Height:  |  Size: 6.5 KiB

18
it/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

18
nl/screen.htm
View File

@ -34,22 +34,6 @@
</ul> </ul>
</div> </div>
<div id="carousel">
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen"> <div id="screen">
<div id="show" onclick="next()"> <div id="show" onclick="next()">
<img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'> <img id='slide1' src='/i/slaid/slaid1.png' alt="Kolibri empty desktop" class='visible'>
@ -61,5 +45,7 @@
</div> </div>
</div> </div>
<div id="carousel"></div>
</body> </body>
</html> </html>

35
ru/screen.htm
View File

@ -7,8 +7,8 @@
<meta name="description" content="Галерея скриншотов Kolibri"> <meta name="description" content="Галерея скриншотов Kolibri">
<meta name="keywords" content="kolibri, kolibrios, колибри, colibri, operating system, assembler, калибри, fasm, alternate, open source"> <meta name="keywords" content="kolibri, kolibrios, колибри, colibri, operating system, assembler, калибри, fasm, alternate, open source">
<meta name="viewport" content="width=device-width"> <meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="/style.css" charset="utf-8"> <link rel="stylesheet" type="text/css" href="../style.css" charset="utf-8">
<script type='text/javascript' src='/script.js'></script> <script type='text/javascript' src='../script.js'></script>
</head> </head>
<body onkeydown='checkkey(event)'> <body onkeydown='checkkey(event)'>
<div id="menu"> <div id="menu">
@ -35,29 +35,16 @@
</div> </div>
<div id="carousel"> <div id="carousel"></div>
<div id="spoiler" onclick="toggle_previews()">Kolibri empty desktop</div>
<div id="panel_minislides">
<button onclick="previous()"></button>
<button onclick="mini(1)" id="mslide1" class="active"></button>
<button onclick="mini(2)" id="mslide2"></button>
<button onclick="mini(3)" id="mslide3"></button>
<button onclick="mini(4)" id="mslide4"></button>
<button onclick="mini(5)" id="mslide5"></button>
<button onclick="mini(6)" id="mslide6"></button>
<button onclick="next()"></button>
</div>
</div>
<div id="screen" onclick="next()">
<div id="screen"> <div id="show" >
<div id="show" onclick="next()"> <img id='slide1' src='../i/slaid/slaid1.png' alt="Чистый стол Kolibri" class='visible'>
<img id='slide1' src='/i/slaid/slaid1.png' alt="Чистый стол Kolibri" class='visible'> <img id='slide2' src='../i/slaid/slaid2.png' alt="Демки">
<img id='slide2' src='/i/slaid/slaid2.png' alt="Демки"> <img id='slide3' src='../i/slaid/slaid3.png' alt="Файловые менеджеры">
<img id='slide3' src='/i/slaid/slaid3.png' alt="Файловые менеджеры"> <img id='slide4' src='../i/slaid/slaid4.png' alt="Сетевые приложения">
<img id='slide4' src='/i/slaid/slaid4.png' alt="Сетевые приложения"> <img id='slide5' src='../i/slaid/slaid5.png' alt="Игры">
<img id='slide5' src='/i/slaid/slaid5.png' alt="Игры"> <img id='slide6' src='../i/slaid/slaid6.png' alt="Средства разработчика">
<img id='slide6' src='/i/slaid/slaid6.png' alt="Средства разработчика">
</div> </div>
</div> </div>

54
script.js
View File

@ -2,8 +2,11 @@
var FIRST_IMG_ID = 1; var FIRST_IMG_ID = 1;
var LAST_IMG_ID = 6; var LAST_IMG_ID = 6;
var current = FIRST_IMG_ID; var current = LAST_IMG_ID;
var previews_visible = true;
window.onload = function() {
next();
}
function checkkey(e) function checkkey(e)
{ {
@ -13,60 +16,17 @@ function checkkey(e)
else if (keycode==27) { dropdown_hide(); } else if (keycode==27) { dropdown_hide(); }
} }
window.onload = function() {
if (document.getElementById("show"))
if (document.getElementById("screen").offsetHeight < 1200) setTimeout( 'toggle_previews();', 1000);
}
function next() { function next() {
document.getElementById("mslide"+current).className = "minislide";
document.getElementById("slide"+current).className = "minislide"; document.getElementById("slide"+current).className = "minislide";
if (current >= LAST_IMG_ID) current = FIRST_IMG_ID; else current++; if (current >= LAST_IMG_ID) current = FIRST_IMG_ID; else current++;
document.getElementById("slide"+current).className = "visible"; document.getElementById("slide"+current).className = "visible";
document.getElementById("mslide"+current).className = "minislide active"; document.getElementById("carousel").innerHTML = document.getElementById("slide"+current).alt;
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+current).alt;
} }
function previous() { function previous() {
document.getElementById("mslide"+current).className = "minislide";
document.getElementById("slide"+current).className = "minislide"; document.getElementById("slide"+current).className = "minislide";
if (current <= FIRST_IMG_ID) current = LAST_IMG_ID; else current--; if (current <= FIRST_IMG_ID) current = LAST_IMG_ID; else current--;
document.getElementById("slide"+current).className = "visible"; document.getElementById("slide"+current).className = "visible";
document.getElementById("mslide"+current).className = "minislide active"; document.getElementById("carousel").innerHTML = document.getElementById("slide"+current).alt;
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+current).alt;
}
function mini(new_current) {
document.getElementById("mslide"+current).className = "minislide";
document.getElementById("slide"+current).className = "minislide";
document.getElementById("slide"+new_current).className = "visible";
document.getElementById("mslide"+new_current).className = "minislide active";
document.getElementById("spoiler").innerHTML = document.getElementById("slide"+new_current).alt;
current = new_current;
}
function toggle_previews() {
if (previews_visible==true)
{
previews_visible=false;
hide_previews(0);
}
else
{
previews_visible = true;
document.getElementById("panel_minislides").style.height = "auto";
document.getElementById("spoiler").style.borderBottom = "1px #555 solid";
}
}
function hide_previews(i) {
if (i<80) {
document.getElementById("panel_minislides").style.height = 80 - i + "px";
i+=3;
setTimeout( 'hide_previews('+i+')', 1);
}
else
{
document.getElementById("spoiler").style.borderBottom = "0";
}
} }

61
style.css
View File

@ -225,68 +225,23 @@ td {
#carousel { #carousel {
position: fixed; position: fixed;
bottom:0; bottom:0;
left: 0; width: 500px;
width: 100%; padding: 0 7px;
left: calc(50% - 250px);
border-radius: 5px 5px 0 0;
text-align: center; text-align: center;
background: #333; background: #333;
z-index:9000; z-index:9000;
}
#carousel * {
vertical-align: middle; vertical-align: middle;
}
#panel_minislides button {
margin: 8px 8px;
outline: none;
width: 84px;
height: 64px;
background-repeat: no-repeat;
background-position: center;
border: 2px #444 solid;
}
#panel_minislides button:first-child { background-image: url(/i/scroll-left.gif);border:none;width:20px;}
#panel_minislides button:last-child { background-image: url(/i/scroll-right.gif);border:none;width:20px;}
#panel_minislides button:nth-child(2) {background-image: url(/i/slaid/minislaid1.png);}
#panel_minislides button:nth-child(3) {background-image: url(/i/slaid/minislaid2.png);}
#panel_minislides button:nth-child(4) {background-image: url(/i/slaid/minislaid3.png);}
#panel_minislides button:nth-child(5) {background-image: url(/i/slaid/minislaid4.png);}
#panel_minislides button:nth-child(6) {background-image: url(/i/slaid/minislaid5.png);}
#panel_minislides button:nth-child(7) {background-image: url(/i/slaid/minislaid6.png);}
#panel_minislides .active {
border-color: #fff !important;
}
#spoiler {
width:100%;
border-bottom:1px #555 solid;
cursor: pointer;
background: 7px 7px no-repeat url("/i/items.png");
color:#fff; color:#fff;
text-shadow: 1px 1px 0 #111; text-shadow: 1px 1px 0 #111;
} }
#show_previews {
position: absolute;
left: 7px;
top: 7px;
color:#888;
text-decoration:none;
}
iframe { iframe {
max-width: 100%; max-width: 100%;
} }
/* Adaptive coding */ /* Adaptive coding */
@media (max-width:864px) { @media (max-width:864px) {
@ -326,14 +281,6 @@ iframe {
display: none !important; display: none !important;
visibility: collapse; visibility: collapse;
} }
#show {
display: inline;
margin: 0;
display: block;
border: none;
overflow: visible;
margin-top: 40px;
}
.download table a { .download table a {
float: left; float: left;
display: block; display: block;