add support for using Stream Deck+ Encoder to change Sonos volume

generateImages.sh

@@ -88,6 +88,9 @@ action shuffle shuffle
 key shuffle shuffle_off
 key shuffle_on shuffle_on
 
+action adjustvolume adjustvolume
+encoder adjustvolume adjustvolume
+
 action volume_up volume
 key volume_up volume
 

src/com.genericmale.sonos.sdPlugin/de.json

@@ -62,6 +62,10 @@
     "Name": "Wiederholungsmodus",
     "Tooltip": "Den Wiederholungsmodus umschalten."
   },
+  "com.genericmale.sonos.adjustvolume": {
+    "Name": "Lautstärke anpassen",
+    "Tooltip": "Lautstärke dynamisch anpassen (über einen Knopf)."
+  },
   "com.genericmale.sonos.shuffle": {
     "Name": "Zufällige Wiedergabe",
     "Tooltip": "Die zufällige Wiedergabe umschalten."

src/com.genericmale.sonos.sdPlugin/en.json

@@ -61,6 +61,10 @@
   "com.genericmale.sonos.repeat": {
     "Name": "Repeat Mode",
     "Tooltip": "Toggle the repeat mode."
+  },
+    "com.genericmale.sonos.adjustvolume": {
+    "Name": "Adjust volume",
+    "Tooltip": "Dynamically adjust volume (via a knob)."
   },
   "com.genericmale.sonos.shuffle": {
     "Name": "Shuffle Mode",

src/com.genericmale.sonos.sdPlugin/manifest.json

@@ -177,6 +177,28 @@
       "Tooltip": "Mute and unmute the audio.",
       "UUID": "com.genericmale.sonos.mute"
     },
+    {
+      "Icon": "images/volumecontrol_action",
+      "Name": "Adjust volume",
+      "States": [
+        {
+          "Image": "images/volume_action"
+        }
+      ],
+      "Controllers": [
+        "Encoder"
+      ],
+      "Encoder": {
+        "Icon": "images/volume_action",
+        "layout": "$B1",
+        "TriggerDescription": {
+          "Rotate": "Adjust volume",
+          "Push": "Mute on/off"
+        }
+      },
+      "Tooltip": "Adjust the volume of your Sonos.",
+      "UUID": "com.genericmale.sonos.adjustvolume"
+    },
     {
       "Icon": "images/volume_action",
       "Name": "Volume Set",

src/com.genericmale.sonos.sdPlugin/pi/index.html

@@ -47,6 +47,13 @@ <h4 data-localize>Sonos Mobile App</h4>
             <input class="sdpi-item-value" name="refreshInterval" type="number" value="1"/>
         </div>
 
+        <div type="range" class="sdpi-item" data-actions="adjustvolume">
+            <div class="sdpi-item-label" data-localize>Sonos volume</div>
+            <div class="sdpi-item-value">
+                <input type="range" min="0" max="100" name="volume"/>
+            </div>
+        </div>
+
         <div class="sdpi-item" data-actions="volume">
             <div class="sdpi-item-label" data-localize>Volume</div>
             <input class="sdpi-item-value" name="volume" type="number" value="50"/>

src/com.genericmale.sonos.sdPlugin/plugin/actions/adjustvolume.js

@@ -0,0 +1,11 @@
+define(class extends SonosAction {
+    async onDialDown({payload: {state}}) {
+        return state === 0 ?
+            this.sonos.setMute(1) :
+            this.sonos.setMute(0);
+    }
+    async onDialRotate({payload: {settings, ticks}}) {
+        const {CurrentVolume: volume} = await this.sonos.getVolume();
+        return this.sonos.setvolume(parseInt(volume) + parseInt(ticks));
+    }
+});

src/com.genericmale.sonos.sdPlugin/stream-deck.js

@@ -2,6 +2,8 @@
  * @class StreamDeck
  * StreamDeck object containing all required code to establish
  * communication with SD-Software and the Property Inspector
+ * 
+ *  UPDATE 1: updated with events to support StreamDeck+ (dialDown, dialRotate, dialUp, touchTap)
  */
 class StreamDeck {
     port;
@@ -410,9 +412,13 @@ class Action {
         this.context = context;
 
         //action events
+        this.streamDeck.en(`${this.action}.dialDown`, (event) => this.onDialDown(event));
+        this.streamDeck.en(`${this.action}.dialRotate`, (event) => this.onDialRotate(event));
+        this.streamDeck.en(`${this.action}.dialUp`, (event) => this.onDialUp(event));
         this.streamDeck.on(`${this.action}.didReceiveSettings`, (event) => this.onDidReceiveSettings(event));
         this.streamDeck.on(`${this.action}.keyDown`, (event) => this.onKeyDown(event));
         this.streamDeck.on(`${this.action}.keyUp`, (event) => this.onKeyUp(event));
+        this.streamDeck.en(`${this.action}.touchTap`, (event) => this.onTouchTap(event));
         this.streamDeck.on(`${this.action}.willAppear`, (event) => this.onWillAppear(event));
         this.streamDeck.on(`${this.action}.willDisappear`, (event) => this.onWillDisappear(event));
         this.streamDeck.on(`${this.action}.titleParametersDidChange`, (event) => this.onTitleParametersDidChange(event));
@@ -431,6 +437,24 @@ class Action {
             .onSystemDidWakeUp((event) => this.onSystemDidWakeUp(event));
     }
 
+    /**
+     * Callback function for the dialDown event, which fires when pushing a knob in
+     */
+    async onDialDown(event) {
+    }
+
+    /**
+     * Callback function for the dialRotate event, which fires when twisting a knob
+     */
+    async onDialRotate(event) {
+    }
+
+    /**
+     * Callback function for the dialUp event, which fires when releasing a knob after pushing the knob in
+     */
+    async onDialUp(event) {
+    }
+
     /**
      * Callback function for the didReceiveSettings event, which fires when calling getSettings
      */
@@ -455,6 +479,12 @@ class Action {
     async onKeyUp(event) {
     }
 
+    /**
+     * Callback function for the touchTap event, which fires when touching or tapping the display on the SD+
+     */
+    async onTouchTap(event) {
+    }
+
     /**
      * Callback function for the willAppear event, which fires when an action appears on they key
      */