3dprinter-toolbox/index.html at main · ziggornif/3dprinter-toolbox · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
<!DOCTYPE html>
<html lang="en" data-theme="light">
<head>
  <meta charset='utf-8'>
  <meta http-equiv='X-UA-Compatible' content='IE=edge'>
  <title>3D Printer Toolbox</title>
  <meta name='viewport' content='width=device-width, initial-scale=1'>
  <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.min.css"/>
  <script type="module" src='/src/main.ts'></script>
</head>
<body>
  <header class="container">
    <hgroup>
      <h1><svg fill="#000000" height="100px" width="100px" version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
        viewBox="0 0 463 463" xml:space="preserve">
      <g>
        <path d="M87.5,343h288c4.142,0,7.5-3.358,7.5-7.5v-264c0-4.142-3.358-7.5-7.5-7.5h-288c-4.142,0-7.5,3.358-7.5,7.5v264
          C80,339.642,83.358,343,87.5,343z M271.5,272h-80H167v-17h129v17H271.5z M199,287h65v9h-65V287z M187.25,311h4.25h80h4.25l12.75,17
          h-114L187.25,311z M307.25,328l-21.75-29c-1.417-1.889-3.639-3-6-3H279v-9h24.5c4.142,0,7.5-3.358,7.5-7.5v-32
          c0-4.142-3.358-7.5-7.5-7.5h-144c-4.142,0-7.5,3.358-7.5,7.5v32c0,4.142,3.358,7.5,7.5,7.5H184v9h-0.5c-2.361,0-4.583,1.111-6,3
          l-21.75,29H95V111h129v33h-24.5c-4.142,0-7.5,3.358-7.5,7.5v24c0,2.841,1.605,5.438,4.146,6.708L224,196.135V207.5
          c0,4.142,3.358,7.5,7.5,7.5s7.5-3.358,7.5-7.5v-11.365l27.854-13.927c2.541-1.27,4.146-3.867,4.146-6.708v-24
          c0-4.142-3.358-7.5-7.5-7.5H239v-33h129v217H307.25z M231.5,183.115l-24.5-12.25V159h49v11.865L231.5,183.115z M368,79v17H95V79
          H368z"/>
        <path d="M103.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S99.358,47,103.5,47z"/>
        <path d="M151.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S147.358,47,151.5,47z"/>
        <path d="M199.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S195.358,47,199.5,47z"/>
        <path d="M247.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S243.358,47,247.5,47z"/>
        <path d="M295.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S291.358,47,295.5,47z"/>
        <path d="M343.5,47h16c4.142,0,7.5-3.358,7.5-7.5s-3.358-7.5-7.5-7.5h-16c-4.142,0-7.5,3.358-7.5,7.5S339.358,47,343.5,47z"/>
        <path d="M415,361.234V23.5C415,10.542,404.458,0,391.5,0h-320C58.542,0,48,10.542,48,23.5v337.734c-9.29,3.138-16,11.93-16,22.266
          v56c0,12.958,10.542,23.5,23.5,23.5h352c12.958,0,23.5-10.542,23.5-23.5v-56C431,373.164,424.29,364.372,415,361.234z M71.5,15h320
          c4.687,0,8.5,3.813,8.5,8.5V360H63V23.5C63,18.813,66.813,15,71.5,15z M416,439.5c0,4.687-3.813,8.5-8.5,8.5h-352
          c-4.687,0-8.5-3.813-8.5-8.5v-56c0-4.687,3.813-8.5,8.5-8.5h352c4.687,0,8.5,3.813,8.5,8.5V439.5z"/>
        <path d="M87.5,416h-16c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h16c4.142,0,7.5-3.358,7.5-7.5S91.642,416,87.5,416z"/>
        <path d="M135.5,416h-16c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h16c4.142,0,7.5-3.358,7.5-7.5S139.642,416,135.5,416z"/>
        <path d="M87.5,392h-16c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h16c4.142,0,7.5-3.358,7.5-7.5S91.642,392,87.5,392z"/>
        <path d="M135.5,392h-16c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h16c4.142,0,7.5-3.358,7.5-7.5S139.642,392,135.5,392z"/>
        <path d="M391.5,416h-24c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h24c4.142,0,7.5-3.358,7.5-7.5S395.642,416,391.5,416z"/>
        <path d="M231.5,416h-64c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h64c4.142,0,7.5-3.358,7.5-7.5S235.642,416,231.5,416z"/>
        <path d="M231.5,392h-64c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h64c4.142,0,7.5-3.358,7.5-7.5S235.642,392,231.5,392z"/>
        <path d="M271.5,416h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S275.642,416,271.5,416z"/>
        <path d="M303.5,416h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S307.642,416,303.5,416z"/>
        <path d="M335.5,416h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S339.642,416,335.5,416z"/>
        <path d="M391.5,392h-24c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h24c4.142,0,7.5-3.358,7.5-7.5S395.642,392,391.5,392z"/>
        <path d="M271.5,392h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S275.642,392,271.5,392z"/>
        <path d="M303.5,392h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S307.642,392,303.5,392z"/>
        <path d="M335.5,392h-8c-4.142,0-7.5,3.358-7.5,7.5s3.358,7.5,7.5,7.5h8c4.142,0,7.5-3.358,7.5-7.5S339.642,392,335.5,392z"/>
      </g>
      </svg>
      3D Printer Toolbox</h1>
    </hgroup>
  </header>
  <main class="container">
    <section id="extruder-calculator">
      <h2>Extruder steps/mm calculator</h2>
      <section>
        <h3>Tutorial (marlin version)</h3>
        <p>Based on tutorial : <a href="https://all3dp.com/2/extruder-calibration-calibrate-e-steps/">Extruder Calibration: How to Calibrate E-Steps</a></p>
        <div>
          <section>
            <p>Use calipers to measure 120 mm on the filament before the extruder and put a mark on it.</p>
            <img src="./src/img/mark-filament.jpeg" alt="image that show how to mark the filament before the extruder">
          </section>
          <section>
            <p>Go to the printer interface and extrude 100 mm.</p>
            <img src="./src/img/extrude-100mm-marlin.jpeg" alt="image that show how to extrude 100mm">
          </section>
          <section>
            <p>At the end of the extrusion, mesure the distance between the mark and the extruder.</p>
            <img src="./src/img/extruder-to-mark.jpeg" alt="image that show how to mesure the rest of filament after the 100mm extrusion">
          </section>
          <section>
            <p>Go to your printer extruder steps/mm configuration and note the current value.</p>
            <img src="./src/img/setup-stepsmm-marlin.jpeg" alt="image that show how to setup extruder steps/mm on 3d printer configuration menu">
          </section>
        </div>
      </section>
      <section>
        <h3>Calculator</h3>
        <form id="extruder-calc">
          <fieldset class="grid">
            <input
                id="extruded"
                type="text"
                name="extruded-length"
                placeholder="Extruder to mark length"
            />
            <input
              id="current-steps"
              type="text"
              name="current-steps"
              placeholder="Current steps/mm extruder configuration"
            />
            <input
              type="submit"
              value="Calculate"
            />
          </fieldset>
          <small id="invalid-helper" style="color:#b7403b"></small>
        </form>
      </section>
      <div id="extruder-result">
      </div>
    </section>
  </main>
  <footer class="container">
    Created by <a href="https://github.com/ziggornif/">Ziggornif</a> • <a href="https://github.com/ziggornif/3dprinter-toolbox">Source code</a>
  </footer>
</body>
</html>