Initialized first release

Author: patrickbussmann

.github/workflows/release.yml

@@ -0,0 +1,53 @@
+name: Release version
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  build:
+    name: Create Release
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@v2
+      - name: Install Node v12
+        uses: actions/setup-node@v1
+        with:
+          node-version: '12.x'
+      - name: Install NPM Packages
+        run: npm install
+      - name: Build
+        run: npm run build --if-present
+      - name: Create Release
+        id: create_release
+        uses: actions/create-release@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          tag_name: ${{ github.ref }}
+          release_name: Release ${{ github.ref }}
+          body: |
+            Changes in this Release
+            - First version
+          draft: false
+          prerelease: false
+      - name: Upload Release Asset
+        id: upload-release-asset
+        uses: actions/upload-release-asset@v1
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+        with:
+          upload_url: ${{ steps.create_release.outputs.upload_url }}
+          asset_path: ./dist/StreamDeckSDK.js
+          asset_name: StreamDeckSDK.js
+          asset_content_type: text/javascript
+      - name: Publish NPM
+        uses: pascalgn/npm-publish-action@4f4bf159e299f65d21cd1cbd96fc5d53228036df
+        with:
+          tag_name: "v%s"
+          tag_message: "v%s"
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_AUTH_TOKEN: ${{ secrets.NPM_AUTH_TOKEN }}

.gitignore

@@ -0,0 +1,3 @@
+/.idea
+/dist
+/node_modules/

README.md

@@ -0,0 +1,138 @@
+# Stream Deck SDK
+
+This project is a **not official** SDK for Elgato's Stream Deck.
+
+The idea behind was that there are few "files" or projects which want providing an layer for the Stream Deck.
+But I want to develop some plugins as easy as possible and as fast as possible.
+
+## Features
+
+- Automatic setting management (Loading & Saving values in Property Inspector with 2 lines of code)
+- Setting image easily via URL
+- Drawing management (Canvas)
+- HTTP Module (http.get/http.post/... easily instead of fetch)
+
+# Installation
+
+    $ npm install streamdeck-sdk
+
+After that add the script to header of your html files. (i.e. `plugin.html`/`index.html` and `property-inspector.html`)
+
+    <script src="node_modules/streamdeck-sdk/dist/StreamDeckSDK.js"></script>
+
+When you downloaded only the `StreamDeckSDK.js` you can easily add them, too.
+
+    <script src="StreamDeckSDK.js"></script>
+
+# Registration Procedure
+
+Read the steps for the plugin and for the property inspector.
+
+## Plugin
+
+The plugin is easily load via:
+
+    <script>
+        var plugin = new StreamDeckPlugin();
+    </script>
+
+## Property Inspector
+
+The property inspector is easily load via:
+
+    <script>
+        var propertyInspector = new StreamDeckPropertyInspector();
+    </script>
+
+### Automatic setting management
+
+For enabling the property inspector setting management you must add this line to your `<script>`:
+
+    propertyInspector.enableSettingManager();
+
+Behind the scene it loops all your `input`, `textarea` and `select` elements.
+Then it checks for the `name` or `id` attribute and if it's already set in the `settings` of your Stream Deck.
+
+If yes, it automatically set's the `value` of your element to the stored value.
+On change event it will automatically store the value.
+And in case of closing the property inspector there is a listener for the `beforeunload` event.
+(which sends the settings to the plugin which stores it then automatically)
+
+You can disable the automatic loading and saving for single elements by adding the `sdk-ignore` class.
+
+This logic supports also `file` inputs.
+You can show the `file` then in the plugin via `instance.setImageURL(instance.settings.myname)`.
+
+### Example: Simple counter (with stored and changable value)
+
+This demonstrates how easy you can develop a plugin with property inspector view.
+
+_Do not forget to add the StreamDeckSDK.js in plugin and property inspector files as described in Installation!_
+
+#### Plugin
+
+The plugin shows a number (counter) and on each key press (keyUp) it will count the number plus one.
+But when we got a new value from property inspector we also want to use this number.
+
+    // First we initialize the Stream Deck Plugin
+	var plugin = new StreamDeckPlugin();
+	// Then we listen to the initialization process
+	plugin.on('init', function(event) {
+	    // Each init gives one instance (instance = 1 button on the Stream Deck)
+	    // Instances having an `action` which you can check when you have multiple actions!
+	    // i.e. if (instance.action === 'org.examle.firstaction') { }
+		var instance = event.detail.instance;
+		// Then we setting the title of the instance to the counter - else 1
+		instance.setTitle((+instance.settings.counter) || 1);
+		// Now we're going to listen for keyUp, so whenever we press the button and release this is called
+		instance.on('keyUp', function() {
+		    // Lets get the current value and count + 1
+		    var count = ((+instance.settings.counter) || 1) + 1;
+		    // Now lets set the title of our instance to the number
+            instance.setTitle(count);
+            // And then lets save the new number
+            instance.setSetting('counter', count);
+		});
+		// We want also to listen for changed settings from the property inspector
+		instance.on('didReceiveSettings', function() {
+		    // So when property inspector changes the counter value set the title to it
+            instance.setTitle(instance.settings.counter || 1);
+		});
+	});
+
+#### Property Inspector
+
+In the property inspector we add the element with the input to the `<body>`.
+
+    <div class="sdpi-item">
+        <div class="sdpi-item-label">Counter Value</div>
+        <input class="sdpi-item-value" name="counter" />
+    </div>
+
+And in the `<script>` (maybe before closing `</body>`) we add our logic.
+
+    <script>
+        var plugin = new StreamDeckPropertyInspector();
+        plugin.enableSettingManager();
+    </script>
+
+#### Done
+
+Et voilà - we created a simple logic which sends the counter value to the plugin which shows it.
+And the plugin count it up on each keypress.
+The property inspector will also be updated on each `keyUp` because it's listening to the setting change event.
+
+# Build
+
+Run `npm run build` to build the project. The build artifacts will be stored in the `dist/` directory.
+
+# Sample plugins
+
+* Coming May 2020: Toggl
+* Coming May 2020: INSTAR Camera Viewer
+
+# Contributing
+
+Feel free to open issues, pull requests or something else.
+
+When you need a plugin feel free to request it via the issues.