Skip to content

Commit 78df2ad

Browse files
GeekyEggoGeekyEggo
authored
feat: add basic property inspector to create command (#41)
* feat: add JSON schemas to vscode config, remove subjective settings * feat: add JSON schemas to vscode config, remove subjective settings * feat: add basic PI to create command --------- Co-authored-by: Richard Herman <geekyeggo@users.noreply.github.com>
1 parent 843f3db commit 78df2ad

File tree

5 files changed

+45
-19
lines changed

5 files changed

+45
-19
lines changed

‎src/commands/create.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -228,6 +228,7 @@ async function renderTemplate(destination: string, pluginInfo: PluginInfo): Prom
228228
await Promise.allSettled([
229229
template.copy(".vscode"),
230230
template.copy(`${TEMPLATE_PLUGIN_UUID}.sdPlugin/imgs`, `${pluginInfo.uuid}.sdPlugin/imgs`),
231+
template.copy(`${TEMPLATE_PLUGIN_UUID}.sdPlugin/ui`, `${pluginInfo.uuid}.sdPlugin/ui`),
231232
template.copy(`${TEMPLATE_PLUGIN_UUID}.sdPlugin/manifest.json.ejs`, `${pluginInfo.uuid}.sdPlugin/manifest.json`),
232233
template.copy("src"),
233234
template.copy("_.gitignore", ".gitignore"),

‎template/.vscode/settings.json

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,17 @@
11
{
2-
/* Prefer tabs over spaces for accessibility */
3-
"editor.insertSpaces": false,
4-
"editor.detectIndentation": false,
5-
/* Explorer */
6-
"explorer.fileNesting.enabled": true,
7-
"explorer.fileNesting.patterns": {
8-
"*.js": "${capture}.js.map, ${capture}.min.js, ${capture}.d.ts",
9-
"package.json": "package-lock.json, yarn.lock, pnpm-lock.yaml, rollup.config.mjs, tsconfig.json"
10-
},
11-
"files.exclude": {
12-
"node_modules": true
13-
}
2+
/* JSON schemas */
3+
"json.schemas": [
4+
{
5+
"fileMatch": [
6+
"**/manifest.json"
7+
],
8+
"url": "https://schemas.elgato.com/streamdeck/plugins/manifest.json"
9+
},
10+
{
11+
"fileMatch": [
12+
"**/layouts/*.json"
13+
],
14+
"url": "https://schemas.elgato.com/streamdeck/plugins/layout.json"
15+
}
16+
]
1417
}

‎template/com.elgato.template.sdPlugin/manifest.json.ejs

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
"UUID": "<%- uuid %>.increment",
99
"Icon": "imgs/actions/counter/icon",
1010
"Tooltip": "Displays a count, which increments by one on press.",
11+
"PropertyInspectorPath": "ui/increment-counter.html",
1112
"Controllers": [
1213
"Keypad"
1314
],

‎template/com.elgato.template.sdPlugin/ui/increment-counter.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
<html>
3+
4+
<head lang="en">
5+
<title>Increment Counter Settings</title>
6+
<meta charset="utf-8" />
7+
<script src="https://cdn.jsdelivr.net/gh/geekyeggo/sdpi-components@v3/dist/sdpi-components.js"></script>
8+
</head>
9+
10+
<body>
11+
<!--
12+
Learn more about property inspector components at https://sdpi-components.dev/docs/components
13+
-->
14+
<sdpi-item label="Increment By">
15+
<sdpi-range setting="incrementBy" min="1" max="5" step="1" default="1" showlabels></sdpi-range>
16+
</sdpi-item>
17+
</body>
18+
19+
</html>

‎template/src/actions/increment-counter.ts.ejs

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ import { action, KeyDownEvent, SingletonAction, WillAppearEvent } from "@elgato/
66
@action({ UUID: "<%- uuid %>.increment" })
77
export class IncrementCounter extends SingletonAction<CounterSettings> {
88
/**
9-
* The {@link SingletonAction.onWillAppear} event is useful for setting the visual representation of an action when it become visible. This could be due to the Stream Deck first
9+
* The {@link SingletonAction.onWillAppear} event is useful for setting the visual representation of an action when it becomes visible. This could be due to the Stream Deck first
1010
* starting up, or the user navigating between pages / folders etc.. There is also an inverse of this event in the form of {@link streamDeck.client.onWillDisappear}. In this example,
1111
* we're setting the title to the "count" that is incremented in {@link IncrementCounter.onKeyDown}.
1212
*/
@@ -21,19 +21,21 @@ export class IncrementCounter extends SingletonAction<CounterSettings> {
2121
* settings using `setSettings` and `getSettings`.
2222
*/
2323
async onKeyDown(ev: KeyDownEvent<CounterSettings>): Promise<void> {
24-
// Determine the current count from the settings.
25-
let count = ev.payload.settings.count ?? 0;
26-
count++;
24+
// Update the count from the settings.
25+
const { settings } = ev.payload;
26+
settings.incrementBy ??= 1;
27+
settings.count = (settings.count ?? 0) + settings.incrementBy;
2728

2829
// Update the current count in the action's settings, and change the title.
29-
await ev.action.setSettings({ count });
30-
await ev.action.setTitle(`${count}`);
30+
await ev.action.setSettings(settings);
31+
await ev.action.setTitle(`${settings.count}`);
3132
}
3233
}
3334

3435
/**
3536
* Settings for {@link IncrementCounter}.
3637
*/
3738
type CounterSettings = {
38-
count: number;
39+
count?: number;
40+
incrementBy?: number;
3941
};

0 commit comments

Comments
 (0)