Update settings
This commit is contained in:
Lucas Sköld
@@ -25,16 +25,30 @@ To favorite the currently selected combo value, right click the node and click `
|
||||
|
||||
## Settings
|
||||
|
||||
| Setting Name | Type | Description |
|
||||
| ------------------------- | ------------------------ | ----------------------------------------------------------------------------------------------------- |
|
||||
| Textbox Colors | Multiline text | List of RGB or HEX colors (one per line) used for syntax highlighting |
|
||||
| Textbox Highlight Type | Combo (Strength/Nesting) | Controls highlighting behavior - Strength by the weight and Nesting by the nesting of the parentheses |
|
||||
| Favorite On Top | Boolean | When enabled, places favorite items at the top of lists |
|
||||
| Combo Highlight Color | Color picker | Sets the highlight color for combo box items |
|
||||
| Preview Image Hover Delay | Slider (0-1000ms) | Delay before showing preview images on hover |
|
||||
| Preview Image Padding | Slider (0-100px) | Padding around preview images |
|
||||
| Preview Image Side | Combo (Left/Right) | Which side preview images appear on |
|
||||
| Preview Image Size | Slider (100-1000px) | Size of preview images |
|
||||
### Textbox
|
||||
|
||||
| Setting Name | Type | Description |
|
||||
| ---------------------- | ------------------------ | ---------------------------------------------------------------------------------------------- |
|
||||
| Textbox Colors | Multiline text | A list of either rgb or hex colors, one color per line. |
|
||||
| Textbox Highlight Type | Combo (Strength/Nesting) | If strength, only the first and last colors will be used. If nesting, all colors will be used. |
|
||||
| Tag Tooltips | Boolean | When hovering over a tag in a textbox, show the tag's tooltip. |
|
||||
|
||||
### Combo
|
||||
|
||||
| Setting Name | Type | Description |
|
||||
| --------------------- | ------------ | ---------------------------------------- |
|
||||
| Favorite On Top | Boolean | Put favorite items over all other items. |
|
||||
| Combo Highlight Color | Color picker | |
|
||||
|
||||
### Preview Image
|
||||
|
||||
| Setting Name | Type | Description |
|
||||
| ------------------------- | ------------------ | ------------------------------------ |
|
||||
| Preview Image Hover Delay | Slider (0-1000) | |
|
||||
| Preview Image Padding | Slider (0-100) | |
|
||||
| Preview Image Side | Combo (Left/Right) | |
|
||||
| Preview Image Size | Slider (100-1000) | |
|
||||
| Index Images | Button | Update images available for preview. |
|
||||
|
||||
## Examples
|
||||
|
||||
|
||||
@@ -93,3 +93,9 @@ const settingsDefinitions = [
|
||||
},
|
||||
];
|
||||
settingsHelper.addSettings(settingsDefinitions);
|
||||
|
||||
if (localStorage.getItem("SyntaxHighlighting.dev") === "true") {
|
||||
const markdownTable =
|
||||
settingsHelper.generateSettingsMarkdownTable(settingsDefinitions);
|
||||
console.log(markdownTable);
|
||||
}
|
||||
|
||||
@@ -662,6 +662,118 @@ export class SettingsHelper {
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Generates a markdown table of settings organized by categories from a settings definitions array.
|
||||
* @param {Array} settingsDefinitions - An array of setting definition objects
|
||||
* @returns {string} A markdown formatted table of settings.
|
||||
* @example
|
||||
* const markdownTable = settingsHelper.generateSettingsMarkdownTable(settingsDefinitions);
|
||||
* console.log(markdownTable);
|
||||
*/
|
||||
generateSettingsMarkdownTable(settingsDefinitions) {
|
||||
if (
|
||||
!Array.isArray(settingsDefinitions) ||
|
||||
settingsDefinitions.length === 0
|
||||
) {
|
||||
return "No settings definitions provided.";
|
||||
}
|
||||
|
||||
// Group settings by category
|
||||
const settingsByCategory = {};
|
||||
|
||||
for (const setting of settingsDefinitions) {
|
||||
// Skip settings without a name
|
||||
if (!setting.name) continue;
|
||||
|
||||
// Get the main category (first item in the category array) or use "Uncategorized"
|
||||
const category =
|
||||
setting.category && setting.category.length > 0
|
||||
? setting.category[1]
|
||||
: "Uncategorized";
|
||||
|
||||
// Initialize category if it doesn't exist
|
||||
if (!settingsByCategory[category]) {
|
||||
settingsByCategory[category] = [];
|
||||
}
|
||||
|
||||
// Determine the type string based on the setting type
|
||||
let typeStr = "Unknown";
|
||||
if (typeof setting.type === "function") {
|
||||
// Try to infer type from the function name or structure
|
||||
const typeObj = setting.type();
|
||||
if (typeObj.type === "boolean") typeStr = "Boolean";
|
||||
else if (typeObj.type === "number") typeStr = "Number";
|
||||
else if (typeObj.type === "text") typeStr = "Text";
|
||||
else if (typeObj.type === "slider" && typeObj.attrs)
|
||||
typeStr = `Slider (${typeObj.attrs.min}-${typeObj.attrs.max})`;
|
||||
else if (typeObj.type === "combo" && typeObj.options)
|
||||
typeStr = `Combo (${typeObj.options
|
||||
.map((o) => o.text || o)
|
||||
.join("/")})`;
|
||||
else if (typeObj.type === CustomSettingTypes.multilineSetting)
|
||||
typeStr = "Multiline text";
|
||||
else if (typeObj.type === CustomSettingTypes.colorPickerSetting)
|
||||
typeStr = "Color picker";
|
||||
else if (typeObj.type === CustomSettingTypes.buttonSetting)
|
||||
typeStr = "Button";
|
||||
else typeStr = String(typeObj.type);
|
||||
} else if (
|
||||
typeof setting.type === "object" &&
|
||||
setting.type !== null
|
||||
) {
|
||||
// Direct type object
|
||||
if (setting.type.type === "boolean") typeStr = "Boolean";
|
||||
else if (setting.type.type === "number") typeStr = "Number";
|
||||
else if (setting.type.type === "text") typeStr = "Text";
|
||||
else if (setting.type.type === "slider" && setting.type.attrs)
|
||||
typeStr = `Slider (${setting.type.attrs.min}-${setting.type.attrs.max})`;
|
||||
else if (setting.type.type === "combo" && setting.type.options)
|
||||
typeStr = `Combo (${setting.type.options
|
||||
.map((o) => o.text || o)
|
||||
.join("/")})`;
|
||||
else if (
|
||||
setting.type.type === CustomSettingTypes.multilineSetting
|
||||
)
|
||||
typeStr = "Multiline text";
|
||||
else if (
|
||||
setting.type.type === CustomSettingTypes.colorPickerSetting
|
||||
)
|
||||
typeStr = "Color picker";
|
||||
else if (setting.type.type === CustomSettingTypes.buttonSetting)
|
||||
typeStr = "Button";
|
||||
else typeStr = String(setting.type.type);
|
||||
} else if (typeof setting.type === "string") {
|
||||
typeStr = setting.type;
|
||||
}
|
||||
|
||||
// Get description from tooltip if available
|
||||
const description = setting.tooltip || "";
|
||||
|
||||
settingsByCategory[category].push({
|
||||
name: setting.name,
|
||||
type: typeStr,
|
||||
description,
|
||||
});
|
||||
}
|
||||
|
||||
// Generate markdown table
|
||||
let markdown = "";
|
||||
|
||||
for (const [category, settings] of Object.entries(settingsByCategory)) {
|
||||
markdown += `### ${category}\n\n`;
|
||||
markdown += "| Setting Name | Type | Description |\n";
|
||||
markdown += "| ------------ | ---- | ----------- |\n";
|
||||
|
||||
for (const setting of settings) {
|
||||
markdown += `| ${setting.name} | ${setting.type} | ${setting.description} |\n`;
|
||||
}
|
||||
|
||||
markdown += "\n";
|
||||
}
|
||||
|
||||
return markdown;
|
||||
}
|
||||
}
|
||||
|
||||
export class UiHelper {
|
||||
|
||||
Reference in New Issue
Block a user