Skip to content

Commit

Permalink
Filament Change Process (#642)
Browse files Browse the repository at this point in the history 
* basic pagination

* styling filament list

* load spools from FilamentManager

* spool list almost done, some regex issues

* Finished Spool Listing

* Started working on heating screen

* finish page 2 design

* update config for extruder speed

* add config parameter + update initial setup screen

* progress on page 2

* finish filament unload

* finished screen 3

* finish page 4 design

* finish page 5 styling

* some fixes

* starting to add functionality

* Should be all working now

* make extruder movements works

* some fixes

* Add settings

* naming and default values

* CodeFactor issues

* disable extruder after unloading filament
  • Loading branch information
@UnchartedBull
UnchartedBull authored May 15, 2020
1 parent 6e4ea62 commit 4e2569f
Show file tree
Hide file tree
Showing 13 changed files with 1,126 additions and 91 deletions.
8 changes: 5 additions & 3 deletions sample.config.json
View file
Original file line number Diff line number Diff line change
@@ -1,11 +1,11 @@
{
"config": {
"octoprint": {
"accessToken": "INSERT API KEY HERE",
"accessToken": "",
"url": "http://localhost:5000/api/"
},
"printer": {
"name": "NAME HERE",
"name": "",
"xySpeed": 100,
"zSpeed": 5,
"defaultTemperatureFanSpeed": {
Expand All @@ -18,7 +18,9 @@
"density": 0,
"thickness": 0,
"feedLength": 470,
"feedSpeed": 100
"feedSpeed": 30,
"feedSpeedSlow": 3,
"purgeDistance": 30
},
"plugins": {
"displayLayerProgress": {
Expand Down
20 changes: 11 additions & 9 deletions src/app/app.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,25 +34,27 @@ export class AppService {
}
}

this.updateError = [".printer should have required property 'defaultTemperatureFanSpeed'"];
this.updateError = [
".filament should have required property 'feedSpeedSlow'",
".filament should hsave required property 'purgeDistance'",
];
}

// If the errors can be automatically fixed return true here
public autoFixError(): boolean {
let config = this.configService.getCurrentConfig();
config.printer.defaultTemperatureFanSpeed = {
hotend: 200,
heatbed: 60,
fan: 100,
};
config.filament.feedLength = 0;
config.filament.feedSpeed = 30;
config.filament.feedSpeedSlow = 5;
config.filament.purgeDistance = 30;
this.configService.saveConfig(config);
this.configService.updateConfig();
return true;
return false;
}

private checkUpdate(): void {
this.http.get('https://api.github.com/repos/UnchartedBull/OctoDash/releases/latest').subscribe(
(data: GitHubRealeaseInformation): void => {
(data: GitHubReleaseInformation): void => {
if (this.version !== data.name.replace('v', '')) {
this.notificationService.setUpdate(
"It's time for an update",
Expand Down Expand Up @@ -132,7 +134,7 @@ interface VersionInformation {
version: string;
}

interface GitHubRealeaseInformation {
interface GitHubReleaseInformation {
name: string;
[key: string]: string;
}
32 changes: 31 additions & 1 deletion src/app/config/config.service.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -236,6 +236,26 @@ export class ConfigService {
public isPreheatPluginEnabled(): boolean {
return this.config.plugins.preheatButton.enabled;
}

public isFilamentManagerEnabled(): boolean {
return this.config.plugins.filamentManager.enabled;
}

public getFeedLength(): number {
return this.config.filament.feedLength;
}

public getFeedSpeed(): number {
return this.config.filament.feedSpeed;
}

public getFeedSpeedSlow(): number {
return this.config.filament.feedSpeedSlow;
}

public getPurgeDistance(): number {
return this.config.filament.purgeDistance;
}
}

export interface Config {
Expand Down Expand Up @@ -273,6 +293,8 @@ interface Filament {
density: number;
feedLength: number;
feedSpeed: number;
feedSpeedSlow: number;
purgeDistance: number;
}

interface Plugins {
Expand Down Expand Up @@ -385,7 +407,7 @@ const schema = {
filament: {
$id: '#/properties/filament',
type: 'object',
required: ['density', 'thickness', 'feedLength', 'feedSpeed'],
required: ['density', 'thickness', 'feedLength', 'feedSpeed', 'feedSpeedSlow', 'purgeDistance'],
properties: {
density: {
$id: '#/properties/filament/properties/density',
Expand All @@ -403,6 +425,14 @@ const schema = {
$id: '#/properties/filament/properties/feedSpeed',
type: 'integer',
},
feedSpeedSlow: {
$id: '#/properties/filament/properties/feedSpeedSlow',
type: 'integer',
},
purgeDistance: {
$id: '#/properties/filament/properties/purgeDistance',
type: 'integer',
},
},
},
plugins: {
Expand Down
94 changes: 54 additions & 40 deletions src/app/config/no-config/no-config.component.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,40 +19,55 @@
<div *ngIf="page === 0">
<span class="no-config__1-welcome">Hey there!</span>
<span class="no-config__text" *ngIf="!configUpdate">
It looks like this is the first time starting OctoDash! <br>
I'll help you setting up your config. If you encounter any issues please create an issue in
GitHub. <br> <br>
Thanks for choosing OctoDash :)
It looks like this is the first start of OctoDash. <br>
I'll help you set up your config and get you started. <br>
If you encounter any issues please check the troubleshooting guide in the GitHub Wiki. <br> <br>
Thanks for choosing OctoDash <fa-icon [icon]="['fas', 'smile']"></fa-icon>
</span>
<span class="no-config__text" *ngIf="configUpdate">
Sorry for bothering you again ... <br>
We've released an update, so awesome, we needed to change the config. Please review your new config! <br>
<br>
Thanks for choosing OctoDash :)
Thanks for choosing OctoDash <fa-icon [icon]="['fas', 'smile']"></fa-icon>
</span>
</div>
<div *ngIf="page === 1">
<span class="no-config__text">
First, tell me some facts about your printer and filament so I can personalize OctoDash.
First, tell me some facts about your printer so I can personalize OctoDash for you.
</span>
<form class="no-config__form">
<label for="printerName" class="no-config__input-label">Printer Name:</label>
<input type="text" id="printerName" class="no-config__input" maxlength="13"
<input type="text" id="printerName" class="no-config__input no-config__2-input" maxlength="13"
[(ngModel)]="config.printer.name" name="printerName" required>
</form>
<div class="no-config-explanation" style="margin-top: 7vh">
If you're unsure about any values during setup, just stick with the defaults. You can change all values (and
even more stuff) in the settings menu anytime. There is also a description of each attribute available in
the GitHub Wiki.
</div>

<span class="no-config__2-filament-divider">Filament</span>
<label for="filamentDiameter" class="no-config__input-label-small">Diameter:</label>
<input type="number" id="filamentDiameter" class="no-config__input no-config__input-small"
[(ngModel)]="config.filament.thickness" name="filamentDiameter" step="0.01" min="0" required>
</div>
<div *ngIf="page === 2">
<span class="no-config__text">
I also need some information about your extruder.
</span>
<form class="no-config__form no-config__2-form">
<label for="feedLength" class="no-config__input-label">Feed Length:</label>
<input type="number" id="feedLength" class="no-config__input no-config__2-input"
[(ngModel)]="config.filament.feedLength" name="feedLength" step="1" min="0" style="width:48vw" required>
<span class="no-config__input-small-suffix" style="padding-right: 3vw;">mm</span>

<label for="filamentDensity" class="no-config__input-label-small">Density:</label>
<input type="number" id="filamentDensity" class="no-config__input no-config__input-small"
[(ngModel)]="config.filament.density" name="filamentDensity" step="0.001" min="0" required>
<span class="no-config__input-small-suffix">g/cm³</span>
<br>
<label for="feedSpeed" class="no-config__input-label-small">Feed Speed:</label>
<input type="number" id="feedSpeed" class="no-config__input no-config__2-input"
[(ngModel)]="config.filament.feedSpeed" name="feedSpeed" step="0.5" min="0" style="width:48vw" required>
<span class="no-config__input-small-suffix">mm/s</span>
<div class="no-config-explanation" style="padding: 2vh 4vw 2vh 0;margin-right: 4vw;">
These values will be used during the Filament Change Process. Be sure to have your Feed Length (length
between Extruder and Hotend) and Feed Speed configured correctly.
</div>
</form>
</div>
<div *ngIf="page === 2">
<div *ngIf="page === 3">
<span class="no-config__text">
Now I need to know something about your OctoPrint setup, so I can talk to your printer.
</span>
Expand All @@ -70,7 +85,7 @@
name="accessToken" style="width: 67vw" required>
</form>
</div>
<div *ngIf="page === 3">
<div *ngIf="page === 4">
<span class="no-config__text">
And now personalize me to your liking.
</span>
Expand All @@ -85,14 +100,13 @@
<input type="number" id="octodashPolling" class="no-config__input"
[(ngModel)]="this.config.octodash.pollingInterval" name="octodashPolling" required style="width: 11vw">
ms
<div class="no-config__3-explanation">
If you're unsure about what values to use, just use the default. You can change all values (and even
more stuff, like defining custom actions) later in the settings menu.
<div class="no-config-explanation" style="margin-top: 7vh">
Don't set your Value Refresh Interval too low (und 1000ms) as this may effect the performance of the
Raspberry Pi.
</div>

</form>
</div>
<div *ngIf="page === 4">
<div *ngIf="page === 5">
<span class="no-config__text">
What plugins are you running?
</span>
Expand Down Expand Up @@ -133,39 +147,39 @@
<span class="no-config__checkbox-checked" *ngIf="config.plugins.psuControl.enabled"></span>
</span> PSU Control
</div>
<div class="no-config__3-explanation">
Enclosure and PSU Control Plugin can be configured further in the settings!
<div class="no-config-explanation">
Enclosure and PSU Control Plugin can be configured further in the settings.
</div>
</div>
</div>
<div *ngIf="page === 5">
<div *ngIf="page === 6">
<span class="no-config__text">
Great! I'll check everything.
</span>
<div class="no-config__5-check-wrapper">
<span class="no-config__5-check">
<img src="assets/checkmark.svg" class="no-config__5-check-icon" *ngIf="configValid" />
<img src="assets/error.svg" class="no-config__5-check-icon" *ngIf="configValid == false" />
<div class="no-config__6-check-wrapper">
<span class="no-config__6-check">
<img src="assets/checkmark.svg" class="no-config__6-check-icon" *ngIf="configValid" />
<img src="assets/error.svg" class="no-config__6-check-icon" *ngIf="configValid == false" />
Config Validation
</span>
<span class="no-config__5-errors" *ngFor="let error of configErrors">{{ error }}</span>
<span class="no-config__6-errors" *ngFor="let error of configErrors">{{ error }}</span>
<div *ngIf="configValid">
<span class="no-config__5-check">
<img src="assets/checkmark.svg" class="no-config__5-check-icon" *ngIf="octoprintConnection" />
<img src="assets/error.svg" class="no-config__5-check-icon" *ngIf="octoprintConnection == false" />
<span class="no-config__6-check">
<img src="assets/checkmark.svg" class="no-config__6-check-icon" *ngIf="octoprintConnection" />
<img src="assets/error.svg" class="no-config__6-check-icon" *ngIf="octoprintConnection == false" />
Octoprint Connection
</span>
<span class="no-config__5-errors" *ngIf="octoprintConnectionError">{{ octoprintConnectionError }}</span>
<span class="no-config__6-errors" *ngIf="octoprintConnectionError">{{ octoprintConnectionError }}</span>
</div>
<div *ngIf="configValid && octoprintConnection">
<span class="no-config__5-check">
<img src="assets/checkmark.svg" class="no-config__5-check-icon" *ngIf="!configSaved" />
<img src="assets/error.svg" class="no-config__5-check-icon" *ngIf="configSaved" />
<span class="no-config__6-check">
<img src="assets/checkmark.svg" class="no-config__6-check-icon" *ngIf="!configSaved" />
<img src="assets/error.svg" class="no-config__6-check-icon" *ngIf="configSaved" />
Saving Config
</span>
<span class="no-config__5-errors" *ngIf="configSaved">{{ configSaved }}</span>
<span class="no-config__6-errors" *ngIf="configSaved">{{ configSaved }}</span>
</div>
<span *ngIf="configValid && octoprintConnection && !configSaved" class="no-config__5-finish"
<span *ngIf="configValid && octoprintConnection && !configSaved" class="no-config__6-finish"
(click)="finishWizard()">done
</span>
</div>
Expand Down
48 changes: 26 additions & 22 deletions src/app/config/no-config/no-config.component.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,19 @@
margin-left: 2vh;
margin-right: 3vh;
font-size: 3.6vw;

fa-icon {
display: block;
margin-top: 2vh;
}
}

&__progress-bar {
height: 4vh;
border-radius: 2vh;
background-color: #44bd32;
width: 0;
transition: width .7s ease-in-out;
transition: width 0.7s ease-in-out;

&-wrapper {
background-color: #718093;
Expand Down Expand Up @@ -56,7 +61,7 @@

&-prefix {
font-size: 3vw;
opacity: .7;
opacity: 0.7;
padding-right: 1vw;
}
}
Expand All @@ -83,16 +88,16 @@
}

&-checked {
background-color: #2196F3;
background-color: #2196f3;
width: 2.4vw;
height: 2.4vw;
display: block;
margin-left: .75vw;
margin-top: .75vw;
border-radius: .7vw;
margin-left: 0.75vw;
margin-top: 0.75vw;
border-radius: 0.7vw;

&-disabled {
background-color: rgba(255, 255, 255, .5)
background-color: rgba(255, 255, 255, 0.5);
}
}
}
Expand All @@ -103,6 +108,15 @@
text-align: center;
}

&-explanation {
font-size: 3vw;
font-style: italic;
opacity: 0.7;
margin-top: 4vh;
padding: 2vh 4vw;
text-align: center;
}

&__1 {
&-welcome {
display: block;
Expand All @@ -115,27 +129,17 @@
}

&__2 {
&-filament-divider {
display: block;
&-form {
text-align: left;
margin-left: 4.3vw;
margin-top: 7vh;
margin-bottom: -7vh;
font-weight: 500;
margin-left: 4vw;
}
}

&__3 {
&-explanation {
font-size: 3vw;
font-style: italic;
opacity: .7;
margin-top: 4vh;
padding: 2vh 4vw;
&-input {
margin-top: 5vh;
}
}

&__5 {
&__6 {
&-check-wrapper {
width: 100%;
text-align: center;
Expand Down
Loading

0 comments on commit 4e2569f

Please sign in to comment.