diff --git a/src/kiri/init.js b/src/kiri/init.js
index 4d35f120..70a07817 100644
--- a/src/kiri/init.js
+++ b/src/kiri/init.js
@@ -27,6 +27,7 @@ gapp.register("kiri.init", [], (root, exports) => {
CAM = [MODES.CAM],
SLA = [MODES.SLA],
FDM = [MODES.FDM],
+ FDM_CAM = [MODES.FDM,MODES.CAM],
FDM_SLA = [MODES.FDM,MODES.SLA],
FDM_LZR = [MODES.LASER,MODES.FDM],
FDM_CAM_SLA = [MODES.CAM,MODES.FDM,MODES.SLA],
@@ -274,18 +275,18 @@ gapp.register("kiri.init", [], (root, exports) => {
return active && (active.nodeName === "INPUT" || active.nodeName === "TEXTAREA");
}
- function inputTextOK() {
- return DOC.activeElement === ui.deviceName;
- }
+ // function inputTextOK() {
+ // return DOC.activeElement === ui.deviceName;
+ // }
- function textAreaHasFocus() {
- let active = DOC.activeElement;
- return active && active.nodeName === "TEXTAREA";
- }
+ // function textAreaHasFocus() {
+ // let active = DOC.activeElement;
+ // return active && active.nodeName === "TEXTAREA";
+ // }
- function inputSize() {
- return parseInt(DOC.activeElement.size);
- }
+ // function inputSize() {
+ // return parseInt(DOC.activeElement.size);
+ // }
function cca(c) {
return c.charCodeAt(0);
@@ -784,7 +785,7 @@ gapp.register("kiri.init", [], (root, exports) => {
dev.new = false;
dev.deviceName = devicename;
- ui.deviceName.value = devicename;
+ // ui.deviceName.value = devicename;
ui.deviceBelt.checked = dev.bedBelt;
ui.deviceRound.checked = dev.bedRound;
ui.deviceOrigin.checked = dev.outputOriginCenter || dev.originCenter || dev.bedRound;
@@ -802,7 +803,7 @@ gapp.register("kiri.init", [], (root, exports) => {
// disable editing for non-local devices
[
- ui.deviceName,
+ // ui.deviceName,
ui.gcodePre,
ui.gcodePost,
ui.bedDepth,
@@ -847,14 +848,19 @@ gapp.register("kiri.init", [], (root, exports) => {
ui.deviceSave.disabled = !local;
ui.deviceDelete.disabled = !local;
+ ui.deviceRename.disabled = !local;
ui.deviceExport.disabled = !local;
+ ui.deviceAdd.style.display = mode === 'SLA' ? 'none' : '';
+
if (local) {
ui.deviceAdd.innerText = "copy";
ui.deviceDelete.style.display = '';
+ ui.deviceRename.style.display = '';
ui.deviceExport.style.display = '';
} else {
ui.deviceAdd.innerText = "customize";
ui.deviceDelete.style.display = 'none';
+ ui.deviceRename.style.display = 'none';
ui.deviceExport.style.display = 'none';
}
ui.deviceAdd.disabled = dev.noclone;
@@ -981,9 +987,8 @@ gapp.register("kiri.init", [], (root, exports) => {
space.world.add(deviceImage = mesh);
}
- function updateDeviceName() {
- let newname = ui.deviceName.value,
- selected = api.device.get(),
+ function updateDeviceName(newname) {
+ let selected = api.device.get(),
devs = settings().devices;
if (newname !== selected) {
devs[newname] = devs[selected];
@@ -1000,8 +1005,7 @@ gapp.register("kiri.init", [], (root, exports) => {
}
function renderDevices(devices) {
- let selectedIndex = -1,
- selected = api.device.get(),
+ let selected = api.device.get() || devices[0],
features = api.feature,
devs = settings().devices,
dfilter = typeof(features.device_filter) === 'function' ? features.device_filter : undefined;
@@ -1039,8 +1043,13 @@ gapp.register("kiri.init", [], (root, exports) => {
ui.deviceDelete.onclick = function() {
api.function.clear();
removeLocalDevice(getSelectedDevice());
+ selectDevice(getModeDevices()[0]);
showDevices();
};
+ ui.deviceRename.onclick = function() {
+ const newname = prompt(`Rename "${selected}`, selected);
+ if (newname) updateDeviceName(newname);
+ };
ui.deviceExport.onclick = function(event) {
const record = {
version: kiri.version,
@@ -1054,12 +1063,9 @@ gapp.register("kiri.init", [], (root, exports) => {
api.device.export(exp, selected, { event, record });
};
- ui.deviceList.innerHTML = '';
- ui.deviceMy.innerHTML = '';
- let incr = 0;
- let found = null;
- let first = devices[0];
let dedup = {};
+ let list_cdev = [];
+ let list_mdev = [];
devices.forEach(function(device, index) {
// prevent device from appearing twice
// such as local name = standard device name
@@ -1068,48 +1074,31 @@ gapp.register("kiri.init", [], (root, exports) => {
}
dedup[device] = device;
let loc = isLocalDevice(device);
- // if filter set, use
- if (!loc && deviceFilter && device.toLowerCase().indexOf(deviceFilter) < 0) {
- return;
- }
- // allow for device filter feature
if (dfilter && dfilter(device) === false) {
return;
}
- if (incr === 0) {
- first = device;
- }
- let opt = DOC.createElement('button');
- opt.appendChild(DOC.createTextNode(device.replace(/\./g,' ')));
- opt.onclick = function() {
- selectDevice(device);
- opt.classList.add("selected");
- if (found && found !== opt) {
- found.classList.remove("selected");
- }
- found = opt;
- api.platform.layout();
- };
if (loc) {
- ui.deviceMy.appendChild(opt);
+ list_mdev.push(h.option(device));
} else {
- ui.deviceList.appendChild(opt);
+ list_cdev.push(h.option(device));
}
- if (device === selected) {
- // scroll to highlighted selection
- setTimeout(() => ui.deviceList.scrollTop = opt.offsetTop, 0);
- opt.classList.add("selected");
- selectedIndex = incr;
- found = opt;
- }
- incr++;
});
- if (selectedIndex >= 0) {
- selectDevice(selected);
- } else {
- selectDevice(first);
+ let dev_list = $('dev-list');
+ h.bind(dev_list, [
+ h.option({ _: '-- My Devices --', disabled: true }),
+ ...list_mdev,
+ h.option({ _: '-- Stock Devices --', disabled: true }),
+ ...list_cdev
+ ]);
+ let dev_opts = [...dev_list.options].map(o => o.label);
+ dev_list.selectedIndex = dev_opts.indexOf(selected);
+ dev_list.onchange = ev => {
+ const seldev = dev_list.options[dev_list.selectedIndex];
+ selectDevice(seldev.label);
+ api.platform.layout();
}
+ selectDevice(selected);
}
function renderTools() {
@@ -1362,8 +1351,12 @@ gapp.register("kiri.init", [], (root, exports) => {
// not the best way to do this, but main decl of api.show is broken
api.show.tools = showTools;
+ function getModeDevices() {
+ return Object.keys(devices[api.mode.get_lower()]).sort();
+ }
+
function updateDeviceList() {
- renderDevices(Object.keys(devices[api.mode.get_lower()]).sort());
+ renderDevices(getModeDevices());
}
async function sync_get() {
@@ -1379,10 +1372,8 @@ gapp.register("kiri.init", [], (root, exports) => {
}
function _showDevices() {
- // disable device filter and show devices
- ui.dev.header.onclick(true);
+ updateDeviceList();
api.modal.show('setup');
- ui.deviceList.focus();
}
function dragOverHandler(evt) {
@@ -1516,7 +1507,7 @@ gapp.register("kiri.init", [], (root, exports) => {
let { event, conf, view, show } = api;
let { bound, toInt, toFloat } = uc;
let { newBlank, newButton, newBoolean, newGroup, newInput } = uc;
- let { newInput2, newSelect, newText, newRow, newGCode } = uc;
+ let { newSelect, newText, newRow, newGCode } = uc;
event.emit('init.one');
@@ -1624,13 +1615,6 @@ gapp.register("kiri.init", [], (root, exports) => {
speedbar: $('speedbar'),
context: $('context-menu'),
- // options: {
- // // area: $('lt-options'),
- // // trash: $('lt-trash'),
- // // enable: $('lt-w-enable'),
- // // disable: $('lt-w-disable'),
- // },
-
back: $('lt-back'),
ltsetup: $('lt-setup'),
ltfile: $('lt-file'),
@@ -1638,7 +1622,6 @@ gapp.register("kiri.init", [], (root, exports) => {
ltact: $('lt-start'),
edit: $('lt-tools'),
nozzle: $('menu-nozzle'),
- // render: $('menu-render'),
modal: $('modal'),
modalBox: $('modal-box'),
@@ -1656,10 +1639,9 @@ gapp.register("kiri.init", [], (root, exports) => {
catalogList: $('catalogList'),
devices: $('devices'),
- deviceList: $('device-list'),
- deviceMy: $('device-my'),
deviceAdd: $('device-add'),
deviceDelete: $('device-del'),
+ deviceRename: $('device-ren'),
deviceExport: $('device-exp'),
deviceSave: $('device-save'),
@@ -1715,37 +1697,34 @@ gapp.register("kiri.init", [], (root, exports) => {
/** Device Browser / Editor */
- device: newGroup(LANG.dv_gr_dev, $('device1'), {group:"ddev", inline:true, class:"noshow"}),
- deviceName: newInput(LANG.dv_name_s, {title:LANG.dv_name_l, size:"70%", text:true, action:updateDeviceName}),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true }),
+ device: newGroup(LANG.dv_gr_dev, null, {group:"ddev", inline:true, class:"noshow"}),
- devbed: newRow([
- uc.newLabel(LANG.volume, { class: "grow" }),
- uc.newLabel('X', { class: "dim" }),
- ui.bedWidth = newInput2({title:LANG.dv_bedw_l, convert:toFloat, size:5, units:true, round:2, action:updateDeviceSize}),
- uc.newLabel('Y', { class: "dim" }),
- ui.bedDepth = newInput2({title:LANG.dv_bedd_l, convert:toFloat, size:5, units:true, round:2, action:updateDeviceSize}),
- uc.newLabel('Z', { class: "dim" }),
- ui.maxHeight = newInput2({title:LANG.dv_bedh_l, convert:toFloat, size:5, modes:FDM_SLA, action:updateDeviceSize}),
- ], { class: "var-row" }),
-
- resolutionX: newInput(LANG.dv_rezx_s, {title:LANG.dv_rezx_l, convert:toInt, size:5, modes:SLA}),
- resolutionY: newInput(LANG.dv_rezy_s, {title:LANG.dv_rezy_l, convert:toInt, size:5, modes:SLA}),
+ _____: newGroup("workspace", null, {group:"dext", inline:true}),
+ bedWidth: newInput('X (width)', {title:LANG.dv_bedw_l, convert:toFloat, size:6, units:true, round:2, action:updateDeviceSize}),
+ bedDepth: newInput('Y (depth)', {title:LANG.dv_bedw_l, convert:toFloat, size:6, units:true, round:2, action:updateDeviceSize}),
+ maxHeight: newInput('Z (height)', {title:LANG.dv_bedw_l, convert:toFloat, size:6, units:true, round:2, action:updateDeviceSize}),
+ resolutionX: newInput(LANG.dv_rezx_s, {title:LANG.dv_rezx_l, convert:toInt, size:6, modes:SLA}),
+ resolutionY: newInput(LANG.dv_rezy_s, {title:LANG.dv_rezy_l, convert:toInt, size:6, modes:SLA}),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
+ _____: newGroup("firmware", null, {group:"dext", inline:true}),
+ fwRetract: newBoolean(LANG.dv_retr_s, onBooleanClick, {title:LANG.dv_retr_l, modes:FDM}),
+ deviceOrigin: newBoolean(LANG.dv_orgc_s, onBooleanClick, {title:LANG.dv_orgc_l, modes:FDM_LZR, show:() => !ui.deviceRound.checked}),
+ deviceRound: newBoolean(LANG.dv_bedc_s, onBooleanClick, {title:LANG.dv_bedc_l, modes:FDM, trigger:true, show:isNotBelt}),
+ deviceBelt: newBoolean(LANG.dv_belt_s, onBooleanClick, {title:LANG.dv_belt_l, modes:FDM, trigger:true, show:() => !ui.deviceRound.checked}),
+ separator: newBlank({class:"pop-sep", modes:FDM, driven:true}),
spindleMax: newInput(LANG.dv_spmx_s, {title:LANG.dv_spmx_l, convert:toInt, size:5, modes:CAM, trigger:1}),
deviceZMax: newInput(LANG.dv_zmax_s, {title:LANG.dv_zmax_l, convert:toInt, size:5, modes:FDM}),
gcodeTime: newInput(LANG.dv_time_s, {title:LANG.dv_time_l, convert:toFloat, size:5, modes:FDM}),
- separator: newBlank({class:"pop-sep", modes:FDM, driven:true}),
- filamentSource: newSelect(LANG.dv_fsrc_s, {title: LANG.dv_fsrc_l, action: filamentSourceSave, modes:FDM}, "filasrc"),
- fwRetract: newBoolean(LANG.dv_retr_s, onBooleanClick, {title:LANG.dv_retr_l, modes:FDM}),
- deviceOrigin: newBoolean(LANG.dv_orgc_s, onBooleanClick, {title:LANG.dv_orgc_l, modes:FDM_LZR, show:() => !ui.deviceRound.checked}),
- deviceRound: newBoolean(LANG.dv_bedc_s, onBooleanClick, {title:LANG.dv_bedc_l, trigger:true, show:isNotBelt}),
- deviceBelt: newBoolean(LANG.dv_belt_s, onBooleanClick, {title:LANG.dv_belt_l, trigger:true, show:() => !ui.deviceRound.checked}),
- extruder: newGroup(LANG.dv_gr_ext, $('device2'), {group:"dext", inline:true, modes:FDM}),
+ filamentSource: newSelect(LANG.dv_fsrc_s, {title: LANG.dv_fsrc_l, action: filamentSourceSave, modes:FDM, show:() => false}, "filasrc"),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM }),
+ extruder: newGroup(LANG.dv_gr_ext, null, {group:"dext", inline:true}),
extFilament: newInput(LANG.dv_fila_s, {title:LANG.dv_fila_l, convert:toFloat, modes:FDM}),
extNozzle: newInput(LANG.dv_nozl_s, {title:LANG.dv_nozl_l, convert:toFloat, modes:FDM}),
extOffsetX: newInput(LANG.dv_exox_s, {title:LANG.dv_exox_l, convert:toFloat, modes:FDM}),
extOffsetY: newInput(LANG.dv_exoy_s, {title:LANG.dv_exoy_l, convert:toFloat, modes:FDM}),
- separator: newBlank({class:"set-sep", modes:FDM, driven:true}),
- _____: newGroup(LANG.dv_gr_too, $('device2'), {group:"dext", inline:true, modes:CAM_LZR}),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:GCODE }),
+ _____: newGroup(LANG.dv_gr_too, null, {group:"dext", inline:true}),
extSelect: newText(LANG.dv_exts_s, {title:LANG.dv_exts_l, size:14, height:3, area:gcode, modes:GCODE}),
extDeselect: newText(LANG.dv_dext_s, {title:LANG.dv_dext_l, size:14, height:3, area:gcode, modes:GCODE}),
extPad: newBlank({class:"grow", modes:FDM}),
@@ -1755,7 +1734,8 @@ gapp.register("kiri.init", [], (root, exports) => {
ui.extDel = newButton(undefined, undefined, {icon:''}),
ui.extNext = newButton(undefined, undefined, {icon:''})
], {class:"dev-buttons ext-buttons", modes:FDM}),
- palette: newGroup(LANG.dv_gr_pal, $('palette3'), {group:"dext2", inline:true, modes:FDM}),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:FDM, show: () => false && ui.filamentSource.selectedOptions[0].value === 'palette3' }),
+ palette: newGroup(LANG.dv_gr_pal, null, {group:"dext2", inline:true, modes:FDM}),
paletteId: newInput(LANG.dv_paid_s, {title:LANG.dv_paid_l, modes:FDM, size:15, text:true}),
palettePing: newInput(LANG.dv_paps_s, {title:LANG.dv_paps_l, modes:FDM, convert:toInt}),
paletteFeed: newInput(LANG.dv_pafe_s, {title:LANG.dv_pafe_l, modes:FDM, convert:toInt}),
@@ -1765,7 +1745,8 @@ gapp.register("kiri.init", [], (root, exports) => {
paletteHeat: newInput(LANG.dv_pahe_s, {title:LANG.dv_pahe_l, modes:FDM, convert:toInt}),
paletteCool: newInput(LANG.dv_paco_s, {title:LANG.dv_paco_l, modes:FDM, convert:toInt}),
palettePress: newInput(LANG.dv_pacm_s, {title:LANG.dv_pacm_l, modes:FDM, convert:toInt}),
- _____: newGroup(LANG.dv_gr_out, $('device2'), {group:"dgco", inline:true, modes:CAM_LZR}),
+ _____: uc.newDiv({ class: "f-col t-body t-inset", addto: $('dev-config'), set:true, modes:CAM_LZR }),
+ _____: newGroup(LANG.dv_gr_out, null, {group:"dgco", inline:true}),
gcodeStrip: newBoolean(LANG.dv_strc_s, onBooleanClick, {title:LANG.dv_strc_l, modes:CAM}),
gcodeSpace: newBoolean(LANG.dv_tksp_s, onBooleanClick, {title:LANG.dv_tksp_l, modes:CAM_LZR}),
useLaser: newBoolean(LANG.dv_lazr_s, onBooleanClick, {title:LANG.dv_lazr_l, modes:CAM}),
@@ -1801,7 +1782,7 @@ gapp.register("kiri.init", [], (root, exports) => {
shiny: newBoolean(LANG.op_shny_s, booleanSave, {title:LANG.op_shny_l, modes:FDM}),
lineType: newSelect(LANG.op_line_s, {title: LANG.op_line_l, action: lineTypeSave, modes:FDM}, "linetype"),
animesh: newSelect(LANG.op_anim_s, {title: LANG.op_anim_l, action: aniMeshSave, modes:CAM}, "animesh"),
- units: newSelect(LANG.op_unit_s, {title: LANG.op_unit_l, action: unitsSave, modes:CAM, trace:false}, "units"),
+ units: newSelect(LANG.op_unit_s, {title: LANG.op_unit_l, action: unitsSave, modes:CAM}, "units"),
_____: newGroup(LANG.lo_menu, $('prefs-lay'), {inline: true}),
autoSave: newBoolean(LANG.op_save_s, booleanSave, {title:LANG.op_save_l}),
autoLayout: newBoolean(LANG.op_auto_s, booleanSave, {title:LANG.op_auto_l}),
@@ -1962,7 +1943,7 @@ gapp.register("kiri.init", [], (root, exports) => {
camStockIndexed: newBoolean(LANG.cs_indx_s, onBooleanClick, {title:LANG.cs_indx_l}),
camStockIndexGrid: newBoolean(LANG.cs_ishg_s, onBooleanClick, {title:LANG.cs_ishg_l, show:() => ui.camStockIndexed.checked}),
camLimits: newGroup(LANG.cc_menu, $('cam-limits'), { modes:CAM, driven, separator }),
- camZAnchor: newSelect(LANG.ou_zanc_s, {title: LANG.ou_zanc_l, action:zAnchorSave, trace:false, show:() => !ui.camStockIndexed.checked}, "zanchor"),
+ camZAnchor: newSelect(LANG.ou_zanc_s, {title: LANG.ou_zanc_l, action:zAnchorSave, show:() => !ui.camStockIndexed.checked}, "zanchor"),
camZOffset: newInput(LANG.ou_ztof_s, {title:LANG.ou_ztof_l, convert:toFloat, units:true}),
camZBottom: newInput(LANG.ou_zbot_s, {title:LANG.ou_zbot_l, convert:toFloat, units:true, trigger: true}),
camZThru: newInput(LANG.ou_ztru_s, {title:LANG.ou_ztru_l, convert:toFloat, bound:bound(0.0,100), units:true, show:() => { return ui.camZBottom.value == 0 }}),
@@ -2192,30 +2173,6 @@ gapp.register("kiri.init", [], (root, exports) => {
if (!ev.buttons) api.event.emit('slider.unlabel');
};
- ui.dev.header.onclick = (hide) => {
- let style = ui.dev.filter.style;
- if (style.display === 'flex' || hide === true) {
- style.display = '';
- deviceFilter = null;
- updateDeviceList();
- } else {
- style.display = 'flex';
- ui.dev.filter.focus();
- deviceFilter = ui.dev.filter.value.toLowerCase();
- updateDeviceList();
- }
- };
-
- ui.dev.filter.onkeyup = (ev) => {
- deviceFilter = ui.dev.filter.value.toLowerCase();
- updateDeviceList();
- };
-
- ui.dev.filter.onclick = (ev) => {
- ev.preventDefault();
- ev.stopPropagation();
- };
-
api.event.on('slider.unlabel', (values) => {
});
@@ -2686,9 +2643,6 @@ gapp.register("kiri.init", [], (root, exports) => {
// fill device list
updateDeviceList();
- // ensure settings has gcode
- selectDevice(DEVNAME || api.device.get());
-
// update ui fields from settings
api.conf.update_fields();
diff --git a/src/kiri/platform.js b/src/kiri/platform.js
index 1801dc29..9ad485fd 100644
--- a/src/kiri/platform.js
+++ b/src/kiri/platform.js
@@ -566,7 +566,6 @@ function platformChanged() {
h.bind($('ws-widgets'), api.widgets.all().map(w => {
let color;
return [
-
h.div([
h.button({
@@ -585,12 +584,10 @@ function platformChanged() {
color = w.getColor();
}
}),
-
h.button(
{ onclick() { platformDelete(w) } },
[ h.i({ class:"fas fa-trash" }), ]
)
-
])
]
}));
diff --git a/src/kiri/ui.js b/src/kiri/ui.js
index 03e74886..580729d9 100644
--- a/src/kiri/ui.js
+++ b/src/kiri/ui.js
@@ -56,11 +56,11 @@ gapp.register("kiri.ui", [], (root, exports) => {
newBoolean,
newButton,
newBlank,
+ newDiv,
newGCode,
newGroup,
newLabel,
newInput,
- newInput2,
newRange,
newRow,
newSelect,
@@ -333,19 +333,23 @@ gapp.register("kiri.ui", [], (root, exports) => {
try {
return fn();
} catch (e) {
- return true;
+ // console.log({ safecall_error: e });
+ return false;
}
}
function addModeControls(el, opt = {}) {
el.__opt = opt;
el.showMe = function() {
+ if (opt.trace) console.log({ showMe: el });
el.classList.remove('hide');
};
el.hideMe = function() {
+ if (opt.trace) console.log({ hideMe: el });
el.classList.add('hide');
};
el.setVisible = function(show) {
+ if (opt.trace) console.log({ setVisible: show });
if (show) el.showMe();
else el.hideMe();
};
@@ -353,8 +357,10 @@ gapp.register("kiri.ui", [], (root, exports) => {
let xprt = opt.expert === undefined || (opt.expert === lastExpert);
let show = opt.show ? safecall(opt.show) : true;
let disp = opt.visible ? opt.visible() : true;
+ let hmod = el.hasMode(mode);
+ if (opt.trace) console.log({ setMode: mode, xprt, show, disp, hmod, modes:el.modes });
if (opt.manual) return;
- el.setVisible(el.hasMode(mode) && show && xprt && disp);
+ el.setVisible(hmod && show && xprt && disp);
}
el.hasMode = function(mode) {
return el.modes.length === 0 || el.modes.contains(mode);
@@ -366,8 +372,10 @@ gapp.register("kiri.ui", [], (root, exports) => {
function newDiv(opt = {}) {
let div = DOC.createElement('div');
addModeControls(div, opt);
- addTo.appendChild(div);
- lastGroup.push(div);
+ (opt.addto || addTo).appendChild(div);
+ if (opt.addto) lastDiv = addTo = div;
+ if (opt.addto && opt.class) div.setAttribute('class', opt.class);
+ lastGroup?.push(div);
div._group = groupName;
return div;
}
@@ -608,74 +616,6 @@ gapp.register("kiri.ui", [], (root, exports) => {
return ip;
}
- function newInput2(opt = {}) {
- let hide = opt.hide,
- size = opt.size || 5,
- height = opt.height || 0,
- ip = height > 1 ? DOC.createElement('textarea') : DOC.createElement('input'),
- action = opt.action || bindTo || inputAction;
-
- ip.setAttribute("class", "var-input");
- if (Number.isInteger(size)) {
- ip.setAttribute("size", size);
- } else {
- ip.setAttribute("style", `width:${size}`);
- }
- ip.setAttribute("type", "text");
- ip.setAttribute("spellcheck", "false");
- if (opt.disabled) ip.setAttribute("disabled", "true");
- if (opt.title) ip.setAttribute("title", opt.title);
- if (opt.convert) ip.convert = opt.convert.bind(ip);
- if (opt.bound) ip.bound = opt.bound;
- if (opt.action) action = opt.action;
- ip.addEventListener('focus', function(event) {
- hidePop();
- setSticky(true);
- });
- if (action) {
- ip.addEventListener('keydown', function(event) {
- let key = event.key;
- if (
- opt.text ||
- (key >= '0' && key <= '9') ||
- key === '.' ||
- key === '-' ||
- key === 'Backspace' ||
- key === 'Delete' ||
- key === 'ArrowLeft' ||
- key === 'ArrowRight' ||
- key === 'Tab' ||
- event.metaKey ||
- event.ctrlKey ||
- (key === ',' && opt.comma)
- ) {
- return;
- }
- event.preventDefault();
- event.stopPropagation();
- });
- ip.addEventListener('keyup', function(event) {
- if (event.keyCode === 13) {
- ip.blur();
- }
- });
- ip.addEventListener('blur', function(event) {
- setSticky(false);
- lastChange = ip;
- action(event);
- if (opt.trigger) {
- refresh();
- }
- });
- if (opt.units) {
- addUnits(ip, opt.round || 3);
- }
- }
- if (!ip.convert) ip.convert = raw.bind(ip);
-
- return ip;
- }
-
function addUnits(input, round) {
setters.push(input);
input.setv = function(value) {
diff --git a/src/moto/webui.js b/src/moto/webui.js
index 26fd7000..4e079af7 100644
--- a/src/moto/webui.js
+++ b/src/moto/webui.js
@@ -133,7 +133,10 @@ gapp.overlay(root, {
});
// add common element types
-["a", "i", "hr", "div", "span", "label", "input", "button", "svg", "textarea"].forEach(type => {
+[
+ "a", "i", "hr", "div", "span", "label", "input",
+ "button", "svg", "textarea", "select", "option"
+].forEach(type => {
h[type] = (attr, innr) => {
return h.el(type, attr, innr);
}
diff --git a/web/kiri/index.css b/web/kiri/index.css
index aa091181..f7aab9fc 100644
--- a/web/kiri/index.css
+++ b/web/kiri/index.css
@@ -123,7 +123,7 @@ input:focus {
input[disabled] {
background-color: #ddd;
color: #000;
- border-width: 1px;
+ /* border-width: 1px; */
}
input[type="range"] {
width: 85px;
@@ -1263,6 +1263,9 @@ th, tr, td, label {
max-width: 70%;
padding-bottom: 5px;
}
+#mod-setup textarea {
+ border-radius: 3px;
+}
#mod-setup .header {
text-align: center;
border-bottom: 1px solid rgba(126,153,183,1);
@@ -1273,33 +1276,12 @@ th, tr, td, label {
#mod-setup .header.sub {
padding-top: 10px;
}
-#dev-search {
- position: absolute;
- font-size: 10px;
- right: 3px;
-}
-#dev-search:hover {
- color: #00f;
-}
-#dev-filter {
- transform: translateY(-7px);
- text-align: center;
- position: absolute;
- display: none;
- padding: 1px;
- right: 150%;
-}
#mod-setup .left {
width: 180px;
padding-right: 10px;
margin-right: 10px;
border-right: 1px solid #ddd;
}
-#mod-setup .footer {
- padding-top: 5px;
- margin-top: 5px;
- border-top: 1px solid rgba(150,130,200,0.5);
-}
.devlist {
background-color: #fdfdfd;
}
@@ -1684,7 +1666,7 @@ th, tr, td, label {
width: 100%;
background-color: #f8f8f8;
}
-#device-action, #tool-action {
+#tool-action {
margin-top: 5px;
}
#device-action button, #tool-action button {
@@ -1946,6 +1928,16 @@ th, tr, td, label {
.settings .set-header a {
font-size: smaller;
}
+#dev-sel {
+ margin-bottom: 0;
+}
+#dev-list {
+ align-self: stretch;
+ padding: 0 5px 0 5px;
+}
+#dev-list:hover {
+ background-color: var(--blue-4);
+}
.set2-group {
border-radius: 3px;
border: 1px solid #ddd !important;
@@ -1965,7 +1957,7 @@ th, tr, td, label {
border-right: 3px solid var(--blue-1);
background-color: var(--blue-4) !important;
}
-.set2-group .var-row label {
+.set2-group .var-row label, #mod-setup .var-row label {
margin-right: 25px;
}
.set2-sep {
diff --git a/web/kiri/index.html b/web/kiri/index.html
index 328956da..84365bf9 100644
--- a/web/kiri/index.html
+++ b/web/kiri/index.html
@@ -367,50 +367,33 @@
-