Initial commit
This commit is contained in:
32
master/templates/404.html
Normal file
32
master/templates/404.html
Normal file
@ -0,0 +1,32 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>CYCLESCALER | 404 - Not Found</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link rel="stylesheet" href="/public/css/semantic.min.css">
|
||||
<style>body{border-top: 30px solid rgb(0, 181, 173);}</style>
|
||||
<noscript>
|
||||
<style>
|
||||
.dropdown:hover > .menu { display: block; }
|
||||
.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
|
||||
</style>
|
||||
</noscript>
|
||||
<script src="/public/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/public/js/semantic.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui container">
|
||||
<br />
|
||||
<div class="ui negative message">
|
||||
<div class="header">
|
||||
404
|
||||
</div>
|
||||
<p>The job was not found</p>
|
||||
</div>
|
||||
<a href="/">
|
||||
<div class="ui fluid button">
|
||||
Return to Home
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
95
master/templates/home.html
Normal file
95
master/templates/home.html
Normal file
@ -0,0 +1,95 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>CYCLESCALER | Upload .blend</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link rel="stylesheet" href="/public/css/semantic.min.css">
|
||||
<style>body{border-top: 30px solid rgb(0, 181, 173);}</style>
|
||||
<noscript>
|
||||
<style>
|
||||
.dropdown:hover > .menu { display: block; }
|
||||
.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
|
||||
</style>
|
||||
</noscript>
|
||||
<script src="/public/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/public/js/semantic.min.js"></script>
|
||||
<script>
|
||||
function uploading() {
|
||||
$("#form").submit()
|
||||
$("#form").hide("slow", function() {
|
||||
//animation complete
|
||||
$("#uploading").show("slow", function() {
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
$( document ).ready(function() {
|
||||
$("#uploading").hide()
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui container">
|
||||
<br >
|
||||
<div class="ui teal segment">
|
||||
<h1 class="ui header">
|
||||
<i class="cube icon"></i>
|
||||
<div class="content">CYCLESCALER</div>
|
||||
<div class="sub header">Containerized Distributed Redering System</div>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="ui teal segment">
|
||||
<h3 class="ui header">
|
||||
<i class="cloud upload icon"></i>
|
||||
<div class="content">File Upload</div>
|
||||
<div class="sub header">Queue a new render</div>
|
||||
</h3>
|
||||
<form id="form" class="ui large form" enctype="multipart/form-data" action="/upload" method="post">
|
||||
<p>To get started, select the .blend file you would like to render. The only prerequisite for using this service is that the output for the rendering be set to be PNG images with a path of "./"</p>
|
||||
<input type="hidden" name="token" value="{{.Token}}" />
|
||||
<div id="fileForm">
|
||||
<label for="fileselect" class="ui fluid icon button">
|
||||
<i class="file icon"></i>
|
||||
Select a .blend File
|
||||
</label>
|
||||
<input type="file" id="fileselect" name="uploadfile" onchange="uploading()" style="display:none">
|
||||
</div>
|
||||
</form>
|
||||
<div id="uploading" class="ui segment">
|
||||
<div class="ui active inverted dimmer">
|
||||
<div class="ui text loader">Uploading file - please wait...</div>
|
||||
</div>
|
||||
<br /><br /><br />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="ui teal segment">
|
||||
<h3 class="ui header">
|
||||
<i class="cubes icon"></i>
|
||||
<div class="content">Render Job List</div>
|
||||
<div class="sub header">A directory of 3D render jobs</div>
|
||||
</h3>
|
||||
{{if .NotNoJobs}}
|
||||
{{range .Jobs}}
|
||||
<div class="ui attached segment">
|
||||
<a href="/jobStatus?token={{.Token}}">
|
||||
<h5 class="ui header">
|
||||
<i class="cube icon"></i>
|
||||
<div class="content">Job {{.Token}} - {{.CompletePercentage}}%</div>
|
||||
<div class="sub header">{{.StartTime}}</div>
|
||||
</h5>
|
||||
</a>
|
||||
|
||||
<div class="ui bottom attached indicating progress" data-percent="{{.CompletePercentage}}" id="progressbar{{.Token}}">
|
||||
<div class="bar"></div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{else}}
|
||||
<p>No jobs have been created. Why not start one by uploading a file above?</p>
|
||||
{{end}}
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
32
master/templates/invalidMime.html
Normal file
32
master/templates/invalidMime.html
Normal file
@ -0,0 +1,32 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>CYCLESCALER | Invalid MIME Type</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link rel="stylesheet" href="/public/css/semantic.min.css">
|
||||
<style>body{border-top: 30px solid rgb(0, 181, 173);}</style>
|
||||
<noscript>
|
||||
<style>
|
||||
.dropdown:hover > .menu { display: block; }
|
||||
.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
|
||||
</style>
|
||||
</noscript>
|
||||
<script src="/public/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/public/js/semantic.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui container">
|
||||
<br />
|
||||
<div class="ui negative message">
|
||||
<div class="header">
|
||||
Wrong file type
|
||||
</div>
|
||||
<p>We expected 'application/x-blender' but received a file with MIME type '{{.UploadedFileMime}}'. Usually this means that the uploaded file is not a valid .blend file. Please try opening the file on your computer to confirm.</p>
|
||||
</div>
|
||||
<a href="/">
|
||||
<div class="ui fluid button">
|
||||
Return to Home
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
122
master/templates/jobStatus.html
Normal file
122
master/templates/jobStatus.html
Normal file
@ -0,0 +1,122 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>CYCLESCALER | Status</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link rel="stylesheet" href="/public/css/semantic.min.css">
|
||||
<style>body{border-top: 30px solid rgb(0, 181, 173);}</style>
|
||||
<noscript>
|
||||
<style>
|
||||
.dropdown:hover > .menu { display: block; }
|
||||
.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
|
||||
</style>
|
||||
</noscript>
|
||||
<script src="/public/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/public/js/semantic.min.js"></script>
|
||||
<script>
|
||||
function copyWget(){
|
||||
var copyText = document.getElementById("wget");
|
||||
copyText.select();
|
||||
document.execCommand("copy");
|
||||
}
|
||||
$( document ).ready(function() {
|
||||
$('#progressbarJob').progress();
|
||||
{{range .Job.Wips}}
|
||||
$('#progressbar{{.FrameNumber}}').progress();
|
||||
{{end}}
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui container">
|
||||
<br >
|
||||
<div class="ui teal segment">
|
||||
<h1 class="ui header">
|
||||
<i class="cube icon"></i>
|
||||
<div class="content">CYCLESCALER</div>
|
||||
<div class="sub header">Containerized Distributed Redering System</div>
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<div class="ui teal segment">
|
||||
<div class="ui two column very relaxed grid">
|
||||
<div class="column">
|
||||
<h3 class="ui header">
|
||||
<i class="globe icon"></i>
|
||||
<div class="content">
|
||||
Job Status
|
||||
<div class="sub header">{{.Job.BlendFileName}}</div>
|
||||
</div>
|
||||
</h3>
|
||||
<p>Job Token: {{.Job.Token}}</p>
|
||||
<div class="ui action input">
|
||||
<input id="wget" type="text" value="wget -r -nc --cut-dirs=3 -nH "https://deadbeef.codes:8098/public/renderedframes/{{.Job.Token}}" ; rm -f renderedframes">
|
||||
<button class="ui teal right labeled icon button" onclick="copyWget()">
|
||||
<i class="copy icon"></i>
|
||||
wget Images
|
||||
</button>
|
||||
</div>
|
||||
<p><a href="/public/renderedframes">Individual rendered frames</a></p>
|
||||
{{if .Job.Completed}}
|
||||
<div class="ui large positive icon message">
|
||||
<i class="checkered flag icon"></i>
|
||||
<div class="content">Rendering Completed!</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{if not .Job.Completed}}
|
||||
<br />
|
||||
<div class="ui big indicating progress" data-percent="{{.Job.CompletePercentage}}" id="progressbarJob">
|
||||
<div class="bar">
|
||||
<div class="progress">{{.Job.CompletePercentage}}%</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
<div class="column">
|
||||
<a href="{{.LatestImage}}"><img class="ui fluid rounded image" src="{{.LatestImage}}"></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui vertical divider"></div>
|
||||
</div>
|
||||
|
||||
<div class="ui teal segment">
|
||||
<h3 class="ui header">
|
||||
<i class="cubes icon"></i>
|
||||
<div class="content">In Progress</div>
|
||||
</h3>
|
||||
{{if .InProgress}}
|
||||
{{range .Job.Wips}}
|
||||
<div class="ui attached segment">
|
||||
<h3 class="ui header">
|
||||
<i class="cube icon"></i>
|
||||
<div class="content">Frame {{.FrameNumber}} - {{.CompletePercentage}}%</div>
|
||||
<div class="ui right floated button" tabindex="0">{{.SlaveName}}</div>
|
||||
</h3>
|
||||
{{.Output}}
|
||||
|
||||
{{if .BadHealth}}<div class="ui inverted progress warning" data-percent="{{.CompletePercentage}}" id="progressbar{{.FrameNumber}}"><div class="ui red message">Render slave has lost contact with master. </div>{{end}}
|
||||
{{if not .BadHealth}}<div class="ui bottom attached indicating progress" data-percent="{{.CompletePercentage}}" id="progressbar{{.FrameNumber}}">{{end}}
|
||||
<div class="bar">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
{{end}}
|
||||
{{if not .InProgress}}
|
||||
<p>Rendering is not currently in progress</p>
|
||||
{{end}}
|
||||
</div>
|
||||
|
||||
<div class="ui teal segment">
|
||||
<h3 class="ui header">
|
||||
<i class="images icon"></i>
|
||||
<div class="content">Completed Frames</div>
|
||||
</h3>
|
||||
{{ if .UseTinyImages }}<div class="ui tiny images"> {{ else }}<div class="ui small images">{{ end }}
|
||||
{{ range .Images }}
|
||||
<a href="/{{.RenderedFramePath}}"><img class="ui rounded image" src="/{{.ThumbnailPath}}"/></a>
|
||||
{{ end }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
39
master/templates/settings.html
Normal file
39
master/templates/settings.html
Normal file
@ -0,0 +1,39 @@
|
||||
<html>
|
||||
<head>
|
||||
<title>CYCLESCALER | Job Configuration</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
<link rel="stylesheet" href="/public/css/semantic.min.css">
|
||||
<style>body{border-top: 30px solid rgb(0, 181, 173);}</style>
|
||||
<noscript>
|
||||
<style>
|
||||
.dropdown:hover > .menu { display: block; }
|
||||
.ui.secondary.menu .dropdown.item > .menu { margin-top: 0; }
|
||||
</style>
|
||||
</noscript>
|
||||
<script src="/public/js/jquery-3.4.1.min.js"></script>
|
||||
<script src="/public/js/semantic.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<div class="ui container">
|
||||
<br >
|
||||
<div class="ui teal segment">
|
||||
<h1 class="ui header">
|
||||
<i class="cube icon"></i>
|
||||
<div class="content">CYCLESCALER</div>
|
||||
<div class="sub header">Containerized Distributed Redering System</div>
|
||||
</h1>
|
||||
</div>
|
||||
<div class="ui teal segment">
|
||||
<p>Settings for file "{{.BlendFileName}}"</p>
|
||||
<form class="ui form" enctype="multipart/form-data" action="/settings" method="post">
|
||||
<div class="required field">
|
||||
<label>Render Frames</label>
|
||||
<input type="input" name="renderframes" placeholder="1-40,46,50-60" />
|
||||
</div>
|
||||
<input type="hidden" name="token" value="{{.Token}}"/>
|
||||
<input type="submit" class="ui submit button"></input>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user