add select tool
This commit is contained in:
parent
5b1e2d5eeb
commit
ff298e8300
5 changed files with 73 additions and 28 deletions
|
|
@ -430,7 +430,7 @@
|
||||||
showDevices();
|
showDevices();
|
||||||
break;
|
break;
|
||||||
case cca('w'): // scale
|
case cca('w'): // scale
|
||||||
UI.tool.scale();
|
UI.tool.next();
|
||||||
break;
|
break;
|
||||||
case cca('o'): // tools
|
case cca('o'): // tools
|
||||||
showTools();
|
showTools();
|
||||||
|
|
@ -2722,12 +2722,18 @@
|
||||||
// bind tool show buttons
|
// bind tool show buttons
|
||||||
UI.tool.show = function(tictac) {
|
UI.tool.show = function(tictac) {
|
||||||
if (typeof(tictac) === 'string') {
|
if (typeof(tictac) === 'string') {
|
||||||
|
nextool = listool.indexOf(tictac)+1;
|
||||||
tictac = $(tictac);
|
tictac = $(tictac);
|
||||||
}
|
}
|
||||||
let mover = parentWithClass(tictac.control, 'movable');
|
let mover = parentWithClass(tictac.control, 'movable');
|
||||||
mover.style.display = 'flex';
|
mover.style.display = 'flex';
|
||||||
tictac.control.onclick();
|
tictac.control.onclick();
|
||||||
}
|
}
|
||||||
|
let nextool = 0;
|
||||||
|
let listool = ['ft-scale','ft-mesh','ft-select','ft-rotate'];
|
||||||
|
UI.tool.next = function() {
|
||||||
|
UI.tool.show(listool[nextool++ % 4]);
|
||||||
|
};
|
||||||
$('tool-rotate').onclick = () => { UI.tool.show('ft-rotate') };
|
$('tool-rotate').onclick = () => { UI.tool.show('ft-rotate') };
|
||||||
$('tool-scale').onclick = () => { UI.tool.show('ft-scale') };
|
$('tool-scale').onclick = () => { UI.tool.show('ft-scale') };
|
||||||
$('tool-mesh').onclick = () => { UI.tool.show('ft-mesh') };
|
$('tool-mesh').onclick = () => { UI.tool.show('ft-mesh') };
|
||||||
|
|
|
||||||
|
|
@ -1985,6 +1985,7 @@
|
||||||
platform.select(widget, shift);
|
platform.select(widget, shift);
|
||||||
platform.compute_max_z();
|
platform.compute_max_z();
|
||||||
API.event.emit('widget.add', widget);
|
API.event.emit('widget.add', widget);
|
||||||
|
platformChanged();
|
||||||
auto_save();
|
auto_save();
|
||||||
if (nolayout) {
|
if (nolayout) {
|
||||||
return;
|
return;
|
||||||
|
|
@ -2057,9 +2058,32 @@
|
||||||
platformUpdateSelected();
|
platformUpdateSelected();
|
||||||
if (feature.drop_layout) platform.layout();
|
if (feature.drop_layout) platform.layout();
|
||||||
API.event.emit('widget.delete', widget);
|
API.event.emit('widget.delete', widget);
|
||||||
|
platformChanged();
|
||||||
auto_save();
|
auto_save();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function platformChanged() {
|
||||||
|
let fts = $('ft-select');
|
||||||
|
fts.innerHTML = '';
|
||||||
|
for (let w of WIDGETS) {
|
||||||
|
let b = DOC.createElement('button');
|
||||||
|
fts.appendChild(b);
|
||||||
|
b.innerText = w.meta.file || 'no name';
|
||||||
|
let color;
|
||||||
|
b.onmouseenter = function() {
|
||||||
|
color = w.getColor();
|
||||||
|
w.setColor(0x0088ff);
|
||||||
|
};
|
||||||
|
b.onmouseleave = function() {
|
||||||
|
w.setColor(color);
|
||||||
|
};
|
||||||
|
b.onclick = function() {
|
||||||
|
platformSelect(w, true);
|
||||||
|
color = w.getColor();
|
||||||
|
};
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function platformSelectAll() {
|
function platformSelectAll() {
|
||||||
forAllWidgets(function(w) { platform.select(w, true) })
|
forAllWidgets(function(w) { platform.select(w, true) })
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -477,10 +477,15 @@ console.log/** Copyright Stewart Allen <sa@grid.space> -- All Rights Reserved */
|
||||||
if (Array.isArray(color)) {
|
if (Array.isArray(color)) {
|
||||||
color = color[this.getExtruder(settings) % color.length];
|
color = color[this.getExtruder(settings) % color.length];
|
||||||
}
|
}
|
||||||
|
this.color = color;
|
||||||
let material = this.mesh.material;
|
let material = this.mesh.material;
|
||||||
material.color.set(color);
|
material.color.set(color);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
PRO.getColor = function() {
|
||||||
|
return this.color;
|
||||||
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @param {number} value
|
* @param {number} value
|
||||||
*/
|
*/
|
||||||
|
|
|
||||||
|
|
@ -440,7 +440,9 @@ th, tr, td, label {
|
||||||
.movable {
|
.movable {
|
||||||
margin: 5px;
|
margin: 5px;
|
||||||
}
|
}
|
||||||
|
.movable input {
|
||||||
|
background-color: rgba(255,255,255,0.5);
|
||||||
|
}
|
||||||
.movable .title {
|
.movable .title {
|
||||||
color: white;
|
color: white;
|
||||||
padding: 2px 3px 1px 3px;
|
padding: 2px 3px 1px 3px;
|
||||||
|
|
@ -450,13 +452,14 @@ th, tr, td, label {
|
||||||
font-size: smaller;
|
font-size: smaller;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.movable .body {
|
.movable .body {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0 5px 0 0;
|
padding: 0 5px 0 0;
|
||||||
background-color: rgba(245,245,245,0.9);
|
background-color: rgba(245,245,245,0.8);
|
||||||
|
}
|
||||||
|
.movable:hover .body {
|
||||||
|
background-color: rgba(245,245,245,0.95);
|
||||||
}
|
}
|
||||||
|
|
||||||
.movable .footer {
|
.movable .footer {
|
||||||
height: 10px;
|
height: 10px;
|
||||||
border-bottom-left-radius: 5px;
|
border-bottom-left-radius: 5px;
|
||||||
|
|
@ -475,7 +478,7 @@ th, tr, td, label {
|
||||||
}
|
}
|
||||||
|
|
||||||
.tictac {
|
.tictac {
|
||||||
margin: 2px 2px 0 0;
|
margin: 2px 2px 2px 0;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
border: 1px solid white;
|
border: 1px solid white;
|
||||||
|
|
@ -484,15 +487,15 @@ th, tr, td, label {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
.tictac:hover {
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
background-color: #eee;
|
||||||
|
}
|
||||||
.tictac.selected {
|
.tictac.selected {
|
||||||
background-color: var(--main-color);
|
background-color: var(--main-color);
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tictac:hover {
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
}
|
|
||||||
|
|
||||||
#float-tools {
|
#float-tools {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
margin: 0 0 0 5px;
|
margin: 0 0 0 5px;
|
||||||
|
|
@ -580,12 +583,18 @@ th, tr, td, label {
|
||||||
grid-template-rows: auto auto auto;
|
grid-template-rows: auto auto auto;
|
||||||
grid-template-columns: auto 1fr;
|
grid-template-columns: auto 1fr;
|
||||||
}
|
}
|
||||||
|
|
||||||
#lock_x, #lock_y, #lock_z {
|
#lock_x, #lock_y, #lock_z {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 2px;
|
right: 2px;
|
||||||
top: 7px;
|
top: 7px;
|
||||||
}
|
}
|
||||||
|
#ft-select {
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
#ft-select button {
|
||||||
|
text-transform: none;
|
||||||
|
}
|
||||||
|
|
||||||
#lt-top {
|
#lt-top {
|
||||||
height: 10px;
|
height: 10px;
|
||||||
|
|
|
||||||
|
|
@ -91,6 +91,21 @@
|
||||||
<div lkt="mesh" class="tictac" select="ft-mesh" label="ft-label"><i class="fas fa-dice-d20"></i></div>
|
<div lkt="mesh" class="tictac" select="ft-mesh" label="ft-label"><i class="fas fa-dice-d20"></i></div>
|
||||||
<div lkt="select" class="tictac" select="ft-select" label="ft-label"><i class="fas fa-mouse-pointer"></i></div>
|
<div lkt="select" class="tictac" select="ft-select" label="ft-label"><i class="fas fa-mouse-pointer"></i></div>
|
||||||
</div>
|
</div>
|
||||||
|
<div id="ft-scale" class="grow grid">
|
||||||
|
<div><label class="middle">X</label><input id="lock_x" type="checkbox" checked/></div>
|
||||||
|
<div><label class="middle">Y</label><input id="lock_y" type="checkbox" checked/></div>
|
||||||
|
<div><label class="middle">Z</label><input id="lock_z" type="checkbox" checked/></div>
|
||||||
|
<div><label id="lab-axis" lk="axis">axis</label></div>
|
||||||
|
<div><input id="size_x" size="8" class="value"/></div>
|
||||||
|
<div><input id="size_y" size="8" class="value"/></div>
|
||||||
|
<div><input id="size_z" size="8" class="value"/></div>
|
||||||
|
<div><label id="lab-size" lk="size">size</label></div>
|
||||||
|
<div><input id="scale_x" size="8" class="value" value="1"/></div>
|
||||||
|
<div><input id="scale_y" size="8" class="value" value="1"/></div>
|
||||||
|
<div><input id="scale_z" size="8" class="value" value="1"/></div>
|
||||||
|
<div><label id="lab-scale" lk="scale">scale</label></div>
|
||||||
|
<button id="scale-reset" class="gr4">reset</button>
|
||||||
|
</div>
|
||||||
<div id="ft-rotate" class="grow grid">
|
<div id="ft-rotate" class="grow grid">
|
||||||
<div><i id="rot_x_lt" class="fas fa-chevron-left"></i></div>
|
<div><i id="rot_x_lt" class="fas fa-chevron-left"></i></div>
|
||||||
<label>X</label>
|
<label>X</label>
|
||||||
|
|
@ -109,21 +124,6 @@
|
||||||
<button id="unrotate" class="grow" lk="reset">reset</button>
|
<button id="unrotate" class="grow" lk="reset">reset</button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="ft-scale" class="grow grid">
|
|
||||||
<div><label class="middle">X</label><input id="lock_x" type="checkbox" checked/></div>
|
|
||||||
<div><label class="middle">Y</label><input id="lock_y" type="checkbox" checked/></div>
|
|
||||||
<div><label class="middle">Z</label><input id="lock_z" type="checkbox" checked/></div>
|
|
||||||
<div><label id="lab-axis" lk="axis">axis</label></div>
|
|
||||||
<div><input id="size_x" size="8" class="value"/></div>
|
|
||||||
<div><input id="size_y" size="8" class="value"/></div>
|
|
||||||
<div><input id="size_z" size="8" class="value"/></div>
|
|
||||||
<div><label id="lab-size" lk="size">size</label></div>
|
|
||||||
<div><input id="scale_x" size="8" class="value" value="1"/></div>
|
|
||||||
<div><input id="scale_y" size="8" class="value" value="1"/></div>
|
|
||||||
<div><input id="scale_z" size="8" class="value" value="1"/></div>
|
|
||||||
<div><label id="lab-scale" lk="scale">scale</label></div>
|
|
||||||
<button id="scale-reset" class="gr4">reset</button>
|
|
||||||
</div>
|
|
||||||
<div id="ft-mesh" class="grow f-col">
|
<div id="ft-mesh" class="grow f-col">
|
||||||
<div id="mesh-info" class="grid">
|
<div id="mesh-info" class="grid">
|
||||||
<label>object:</label>
|
<label>object:</label>
|
||||||
|
|
@ -137,7 +137,7 @@
|
||||||
<button id="mesh-export-stl" lk="rc_xstl">export STL</button>
|
<button id="mesh-export-stl" lk="rc_xstl">export STL</button>
|
||||||
<button id="mesh-heal" lk="rc_heal">heal</button>
|
<button id="mesh-heal" lk="rc_heal">heal</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="ft-select" class="grow middle">coming soon</div>
|
<div id="ft-select" class="grow f-col"></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer"></div>
|
<div class="footer"></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -475,12 +475,13 @@
|
||||||
</div>
|
</div>
|
||||||
<div id="tool-info" class="noshow"></div>
|
<div id="tool-info" class="noshow"></div>
|
||||||
<div id="context-menu">
|
<div id="context-menu">
|
||||||
<button id="context-clear-workspace" lk="rc_clws">clear workspace</button>
|
|
||||||
<button id="context-export-workspace" lk="rc_xpws">export workspace</button>
|
<button id="context-export-workspace" lk="rc_xpws">export workspace</button>
|
||||||
|
<button id="context-clear-workspace" lk="rc_clws">clear workspace</button>
|
||||||
<div class="sep"></div>
|
<div class="sep"></div>
|
||||||
<button id="context-layflat" lk="rc_lafl">lay flat</button>
|
<button id="context-layflat" lk="rc_lafl">lay flat</button>
|
||||||
<button id="context-mirror" lk="rc_mirr">mirror</button>
|
<button id="context-mirror" lk="rc_mirr">mirror</button>
|
||||||
<button id="context-duplicate" lk="rc_dupl">duplicate</button>
|
<button id="context-duplicate" lk="rc_dupl">duplicate</button>
|
||||||
|
<div class="sep"></div>
|
||||||
<button id="context-setfocus" lk="rc_focs">set focus</button>
|
<button id="context-setfocus" lk="rc_focs">set focus</button>
|
||||||
</div>
|
</div>
|
||||||
<div id="fps" class="noshow"></div>
|
<div id="fps" class="noshow"></div>
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue