Beta version

albertogcatalan · Dec 16, 2020 · 2a1bc7d · 2a1bc7d
1 parent bc72005
commit 2a1bc7d
Show file tree

Hide file tree

Showing 10 changed files with 29 additions and 225 deletions.
diff --git a/Release/com.streamtools.webhooks.streamDeckPlugin b/Release/com.streamtools.webhooks.streamDeckPlugin
diff --git a/Sources/com.streamtools.webhooks.sdPlugin/action/.DS_Store b/Sources/com.streamtools.webhooks.sdPlugin/action/.DS_Store
diff --git a/Sources/com.streamtools.webhooks.sdPlugin/action/images.sketch b/Sources/com.streamtools.webhooks.sdPlugin/action/images.sketch
diff --git a/Sources/com.streamtools.webhooks.sdPlugin/app.js b/Sources/com.streamtools.webhooks.sdPlugin/app.js
@@ -30,16 +30,14 @@ const action = {
             $SD.api.showAlert(jsonObj.context);
             return;
         }
-        let url = 'http://streamtools.local.com/webhook/'+jsonObj.payload.settings.widgettype+'/'+jsonObj.payload.settings.widgetid; 
+        let url = 'http://streamtools.local.com/webhook/'+jsonObj.payload.settings.widgettype+'/'+jsonObj.payload.settings.widgetid+'/'; 
         fetch(url, {
             "method": 'POST',
             "headers": {
                 "content-type": "application/json",
                 "X-API-KEY": jsonObj.payload.settings.streamtoolsapikey
             },
-            "body": {
-                "action": jsonObj.payload.settings.webhookpayload
-            }
+            "body": JSON.stringify({"action": jsonObj.payload.settings.webhookpayload})
         }).then(result => $SD.api.showOk(jsonObj.context), error => $SD.api.showAlert(jsonObj.context));
     }
 };
diff --git a/Sources/com.streamtools.webhooks.sdPlugin/en.json b/Sources/com.streamtools.webhooks.sdPlugin/en.json
@@ -3,7 +3,7 @@
   "Name": "Streamtools Webhook", 
   "Category": "Templates", 
   "com.streamtools.webhooks.action": {
-    "Name": "Streamtools - Send action", 
+    "Name": "Streamtools - Widgets", 
     "Tooltip": "Send an action request to a Streamtools widget with remote webhook API"
   },
   "Localization": {

diff --git a/Sources/com.streamtools.webhooks.sdPlugin/es.json b/Sources/com.streamtools.webhooks.sdPlugin/es.json
@@ -3,7 +3,7 @@
   "Name": "Streamtools Webhook", 
   "Category": "Templates", 
   "com.streamtools.webhooks.action": {
-    "Name": "Streamtools - Enviar acción", 
+    "Name": "Streamtools - Widgets", 
     "Tooltip": "Envia una solicitud de acción a un widget de Streamtools con la API"
   },
   "Localization": {

diff --git a/Sources/com.streamtools.webhooks.sdPlugin/manifest.json b/Sources/com.streamtools.webhooks.sdPlugin/manifest.json
@@ -16,14 +16,14 @@
     }
   ], 
   "SDKVersion": 2,
-  "Author": "Alberto González Catalán", 
+  "Author": "Streamtools", 
   "CodePath": "index.html", 
   "PropertyInspectorPath": "propertyinspector/index.html", 
   "Description": "Send an action request to a Streamtools widget with remote webhook API", 
   "Name": "Streamtools Webhook", 
   "Icon": "action/images/action", 
   "URL": "https://streamtools.com", 
