177 lines
5.0 KiB
HTML
177 lines
5.0 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block headeraddons %}
|
|
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
|
|
<style>
|
|
.chromeFrameInstallDefaultStyle {
|
|
margin-top: 10px;
|
|
width: 800px;
|
|
border: 5px solid blue;
|
|
}
|
|
</style>
|
|
|
|
<script src="{{STATIC_URL}}js/jquery-1.10.2.min.js"></script>
|
|
<script src="{{STATIC_URL}}js/thingview.js/three.min.js"></script>
|
|
<script src="{{STATIC_URL}}js/thingview.js/thingiview.js"></script>
|
|
|
|
<script>
|
|
$(window).load(function() {
|
|
// You may want to place these lines inside an onload handler
|
|
CFInstall.check({
|
|
mode: "inline", // the default
|
|
node: "prompt"
|
|
});
|
|
});
|
|
|
|
|
|
|
|
$(document).ready(function() {
|
|
thingiurlbase = "{{STATIC_URL}}js/thingview.js";
|
|
thingiview = new Thingiview("viewer",100,10);
|
|
thingiview.initScene();
|
|
thingiview.setObjectColor('#C0D8F0');
|
|
thingiview.setBackgroundColor('#eee');
|
|
thingiview.setRotation(false);
|
|
thingiview.setShowPlane(true);
|
|
thingiview.loadSTL('{{ geometry.file.url }}');
|
|
|
|
var wireframe = false;
|
|
var grid = true;
|
|
var rotate = false;
|
|
|
|
$('#view_wireframe').click(function() {
|
|
wireframe = !wireframe;
|
|
if(wireframe) {
|
|
thingiview.setObjectMaterial('wireframe');
|
|
$(this).addClass('pure-button-active');
|
|
}
|
|
else {
|
|
thingiview.setObjectMaterial('solid');
|
|
$(this).removeClass('pure-button-active');
|
|
}
|
|
});
|
|
|
|
$('#view_grid').click(function() {
|
|
grid = !grid;
|
|
|
|
thingiview.setShowPlane(grid);
|
|
|
|
if(grid) {
|
|
$(this).addClass('pure-button-active');
|
|
}
|
|
else {
|
|
$(this).removeClass('pure-button-active');
|
|
}
|
|
});
|
|
|
|
$('#view_rotate').click(function() {
|
|
rotate = !rotate;
|
|
|
|
thingiview.setRotation(rotate);
|
|
|
|
if(rotate) {
|
|
$(this).addClass('pure-button-active');
|
|
}
|
|
else {
|
|
$(this).removeClass('pure-button-active');
|
|
}
|
|
});
|
|
});
|
|
|
|
</script>
|
|
{% endblock %}
|
|
|
|
|
|
{% block content %}
|
|
<div id="content">
|
|
<div id="prompt">
|
|
<!-- if IE without GCF, prompt goes here -->
|
|
</div>
|
|
<h1>{{ geometry.name }}</h1>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-2-3">
|
|
<div id="viewer"></div>
|
|
</div>
|
|
<div class="pure-u-1-3">
|
|
<div id="fileinfos">
|
|
<h2><i class="icon-beaker"></i> Infos</h2>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-calendar"></i> <b>uploaded:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{ geometry.date}}<br/>
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-user"> </i><b>by:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.user.username}}
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<b><i class="icon-file"> </i> size:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.file.size | filesizeformat}}
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-code"></i> <b>polygons:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.get_polycount}}
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-resize-horizontal"></i> <b>width:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.get_width}}
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-resize-vertical"></i> <b>height:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.get_height}}
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-1-3">
|
|
<i class="icon-resize-full"></i> <b>depth:</b>
|
|
</div>
|
|
<div class="pure-u-2-3">
|
|
{{geometry.get_depth}}
|
|
</div>
|
|
</div>
|
|
|
|
<h2><i class="icon-download-alt"></i> Downloads</h2>
|
|
<a class="pure-button button-green" href="{{geometry.file.url}}"><i class="icon-download"></i> Download Model</a><br/>
|
|
{% if geometry.sourcefile %}
|
|
<a class="pure-button button-lightblue" href="{{geometry.sourcefile.url}}"><i class="icon-edit-sign"></i> Download Source</a>
|
|
{% endif %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="pure-g-r">
|
|
<div class="pure-u-2-3">
|
|
<div id="controls">
|
|
<button class="pure-button" id="view_wireframe">Wireframe</button>
|
|
<button class="pure-button pure-button-active" id="view_grid">Grid</button>
|
|
<button class="pure-button" id="view_rotate">Rotation</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="textcontainer">
|
|
{{ geometry.description }}
|
|
</div>
|
|
|
|
</div>
|
|
{% endblock %} |