-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
56 lines (43 loc) · 2.56 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="author" content="Žan Žnidar">
<title>Video collage projectfile maker</title>
<meta name="description" content="Create .fcpxml timeline projectfiles for video collages which you can then losslessly import into DaVinci Resolve and edit further!">
<style>
.selected { background-color: lightblue; }
</style>
</head>
<body>
<p id="unsupported" style="background-color: #ffcccc; color: #660000; padding: 2em 2em 2em 2em; width: 95%; margin: auto; border: #660000 solid 2px;">
Javascript must be enabled for this webste to run. <br>
Please enable javascript and use a non-outdated browser.
</p>
<p>See <a href="https://github.com/zznidar/video-collage-projectfile-maker#usage">instructions</a> on how to use this website</p>
<label for="inputfile">Choose a .fcpxml file of your timeline:</label>
<input type="file" id="inputpicker" name="inputfile" accept=".fcpxml">
<br>
<label for="rowssetting">How many rows should your collage have? (Set 0 for auto)</label>
<input type="number" id="rowssetting" name="rowssetting" min="0" value="0" placeholder="Number of rows (0 = auto)">
<label for="shufflebtn">Want to try with reordered clips?</label>
<button type="button" id="shufflebtn" name="shufflebtn">Shuffle my clips!</button> <i>Click two videos to swap them.</i>
<br><br>
<!-- <label for="previewscale">Resize preview to fit your screen:</label>
<input type="number" id="previewscale" name="previewscale" min="1" max="100" value="50" placeholder="Preview size [%]"> -->
<label for="downloadbtn">Are you satisfied with the preview?</label>
<button type="button" id="downloadbtn" name="downloadbtn">Download .fcpxml file!</button>
<br><br>
<div id="preview2" style="width: 1920px;height: 1080px;border: 5px solid black;position: relative; transform-origin: top left; transform: scale(0.5, 0.5);">
<!-- <div style="border: 5px solid #711525;width: 820.2530879999999px;height: 461.392362px;position: relative;position: absolute;left: 550px;top: 310px;transform: translate(-410px, -309px);"></div> -->
</div>
<!-- Write instructions on how to use it -->
<script src="ui.js"></script>
<script src="fcpxml-importer.js"></script>
<script src="collage-maker.js"></script>
<script src="fcpxml-exporter.js"></script>
<footer>
<p>Check out this project on <a href="https://github.com/zznidar/video-collage-projectfile-maker">GitHub</a>!</p>
</footer>
</body>
</html>