Skip to content

Commit

Permalink
Updated GUI
Browse files Browse the repository at this point in the history
  • Loading branch information
petervanderwalt committed Apr 15, 2024
1 parent 4a631a7 commit c209ce2
Show file tree
Hide file tree
Showing 7 changed files with 58 additions and 32 deletions.
62 changes: 37 additions & 25 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ <h1 style="position: fixed; top: 100px; left: 50%; transform: translateX(-50%);
<i class="fas fa-square fg-red"></i>
<i class="fa fa-object-group fg-white" data-fa-transform="shrink-6"></i>
</span>
<div data-role="splitter" data-split-sizes="70,30" data-min-sizes="400,400" class="h-100">
<div data-role="splitter" data-split-sizes="80,20" data-min-sizes="480,400" class="h-100">
<div id="col1" style="overflow: hidden;">
<div class="window drop-shadow" style="height: calc(100% - 10px); overflow: hidden;">
<div class="window-caption bg-openbuilds">
Expand Down Expand Up @@ -256,19 +256,7 @@ <h1 style="position: fixed; top: 100px; left: 50%; transform: translateX(-50%);
<span class="title">Settings</span>
</div>

<div class="group">

<div id="ddThemeButton">
<button id="btnTheme" class="ribbon-button" onclick="Theme.toggle();">
<span class="icon" id="currentThemeIcon">
<i class="fas fa-paint-brush"></i>
</span>
<span class="caption" id="currentThemeName">Dark<br>Mode</span>
<span class="h6 badge bg-green fg-white"> <i class="fas fa-brush fa-spin"></i> New!</span>
</button>
</div>
<span class="title">Theme</span>
</div>

<div class="group">
<div class="ribbon-group">
Expand All @@ -289,6 +277,20 @@ <h1 style="position: fixed; top: 100px; left: 50%; transform: translateX(-50%);
<span class="title">App</span>
</div>

<div class="group">

<div id="ddThemeButton">
<button id="btnTheme" class="ribbon-button" onclick="Theme.toggle();">
<span class="icon" id="currentThemeIcon">
<i class="fas fa-paint-brush"></i>
</span>
<span class="caption" id="currentThemeName">Dark<br>Mode</span>
<span class="h6 badge bg-green fg-white"> <i class="fas fa-brush fa-spin"></i> New!</span>
</button>
</div>
<span class="title">Theme</span>
</div>


</div>
</nav>
Expand Down Expand Up @@ -362,12 +364,11 @@ <h1 style="position: fixed; top: 100px; left: 50%; transform: translateX(-50%);
<div id="col2">
<!-- <div style="height: 100%; overflow-y:hidden; padding-right:5px;"> -->

<div data-role="splitter" data-split-mode="vertical" data-split-sizes="30,60,10" data-min-sizes="220,280,150" class="h-100">

<div data-role="splitter" data-split-mode="vertical" data-split-sizes="25,55,10,10" data-min-sizes="220,280,100,110" class="h-100">
<div id="renderDocuments" class="window drop-shadow">
<div class="window-caption bg-openbuilds">
<i class="far fa-file-alt fa-fw ml-1 mr-1"></i>
<span class="title">Documents <span class="workspaceTitle"></span></span>
<span class="title">1. Documents <span class="workspaceTitle"></span></span>
</div>
<div id="selectoverlay" class="text-center mt-1">
<button class="button drop-shadow" id="selectAll"><span class="far fa-check-square"></span> All</button>
Expand All @@ -386,7 +387,7 @@ <h6>Parsing Documents...</h6>

<div id="documentstree">
<div id="nodocuments" style="display:none;">
<p class="text-secondary text-center">Please load some vectors from DXF (Polylines) or SVG (Paths); or Images (Traceable) using the <kbd class="bg-openbuilds"> <i class="far fa-folder-open" aria-hidden="true"></i> Open
<p class="text-secondary text-center mt-3">Please load some vectors from DXF (Polylines) or SVG (Paths); or Images (Traceable) using the <kbd class="bg-openbuilds"> <i class="far fa-folder-open" aria-hidden="true"></i> Open
Drawing</kbd> button, or insert a Shape, Icon or some Text using the built-in tools to get started </p>
</div>
<ul data-role="treeview pl-0" id="left-tree-view">
Expand All @@ -399,7 +400,7 @@ <h6>Parsing Documents...</h6>
<div class="window drop-shadow mt-2">
<div class="window-caption bg-openbuilds">
<i class="fas fa-tasks fa-fw ml-1 mr-1"></i>
<span class="title">Toolpaths</span>
<span class="title">2. Configure Toolpaths</span>
<div class="buttons">

