Add built-in Octoprint support

calibration.html

@@ -255,10 +255,8 @@ <h6 id="fl" >First layer gcode generator</h6>
         <!-- firstlayerForm -->
         <form name="firstlayerForm" id="firstlayerForm" onsubmit="return false;">
             <script>
-            createForm("firstlayer");    
+                createForm("firstlayer");
             </script>
-            <p><input type="button" onclick="processGcode(form)" value="Download Gcode"></p>
-            <p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters"> <input type="button" onclick="outputSettings(form)" value="Output Settings Summary"></p>
         </form>
         <h2>Interpreting Results:</h2>
         <p>Please use the following video as a guide to this test:</p>
@@ -285,10 +283,8 @@ <h6 id="bl">Baseline test print generator</h6>
         <!-- baselineForm -->
         <form name="baselineForm" id="baselineForm" onsubmit="return false;">
             <script>
-                createForm("baseline");    
+                createForm("baseline");
             </script>
-            <p><input type="button" onclick="processGcode(form)" value="Download Gcode"></p>
-            <p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters"> <input type="button" onclick="outputSettings(form)" value="Output Settings Summary"></p>
         </form>
         <h2>Interpreting Results:</h2>
         <p>Please use the following video as a guide to this test:</p>
@@ -690,8 +686,6 @@ <h6 id="ret">Retraction tuning tower generator</h6>
             <script>
                 createForm("retraction");
             </script>
-            <p><input type="button" onclick="processGcode(form)" value="Download Gcode"></p>
-            <p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters"> <input type="button" onclick="outputSettings(form)" value="Output Settings Summary"></p>
         </form>
         <h2>Interpreting Results:</h2>
         <p>Please use the following video as a guide to this test:</p>
@@ -748,8 +742,6 @@ <h6 id="tmp">Temperature tuning tower generator</h6>
             <script>
                 createForm("temperature");
             </script>
-            <p><input type="button" onclick="processGcode(form)" value="Download Gcode"></p>
-            <p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters"> <input type="button" onclick="outputSettings(form)" value="Output Settings Summary"></p>
         </form>
         <h2>Interpreting Results:</h2>
         <p>Please use the following video as a guide to this test:</p>
@@ -855,8 +847,6 @@ <h6 id="acc">Acceleration & jerk/junction deviation tuning tower generator</h6>
             <script>
                 createForm("acceleration");
             </script>
-            <p><input type="button" onclick="processGcode(form)" value="Download Gcode"></p>
-            <p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters"> <input type="button" onclick="outputSettings(form)" value="Output Settings Summary"></p>
         </form>
         <h2>Interpreting Results:</h2>
         <p>Please use the following video as a guide to this test:</p>
@@ -1044,6 +1034,14 @@ <h2>Fixing persistent dimensional accuracy after X/Y/Z steps per unit have been
         <p>One final measure, that is the least desirable, is to design parts to be printed bigger or smaller to compensate. This is a band aid approach and falls apart very quickly once we print geometry designed by other people.</p>
 
     </div>
+
+    <form style="display: none" name="octoprintForm" id="octoprintForm" action="#" method="post" enctype="multipart/form-data" target="_blank">
+        <input type="file" name="file"/>
+        <input type="hidden" name="apikey" value=""/>
+        <input type="hidden" name="path" value="TeachingTechYT"/>
+        <input type="hidden" name="select" value="true"/>
+        <input type="hidden" name="print" value="true"/>
+    </form>
 </div>
 <div id="up"></div>
 <div id="footer"></div>

js/commongcode.js

@@ -1,6 +1,4 @@
-var commonStart = `; G-Code originally generated by Simplify3D(R) Version 4.1.2
-; This calibration test gcode modified by the Teaching Tech Calibration website: https://teachingtechyt.github.io/calibration.html
-;M80 ; power supply on
+var commonStart = `;M80 ; power supply on
 G90
 M82
 M106 S0

js/createform.js

