LJ/doc/concepts.html

135 lines
6.6 KiB
HTML

<!DOCTYPE HTML>
<!--
Prologue by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
<html>
<head>
<title>LJ Laser server</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
<!--[if lte IE 9]><link rel="stylesheet" href="assets/css/ie9.css" /><![endif]-->
</head>
<body>
<!-- Header -->
<div id="header">
<div class="top">
<!-- Logo -->
<div id="logo">
<h1 id="title">L J doc</h1>
<p>by <a href="http://www.teamlaser.fr">/team/laser</a></p>
</div>
<!-- Nav -->
<nav id="nav">
<!--
Prologue's nav expects links in one of two formats:
1. Hash link (scrolls to a different section within the page)
<li><a href="#foobar" id="foobar-link" class="icon fa-whatever-icon-you-want skel-layers-ignoreHref"><span class="label">Foobar</span></a></li>
2. Standard link (rbss the user to another page/site)
<li><a href="http://foobar.tld" id="foobar-link" class="icon fa-whatever-icon-you-want"><span class="label">Foobar</span></a></li>
-->
<ul>
<li><a href="../www/index.html"id="top-link" class="skel-layers-ignoreHref"><span class="icon fa-home">Home</span></a></li>
<li><a href="features.html" id="portfolio-link" class="skel-layers-ignoreHref"><span class="icon fa-wifi">Features</span></a></li>
<li><a href="concepts.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">Concepts</span></a></li>
<li><a href="aurora.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">Aurora</span></a></li>
<li><a href="plugins.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">Plugins</span></a></li>
<li><a href="pointslists.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">Pointlists</span></a></li>
<li><a href="references.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">References</span></a></li>
<li><a href="etherdream/protocol.html" id="contact-link" class="skel-layers-ignoreHref"><span class="icon fa-cog">etherdream</span></a></li>
</ul>
</nav>
</div>
</div>
<!-- Main -->
<div id="main">
<!-- Sat -->
<section id="sat" class="three">
<div class="container" style="text-align: left">
<header>
<h2>Concepts</h2>
</header>
<img src="images/simu.png" style="border: 2px solid #111" alt="" /><br />
<span style="font-size: 0.9em;">webUI simulator</span><br /><br />
<p>L J has 5 main <strong>components</strong> :
<ul>
<li><strong>"Plugins"</strong> : points generators (to one or more lasers). Lot examples comes with LJ : planetarium, 3D anaglyph animations,... See plugins <a href="plugins.html" id="contact-link" class="skel-layers-ignoreHref">page</a>.</li>
<li>A <strong>"tracer"</strong> per etherdream/laser : take its given point list, correct geometry, recompute in laser controller coordinates, send it and report the etherdream status to the "manager". </li>
<li>A <strong>"manager"</strong> that talk to all tracers (which point list to draw, new geometry correction, setup parameters,...), handle I/Os (UI functions, OSC commands,...) and manage plugins (launch, checks,...)</li>
<li>A <strong>web GUI</strong> in html, css, and vanilla js. No html server or js framework here : it's complex enough. This GUI has a simulator, but one can used a builtin python simulator (pysimu) or an included etherdream/laser emulator ("visualiser" from nannou) to work without physical lasers !!</li>
<li>A <strong>network available database</strong> (redis) as backbone. "Plugins" send directly their points lists to redis and each "tracer" is instructed to get one of the available points list in redis.</li>
</ul>
<img src="images/layer.png" style="border: 2px solid #111" alt="" /><br />
<span style="font-size: 0.9em;">Add polylines to layers</span><br /><br />
<ul>
<li>
<strong>Sprites</strong> : "Polyline" (i.e : 4 closed points to draw a square) or "rPolyline" (with built in parameters to resize, rotate, translate,...).</li>
<li>
<strong>"Layers"</strong> : Store multiple Polylines or rPolylines. No layers limits. "Layer" = "Point List".</li>
<li>
<strong>"Destinations"</strong> : To what Scene/laser send a given layer. One layer can have multiple destinations (to duplicate content on different lasers). Destinations can be <strong>fixed</strong> or <strong>relative</strong> (like rPolyline with builtin resize, rotations,...).
</li>
</ul>
<img src="images/scenes.png" width="580" style="border: 2px solid #111" alt="" /><br />
<span style="font-size: 0.9em;">Virtual scenes with different or same layers.</span><br /><br />
<ul>
<li>
Up to 4 <strong>Virtual scenes</strong> for up to 4 lasers. You choose at anytime wich scene is actually drawn by lasers. Look, scene 3 uses the exact same man on one layer, but this layer is registered on 4 "relative destinations"(with different builtin resize parameter, one destination per laser).
</li>
<li>
<strong>"Objects"</strong> : Store parameters for a category. Imagine in a game suddenly all NPC turn to red. A<strong>"FixedObject"</strong>store parameters used in polylines, a<strong>"RelativeObject"</strong> store also additionnal parameters like rPolylines parameters.<br />
</li>
</ul>
</div>
</section>
</div>
<!-- Footer -->
<div id="footer">
<!-- Copyright -->
<p class="copyright">
LJ is CC NC
</p>
</div>
<!-- Scripts -->
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/jquery.scrolly.min.js"></script>
<script src="assets/js/jquery.scrollzer.min.js"></script>
<script src="assets/js/skel.min.js"></script>
<script src="assets/js/util.js"></script>
<!--[if lte IE 8]><script src="assets/js/ie/respond.min.js"></script><![endif]-->
<script src="assets/js/main.js"></script>
</body>
</html>