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.
112 lines
3.1 KiB
HTML
112 lines
3.1 KiB
HTML
<html>
|
|
<head>
|
|
<style>
|
|
|
|
body{
|
|
font-family:Helvetica;
|
|
|
|
}
|
|
.contain{
|
|
float: left;
|
|
width: 14%;
|
|
word-wrap:break-word;
|
|
height: 90vh;
|
|
}
|
|
.contain h1{
|
|
font-size: 20px;
|
|
margin-top: -0px;
|
|
padding: 10px;
|
|
|
|
}
|
|
.contain div{
|
|
font-size: 9px;
|
|
padding-left: 10px;
|
|
padding-right: 10px;
|
|
overflow: auto;
|
|
max-height: 90vh;
|
|
}
|
|
|
|
</style>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<div class="contain" ><h1>nouns</h1><div id="nouns"></div></div>
|
|
<div class="contain" ><h1>verbs</h1><div id="verbs"></div></div>
|
|
<div class="contain" ><h1>pronouns</h1><div id="pronouns"></div></div>
|
|
<div class="contain" ><h1>adverbs</h1><div id="adverbs"></div></div>
|
|
<div class="contain" ><h1>adjectives</h1><div id="adjectives"></div></div>
|
|
<div class="contain" ><h1>keywords</h1><div id="keywords"></div></div>
|
|
<div class="contain" ><h1>chars</h1><div id="chars"></div></div>
|
|
|
|
<script>
|
|
|
|
var canUpdate = 1;
|
|
|
|
$("#nouns, #verbs, #pronouns, #adverbs, #adjectives, #keywords, #chars").scroll(function() {
|
|
console.log("scrolling");
|
|
canUpdate = 0;
|
|
clearTimeout($.data(this, 'scrollTimer'));
|
|
$.data(this, 'scrollTimer', setTimeout(function() {
|
|
// do something
|
|
console.log("Haven't scrolled in 250ms!");
|
|
canUpdate = 1;
|
|
}, 800));
|
|
});
|
|
|
|
|
|
|
|
$( document ).ready( function () {
|
|
if(canUpdate == 1){
|
|
var userid = 1,
|
|
url = 'database.json',
|
|
callback = function (data) {
|
|
var nouns = data["nouns"];
|
|
var verbs = data["verbs"]
|
|
var pronouns = data["pronouns"]
|
|
var adverbs = data["adverbs"]
|
|
var adjectives = data["adjectives"]
|
|
var keywords = data["keywords"]
|
|
var chars = data["chars"]
|
|
$('#nouns').html(nouns.join("</br>"));
|
|
$('#verbs').html(verbs.join("</br>"));
|
|
$('#pronouns').html(pronouns.join("</br>"));
|
|
$('#adverbs').html(adverbs.join("</br>"));
|
|
$('#adjectives').html(adjectives.join("</br>"));
|
|
$('#keywords').html(keywords.join("</br>"));
|
|
$('#chars').html(chars.join(" "));
|
|
var wtf = $('#nouns');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#verbs');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#pronouns');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#adverbs');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#adjectives');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#keywords');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
var wtf = $('#chars');
|
|
var height = wtf[0].scrollHeight;
|
|
wtf.scrollTop(height);
|
|
console.log("now");
|
|
},
|
|
fetchData = function () {
|
|
$.getJSON(url, callback);
|
|
};
|
|
fetchData();
|
|
setInterval(fetchData, 5000);
|
|
}
|
|
|
|
|
|
});
|
|
</script>
|
|
</body>
|
|
</html>
|