archive/scratch-feed
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

studio and comments support

Browse source
This commit is contained in:
biglyderv 2024-09-18 05:02:20 -04:00
parent 1bb22a2808
commit a674674369
No known key found for this signature in database
GPG key ID: 33AC87E9ACE66954
3 changed files with 125 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
css/app.css
View file

@ -39,7 +39,8 @@ section#area-main {
} }
sub { sub {
color: rgb(33, 156, 70) color: rgb(33, 156, 70);
display: block;
} }
h1 { h1 {
@ -105,6 +106,10 @@ pre {
flex-wrap: wrap; flex-wrap: wrap;
} }
#area-main.nogrid {
display: block;
}
.proj { .proj {
text-align: center; text-align: center;
max-width: 240px; max-width: 240px;
@ -123,3 +128,26 @@ pre {
.eras a { .eras a {
margin-right: 10px; margin-right: 10px;
} }
.buttons {
display: flex;
}
.user {
width: 60px;
height: 60px;
border-radius: 60px;
}
.commenter {
display: flex;
}
pre {
max-width: 500px;
white-space: pre-wrap;
}
.commenter > div {
margin-bottom: 30px;
}

15
index.html
View file

@ -9,9 +9,17 @@
<body> <body>
<section> <section>
<h1><a href='https://codeberg.org/onezDerv/scratch-feed'>Scratch Feed</a></h1> <h1><a href='https://codeberg.org/onezDerv/scratch-feed'>Scratch Feed</a></h1>
<h2>Users to follow</h2> <p>
<textarea id='users'>User1 A clean, descriptive content aggregator for Scratch projects and other data.
User2 </p>
<span class='buttons'>
<button><a href='#user'>Projects</a></button>
<button><a href='#comment'>Comments</a></button>
</span>
<h2>Pages to follow</h2>
<textarea id='users'>@08draven
@GC_Collabs
#35236113
... ...
</textarea> </textarea>
<button id='submit'>Submit</button> <button id='submit'>Submit</button>
@ -19,6 +27,5 @@ User2
<section id='area-main'> <section id='area-main'>
</section> </section>
<script src='js/data.js'></script>
<script src='js/app.js'></script> <script src='js/app.js'></script>
</body> </body>

97
js/app.js
View file

@ -1,3 +1,5 @@
// All URLs listed here are from a custom NGINX config.
let area = document.querySelector('#area-main'); let area = document.querySelector('#area-main');
let entries = []; let entries = [];
let users = {}; let users = {};
@ -5,6 +7,7 @@ let fetchData;
let sum = 0; let sum = 0;
let doThings = false; let doThings = false;
let i = 0; let i = 0;
let studios = {};
async function genTree(treeId) { async function genTree(treeId) {
let entry = treeId; let entry = treeId;
@ -27,10 +30,20 @@ async function genTree(treeId) {
return entry; return entry;
} }
async function main() { //todo: rewrite
async function main(type) {
let users = document.querySelector('#users').value.split('\n'); let users = document.querySelector('#users').value.split('\n');
for (let user of users) {
let typed = user[0];
user = user.slice(1);
if (typed == '#') {
studios[typed] = await (fetch(`https://hf.zenoverse.net/studio/${user}`)
.then(x => x.json()));
}
}
let url = new URL(window.location); let url = new URL(window.location);
url.search = '?users=' + users.join('&users='); url.search = '?users=' + users.join('&users=');
history.pushState(null, '', url); history.pushState(null, '', url);
@ -38,11 +51,28 @@ async function main() {
entries = []; entries = [];
for (let user of users) { for (let user of users) {
let extraFetch = await fetch(`https://hf.zenoverse.net/user/${user}`, { let typed = user[0];
user = user.slice(1);
let extraFetch = [];
if (typed == '#' && type == '#user') {
extraFetch = await (fetch(`https://hf.zenoverse.net/studio_project/${user}`)
.then(x => x.json()));
extraFetch.forEach(x => {
x.studio = studios[typed].title;
x.studioID = typed
});
} else if (typed == '#' && type == '#comment') {
extraFetch = await (fetch(`https://hf.zenoverse.net/studio_comment/${user}`)
.then(x => x.json()));
extraFetch.forEach(x => x.studio = studios[typed].title);
} else if (typed == '@' && type == '#user') {
extraFetch = await (fetch(`https://hf.zenoverse.net/user/${user}`)
.then(x => x.json()));
extraFetch.forEach(x => x.username = user);
}
});
extraFetch = await extraFetch.json();
extraFetch.forEach(x => x.username = user);
entries = [...entries, ...extraFetch]; entries = [...entries, ...extraFetch];
} }
entries = entries.sort((a, b) => b.id - a.id); entries = entries.sort((a, b) => b.id - a.id);
@ -62,8 +92,9 @@ async function main() {
setInterval(function () { setInterval(function () {
if (doThings && (window.innerHeight + window.scrollY) >= document.body.scrollHeight - 25) if (!doThings || (window.innerHeight + window.scrollY) < document.body.scrollHeight - 25) return;
scroller(); if (type == '#user') scroller();
if (type == '#comment') commenter();
}, 500); }, 500);
} }
@ -73,12 +104,46 @@ function sanitize(content) {
return decoder.innerHTML; return decoder.innerHTML;
} }
function commenter() {
let h = '';
area.className = 'nogrid';
for (let j = 0; j < 10; j++) {
let entry = entries[i];
if (!entry) continue;
// ugly tbf
h += `<div class='commenter'>
<img src='https://uploads.scratch.mit.edu/get_image/user/${entry.author.id}_999x999.png' class='user' float='left'>
<div>
<div><b><a href='/users/${entry.author.username}'>${entry.author.username}</a></b></div>
<sub>In <a href='/studios/${entry.studioID}'>${entry.studio}</a></sub>
<pre>${entry.content}</pre>
<sub>${entry.datetime_created}</sub>
</div>
</div>
`
i++;
}
area.innerHTML += h;
}
function scroller() { function scroller() {
let h = ''; let h = '';
for (let j = 0; j < 35; j++) { for (let j = 0; j < 35; j++) {
let entry = entries[i]; let entry = entries[i];
if (!entry) continue; if (!entry) continue;
h += `<div class='proj'><a href="https://scratch.mit.edu/projects/${entry.id}"><img src='https://uploads.scratch.mit.edu/get_image/project/${entry.id}_1920x1080.png'>${entry.title}</a> <sub>by ${entry.username}</sub></div>`; // ugly tbf
h += `<div class='proj'>
<a href="https://scratch.mit.edu/projects/${entry.id}">
<img src='https://uploads.scratch.mit.edu/get_image/project/${entry.id}_1920x1080.png'>
${entry.title}
</a>
<sub>
by ${entry.username}
</sub>
<sub>
${entry.studio ? ' in ' + entry.studio : ''}
</sub>
</div>`;
i++; i++;
} }
area.innerHTML += h; area.innerHTML += h;
@ -86,11 +151,19 @@ function scroller() {
let sub = document.querySelector('#users'); let sub = document.querySelector('#users');
let params = new URLSearchParams(window.location.search).getAll('users'); let srch = new URLSearchParams(window.location.search)
let params = srch.getAll('users');
let val = params.join('\n') || sub.value; let val = params.join('\n') || sub.value;
sub.textContent = sub.value = val; sub.textContent = sub.value = val;
main(); main(window.location.hash || '#user');
document.querySelector('#submit').onclick = main; document.querySelector('#submit').onclick = () => main(window.location.hash || '#user');
document.querySelectorAll('.buttons button').forEach(x => x.onclick = function() {
window.setInterval(function() {
window.location.reload();
},100);
})