</div>
Expand Down Expand Up @@ -430,20 +431,31 @@ <h6>Calculating Toolpaths...</h6>

<div class="window drop-shadow mt-2">
<div class="window-caption bg-openbuilds">
<i class="fas fa-tasks fa-fw ml-1 mr-1"></i>
<span class="title">Export Gcode</span>
<i class="fa fa-cubes fa-fw ml-1 mr-1"></i>
<span class="title">3. Create Gcode</span>
<div class="buttons">
</div>
</div>
<div class="window-content p-1 text-center mt-1" style="overflow-y:hidden;">
<button class="button drop-shadow" style="width: 300px;" title=" Generate GCODE" id="generatetpgcode" onclick="makeGcode();"><span class="fa fa-cubes fa-fw icon"></span>Generate GCODE</button>
</div>
</div>

<div class="window drop-shadow mt-2">
<div class="window-caption bg-openbuilds">
<i class="fa fa-save fa-fw ml-1 mr-1"></i>
<span class="title">4. Export Gcode</span>
<div class="buttons">
</div>
</div>


<div class="window-content p-1 text-center mt-1" style="overflow-y:scroll;">
<button class="button drop-shadow" title="Generate GCODE" id="generatetpgcode" onclick="makeGcode();"><span class="fa fa-cubes fa-fw icon"></span>Generate GCODE</button>
<button class="button drop-shadow" title="Save GCODE" id="gcodesavebtn2" onclick="saveFile();"><span id="gcodeexporticon" class="fa fa-save fa-fw icon fg-gray"></span>Save GCODE</button>
<div class="window-content p-1 text-center mt-1" style="overflow-y:hidden;">

<button class="button drop-shadow" title="Save GCODE" id="gcodesavebtn2" onclick="saveFile();"><span class="fa fa-save fa-fw icon"></span>Save GCODE</button>
<button class="button drop-shadow" title="Preview GCODE" id="gcodeviewbtn2" onclick="previewFile();"><span id="gcodepreviewicon" class="fa fa-eye fa-fw icon fg-gray"></span></button>
<button class="button drop-shadow" title="Clear GCODE" id="gcodetrashbtn2" onclick="trashGcode();"><span id="trashicon" class="fa fa-trash fa-fw fg-gray icon"></span></button>
<hr>
<p class="text-secondary text-center">Save the GCODE to your Computer and then Open it using <kbd class="bg-openbuilds"><a href="https://software.openbuilds.com">OpenBuilds CONTROL</a></kbd></p>

</div>

