/SLAcer.js

Permalink
Switch branches/tags
Nothing to show
Find file
SLAcer.js/index.html
Fetching contributors…
Cannot retrieve contributors at this time
Raw Blame History
229 lines (216 sloc) 13.2 KB
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>SLAcer.js (bêta)</title>
<link rel="stylesheet" type="text/css" href="vendor/jquery-ui/jquery-ui.min.css" />
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" href="vendor/bootstrap-slider/css/bootstrap-slider.min.css" />
<link rel="stylesheet" type="text/css" href="css/main.css" />
</head>
<body>
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">SLAcer.js (bêta)</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#">About</a></li>
<li><a href="https://github.com/lautr3k/SLAcer.js">GitHub</a></li>
</ul>
</div>
</div>
</nav><!-- .navbar -->
<div class="body container-fluid">
<div id="sidebar">
<div class="form-group">
<button id="open-viewer-2d" class="btn btn-default btn-xs" type="button">
2D viewer <span class="glyphicon glyphicon-modal-window"></span>
</button>
</div>
<div id="file" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#file-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">File</h3>
</div>
<div id="file-body" class="panel-body collapse in">
<div class="form-group">
<span class="btn btn-default btn-file btn-xs">
Browse <input type="file" name="file" id="file-input" accept=".stl" />
</span>
<small>Or drop an STL file anywhere.</small>
</div>
</div>
</div><!-- #file -->
<div id="mesh" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#mesh-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">Mesh</h3>
</div>
<div id="mesh-body" class="panel-body collapse in">
<div class="info">
<span class="info-label">Faces</span>
<span class="info-value" id="mesh-faces">0</span>
</div>
<div class="info">
<span class="info-label">Width <small>(<span class="mesh-size-unit">mm</span>)</small></span>
<span class="info-value" id="mesh-size-x">0</span>
</div>
<div class="info">
<span class="info-label">Depth <small>(<span class="mesh-size-unit">mm</span>)</small></span>
<span class="info-value" id="mesh-size-y">0</span>
</div>
<div class="info">
<span class="info-label">Height <small>(<span class="mesh-size-unit">mm</span>)</small></span>
<span class="info-value" id="mesh-size-z">0</span>
</div>
<div class="info">
<span class="info-label">Volume <small>(ml)</small></span>
<span class="info-value" id="mesh-volume">0</span>
</div>
<div class="info">
<span class="info-label">Weight <small>(g)</small></span>
<span class="info-value" id="mesh-weight">0</span>
</div>
<div class="info">
<span class="info-label">Cost <small>($)</small></span>
<span class="info-value" id="mesh-cost">0</span>
</div>
</div>
</div><!-- #mesh -->
<div id="slicer" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#slicer-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">Slicer</h3>
</div>
<div id="slicer-body" class="panel-body collapse in">
<div class="form-group">
<label for="slicer-layers-height">Layers height <small>(μm)</small></label>
<input type="number" id="slicer-layers-height" class="form-control input-sm" placeholder="100" min="1" />
</div>
</div>
</div><!-- #slicer -->
<div id="build-volume" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#build-volume-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">Build volume</h3>
</div>
<div id="build-volume-body" class="panel-body collapse in">
<div class="form-group">
<label for="build-volume-x">X <small>(width)</small></label>
<input type="number" id="build-volume-x" class="form-control input-sm" placeholder="100" min="0" />
</div>
<div class="form-group">
<label for="build-volume-y">Y <small>(depth)</small></label>
<input type="number" id="build-volume-y" class="form-control input-sm" placeholder="100" min="0" />
</div>
<div class="form-group">
<label for="build-volume-z">Z <small>(height)</small></label>
<input type="number" id="build-volume-z" class="form-control input-sm" placeholder="100" min="0" />
</div>
<div class="form-group">
<label for="build-volume-unit">unit</label>
<input type="radio" name="build-volume-unit" id="build-volume-unit-in" value="in" /> in
<input type="radio" name="build-volume-unit" id="build-volume-unit-mm" value="mm" checked="checked" /> mm
</div>
</div>
</div><!-- #build-volume -->
<div id="resin" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#resin-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">Resin</h3>
</div>
<div id="resin-body" class="panel-body collapse in">
<div class="form-group">
<label for="resin-density">Density <small>(g / cm³)</small></label>
<input type="number" id="resin-density" class="form-control input-sm" placeholder="1.1" min="0" step="0.1" />
</div>
<div class="form-group">
<label for="resin-price">Price <small>($ / l)</small></label>
<input type="number" id="resin-price" class="form-control input-sm" placeholder="50" min="0" />
</div>
</div>
</div><!-- #resin -->
<div id="screen" class="panel panel-default">
<div class="panel-heading">
<button class="panel-toggle btn btn-default btn-xs pull-right" type="button" data-toggle="collapse" data-target="#screen-body">
<span class="glyphicon glyphicon-menu-down"></span>
</button>
<h3 class="panel-title">Screen</h3>
</div>
<div id="screen-body" class="panel-body collapse in">
<div class="form-group">
<label for="screen-width">Width <small>(px)</small></label>
<input type="number" id="screen-width" class="form-control input-sm" placeholder="1680" min="0" />
</div>
<div class="form-group">
<label for="screen-height">Height <small>(px)</small></label>
<input type="number" id="screen-height" class="form-control input-sm" placeholder="1050" min="0" />
</div>
<div class="form-group">
<label for="screen-diagonal-size">Diagonal size</label>
<input type="number" id="screen-diagonal-size" class="form-control input-sm" placeholder="22" min="0" />
</div>
<div class="form-group">
<label for="screen-diagonal-unit">Diagonal unit</label>
<input type="radio" name="screen-diagonal-unit" id="screen-diagonal-unit-in" value="in" checked="checked" /> in
<input type="radio" name="screen-diagonal-unit" id="screen-diagonal-unit-mm" value="mm" /> mm
</div>
</div>
</div><!-- #screen -->
</div><!-- #sidebar -->
<div id="main">
<div id="viewer3d" class="box fl">loading...</div>
</div><!-- #main -->
<div id="slider">
<span class="max">100</span>
<input id="ex4" type="text"
data-slider-min="0"
data-slider-max="100"
data-slider-step="1"
data-slider-value="0"
data-slider-tooltip="always"
data-slider-tooltip-position="left"
data-slider-orientation="vertical" />
<span class="min">0</span>
</div><!-- #main -->
</div><!-- .body -->
<script src="vendor/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="vendor/jquery-ui/jquery-ui.min.js" type="text/javascript"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js" type="text/javascript"></script>
<script src="vendor/bootstrap-slider/bootstrap-slider.min.js" type="text/javascript"></script>
<script src="vendor/lodash.min.js" type="text/javascript"></script>
<script src="vendor/three.min.js" type="text/javascript"></script>
<script src="vendor/earcut.js" type="text/javascript"></script>
<script src="vendor/triangulation.js" type="text/javascript"></script>
<script src="js/slacer/settings.js" type="text/javascript"></script>
<script src="js/slacer/mesh.js" type="text/javascript"></script>
<script src="js/slacer/viewer.js" type="text/javascript"></script>
<script src="vendor/OrbitControls.js" type="text/javascript"></script>
<script src="js/slacer/viewcontrols.js" type="text/javascript"></script>
<script src="js/slacer/viewer3d.js" type="text/javascript"></script>
<script src="js/slacer/viewer2d.js" type="text/javascript"></script>
<script src="js/slacer/slicer.js" type="text/javascript"></script>
<script src="js/loader/stl.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
</body>
</html>