123 lines
5.4 KiB
HTML
123 lines
5.4 KiB
HTML
<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>
|