</div>
Expand Down
2 changes: 1 addition & 1 deletion js/advanced-cam-doctree.js
Original file line number Diff line number Diff line change
Expand Up @@ -185,7 +185,7 @@ function animateTree() {
// $('#floating-tpaddpath-btn').addClass('success')
$('#addJobBtn,#addJobMenuBtn').addClass('success').prop('disabled', false)
$("#tpaddicon").addClass('fg-green')
$(".addJobBtn-text").html("Create toolpath using (" + selectCount + ") selected vectors");
$(".addJobBtn-text").html("Create Toolpath using (" + selectCount + ") selected vectors");


if (toolpathsInScene.length > 0) {
Expand Down
4 changes: 3 additions & 1 deletion js/advanced-cam-gcode.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,8 @@ function trashGcode() {
disableSim()
$('#sendGcodeToMyMachine').prop('disabled', true);;
$('#gcodesavebtn2').addClass('disabled');
$('#gcodesavebtn2').removeClass('primary');
$('#gcodetrashbtn2').addClass('disabled');
$('#gcodeexporticon').removeClass('fg-grayBlue').addClass('fg-gray');
$('#gcodepreviewicon').removeClass('fg-grayBlue').addClass('fg-gray');
$('#trashicon').removeClass('fg-red').addClass('fg-gray');
}
Expand All @@ -35,6 +35,7 @@ function makeGcodeExec() {
// Button on Ribbon Menu
$("#generatetpgcode").html("<i class='fa fa-spinner fa-spin '></i> Generating, please wait");
$("#generatetpgcode").prop('disabled', true);
$("#generatetpgcode").removeClass('success');
// Button on Window bar above Toolpaths


Expand Down Expand Up @@ -153,6 +154,7 @@ function generateGcode(index, toolpathGrp, cutSpeed, plungeSpeed, laserPwr, rapi
Metro.toast.create(message, null, 4000, 'bg-red');
$("#generatetpgcode").html("<i class='fa fa-cubes' aria-hidden='true'></i> Generate G-Code");
$("#generatetpgcode").prop('disabled', false);
$("#generatetpgcode").addClass('success');
} else {
toolpathGrp.traverse(function(child) {
var toolDia = toolpathGrp.userData.toolDia;
Expand Down
4 changes: 3 additions & 1 deletion js/advanced-cam-tree.js
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,7 @@ function fillTree() {
if (toolpathsInScene.length > 0) {

$('#generatetpgcode').prop('disabled', false);
$("#generatetpgcode").addClass('success');

var table = `<table class="jobsetuptable" style="width: 100%" id="toolpathstable">`
$('#toolpathtree').append(table)
Expand Down Expand Up @@ -132,9 +133,10 @@ function fillTree() {
}

} else {
var instructions = `<p class="text-secondary text-center">Please select some Vectors by clicking them in the viewer or using the Documents tree above. Hold down Ctrl to select multiples, Ctrl+A for Select-All, etc. <br>Add them to a toolpath using the <kbd class="bg-openbuilds"> <i class="fa fa-plus" aria-hidden="true"></i> Create Toolpath</kbd> button</p>`
var instructions = `<p class="text-secondary text-center mt-3">Please select some Vectors by clicking them in the viewer or using the Documents tree above. Hold down Ctrl to select multiples, Ctrl+A for Select-All, etc. <br>Add them to a toolpath using the <kbd class="bg-openbuilds"> <i class="fa fa-plus" aria-hidden="true"></i> Create Toolpath</kbd> button</p>`
$('#toolpathtree').append(instructions);
$('#generatetpgcode').prop('disabled', true);
$("#generatetpgcode").removeClass('success');

} // End of if (toolpathsInScene.length > 0)

Expand Down
1 change: 1 addition & 0 deletions js/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -321,6 +321,7 @@ function loadFile(f) {
function saveFile() {
Metro.dialog.create({
title: "Save GCODE",
clsDialog: "dark",
content: `<div class="form-group">
<label>Filename:</label>
<input type="text" id="gcodeFilename" contenteditable="true" placeholder="` + 'file-' + date.yyyymmdd() + '.gcode' + `" value="` + 'file-' + date.yyyymmdd() + '.gcode' + `"/>
Expand Down
3 changes: 2 additions & 1 deletion lib/3dview/3dview.js
Original file line number Diff line number Diff line change
Expand Up @@ -37,12 +37,13 @@ function parseGcodeInWebWorker() {
// Button on Ribbon Menu
$("#generatetpgcode").html("<i class='fa fa-cubes' aria-hidden='true'></i> Generate G-Code");
$("#generatetpgcode").prop('disabled', false);
$("#generatetpgcode").addClass('success');


// $('#gcodesavebtn1').prop('disabled', false);
$('#gcodesavebtn2').removeClass('disabled');
$('#gcodesavebtn2').addClass('primary');
$('#gcodetrashbtn2').removeClass('disabled');
$('#gcodeexporticon').addClass('fg-grayBlue').removeClass('fg-gray');
$('#gcodepreviewicon').addClass('fg-grayBlue').removeClass('fg-gray');
$('#trashicon').addClass('fg-red').removeClass('fg-gray');

Expand Down
14 changes: 11 additions & 3 deletions workers/toolpath/toolpath.js
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@ function toolpathPreview(i) {
function drawToolpath(index) {
$("#generatetpgcode").html("<i class='fa fa-spinner fa-spin '></i> Unavailable, please wait");
$("#generatetpgcode").prop('disabled', true);
$("#generatetpgcode").removeClass('success');

var toolPathWorker = new Worker('workers/toolpath/worker/toolpathworker.js');
toolpathsInScene[index].userData.worker = toolPathWorker
Expand Down Expand Up @@ -49,10 +50,14 @@ function drawToolpath(index) {
if (toolpathWorkersBusy()) {
$("#generatetpgcode").html("<i class='fa fa-spinner fa-spin '></i> Unavailable, please wait");
$("#generatetpgcode").prop('disabled', true);
$("#generatetpgcode").removeClass('success');


} else {
$("#generatetpgcode").html("<i class='fa fa-cubes' aria-hidden='true'></i> Generate G-Code");
$("#generatetpgcode").prop('disabled', false);
$("#generatetpgcode").addClass('success');


}
}
Expand All @@ -65,9 +70,12 @@ function drawToolpath(index) {
performanceLimit: $('#performanceLimit').is(":checked")
}

toolPathWorker.postMessage({
'data': dataToProcess
});
if (toolpathsInScene[index].userData.camOperation) {
toolPathWorker.postMessage({
'data': dataToProcess
});
}


}

Expand Down

0 comments on commit c209ce2

Please sign in to comment.