|
1 | | -<!DOCTYPE html> |
2 | | -<html lang="en"> |
3 | | -<head> |
4 | | - <meta charset="UTF-8"> |
5 | | - <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
6 | | - <title>Coding Hut Wiki</title> |
7 | | - <script> |
8 | | - const apiUrl = 'https://api.jsonbin.io/v3/b/67c73db1e41b4d34e4a0bfb1/latest'; |
9 | | - |
10 | | - async function fetchPages() { |
11 | | - try { |
12 | | - const response = await fetch(apiUrl); |
13 | | - |
14 | | - // Check if the response is OK |
15 | | - if (!response.ok) { |
16 | | - console.error("Failed to fetch data", response.statusText); |
17 | | - return; |
18 | | - } |
19 | | - |
20 | | - const data = await response.json(); |
21 | | - console.log('Fetched data:', data); // Log the entire data object |
22 | | - |
23 | | - // Assuming pages are located directly in the response (adjust as needed) |
24 | | - const pages = data.record || []; // If the pages are in a 'record' property, adjust accordingly |
25 | | - if (Array.isArray(pages)) { |
26 | | - renderPages(pages); |
27 | | - } else { |
28 | | - console.error("Pages data is not an array:", pages); |
29 | | - } |
30 | | - } catch (error) { |
31 | | - console.error("Error fetching pages:", error); |
32 | | - } |
33 | | - } |
34 | | - |
35 | | - async function createPage() { |
36 | | - const title = document.getElementById('createTitle').value; |
37 | | - const content = document.getElementById('createContent').value; |
38 | | - if (!title || !content) return; |
39 | | - |
40 | | - await fetch(apiUrl, { |
41 | | - method: 'POST', |
42 | | - headers: { 'Content-Type': 'application/json' }, |
43 | | - body: JSON.stringify({ title, body: content }) |
44 | | - }); |
45 | | - |
46 | | - // Clear the input fields and refresh the list of pages |
47 | | - document.getElementById('createTitle').value = ''; |
48 | | - document.getElementById('createContent').value = ''; |
49 | | - fetchPages(); |
50 | | - } |
51 | | - |
52 | | - async function editPage(id, currentTitle, currentContent) { |
53 | | - const newTitle = prompt('New title:', currentTitle); |
54 | | - const newContent = prompt('New content:', currentContent); |
55 | | - if (newTitle && newContent !== null) { |
56 | | - await fetch(`${apiUrl}/${id}`, { |
57 | | - method: 'PUT', |
58 | | - headers: { 'Content-Type': 'application/json' }, |
59 | | - body: JSON.stringify({ title: newTitle, body: newContent }) |
60 | | - }); |
61 | | - fetchPages(); |
62 | | - } |
63 | | - } |
64 | | - |
65 | | - async function deletePage(id) { |
66 | | - if (confirm("Are you sure that you want to delete this page? Abusing the delete function can result in a ban from Coding Hut.") == true) { |
67 | | - await fetch(`${apiUrl}/${id}`, { method: 'DELETE' }); |
68 | | - fetchPages(); |
69 | | - alert("The page has been deleted."); |
70 | | - } else { |
71 | | - alert("Cancelled!"); |
72 | | - } |
73 | | - |
74 | | - } |
75 | | - |
76 | | - function renderPages(pages) { |
77 | | - const pagesDiv = document.getElementById('pages'); |
78 | | - pagesDiv.innerHTML = ''; |
79 | | - |
80 | | - if (pages.length === 0) { |
81 | | - pagesDiv.innerHTML = '<p>No wiki pages found.</p>'; |
82 | | - } |
83 | | - pages.forEach(page => { |
84 | | - pagesDiv.innerHTML += ` |
85 | | - <div class="card"> |
86 | | - <div class="card-content"> |
87 | | - <strong>${page.title}</strong> |
88 | | - <p>${page.body}</p> |
89 | | - </div> |
90 | | - <div class="actions"> |
91 | | - <b>Page Actions</b> |
92 | | - <button onclick="editPage(${page.id}, '${page.title}', '${page.body}')">✏️ Edit</button> |
93 | | - <button onclick="deletePage(${page.id})">🗑️ Delete</button> |
94 | | - <a href="https://scratch-coding-hut.github.io/Wiki/report-page"> |
95 | | - <button>⛳️ Report</button> |
96 | | - </a> |
97 | | - </div> |
98 | | - </div>`; |
99 | | - }); |
100 | | - } |
101 | | - |
102 | | - window.onload = fetchPages; |
103 | | - </script> |
104 | | - <style> |
105 | | - body { |
106 | | - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; |
107 | | - background: #0f172a; |
108 | | - color: #f8fafc; |
109 | | - margin: 0; |
110 | | - padding: 0; |
111 | | - } |
112 | | - |
113 | | - .container { |
114 | | - max-width: 800px; |
115 | | - margin: 50px auto; |
116 | | - padding: 20px; |
117 | | - } |
118 | | - |
119 | | - .card { |
120 | | - background: #1e293b; |
121 | | - padding: 20px; |
122 | | - border-radius: 16px; |
123 | | - margin-bottom: 15px; |
124 | | - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5); |
125 | | - transition: transform 0.2s, box-shadow 0.2s; |
126 | | - } |
127 | | - |
128 | | - .card:hover { |
129 | | - transform: scale(1.02); |
130 | | - box-shadow: 0 8px 20px rgba(0, 0, 0, 0.7); |
131 | | - } |
132 | | - |
133 | | - .card-content { |
134 | | - margin-bottom: 10px; |
135 | | - } |
136 | | - |
137 | | - .card-content strong { |
138 | | - font-size: 1.5em; |
139 | | - color: #38bdf8; |
140 | | - } |
141 | | - |
142 | | - .actions { |
143 | | - display: flex; |
144 | | - gap: 10px; |
145 | | - } |
146 | | - |
147 | | - button { |
148 | | - padding: 10px 15px; |
149 | | - border-radius: 12px; |
150 | | - border: none; |
151 | | - background: #38bdf8; |
152 | | - color: #0f172a; |
153 | | - font-weight: bold; |
154 | | - cursor: pointer; |
155 | | - transition: background 0.3s ease-in-out; |
156 | | - } |
157 | | - |
158 | | - button:hover { |
159 | | - background: #7dd3fc; |
160 | | - } |
161 | | - |
162 | | - .form-container { |
163 | | - margin-bottom: 20px; |
164 | | - background: #1e293b; |
165 | | - padding: 20px; |
166 | | - border-radius: 8px; |
167 | | - box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3); |
168 | | - } |
169 | | - |
170 | | - .form-container input, |
171 | | - .form-container textarea { |
172 | | - width: 100%; |
173 | | - padding: 10px; |
174 | | - margin-bottom: 10px; |
175 | | - border-radius: 8px; |
176 | | - border: 1px solid #38bdf8; |
177 | | - background: #0f172a; |
178 | | - color: #f8fafc; |
179 | | - font-size: 1em; |
180 | | - } |
181 | | - |
182 | | - .form-container button { |
183 | | - width: 100%; |
184 | | - } |
185 | | - |
186 | | - h2 { |
187 | | - font-size: 1.8em; |
188 | | - color: #38bdf8; |
189 | | - } |
190 | | - </style> |
191 | | -</head> |
192 | | -<body> |
193 | | - <center><h1>Coding Hut Wiki</h1></center> |
194 | | - <div class="container"> |
195 | | - <h2>Create New Wiki Page</h2> |
196 | | - You can create a new wiki page using the below form. |
197 | | - <div class="form-container"> |
198 | | - <input type="text" id="createTitle" placeholder="Enter title" /> |
199 | | - <textarea id="createContent" placeholder="Enter content"></textarea> |
200 | | - <button onclick="createPage()">➕ Create Wiki Page</button> |
201 | | - </div> |
202 | | - |
203 | | - <h2>Wiki Pages</h2> |
204 | | - The wiki pages will appear below, we may have a search function in the future as well. |
205 | | - <div id="pages"> |
206 | | - <!-- List of pages will appear here --> |
207 | | - </div> |
208 | | - <div class="container"> |
209 | | - By using the Coding Hut Wiki, you agree to the <a href="https://scratch-coding-hut.github.io/Wiki/wiki-guidelines">Wiki Guidelines, which can be found by clicking here</a>. |
210 | | - </div> |
211 | | - </div> |
212 | | -</body> |
213 | | -</html> |
| 1 | +<script>window.location.href = "https://scratch-hut-wiki.netlify.app/"</script> |
0 commit comments