@@ -326,6 +326,28 @@ var endGcode = /*html*/ `<h4>Additional end gcode</h4>
 
 var preview = /*html*/ `<p>It is advised to preview the generated gcode through your slicer or <a href="http://gcode.ws/" target="_blank">Gcode.ws</a> before printing.`;
 
+var downloadGcodeHtml = /*html*/ `<h4>Download</h4>
+<p><label>Filename: <input type="text" name="{formName}_filename" value="{formName}.gcode"></label></p>
+<p><input type="button" onclick="downloadGcode(form, form['{formName}_filename'].value)" value="Download Gcode">
+   <input type="button" onclick="uploadGcode(form, form['{formName}_filename'].value)" value="Upload&Print Gcode"></p>
+<p><input type="button" onclick="resetFormToDefaults(form)" value="Reset parameters">
+   <input type="button" onclick="downloadSettings(form, form['{formName}_filename'].value)" value="Output Settings Summary"></p>
+
+<h4>Octoprint / Moonraker</h4>
+<p>You can directly print from this website if you specify <b>Octoprint</b> or <b>Moonraker</b> server.</p>
+<p><label>URL: <input type="text" name="octoprint_url"></label>
+   <label>API Key: <input type="password" name="octoprint_key"></label></p>
+<div class="octoprintExp">
+    <label>Configure Octoprint:</label>
+    <ul>
+        <li>Login to your Octoprint</li>
+        <li>or get API Key go to <b>User Settings > Application Keys</b> and manually generate new application key.</li>
+        <li>Restart afterwards</li>
+    </ul>
+</div>
+
+`;
+
 function createForm(n){
     document.write('<input type="hidden" name="description" value="'+n+'">')
     document.write(nozzleLayer);
@@ -357,4 +379,5 @@ function createForm(n){
     }
     document.write(endGcode);
     document.write(preview);
-}      
+    document.write(downloadGcodeHtml.replaceAll('{formName}', n));
+}

js/gcodeprocessing.js

@@ -112,7 +112,6 @@ function updateFeeds(feedrate) {
 
 function processGcode(formName) {
     var name = formName.name;
-    var description = formName.description.value;
     var nozzleLayer = formName.nozzleLayer.value;
     var bedTemp = formName.bedtemp.value;
     var centre = formName.centre.checked;
@@ -544,37 +543,14 @@ function processGcode(formName) {
     if(formName.deltaHome.checked == true) {
         gcode = gcode.replace(/G28 X0 ; home X axis/, "G28 ; home all on delta");
     }
-
-    // process finished gcode file
-    downloadFile(description+'.gcode', gcode);
+
+    return gcode;
 }
 
 function outputSettings(formName) {
-    var fileName;
-    var string = "Settings for ";
-    switch(formName.name) {
-        case "firstlayerForm":
-            string += "first layer"
-            fileName = "firstlayersettings.txt";
-            break;
-        case "baselineForm":
-            string += "baseline print"
-            fileName = "baselinesettings.txt";
-            break;
-        case "retractionForm":
-            string += "retraction tuning"
-            fileName = "retractionsettings.txt";
-            break;
-        case "temperatureForm":
-            string += "temperature tuning"
-            fileName = "temperaturesettings.txt";
-            break;
-        case "accelerationForm":
-            string += "acceleration and jerk/junction deviation tuning"
-            fileName = "accelerationsettings.txt";
-            break;
-    }
-    string += " form\n_________________________________________________________________________\n\n";
+    var string = "";
+    string += "Settings for " + formName.description.value + " form\n";
+    string += "_________________________________________________________________________\n\n";
     string += "G-Code originally generated by Simplify3D(R) Version 4.1.2\nThis calibration test gcode modified by the Teaching Tech Calibration website: https://teachingtechyt.github.io/calibration.html\n";
     string += "All changes are marked in the gcode with 'custom' at the end of each line. Open the gcode in a text editor and search for this to your check inputs if needed.\n\n";
     if(formName.psuon.checked == true) {
@@ -653,6 +629,60 @@ function outputSettings(formName) {
             string += "   B    |    "+formName.accel_b1.value+" mm/sec/sec   |          "+formName.accel_b4.value+"\n";
             string += "   A    |    "+formName.accel_a1.value+" mm/sec/sec   |          "+formName.accel_a4.value+"\n";
         }
-    }  
-    downloadFile(fileName, string);
+    }
+    return string;
+}
+
+function getGcodeAndSettings(form) {
+    var gcode = processGcode(form);
+    var settings = outputSettings(form);
+
+    var output = "";
+    // prefix each line with ; to indicate comment
+    output += "; " + settings.replaceAll("\n", "\n; ");
+    output += gcode;
+    return output;
+}
+
+function downloadGcode(form, fileName) {
+    if (!fileName) {
+        fileName = form.description.value + ".gcode";
+    }
+
+    downloadFile(fileName, getGcodeAndSettings(form));
+}
+
+function downloadSettings(form, fileName) {
+    if (!fileName) {
+        fileName = form.description.value + "settings.txt";
+    }
+
+    downloadFile(fileName, outputSettings(form));
+}
+
+function uploadGcode(form, fileName) {
+    var output = getGcodeAndSettings(form);
+
+    if (!form.octoprint_url.value) {
+        alert("No URL specified for Octoprint or Moonraker.");
+        return;
+    }
+
+    // get only basename
+    if (!fileName) {
+        fileName = form.description.value + ".gcode";
+    }
+    fileName = fileName.split('/').reverse()[0];
+
+    // remove `/` from the end of URL
+    var url = form.octoprint_url.value.replace(/\/$/, '');
+    url += "/api/files/local";
+
+    const dataTransfer = new DataTransfer();
+    dataTransfer.items.add(new File([output], fileName, {type : 'text/plain'}));
+
+    document.octoprintForm.action = url;
+    document.octoprintForm.file.files = dataTransfer.files;
+    document.octoprintForm.apikey.value = form.octoprint_key.value;
+    document.octoprintForm.submit();
 }

js/persist.js

@@ -17,6 +17,7 @@ function loadFormData(form) {
       element.tagName == "INPUT" && element.type == "checkbox" ||
       element.tagName == "INPUT" && element.type == "radio" ||
       element.tagName == "INPUT" && element.type == "text" ||
+      element.tagName == "INPUT" && element.type == "password" ||
       element.tagName == "TEXTAREA" ||
       element.tagName == "SELECT"
     ) {