Skip to content

Commit 2a0ef46

Browse files
mikecentolamikecentola
committed
Modified variable & field labels to be unit independent
1 parent 267ab0e commit 2a0ef46

File tree

3 files changed

+99
-37
lines changed

3 files changed

+99
-37
lines changed

‎src/webviews/apps/calc/calc.html‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -14,18 +14,18 @@
1414
<section id="rpm" class="calculator">
1515
<h3>RPM</h3>
1616
<vscode-divider role="separator"></vscode-divider>
17-
<vscode-text-field id="rpm-sfm" placeholder="Enter SFM" size="6">SFM</vscode-text-field>
17+
<vscode-text-field id="rpm-speed" placeholder="Enter Speed" size="6">Cutting Speed</vscode-text-field>
1818
<vscode-text-field id="rpm-tool-dia" placeholder="Enter Tool Dia" size="6">Tool Diameter</vscode-text-field>
1919
<label class="results">RPM</label><span id="rpm-results" class="results"></span>
2020
<vscode-button id="rpm-calc-btn">Calculate</vscode-button>
2121
</section>
22-
<section id="sfm" class="calculator">
23-
<h3>SFM</h3>
22+
<section id="Cutting Speed" class="calculator">
23+
<h3>Cutting Speed</h3>
2424
<vscode-divider role="separator"></vscode-divider>
25-
<vscode-text-field id="sfm-rpm" placeholder="Enter SFM" size="6">RPM</vscode-text-field>
26-
<vscode-text-field id="sfm-tool-dia" placeholder="Enter Tool Dia" size="6">Tool Diameter</vscode-text-field>
27-
<label class="results">SFM</label><span id="sfm-results" class="results"></span>
28-
<vscode-button id="sfm-calc-btn">Calculate</vscode-button>
25+
<vscode-text-field id="speed-rpm" placeholder="Enter RPM" size="6">RPM</vscode-text-field>
26+
<vscode-text-field id="speed-tool-dia" placeholder="Enter Tool Dia" size="6">Tool Diameter</vscode-text-field>
27+
<label class="results">Cutting Speed</label><span id="speed-results" class="results"></span>
28+
<vscode-button id="speed-calc-btn">Calculate</vscode-button>
2929
</section>
3030
</section>
3131
<section class="row">
@@ -44,14 +44,14 @@ <h3>Feedrate</h3>
4444
<vscode-divider role="separator"></vscode-divider>
4545
<vscode-text-field id="fr-rpm" placeholder="Enter RPM" size="6">RPM</vscode-text-field>
4646
<vscode-text-field id="fr-num-flutes" placeholder="Enter # Flutes" size="6"># of Flutes</vscode-text-field>
47-
<vscode-text-field id="fr-chip-load" placeholder="Enter IPT" size="6">Load / Tooth</vscode-text-field>
47+
<vscode-text-field id="fr-chip-load" placeholder="Enter FPT" size="6">Feed / Tooth</vscode-text-field>
4848
<label class="results">Feedrate</label><span id="fr-results" class="results"></span>
4949
<vscode-button id="fr-calc-btn">Calculate</vscode-button>
5050
</section>
5151
<section id="chip-load" class="calculator">
5252
<h3>Chip Load</h3>
5353
<vscode-divider role="separator"></vscode-divider>
54-
<vscode-text-field id="cl-ipm" placeholder="Enter IPM" size="6">IPM</vscode-text-field>
54+
<vscode-text-field id="cl-feedrate" placeholder="Enter Feedrate" size="6">Feedrate</vscode-text-field>
5555
<vscode-text-field id="cl-rpm" placeholder="Enter RPM" size="6">RPM</vscode-text-field>
5656
<vscode-text-field id="cl-num-flutes" placeholder="Enter # Flutes" size="6"># of Flutes</vscode-text-field>
5757
<label class="results">Chip Load</label><span id="cl-results" class="results"></span>
@@ -77,6 +77,14 @@ <h3>Chip Load</h3>
7777
<vscode-button id="mrr-calc-btn">Calculate</vscode-button>
7878
</section>
7979
</section>
80+
<section class="row">
81+
<span class="clear-btn">
82+
<vscode-button id="view-3-clear">Clear Fields</vscode-button>
83+
</span>
84+
</section>
85+
<section class="row">
86+
<span class="units"><a href="#">Units: </a></span>
87+
</section>
8088
</vscode-panel-view>
8189
</vscode-panels>
8290
</div>

