Select Text read_text.html
mk_videos.html
<!DOCTYPE html>
<html>
<head>
<title>Index.html</title>
<style>
body {
background-color: #2C2C2C;
color: white;
font-family: Arial, sans-serif;
}
.refresh-button {
display: inline-block;
padding: 5px;
margin: 10px;
font-size: 2em;
background-color: orange;
color: rgb(0, 0, 0);
text-decoration: none;
border-radius: 5px;
margin: 1px;
}
.refresh-button2 {
display: inline-block;
padding: 5px;
margin: 10px;
font-size: 2em;
background-color: rgb(255, 225, 0);
color: rgb(0, 0, 0);
text-decoration: none;
border-radius: 5px;
margin: 1px;
}
.refresh-button:hover {
background-color: orange;
}
.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
background-color: orange;
padding: 10px 0;
z-index: 1000;
}
.video-gallery {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
figure {
max-width: 300px;
margin: 10px;
text-align: center;
}
figcaption {
margin-top: 8px;
font-size: 1rem;
color: #cccccc;
}
pre {
color: white;
font-size: 24px;
font-family: monospace;
white-space: pre-wrap;
word-wrap: break-word;
}
p {
color: white;
font-size: 24px;
font-family: monospace;
white-space: pre-wrap;
word-wrap: break-word;
}
img {
width: 200px;
height: auto;
display: block;
margin-bottom: 5px;
border-radius: 8px;
}
body {
background-color: rgb(156, 23, 23);
color: white;
font-family: Arial, sans-serif;
}
.refresh-button {
display: inline-block;
padding: 5px;
margin: 10px;
font-size: 2em;
background-color: orange;
color: rgb(0, 0, 0);
text-decoration: none;
border-radius: 5px;
margin: 1px;
}
.refresh-button2 {
display: inline-block;
padding: 5px;
margin: 10px;
font-size: 2em;
background-color: rgb(255, 225, 0);
color: rgb(0, 0, 0);
text-decoration: none;
border-radius: 5px;
margin: 1px;
}
.refresh-button3 {
display: inline-block;
padding: 5px;
margin: 10px;
font-size: 2em;
background-color: blue;
color: yellow;
text-decoration: none;
border-radius: 5px;
margin: 1px;
}
.refresh-button:hover {
background-color: orange;
}
.sticky {
position: -webkit-sticky;
position: sticky;
top: 0;
background-color: orange;
padding: 10px 0;
z-index: 1000;
}
.video-gallery {
display: flex;
flex-wrap: wrap;
justify-content: space-around;
}
figure {
max-width: 300px;
margin: 10px;
text-align: center;
}
figcaption {
margin-top: 8px;
/* Keep the same margin */
font-size: 1.2vw;
/* Set a specific font size */
color: #cccccc;
/* Consistent color */
line-height: 1.5;
/* Set a specific line height for consistency */
text-align: center;
/* Center align if necessary */
}
.container {
max-width: 800px;
margin: 0 auto;
padding: 20px;
background: rgb(156, 23, 23);
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.button {
display: inline-block;
padding: 10px 20px;
margin: 5px;
font-size: 23px;
color: black;
background-color: orange;
border: none;
border-radius: 5px;
text-decoration: none;
text-align: center;
cursor: pointer;
}
.button:hover {
background-color: orange;
}
.round {
display: inline-block;
padding: 15px 15px 15px 15px;
min-width: 1vw;
min-height: 1vw;
font-size: 18px;
color: black;
background-color: red;
border: 2px black solid;
border-radius: 50%;
text-decoration: none;
text-align: center;
cursor: pointer;
}
.responsive-img {
width: 256px;
height: 384px;
object-fit: cover;
display: block;
}
</style>
</head>
<body style="background-color: rgb(156, 23, 23);">
<center>
<h1 style="color: orange">
FlaskArchitect's Video Processing mk_videos.html
</h1>
<a href="{{ url_for('index') }}" class="refresh-button2">HOME</a>
<a href="{{ url_for('mk_novel') }}" class="refresh-button2">Novel</a>
<a
href="{{ url_for('mk_videos') }}" class="refresh-button2">Vid Process</a> <a href="{{ url_for('img_processing_route') }}" class="refresh-button2">Img
Process</a> <a href="{{ url_for('utilities') }}"
class="refresh-button2">Utilities</a> <a href="{{ url_for('home2') }}"
class="refresh-button2">blog</a><br /><br /><a href="{{ url_for('video_edit') }}"
class="refresh-button2">Trim Video</a>
<a href="{{ url_for('ffmpeg') }}" class="refresh-button">Run an Ffmpeg Cmd</a>
<a href="{{ url_for('png_overlay') }}" class="refresh-button">png_overlay</a><br/><br />
<a href="{{ url_for('clean_storage_route') }}" class="refresh-button">Remove Unwanted Video Images</a><br /><br />
<a href="{{ url_for('get_videos') }}" class="refresh-button">View Video History</a>
<br />
<br />
<a href="{{ url_for('add_novel_text') }}" class="refresh-button">Add Text</a>
<a href="{{ url_for('title_route') }}" class="refresh-button">Add Title Video</a>
<a href="{{ url_for('remove_images') }}" class="refresh-button3">Remove_images from Store</a><br />
<br />
<div class="container">
<h1>Control Panel</h1>
<a href="{{ url_for('convert_images_route') }}" class="button">Convert Images</a>
<a href="{{ url_for('refresh_all_route') }}" class="button">Refresh All (Create Title First)</a>
</div>
<hr />
<br />
<a href="{{ url_for('upload_form') }}" class="refresh-button">Upload Form</a>
<a href="{{ url_for('upload_mp4_video') }}" class="refresh-button">Upload mp4</a>
<a href="{{ url_for('delete_file') }}" class="refresh-button">Delete mp4</a>
<a href="{{ url_for('concat_videos') }}" class="refresh-button">concat_videos</a><br /><br />
<a href="{{ url_for('mk_prompt_route') }}" class="refresh-button">Create Text2Image Prompts</a><br /><br />
<form action="/get_images" method="post">
<button type="submit">Get Three Random Images</button> |
</form>
<br />
<hr>
<br />
<hr>
<h3>Video Gallery</h3>
<!-- Include the menu -->
{% include 'video_menu.html' %}
<hr>
<h3>Video Gallery End</h3>
<img class="responsive-img" src="static/temp_exp/x.gif" />
</div>
</center>
<script>
document.querySelectorAll("video source").forEach(source => {
const video = source.parentElement;
source.src = source.src + "?v=" + new Date().getTime(); // Add a timestamp
video.load(); // Reload the video
});
</script>
</body>
</html>
Back to file list