-  "Version": "1.0.4",
+  "Version": "1.0.13",
   "OS": [
     {
         "Platform": "mac", 

diff --git a/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/index.html b/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/index.html
@@ -8,6 +8,8 @@
         <title>Streamtools Webhook</title>
         <link rel="stylesheet" href="css/sdpi.css">
         <script src="js/common.js"></script>
+        <script src="js/common_pi.js"></script>
+        <script src="js/index_pi.js"></script>
     </head>
     <body>
       <div class="sdpi-wrapper">
@@ -18,7 +20,7 @@
         <div class="sdpi-item">
             <div class="sdpi-item-label">Widget</div>
             <select class="sdpi-item-value select inspector" id="widgettype">
-                <option value="timer">Timers</option>
+                <option value="timer" selected>Timers</option>
                 <option value="studyroom">Study Room</option>
                 <option value="randomnamepicker">Random Picker</option>
                 <option value="flipcoin">Coin Flipper</option>
@@ -32,7 +34,7 @@
         <div type="textarea" class="sdpi-item">
             <div class="sdpi-item-label" data-localize="Action">Action</div>
             <select class="sdpi-item-value select inspector" id="webhookpayload">
-              <option value="start">Start</option>
+              <option value="start" selected>Start</option>
           </select>
         </div>
         <div class="sdpi-item">
@@ -46,9 +48,9 @@
                 if(jsonObj.hasOwnProperty('actionInfo')) {
                     settings = Utils.getProp(jsonObj, 'actionInfo.payload.settings', {});
                     document.getElementById("streamtoolsapikey").value = settings.streamtoolsapikey || "st...";
-                    document.getElementById("widgettype").value = settings.widgettype || "Timers";
-                    document.getElementById("widgetid").value = settings.widgetid || "OT...";
-                    document.getElementById("webhookpayload").value = settings.webhookpayload || "Start";
+                    document.getElementById("widgettype").value = settings.widgettype;
+                    document.getElementById("widgetid").value = settings.widgetid;
+                    document.getElementById("webhookpayload").value = settings.webhookpayload;
                     // [].forEach.call(document.querySelectorAll(".inspector"), element => {
                     //     element.addEventListener("change", () => {
                     //         var payload = {};
@@ -71,7 +73,7 @@
             }
         }
     </script>
-
+    <div class="sdpi-info-label hidden" style="top: -1000;" value=""></div>
 
 
     </body>

diff --git a/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/js/common.js b/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/js/common.js
@@ -1059,16 +1059,27 @@ const SDApi = {
         getGlobalSettings: function (context, payload) {
             SDApi.send(context, 'getGlobalSettings', {});
         },
-        
+
         setGlobalSettings: function (context, payload) {
             SDApi.send(context, 'setGlobalSettings', {
                 payload: payload
             });
         },
 
-        logMessage: function (context, payload) {
-            SDApi.send(context, 'logMessage', {
-                payload: payload
+        logMessage: function () {
+           /**
+            * for logMessage we don't need a context, so we allow both
+            * logMessage(unneededContext, 'message')
+            * and
+            * logMessage('message')
+            */
+
+            let payload = (arguments.length > 1) ? arguments[1] : arguments[0];
+
+            SDApi.send(null, 'logMessage', {
+                payload: {
+                    message: payload
+                }
             });
         },
 

diff --git a/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/js/index_pi.js b/Sources/com.streamtools.webhooks.sdPlugin/propertyinspector/js/index_pi.js
@@ -35,213 +35,6 @@ let sdpiWrapper = document.querySelector('.sdpi-wrapper');
 
 let settings;
 
- /**
-  * The 'connected' event is the first event sent to Property Inspector, after it's instance
-  * is registered with Stream Deck software. It carries the current websocket, settings,
-  * and other information about the current environmet in a JSON object.
-  * You can use it to subscribe to events you want to use in your plugin.
-  */
-
-$SD.on('connected', (jsn) => {
-    /**
-     * The passed 'applicationInfo' object contains various information about your
-     * computer, Stream Deck version and OS-settings (e.g. colors as set in your
-     * OSes display preferences.)
-     * We use this to inject some dynamic CSS values (saved in 'common_pi.js'), to allow
-     * drawing proper highlight-colors or progressbars.
-     */
-
-    console.log("connected");
-    addDynamicStyles($SD.applicationInfo.colors, 'connectSocket');
-
-    /**
-     * Current settings are passed in the JSON node
-     * {actionInfo: {
-     *      payload: {
-     *          settings: {
-     *                  yoursetting: yourvalue,
-     *                  otherthings: othervalues
-     * ...
-     * To conveniently read those settings, we have a little utility to read
-     * arbitrary values from a JSON object, eg:
-     *
-     * const foundObject = Utils.getProp(JSON-OBJECT, 'path.to.target', defaultValueIfNotFound)
-     */
-
-    settings = Utils.getProp(jsn, 'actionInfo.payload.settings', false);
-    if (settings) {
-        updateUI(settings);
-    }
-});
-
-/**
- * The 'sendToPropertyInspector' event can be used to send messages directly from your plugin
- * to the Property Inspector without saving these messages to the settings.
- */
-
-$SD.on('sendToPropertyInspector', jsn => {
-    const pl = jsn.payload;
-    /**
-     *  This is an example, how you could show an error to the user
-     */
-     if (pl.hasOwnProperty('error')) {
-        sdpiWrapper.innerHTML = `<div class="sdpi-item">
-            <details class="message caution">
-            <summary class="${pl.hasOwnProperty('info') ? 'pointer' : ''}">${pl.error}</summary>
-                ${pl.hasOwnProperty('info') ? pl.info : ''}
-            </details>
-        </div>`;
-    } else {
-
-        /**
-         *
-         * Do something with the data sent from the plugin
-         * e.g. update some elements in the Property Inspector's UI.
-         *
-         */
-    }
-});
-
-const updateUI = (pl) => {
-    Object.keys(pl).map(e => {
-        if (e && e != '') {
-            const foundElement = document.querySelector(`#${e}`);
-            console.log(`searching for: #${e}`, 'found:', foundElement);
-            if (foundElement && foundElement.type !== 'file') {
-                foundElement.value = pl[e];
-                const maxl = foundElement.getAttribute('maxlength') || 50;
-                const labels = document.querySelectorAll(`[for='${foundElement.id}']`);
-                if (labels.length) {
-                    for (let x of labels) {
-                        x.textContent = maxl ? `${foundElement.value.length}/${maxl}` : `${foundElement.value.length}`;
-                    }
-                }
-            }
-        }
-   })
-}
-
-/**
- * Something in the PI changed:
- * either you clicked a button, dragged a slider or entered some text
- *
- * The 'piDataChanged' event is sent, if data-changes are detected.
- * The changed data are collected in a JSON structure
- *
- * It looks like this:
- *
- *  {
- *      checked: false
- *      group: false
- *      index: 0
- *      key: "mynameinput"
- *      selection: []
- *      value: "Elgato"
- *  }
- *
- * If you set an 'id' to an input-element, this will get the 'key' of this object.
- * The input's value will get the value.
- * There are other fields (e.g.
- *      - 'checked' if you clicked a checkbox
- *      - 'index', if you clicked an element within a group of other elements
- *      - 'selection', if the element allows multiple-selections
- * )
- *
- * Please note:
- * the template creates this object for the most common HTML input-controls.
- * This is a convenient way to start interacting with your plugin quickly.
- *
- */
-
-$SD.on('piDataChanged', (returnValue) => {
-
-    console.log('%c%s', 'color: white; background: blue}; font-size: 15px;', 'piDataChanged');
-    console.log(returnValue);
-
-    if (returnValue.key === 'clickme') {
-
-        postMessage = (w) => {
-            w.postMessage(
-                Object.assign({}, $SD.applicationInfo.application, {action: $SD.actionInfo.action})
-                ,'*');
-        }
-
-        if (!window.xtWindow || window.xtWindow.closed) {
-            window.xtWindow  = window.open('../externalWindow.html', 'External Window');
-            setTimeout(() => postMessage(window.xtWindow), 200);
-        } else {
-           postMessage(window.xtWindow);
-        }
-
-    } else {
-
-        /* SAVE THE VALUE TO SETTINGS */
-        saveSettings(returnValue);
-
-        /* SEND THE VALUES TO PLUGIN */
-        sendValueToPlugin(returnValue, 'sdpi_collection');
-    }
-});
-
-/**
- * Below are a bunch of helpers to make your DOM interactive
- * The will cover changes of the most common elements in your DOM
- * and send their value to the plugin on a change.
- * To accomplish this, the 'handleSdpiItemChange' method tries to find the
- * nearest element 'id' and the corresponding value of the element(along with
- * some other information you might need) . It then puts everything in a
- * 'sdpi_collection', where the 'id' will get the 'key' and the 'value' will get the 'value'.
- *
- * In the plugin you just need to listen for 'sdpi_collection' in the sent JSON.payload
- * and save the values you need in your settings (or StreamDeck-settings for persistence).
- *
- * In this template those key/value pairs are saved automatically persistently to StreamDeck.
- * Open the console in the remote debugger to inspect what's getting saved.
- *
- */
-
- function saveSettings(sdpi_collection) {
-
-    if (typeof sdpi_collection !== 'object') return;
-
-    if (sdpi_collection.hasOwnProperty('key') && sdpi_collection.key != '') {
-        if (sdpi_collection.value && sdpi_collection.value !== undefined) {
-            console.log(sdpi_collection.key, " => ", sdpi_collection.value);
-            settings[sdpi_collection.key] = sdpi_collection.value;
-            console.log('setSettings....', settings);
-            $SD.api.setSettings($SD.uuid, settings);
-        }
-    }
- }
-
- /**
-  * 'sendValueToPlugin' is a wrapper to send some values to the plugin
-  *
-  * It is called with a value and the name of a property:
-  *
-  * sendValueToPlugin(<any value>), 'key-property')
-  *
-  * where 'key-property' is the property you listen for in your plugin's
-  * 'sendToPlugin' events payload.
-  *
-  */
-
- function sendValueToPlugin(value, prop) {
-    console.log("sendValueToPlugin", value, prop);
-    if ($SD.connection && $SD.connection.readyState === 1) {
-        const json = {
-            action: $SD.actionInfo['action'],
-            event: 'sendToPlugin',
-            context: $SD.uuid,
-            payload: {
-                [prop]: value,
-                targetContext: $SD.actionInfo['context']
-            }
-        };
-
-        $SD.connection.send(JSON.stringify(json));
-    }
-}
 
 /** CREATE INTERACTIVE HTML-DOM
  * The 'prepareDOMElements' helper is called, to install events on all kinds of