Merge branch 'dev'
This commit is contained in:
ForeverPyrite
30
app/website/index.html
Normal file
30
app/website/index.html
Normal file
@@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en-us">
|
||||
|
||||
<head>
|
||||
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<title>Screw You Bardo</title>
|
||||
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='style.css') }}">
|
||||
<link rel="icon" type="image/x-icon" href="https://www.foreverpyrite.com/favicon.ico">
|
||||
<script src="{{ url_for('static', filename='script.js')}}"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<div class="content">
|
||||
<pre id="response-area">Response will appear here.</pre>
|
||||
<div class="form_box">
|
||||
<input id="url_box" placeholder="Paste the lecture URL here." autofocus></input>
|
||||
<input id="submit" type="submit" onclick=""></input>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
BIN
app/website/static/font-files/nimbus-sans-d-ot-light.woff
Normal file
BIN
app/website/static/font-files/nimbus-sans-d-ot-light.woff
Normal file
Binary file not shown.
BIN
app/website/static/font-files/nimbus-sans-d-ot-light.woff2
Normal file
BIN
app/website/static/font-files/nimbus-sans-d-ot-light.woff2
Normal file
Binary file not shown.
80
app/website/static/script.js
Normal file
80
app/website/static/script.js
Normal file
@@ -0,0 +1,80 @@
|
||||
document.addEventListener("DOMContentLoaded", (event) => {
|
||||
const response_area = document.getElementById('response-area');
|
||||
const submit_button = document.getElementById('submit')
|
||||
submit_button.addEventListener('click', function() {
|
||||
var url = document.getElementById('url_box').value;
|
||||
|
||||
if (!url) {
|
||||
response_area.innerText = 'Please enter a URL.';
|
||||
return;
|
||||
}
|
||||
else {
|
||||
document.getElementById('url_box').value = "";
|
||||
}
|
||||
|
||||
// First, process the URL
|
||||
fetch('/process_url', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/x-www-form-urlencoded',
|
||||
},
|
||||
body: new URLSearchParams({ url: url })
|
||||
})
|
||||
.then(response => {
|
||||
if (!response.ok) {
|
||||
throw new Error('Network response was not ok');
|
||||
}
|
||||
// Extract the text from the response body
|
||||
return response.text(); // Use .json() if the response is JSON
|
||||
})
|
||||
.then(text => {
|
||||
submit_button.style.display = "none";
|
||||
if (text === "Processing started. Check /stream_output for updates.") {
|
||||
streamOutput(response_area);
|
||||
} else {
|
||||
response_area.innerText = text; // Show any other response message
|
||||
submit_button.style.display = "flex";
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error processing URL:', error);
|
||||
response_area.innerText = 'Error processing URL: ' + error.message;
|
||||
submit_button.style.display = "flex";
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
function streamOutput(response_area) {
|
||||
// Fetch the streaming output
|
||||
const streamResponsePromise = fetch('/stream_output');
|
||||
response_area.innerHTML = ""
|
||||
|
||||
streamResponsePromise
|
||||
.then(response => {
|
||||
const reader = response.body.getReader();
|
||||
const decoder = new TextDecoder("utf-8");
|
||||
|
||||
function readStream() {
|
||||
reader.read().then(({ done, value }) => {
|
||||
if(done) {
|
||||
document.getElementById('submit').style.display = "flex";
|
||||
return
|
||||
}
|
||||
// Decode and process the chunk
|
||||
const chunk = decoder.decode(value, { stream: true });
|
||||
response_area.innerHTML += chunk;
|
||||
response_area.scrollTop = response_area.scrollHeight
|
||||
|
||||
// Continue reading
|
||||
readStream();
|
||||
});
|
||||
}
|
||||
|
||||
// Start reading the stream
|
||||
readStream();
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error fetching stream:', error);
|
||||
response_area.innerText = 'Error fetching stream: ' + error.message;
|
||||
});
|
||||
}
|
||||
78
app/website/static/style.css
Normal file
78
app/website/static/style.css
Normal file
@@ -0,0 +1,78 @@
|
||||
|
||||
|
||||
@font-face {
|
||||
font-family: 'nimbus_sans_d_otlight';
|
||||
src: url('font-files/nimbus-sans-d-ot-light.woff2') format('woff2'),
|
||||
url('font-files/nimbus-sans-d-ot-light.woff') format('woff');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
* {
|
||||
font-family: 'nimbus_sans_d_otlight';
|
||||
color: white;
|
||||
}
|
||||
|
||||
body {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
max-width: 100vw;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
max-height: 100vh;
|
||||
margin: 0;
|
||||
background-color: rgb(31, 31, 31);
|
||||
}
|
||||
|
||||
body .content {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-self: center;
|
||||
width: 75%;
|
||||
max-width: 65vw;
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
max-height: 100vh;
|
||||
}
|
||||
|
||||
#response-area {
|
||||
display: block;
|
||||
height: 90%;
|
||||
min-height: 90vh;
|
||||
text-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
align-content: flex-end;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.form_box {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-between;
|
||||
align-content: space-around;
|
||||
}
|
||||
|
||||
#url_box {
|
||||
display: flex;
|
||||
height: 5%;
|
||||
min-height: 5vh;
|
||||
width: 90%;
|
||||
min-width: 80vh;
|
||||
background-color: rgb(31, 31, 31);
|
||||
}
|
||||
|
||||
#submit {
|
||||
display: flex;
|
||||
width: 5%;
|
||||
min-width: 3vw;
|
||||
background-color: rgb(49, 49, 49);
|
||||
}
|
||||
#submit:hover {
|
||||
cursor: pointer;
|
||||
background-color: rgb(31, 31, 31);
|
||||
}
|
||||
|
||||
input {
|
||||
border-radius: 15px;
|
||||
}
|
||||
Reference in New Issue
Block a user