replace index with test
This commit is contained in:
Flummi
parent
da08de7b79
commit
03c9bb9a48
|
|
@ -2,19 +2,44 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>f0ck me!</title>
|
||||
<link rel="stylesheet" type="text/css" href="./s/style.css">
|
||||
<link rel="icon" type="image/gif" href="./s/favicon.gif" />
|
||||
<link rel="stylesheet" type="text/css" href="./s/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="navbar"><a href="/">f0ck.me</a> | <a href="/how">how to</a> | <a href="/contact">Contact</a></div><br />
|
||||
<div style="text-align: center;">
|
||||
<div style="display: inline-block;">
|
||||
<div class="centeredthumbs">
|
||||
{% for item in items %}
|
||||
<div class="mrhankyisteinneger"><a href="./{{ item.id }}" title="{{ item.mime }}"><img src="./t/{{ item.id }}.png" /></a></div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="body">
|
||||
<div id="posts" data-last="{{ last }}">
|
||||
{% for item in items %}
|
||||
<a href="./{{ item.id }}" title="{{ item.mime }}"><img class="thumb" src="//f0ck.me/t/{{ item.id }}.png" /></a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
</html>
|
||||
<div style="position: fixed; top:0;right:0" id="debug"></div>
|
||||
<script src="./s/jquery-3.1.0.min.js"></script>
|
||||
<script>
|
||||
var scrollListener = function () {
|
||||
$(window).one("scroll", function () {
|
||||
if($(window).scrollTop() + 256 >= $(document).height() - $(window).height()) {
|
||||
$.ajax({
|
||||
url: './api/p/'+$('#posts').data('last'),
|
||||
dataType: 'json',
|
||||
success: function(msg) {
|
||||
var html = "";
|
||||
for(var i = 0; i < msg.items.length; i++)
|
||||
if(msg.items[i].id)
|
||||
html += "<a href=\"./"+msg.items[i].id+"\" title=\""+msg.items[i].mime+"\"><img class=\"thumb\" src=\"//f0ck.me/t/"+msg.items[i].id+".png\" /></a>\n";
|
||||
$('#posts').append(html);
|
||||
$('#posts').data('last', msg.last);
|
||||
}
|
||||
});
|
||||
}
|
||||
setTimeout(scrollListener, 50);
|
||||
});
|
||||
};
|
||||
$(document).ready(function () {
|
||||
scrollListener();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
48
s/style.css
48
s/style.css
|
|
@ -1,13 +1,32 @@
|
|||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
width: 100%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
.mrhankyisteinneger > a > img {
|
||||
max-height: 128px;
|
||||
max-width: 128px;
|
||||
border: 2px solid #4c4a4a;
|
||||
margin: 0;
|
||||
.body {
|
||||
width: 90%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
.thumb {
|
||||
border: 0;
|
||||
margin: 0 8px 8px 0;
|
||||
float: left;
|
||||
border: 2px solid #4c4a4a;
|
||||
}
|
||||
.thumb:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.clear {
|
||||
clear: both;
|
||||
padding: 1em 0;
|
||||
}
|
||||
a {
|
||||
color: #9f0;
|
||||
|
|
@ -15,6 +34,7 @@ a {
|
|||
a:hover {
|
||||
color: #74c100;
|
||||
}
|
||||
|
||||
.medium {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
|
@ -27,15 +47,6 @@ a:hover {
|
|||
text-align: center;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.mrhankyisteinneger {
|
||||
padding: 0;
|
||||
display: block;
|
||||
margin: 0 0 4px 5px;
|
||||
float: left;
|
||||
}
|
||||
.mrhankyisteinneger:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.controls {
|
||||
text-align: center;
|
||||
padding-top: 10px;
|
||||
|
|
@ -51,9 +62,4 @@ a:hover {
|
|||
}
|
||||
code {
|
||||
color: #9df943;
|
||||
}
|
||||
.centeredthumbs {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-flow: row wrap;
|
||||
}
|
||||
36
s/test.css
36
s/test.css
|
|
@ -1,36 +0,0 @@
|
|||
html, body {
|
||||
height: 100%;
|
||||
}
|
||||
body {
|
||||
width: 100%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
.body {
|
||||
width: 90%;
|
||||
margin: 1em auto 3em auto;
|
||||
background-color: #262626;
|
||||
color: #fff;
|
||||
font-family: Monospace;
|
||||
}
|
||||
.thumb {
|
||||
border: 0;
|
||||
margin: 0 8px 8px 0;
|
||||
float: left;
|
||||
border: 2px solid #4c4a4a;
|
||||
}
|
||||
.thumb:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
.clear {
|
||||
clear: both;
|
||||
padding: 1em 0;
|
||||
}
|
||||
a {
|
||||
color: #9f0;
|
||||
}
|
||||
a:hover {
|
||||
color: #74c100;
|
||||
}
|
||||
22
s/test.js
22
s/test.js
|
|
@ -1,22 +0,0 @@
|
|||
var scrollListener = function () {
|
||||
$(window).one("scroll", function () {
|
||||
if($(window).scrollTop() + 256 >= $(document).height() - $(window).height()) {
|
||||
$.ajax({
|
||||
url: './api/p/'+$('#posts').data('last'),
|
||||
dataType: 'json',
|
||||
success: function(msg) {
|
||||
var html = "";
|
||||
for(var i = 0; i < msg.items.length; i++)
|
||||
if(msg.items[i].id)
|
||||
html += "<a href=\"./"+msg.items[i].id+"\" title=\""+msg.items[i].mime+"\"><img class=\"thumb\" src=\"//f0ck.me/t/"+msg.items[i].id+".png\" /></a>\n";
|
||||
$('#posts').append(html);
|
||||
$('#posts').data('last', msg.last);
|
||||
}
|
||||
});
|
||||
}
|
||||
setTimeout(scrollListener, 50);
|
||||
});
|
||||
};
|
||||
$(document).ready(function () {
|
||||
scrollListener();
|
||||
});
|
||||
|
|
@ -1,21 +0,0 @@
|
|||
<!DOCTYPE blah>
|
||||
<html>
|
||||
<head>
|
||||
<title>f0ck me!</title>
|
||||
<link rel="icon" type="image/gif" href="./s/favicon.gif" />
|
||||
<link rel="stylesheet" type="text/css" href="./s/test.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="body">
|
||||
<div id="posts" data-last="{{ last }}">
|
||||
{% for item in items %}
|
||||
<a href="./{{ item.id }}" title="{{ item.mime }}"><img class="thumb" src="//f0ck.me/t/{{ item.id }}.png" /></a>
|
||||
{% endfor %}
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
</div>
|
||||
<div style="position: fixed; top:0;right:0" id="debug"></div>
|
||||
<script src="./s/jquery-3.1.0.min.js"></script>
|
||||
<script src="./s/test.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -38,18 +38,6 @@ function Websrv(tbot, tsql, tlib) {
|
|||
};
|
||||
if(filePath == "./index.html") { // mainpage
|
||||
var tpl = swig.compile(templates.index);
|
||||
var data = { items: [] };
|
||||
sql.query("select `id`,`mime` from `f0ck`.`items` order by `id` desc", (err, rows, fields) => {
|
||||
rows.forEach((e,i,a) => {
|
||||
data.items.push({ "id": e.id, "mime": e.mime });
|
||||
});
|
||||
res.writeHead(200, { 'Content-Type': 'text/html' });
|
||||
res.end(tpl(data), 'utf-8');
|
||||
});
|
||||
}
|
||||
|
||||
else if(filePath == "./test") { // (test)mainpage
|
||||
var tpl = swig.compile(templates.test);
|
||||
var data = {
|
||||
items: [],
|
||||
last: 10000
|
||||
|
|
@ -63,7 +51,6 @@ function Websrv(tbot, tsql, tlib) {
|
|||
res.end(tpl(data), 'utf-8');
|
||||
});
|
||||
}
|
||||
|
||||
else if(Number.isInteger(parseInt(url))) { // itempage
|
||||
var query = "select * from `f0ck`.`items` where `id` = ? limit 1; " // get item
|
||||
+ "select `id` from `f0ck`.`items` where `id` = (select min(`id`) from `f0ck`.`items` where `id` > ?); " // get previous item
|
||||
|
|
@ -288,7 +275,6 @@ Websrv.prototype.getTpls = () => {
|
|||
"item": fs.readFileSync("./s/item.tpl.html", "utf-8"),
|
||||
"how": fs.readFileSync("./s/how.tpl.html", "utf-8"),
|
||||
"contact": fs.readFileSync("./s/contact.tpl.html", "utf-8"),
|
||||
"scripts": fs.readFileSync("./s/scripts.tpl.html", "utf-8"),
|
||||
"test": fs.readFileSync("./s/test.tpl.html", "utf-8")
|
||||
"scripts": fs.readFileSync("./s/scripts.tpl.html", "utf-8")
|
||||
};
|
||||
};
|
||||
Loading…
Reference in New Issue
Block a user