<!DOCTYPE html> <html> <head> <title>Doodle3D</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black" /> <link rel="apple-touch-icon-precomposed" href="img/icon.png"/> <meta id="Viewport" name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=yes"> <!-- Bootstrap --> <!--<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">--> <link href="css/normalize.css" rel="stylesheet" media="screen"> <link href="css/fixedPosInterface.css" rel="stylesheet" media="screen"> <link href="css/d3d_btns.css" rel="stylesheet" media="screen"> <link href="css/settingsPopup.css" rel="stylesheet" media="screen"> <style type="text/css"> .debugContainer { position: absolute; top: 0px; left: 0px; z-index: 500; display: none; } #debug_textArea { display:none; } .debugBtn { width: 25px; height: 25px; background-color: #03b; float:left; } .agentInfo { background: #fff; border: 1px #333 solid; display: none; float:left; opacity: .7; } .agentInfoToggle { display: block; } </style> </head> <body> <div class="debugContainer"> <div class="debugBtn"></div> <div class="agentInfo"></div> </div> <div id="landscape"> <div class="container"> <img class="bgTop" src="img/bg_top.png" /> <img class="bgMiddle" src="img/bg_middle.png" /> <img class="bgBottom" src="img/bg_bottom.png" /> <div class="buttons"> <img id="d3dlogo" src="img/logo_full.png" onclick="location.reload()"> <div class="btn" id="btnNew"></div> <!--<img class="btn" id="btnNew" src="img/buttons/btnNew.png">--> <img class="btn" id="btnPrevious" src="img/buttons/btnLeft.png"> <img class="btn" id="btnNext" src="img/buttons/btnRight.png"> <img class="btn" id="btnSave" src="img/buttons/btnSave.png"> <div class="btn" id="btnOops"></div> <img class="btn" id="btnPrint" src="img/buttons/btnPrint.png"> <img class="btn" id="btnStop" src="img/buttons/btnStop.png"> <img class="btn" id="btnInfo" src="img/buttons/btnInfo.png"> <img class="btn" id="btnSettings" src="img/buttons/btnSettings.png"> </div> </div> <div id="drawAreaContainer"> <canvas id="mycanvas"></canvas> <!--<svg id="svg">--> <!--<path id="path" d="M200 100 L450 100 L450 350 L200 350 L200 100" fill="none" stroke="black" stroke-width="3"/>--> <!--</svg>--> <canvas id="preview"></canvas> <div class="buttons cf"> <div id="btnsUpDown"> <div id="btnMoveUp"></div> <div id="btnMoveDown"></div> </div> <div id="btnsTurnLeftRight"> <div id="btnTwistLeft"></div> <div id="btnTwistRight"></div> </div> </div> </div> <div id="debug_textArea" style="position:absolute; bottom: -600px; width: 800px; height: 600px;"> <textarea rows="5" cols="115" id="textdump"></textarea> </div> <div id="contentOverlay"> <div id="settingsContainer"> <div id="settings"> <header> <img src="img/settings_lable.png" alt="settings"/> </header> <div class="content"> <div class="settings">henk</div> <div class="buttons"> <div class="btnOK"></div> </div> </div> </div> </div> </div> </div> <div id="portrait"> <img class="vertImage" src="img/bg_vertical2.png"/> </div> <script src="js/libs/jquery-1.8.3.min.js"></script> <!--<script src="js/libs/bootstrap.min.js"></script>--> <script src="js/settings.js"></script> <script src="js/d3dServerInterfacing.js"></script> <script src="js/buttonbehaviors.js"></script> <script src="js/canvasDrawing_v01.js"></script> <script src="js/previewRendering_v01.js"></script> <script src="js/doodlePrintCode.js"></script> <script src="js/gcodeGenerating_v01.js"></script> <script src="js/init_layout.js"></script> <!--<script src="js/draw_logic.js"></script>--> <script type="text/javascript"> // not using these at the moment $("#btnPrevious").css("opacity", "0.3"); $("#btnNext").css("opacity", "0.3"); $("#btnSave").css("opacity", "0.3"); $("#btnInfo").css("opacity", "0.3"); // $("#btnSettings").css("opacity", "0.3"); // var debug = true; $(function() { console.log("ready"); initLayouting(); initDoodleDrawing(); initPreviewRendering(); initButtonBehavior(); initSettingsPopup(); $("#settings .settings").load("settings.html", function() { console.log("finished loading settings.html, now loading settings..."); loadSettings(); }); if(debug) { console.log("debug mode"); $("body").css("overflow", "auto"); $("#debug_textArea").css("display", "block"); } // $("#mycanvas").css("scale", 0.5); //debug // generate_gcode(); }) </script> </body> </html>