-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathreports-feed.html
More file actions
142 lines (126 loc) · 5.99 KB
/
reports-feed.html
File metadata and controls
142 lines (126 loc) · 5.99 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>MyScratchBlocks Report Feed</title>
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
font-family: "Inter", sans-serif;
background-color: #f4f7f6;
color: #333;
}
::-webkit-scrollbar {
width: 8px;
}
::-webkit-scrollbar-track {
background: #e0e0e0;
border-radius: 10px;
}
::-webkit-scrollbar-thumb {
background: #a0a0a0;
border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
background: #777;
}
</style>
</head>
<body class="min-h-screen flex flex-col items-center py-8 px-4 sm:px-6 lg:px-8">
<!-- Header -->
<header class="w-full max-w-4xl bg-white rounded-xl shadow-lg p-6 mb-8 text-center">
<h1 class="text-4xl sm:text-5xl font-extrabold text-gray-800 mb-2">MyScratchBlocks Reports Feed</h1>
<p class="text-lg text-gray-600">These are all the user's reports, all found below, for free!</p>
</header>
<!-- Main Content -->
<main class="w-full max-w-4xl flex-grow bg-white rounded-xl shadow-lg p-6">
<div id="posts-container" class="grid gap-6 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-2">
<p id="loading-message" class="text-center text-gray-500 text-lg col-span-full">Loading reports, please wait...</p>
</div>
<div id="message-box" class="hidden mt-6 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded-md relative" role="alert">
<strong class="font-bold">Error!</strong>
<span class="block sm:inline" id="message-text"></span>
</div>
</main>
<!-- Footer -->
<footer class="w-full max-w-4xl text-center text-gray-600 mt-8">
<p>© <span id="current-year"></span>. The Reports Feed should only be used to fight abuse and not for anything else.</p>
<p class="text-sm mt-1">Powered by the RSS feed provided by Blogger</p>
</footer>
<script>
document.addEventListener('DOMContentLoaded', () => {
document.getElementById('current-year').textContent = new Date().getFullYear();
const allowedUsers = ["kRxZy_kRxZy", "MyScratchedAccount"];
const username = localStorage.getItem('username');
if (!allowedUsers.includes(username)) {
document.body.innerHTML = `
<div class="text-center mt-40 text-red-600 text-xl font-semibold">
Access denied. Only specific users can view this page. Are you logged in to the right account?
</div>
`;
return;
}
const BLOGGER_RSS_FEED_URL = 'https://api.feednami.com/api/v1/feeds/load?url=https://myscratchblocks-report.blogspot.com/feeds/posts/default';
const postsContainer = document.getElementById('posts-container');
const loadingMessage = document.getElementById('loading-message');
const messageBox = document.getElementById('message-box');
const messageText = document.getElementById('message-text');
function displayMessage(message, type = 'error') {
messageText.textContent = message;
messageBox.classList.remove('hidden');
messageBox.classList.toggle('bg-green-100', type === 'success');
messageBox.classList.toggle('border-green-400', type === 'success');
messageBox.classList.toggle('text-green-700', type === 'success');
messageBox.classList.toggle('bg-red-100', type === 'error');
messageBox.classList.toggle('border-red-400', type === 'error');
messageBox.classList.toggle('text-red-700', type === 'error');
}
async function fetchBloggerPostsFromRSS() {
try {
const response = await fetch(`https://api.rss2json.com/v1/api.json?rss_url=https://myscratchblocks-report.blogspot.com/feeds/posts/default`);
if (!response.ok) {
throw new Error("Unable to fetch RSS feed.");
}
const data = await response.json();
loadingMessage.classList.add('hidden');
if (data.status === 'ok' && data.items.length > 0) {
postsContainer.innerHTML = '';
data.items.forEach((item, index) => {
const snippet = item.description ? item.description.replace(/<[^>]*>/g, '').substring(0, 1000) + '... And there is more to read.' : 'No content found.';
const postElement = document.createElement('div');
postElement.className = 'bg-gray-50 p-6 rounded-lg shadow-md hover:shadow-xl transition-shadow duration-300 transform hover:-translate-y-1';
postElement.innerHTML = `
<h2 class="text-2xl font-semibold text-gray-800 mb-2">
<a href="${item.link}" target="_blank" class="hover:underline text-indigo-600">${item.title}</a>
</h2>
<p class="text-gray-700 text-base leading-relaxed mb-4">${snippet}</p>
<div class="flex justify-between items-center">
<a href="${item.link}" target="_blank" class="px-4 py-2 bg-indigo-500 text-white font-medium rounded-md hover:bg-indigo-600 transition">
Read More
</a>
<button class="delete-btn px-3 py-1 bg-red-500 text-white text-sm rounded hover:bg-red-600" data-index="${index}">Eliminate</button>
</div>
`;
postsContainer.appendChild(postElement);
});
// Handle delete buttons
document.querySelectorAll('.delete-btn').forEach(btn => {
btn.addEventListener('click', (e) => {
const post = e.target.closest('div.bg-gray-50');
post.remove();
});
});
} else {
postsContainer.innerHTML = '<p class="text-center text-gray-500 text-lg col-span-full">No reports found or RSS feed empty.</p>';
}
} catch (error) {
loadingMessage.classList.add('hidden');
displayMessage(`Error: ${error.message}`, 'error');
}
}
fetchBloggerPostsFromRSS();
});
</script>
</body>
</html>