‎src/webviews/apps/calc/calc.ts‎

Lines changed: 80 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -35,17 +35,19 @@ export class CalcApp extends GWebviewApp {
3535
// Populate RPM Calculator
3636
this._calcDom.rpm = {
3737
btn: document.getElementById('rpm-calc-btn') as HTMLElement,
38-
sfm: document.getElementById('rpm-sfm')?.shadowRoot?.getElementById('control') as HTMLInputElement,
38+
speed: document.getElementById('rpm-speed')?.shadowRoot?.getElementById('control') as HTMLInputElement,
3939
toolDia: document.getElementById('rpm-tool-dia')?.shadowRoot?.getElementById('control') as HTMLInputElement,
4040
results: document.getElementById('rpm-results') as HTMLSpanElement,
4141
};
4242

4343
// Populate SFM Calculator
44-
this._calcDom.sfm = {
45-
btn: document.getElementById('sfm-calc-btn') as HTMLElement,
46-
rpm: document.getElementById('sfm-rpm')?.shadowRoot?.getElementById('control') as HTMLInputElement,
47-
toolDia: document.getElementById('sfm-tool-dia')?.shadowRoot?.getElementById('control') as HTMLInputElement,
48-
results: document.getElementById('sfm-results') as HTMLSpanElement,
44+
this._calcDom.speed = {
45+
btn: document.getElementById('speed-calc-btn') as HTMLElement,
46+
rpm: document.getElementById('speed-rpm')?.shadowRoot?.getElementById('control') as HTMLInputElement,
47+
toolDia: document
48+
.getElementById('speed-tool-dia')
49+
?.shadowRoot?.getElementById('control') as HTMLInputElement,
50+
results: document.getElementById('speed-results') as HTMLSpanElement,
4951
};
5052

5153
// Populate Feedrate Calculator
@@ -64,7 +66,7 @@ export class CalcApp extends GWebviewApp {
6466
// Populate Chipload Calculator
6567
this._calcDom.chipLoad = {
6668
btn: document.getElementById('cl-calc-btn') as HTMLElement,
67-
feedRate: document.getElementById('cl-ipm')?.shadowRoot?.getElementById('control') as HTMLInputElement,
69+
feedRate: document.getElementById('cl-feedrate')?.shadowRoot?.getElementById('control') as HTMLInputElement,
6870
rpm: document.getElementById('cl-rpm')?.shadowRoot?.getElementById('control') as HTMLInputElement,
6971
numFlutes: document
7072
.getElementById('cl-num-flutes')
@@ -128,30 +130,30 @@ export class CalcApp extends GWebviewApp {
128130
switch (target.id) {
129131
case 'rpm-calc-btn': {
130132
if (this._calcDom.rpm) {
131-
const sfm = Math.abs(Number(this._calcDom.rpm.sfm.value));
133+
const sfm = Math.abs(Number(this._calcDom.rpm.speed.value));
132134
const toolDia = Math.abs(Number(this._calcDom.rpm.toolDia.value));
133135

134-
this._calcDom.rpm.sfm.value = sfm ? sfm.toString() : '';
136+
this._calcDom.rpm.speed.value = sfm ? sfm.toString() : '';
135137
this._calcDom.rpm.toolDia.value = toolDia ? sfm.toString() : '';
136138

137-
result = this._calcRPM(sfm, toolDia, this._units);
139+
result = this._calcRPM(sfm, toolDia);
138140

139141
this._displayResults(result, this._calcDom.rpm);
140142
}
141143
break;
142144
}
143145

144-
case 'sfm-calc-btn': {
145-
if (this._calcDom.sfm) {
146-
const rpm = Math.abs(Number(this._calcDom.sfm.rpm.value));
147-
const toolDia = Math.abs(Number(this._calcDom.sfm.toolDia.value));
146+
case 'speed-calc-btn': {
147+
if (this._calcDom.speed) {
148+
const rpm = Math.abs(Number(this._calcDom.speed.rpm.value));
149+
const toolDia = Math.abs(Number(this._calcDom.speed.toolDia.value));
148150

149-
this._calcDom.sfm.rpm.value = rpm ? rpm.toString() : '';
150-
this._calcDom.sfm.toolDia.value = toolDia ? toolDia.toString() : '';
151+
this._calcDom.speed.rpm.value = rpm ? rpm.toString() : '';
152+
this._calcDom.speed.toolDia.value = toolDia ? toolDia.toString() : '';
151153

152-
result = this._calcSFM(rpm, toolDia, this._units);
154+
result = this._calcSFM(rpm, toolDia);
153155

154-
this._displayResults(result, this._calcDom.sfm);
156+
this._displayResults(result, this._calcDom.speed);
155157
}
156158
break;
157159
}
@@ -204,6 +206,7 @@ export class CalcApp extends GWebviewApp {
204206

205207
this._displayResults(result, this._calcDom.mrr);
206208
}
209+
break;
207210
}
208211
}
209212
}
@@ -230,12 +233,63 @@ export class CalcApp extends GWebviewApp {
230233

231234
private _displayResults(result: number | undefined, target: TCalcDom): void {
232235
if (result && result !== Number.POSITIVE_INFINITY) {
233-
// Precision is 2 decimals or 5 for Chip Load
234-
const precision = target === this._calcDom.chipLoad ? 5 : 2;
235-
236236
if (target) {
237237
target.results.classList.remove('error');
238-
target.results.innerHTML = result.toFixed(precision);
238+
239+
// Precision is 2 decimals or 4 for Chip Load
240+
const precision = target === this._calcDom.chipLoad ? 4 : 2;
241+
let units = '';
242+
243+
// Assign units
244+
switch (target) {
245+
case this._calcDom.rpm:
246+
{
247+
units = '[RPM]';
248+
}
249+
break;
250+
251+
case this._calcDom.speed:
252+
{
253+
if (this._units === Units.Inch || this._units === Units.Default) {
254+
units = '[SFM]';
255+
} else {
256+
units = '[m/min]';
257+
}
258+
}
259+
break;
260+
261+
case this._calcDom.feedrate:
262+
{
263+
if (this._units === Units.Inch || this._units === Units.Default) {
264+
units = '[in/min]';
265+
} else {
266+
units = '[mm/min]';
267+
}
268+
}
269+
break;
270+
271+
case this._calcDom.chipLoad:
272+
{
273+
if (this._units === Units.Inch || this._units === Units.Default) {
274+
units = '[in]';
275+
} else {
276+
units = '[mm]';
277+
}
278+
}
279+
break;
280+
281+
case this._calcDom.mrr:
282+
{
283+
if (this._units === Units.Inch || this._units === Units.Default) {
284+
units = '[in<sup>3</sup>/min]';
285+
} else {
286+
result /= 100;
287+
units = '[cm<sup>3</sup>/min]';
288+
}
289+
}
290+
break;
291+
}
292+
target.results.innerHTML = `${result.toFixed(precision)} <sub>${units}</sub>`;
239293
}
240294
} else {
241295
// Answer is NaN or Infinity
@@ -246,16 +300,16 @@ export class CalcApp extends GWebviewApp {
246300
}
247301
}
248302

249-
private _calcRPM(sfm: number, toolDia: number, units: Units): number | undefined {
250-
if (units === Units.Inch || units === Units.Default) {
303+
private _calcRPM(sfm: number, toolDia: number): number | undefined {
304+
if (this._units === Units.Inch || this._units === Units.Default) {
251305
return (sfm * 12) / (Math.PI * toolDia);
252306
} else {
253307
return (sfm * 1000) / (Math.PI * toolDia);
254308
}
255309
}
256310

257-
private _calcSFM(rpm: number, toolDia: number, units: Units): number | undefined {
258-
if (units === Units.Inch || units === Units.Default) {
311+
private _calcSFM(rpm: number, toolDia: number): number | undefined {
312+
if (this._units === Units.Inch || this._units === Units.Default) {
259313
// Calculate SFM for Imperial
260314
return (Math.PI * toolDia * rpm) / 12;
261315
} else {

‎src/webviews/apps/calc/calc.types.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@
77
export interface ICalcDom {
88
rpm?: {
99
btn: HTMLElement;
10-
sfm: HTMLInputElement;
10+
speed: HTMLInputElement;
1111
toolDia: HTMLInputElement;
1212
results: HTMLSpanElement;
1313
};
1414

15-
sfm?: {
15+
speed?: {
1616
btn: HTMLElement;
1717
rpm: HTMLInputElement;
1818
toolDia: HTMLInputElement;

0 commit comments

Comments
 (0)