|
|
<!DOCTYPE html> |
|
|
<html lang="en" class="h-100" data-bs-theme="auto"> |
|
|
<head> |
|
|
<script src="../assets/js/color-modes.js"></script> |
|
|
<meta charset="utf-8" /> |
|
|
<meta name="viewport" content="width=device-width, initial-scale=1" /> |
|
|
<meta name="description" content="" /> |
|
|
<meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors" /> |
|
|
<meta name="generator" content="Hugo 0.122.0" /> |
|
|
<title>Comic</title> |
|
|
<link rel="preconnect" href="https://fonts.googleapis.com"> |
|
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> |
|
|
<link href="https://fonts.googleapis.com/css2?family=Bungee+Spice&display=swap" rel="stylesheet"> |
|
|
|
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3" /> |
|
|
<link href="{{url_for('static', filename='bootstrap.min.css')}}" rel="stylesheet" /> |
|
|
<link rel="stylesheet" href="{{url_for('static', filename='styles.css')}}" /> |
|
|
</head> |
|
|
<body class="d-flex h-100 text-center text-bg-dark"> |
|
|
<div class="carousel"> |
|
|
<div id="preview-container"> |
|
|
<div id="video-container"> |
|
|
<video id="video-preview" controls autoplay></video> |
|
|
</div> |
|
|
<div id="iframe-container"> |
|
|
<iframe id="iframe-preview" width="560" height="415" src="#" title="YouTube video player" frameborder="0" |
|
|
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" |
|
|
referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe> |
|
|
</div> |
|
|
</div> |
|
|
<div class="box" id="box"> |
|
|
<h1 id="title">Comic</h1> |
|
|
<p id="description">An automated movie-to-comic generator</p> |
|
|
<div class="button-container"> |
|
|
<input type="file" id="fileInput" accept=".mp4" style="display: none" /> |
|
|
<button onclick="openFilePicker()" class="icon-button"> |
|
|
<img src="{{url_for('static', filename='images/upload.png')}}" alt="Upload Video" /> |
|
|
</button> |
|
|
<button onclick="toggleLinkInput()" class="icon-button"> |
|
|
<img src="{{url_for('static', filename='images/link.png')}}" alt="Enter Link" /> |
|
|
</button> |
|
|
</div> |
|
|
<div id="linkInputContainer" style="display: none"> |
|
|
<input type="text" id="link-input" placeholder="Enter Link" /> |
|
|
</div> |
|
|
<p id="fileName"></p> |
|
|
<button onclick="submitForm()" class="submit-button">Submit</button> |
|
|
<p id="submissionResult"></p> |
|
|
</div> |
|
|
</div> |
|
|
<script src="{{url_for('static', filename='script.js')}}"></script> |
|
|
<script src="{{url_for('static', filename='bootstrap.bundle.min.js')}}"></script> |
|
|
</body> |
|
|
</html> |
|
|
|
