past3d/pastebin/templates/pastebin/geometry.html

183 lines
5.2 KiB
HTML

{% extends "base.html" %}
{% block title %} {{ geometry.name }} {% endblock %}
{% 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">
{% if geometry.user %}
{{geometry.user.username}}
{% else %}
Anonymous
{% endif %}
</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 %}