Add edge threshold popup.
This commit is contained in:
parent
bb3bef4134
commit
c3eb21b185
@ -128,6 +128,17 @@ OV.AddRadioButton = function (parentElement, name, id, text, onChange)
|
||||
return radio;
|
||||
};
|
||||
|
||||
OV.AddSelect = function (parentElement, options)
|
||||
{
|
||||
let selectElement = OV.AddDomElement (parentElement, 'select');
|
||||
for (let option of options) {
|
||||
let optionElement = OV.AddDomElement (selectElement, 'option');
|
||||
optionElement.value = option.value;
|
||||
optionElement.innerHTML = option.text;
|
||||
}
|
||||
return selectElement;
|
||||
};
|
||||
|
||||
OV.SelectRadioButton = function (radioButtons, selectedId)
|
||||
{
|
||||
for (let radioButton of radioButtons) {
|
||||
|
||||
@ -9,6 +9,11 @@
|
||||
src: url('Quicksand/Quicksand-Regular.ttf');
|
||||
}
|
||||
|
||||
input, select, textarea
|
||||
{
|
||||
outline: none;
|
||||
}
|
||||
|
||||
html, body
|
||||
{
|
||||
color: var(--ov_foreground_color);
|
||||
|
||||
@ -58,22 +58,28 @@ div.ov_sidebar_content div.ov_sidebar_settings_row
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_details_input
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_parameter_name
|
||||
{
|
||||
width: 30px;
|
||||
margin-right: 10px;
|
||||
width: 70%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_details_text
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_parameter_value
|
||||
{
|
||||
width: 30%;
|
||||
float: left;
|
||||
}
|
||||
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_parameter_value select
|
||||
{
|
||||
color: var(--ov_dialog_foreground_color);
|
||||
background: var(--ov_dialog_background_color);
|
||||
border: 1px solid var(--ov_border_color)
|
||||
}
|
||||
|
||||
div.ov_sidebar_content div.ov_sidebar_settings_padded
|
||||
{
|
||||
margin: 10px 0px 0px 40px;
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
|
||||
@ -374,15 +374,35 @@ OV.SettingsSidebarPanel = class extends OV.SidebarPanel
|
||||
let edgeSettingsDiv = OV.AddDiv (contentDiv, 'ov_sidebar_settings_padded');
|
||||
|
||||
let colorRow = OV.AddDiv (edgeSettingsDiv, 'ov_sidebar_settings_row');
|
||||
let colorInputDiv = OV.AddDiv (colorRow, 'ov_sidebar_settings_details_input');
|
||||
OV.AddDiv (colorRow, 'ov_sidebar_settings_details_text', 'Edge Color');
|
||||
OV.AddDiv (colorRow, 'ov_sidebar_settings_parameter_name', 'Edge Color');
|
||||
let predefinedEdgeColors = ['#ffffff', '#e3e3e3', '#c9c9c9', '#898989', '#5f5f5f', '#494949', '#383838', '#0f0f0f'];
|
||||
let colorInputDiv = OV.AddDiv (colorRow, 'ov_sidebar_settings_parameter_value');
|
||||
let colorInput = OV.AddDiv (colorInputDiv);
|
||||
let pickr = this.AddColorPicker (colorInput, defaultEdgeColor, predefinedEdgeColors, (color) => {
|
||||
this.settings.edgeColor = color;
|
||||
this.callbacks.onEdgeDisplayChange ();
|
||||
});
|
||||
|
||||
let thresholdRow = OV.AddDiv (edgeSettingsDiv, 'ov_sidebar_settings_row');
|
||||
OV.AddDiv (thresholdRow, 'ov_sidebar_settings_parameter_name', 'Threshold Angle');
|
||||
let thresholdInputDiv = OV.AddDiv (thresholdRow, 'ov_sidebar_settings_parameter_value');
|
||||
let thresholdValues = [{
|
||||
value : '1',
|
||||
text : '1'
|
||||
}];
|
||||
for (let thresholdValue = 10; thresholdValue <= 180; thresholdValue += 10) {
|
||||
thresholdValues.push ({
|
||||
value : thresholdValue.toString (),
|
||||
text : thresholdValue.toString ()
|
||||
});
|
||||
}
|
||||
let thresholdSelect = OV.AddSelect (thresholdInputDiv, thresholdValues);
|
||||
thresholdSelect.addEventListener ('change', () => {
|
||||
this.settings.edgeThreshold = parseInt (thresholdSelect.value, 10);
|
||||
this.callbacks.onEdgeDisplayChange ();
|
||||
});
|
||||
thresholdSelect.value = defaultEdgeThreshold.toString ();
|
||||
|
||||
let buttons = [];
|
||||
let offButton = AddRadioButton (buttonsDiv, 'off', 'Don\'t Show Edges', () => {
|
||||
OV.HideDomElement (edgeSettingsDiv);
|
||||
@ -396,11 +416,12 @@ OV.SettingsSidebarPanel = class extends OV.SidebarPanel
|
||||
});
|
||||
buttons.push (offButton);
|
||||
buttons.push (onButton);
|
||||
|
||||
OV.SelectRadioButton (buttons, defaultShowEdges ? 'on' : 'off');
|
||||
ShowEdgeSettings (edgeSettingsDiv, defaultShowEdges);
|
||||
|
||||
return {
|
||||
pickr : pickr,
|
||||
threshold : thresholdSelect,
|
||||
select : (value) => {
|
||||
OV.SelectRadioButton (buttons, value ? 'on' : 'off');
|
||||
ShowEdgeSettings (edgeSettingsDiv, value);
|
||||
@ -459,8 +480,9 @@ OV.SettingsSidebarPanel = class extends OV.SidebarPanel
|
||||
this.settings.showEdges = defaultSettings.showEdges;
|
||||
this.settings.edgeColor = defaultSettings.edgeColor;
|
||||
this.settings.edgeThreshold = defaultSettings.edgeThreshold;
|
||||
this.edgeDisplayInput.pickr.setColor ('#' + OV.ColorToHexString (defaultSettings.edgeColor));
|
||||
this.edgeDisplayInput.select (this.settings.showEdges);
|
||||
this.edgeDisplayInput.pickr.setColor ('#' + OV.ColorToHexString (defaultSettings.edgeColor));
|
||||
this.edgeDisplayInput.threshold.value = this.settings.edgeThreshold.toString ();
|
||||
this.callbacks.onEdgeDisplayChange ();
|
||||
|
||||
this.settings.themeId = defaultSettings.themeId;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user