<!DOCTYPE >
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta charset="windows-1252" />
    <meta content="charset=UTF-8" />
    <title>MODELLO 3D</title>
    <!--STYLESHEET-->
    <link type="text/css" rel="stylesheet" href="stylesheet/3dhop.css" />
    <!--SPIDERGL-->
    <script type="text/javascript" src="js/spidergl.js"></script>
    <!--JQUERY-->
    <script type="text/javascript" src="js/jquery.js"></script>
    <!--PRESENTER-->
    <script type="text/javascript" src="js/presenter.js"></script>
    <!--3D MODELS LOADING AND RENDERING-->
    <script type="text/javascript" src="js/nexus.js"></script>
    <script type="text/javascript" src="js/ply.js"></script>
    <!--TRACKBALLS-->
    <script type="text/javascript" src="js/trackball_turntable.js"></script>
    <script type="text/javascript" src="js/trackball_turntable_pan.js"></script>
    <script type="text/javascript" src="js/trackball_pantilt.js"></script>
    <script type="text/javascript" src="js/trackball_sphere.js"></script>
    <!--UTILITY-->
    <script type="text/javascript" src="js/init.js"></script>
  </head>
  <body>
    <div id="3dhop" class="tdhop" onmousedown="if (event.preventDefault) event.preventDefault()">
      <div id="tdhlg"></div>
      <div id="toolbar"> <img id="home" title="Home" src="skins/dark/home.png" /><br />
        <!--ZOOM--> <img id="zoomin" title="Zoom In" src="skins/dark/zoomin.png" /><br />
        <img id="zoomout" title="Zoom Out" src="skins/dark/zoomout.png" /><br />
        <!--ZOOM-->
        <!--LIGHTING--> <img id="lighting_off" title="Enable Lighting" src="skins/dark/lighting_off.png"

          style="position:absolute; visibility:hidden;" /> <img id="lighting" title="Disable Lighting"

          src="skins/dark/lighting.png" /><br />
        <!--LIGHTING-->
        <!--LIGHT--> <img id="light_on" title="Disable Light Control" src="skins/dark/lightcontrol_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="light" title="Enable Light Control"

          src="skins/dark/lightcontrol.png" /><br />
        <!--LIGHT-->
        <!--MEASURE--> <img id="measure_on" title="Disable Measure Tool" src="skins/dark/measure_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="measure" title="Enable Measure Tool"

          src="skins/dark/measure.png" /><br />
        <!--MEASURE-->
        <!--POINT PICKING--> <img id="pick_on" title="Disable PickPoint Mode" src="skins/dark/pick_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="pick" title="Enable PickPoint Mode"

          src="skins/dark/pick.png" /><br />
        <!--POINT PICKING-->
        <!--SECTIONS--> <img id="sections_on" title="Disable Plane Sections" src="skins/dark/sections_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="sections" title="Enable Plane Sections"

          src="skins/dark/sections.png" /><br />
        <!--SECTIONS-->
        <!--COLOR--> <img id="color_on" title="Disable Solid Color" src="skins/dark/color_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="color" title="Enable Solid Color"

          src="skins/dark/color.png" /><br />
        <!--COLOR-->
        <!--CAMERA--> <img id="perspective" title="Perspective Camera" src="skins/dark/perspective.png"

          style="position:absolute; visibility:hidden;" /> <img id="orthographic"

          title="Orthographic Camera" src="skins/dark/orthographic.png" /><br />
        <!--CAMERA-->
        <!--FULLSCREEN--> <img id="full_on" title="Exit Full Screen" src="skins/dark/full_on.png"

          style="position:absolute; visibility:hidden;" /> <img id="full" title="Full Screen"

          src="skins/dark/full.png" />
        <!--FULLSCREEN--> </div>
      <!--MEASURE-->
      <div id="measure-box" class="output-box">Measured length
        <hr /><span id="measure-output" class="output-text" onmousedown="event.stopPropagation()">0.0</span></div>
      <!--MEASURE-->
      <!--POINT PICKING-->
      <div id="pickpoint-box" class="output-box">XYZ picked point
        <hr /><span id="pickpoint-output" class="output-text" onmousedown="event.stopPropagation()">[
          0 , 0 , 0 ]</span></div>
      <!--POINT PICKING-->
      <!--SECTIONS-->
      <div id="sections-box" class="output-box">
        <table class="output-table" onmousedown="event.stopPropagation()">
          <tbody>
            <tr>
              <td>Plane</td>
              <td>Position</td>
              <td>Flip</td>
            </tr>
            <tr>
              <td><img id="xplane_on" title="Disable X Axis Section" src="skins/icons/sectionX_on.png"

                  onclick="sectionxSwitch()" style="position:absolute; visibility:hidden; border:1px inset;" />
                <img id="xplane" title="Enable X Axis Section" src="skins/icons/sectionX.png"

                  onclick="sectionxSwitch()" /></td>
              <td><input id="xplaneSlider" class="output-input" title="Move X Axis Section Position"

                  type="range" /></td>
              <td><input id="xplaneFlip" class="output-input" title="Flip X Axis Section Direction"

                  type="checkbox" /></td>
            </tr>
            <tr>
              <td><img id="yplane_on" title="Disable Y Axis Section" src="skins/icons/sectionY_on.png"

                  onclick="sectionySwitch()" style="position:absolute; visibility:hidden; border:1px inset;" />
                <img id="yplane" title="Enable Y Axis Section" src="skins/icons/sectionY.png"

                  onclick="sectionySwitch()" /></td>
              <td><input id="yplaneSlider" class="output-input" title="Move Y Axis Section Position"

                  type="range" /></td>
              <td><input id="yplaneFlip" class="output-input" title="Flip Y Axis Section Direction"

                  type="checkbox" /></td>
            </tr>
            <tr>
              <td><img id="zplane_on" title="Disable Z Axis Section" src="skins/icons/sectionZ_on.png"

                  onclick="sectionzSwitch()" style="position:absolute; visibility:hidden; border:1px inset;" />
                <img id="zplane" title="Enable Z Axis Section" src="skins/icons/sectionZ.png"

                  onclick="sectionzSwitch()" /></td>
              <td><input id="zplaneSlider" class="output-input" title="Move Y Axis Section Position"

                  type="range" /></td>
              <td><input id="zplaneFlip" class="output-input" title="Flip Z Axis Section Direction"

                  type="checkbox" /></td>
            </tr>
          </tbody>
        </table>
        <table class="output-table" onmousedown="event.stopPropagation()" style="text-align:right;">
          <tbody>
            <tr>
              <td>Show planes<input id="showPlane" class="output-input" title="Show Section Planes"

                  style="bottom:-3px;" type="checkbox" /></td>
              <td>Show edges<input id="showBorder" class="output-input" title="Show Section Edges"

                  style="bottom:-3px;" type="checkbox" /></td>
            </tr>
          </tbody>
        </table>
      </div>
      <!--SECTIONS--> <canvas id="draw-canvas" style="background-image: url(skins/backgrounds/light.jpg)">
      </canvas></div>
    <script type="text/javascript">
var presenter = null;

function setup3dhop() {
	presenter = new Presenter("draw-canvas");

	presenter.setScene({
		meshes: {
			"obj_1" : { 