@operato/scene-mqtt 0.1.3

package/CHANGELOG.md

@@ -0,0 +1,16 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+### [0.1.3](https://github.com/things-scene/operato-scene/compare/v0.1.2...v0.1.3) (2022-01-28)
+
+
+### :rocket: New Features
+
+* add graphql, mqtt scene component ([e223063](https://github.com/things-scene/operato-scene/commit/e223063b562f6a6a7b6ff12f3e32df30aa920da8))
+
+
+### :bug: Bug Fix
+
+* applied [@operato](https://github.com/operato)@^0.3.20 ([9a1dcbd](https://github.com/things-scene/operato-scene/commit/9a1dcbd2d1ca7f95b498503c87242b6d57ee3482))

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2021 Hearty, Oh
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,120 @@
+# MQTT data source component for Things Scene
+
+## Concept
+
+- Subscribe the topic via MQTT Web Socket protocol.
+- Data Spread is set in data binding.
+
+## Creating a Development Environment (Based on MacOS)
+
+### Installing mosquitto as MQTT broker
+
+- Use homebrew to install mosquitto.
+
+```
+$ brew install mosquitto
+```
+
+- Since Things Scene is for the browser, it must be accessible to MQTT broker via a web socket. So, enable the web service function on mosquitto.
+
+```
+$ echo -e "listener 1884\nprotocol websockets\nlistener 1883\nprotocol mqtt" >> /usr/local/opt/mosquitto/etc/mosquitto/mosquitto.conf
+$ brew services restart mosquitto
+```
+
+## Setting
+
+### When use mosquitto as MQTT Broker
+
+- broker : hostname of the broker
+- port : websocket service port number (default 1884)
+- path : '/mqtt'
+- user : username or blank
+- password : password or blank
+- topic : topic
+- qos : QOS level [0, 1, 2]
+- client-id : (unique) client id
+
+```
+The client ID is the name of the only connection node (from the broker's point of view) and is unique for monitoring by the broker.
+If leave the client ID property blank, it will be automatically created as 'THINGS-BOARD-{timestamp}'.
+If enter the client ID property, it will be automatically created as '{{client-id}}-{timestamp}'.
+The reason for adding timestamp to the client ID property is to create a unique ID.
+```
+
+- data-format : [Plain Text, JSON]
+- retain : true or false
+- ssl : true or false (false)
+
+### When use MQTT-Websocket Plug-in of RabbitMQ
+
+- broker : hostname of the broker
+- port : websocket service port number (default 15675)
+- path : '/ws'
+- user : username or blank
+- password : password or blank
+- topic : topic
+- qos : QOS level [0, 1, 2]
+- client-id : (unique) client id
+
+```
+The client ID is the name of the only connection node (from the broker's point of view) and is unique for monitoring by the broker.
+If leave the client ID property blank, it will be automatically created as 'THINGS-BOARD-{timestamp}'.
+If enter the client ID property, it will be automatically created as '{{client-id}}-{timestamp}'.
+The reason for adding timestamp to the client ID property is to create a unique ID.
+```
+
+- data-format : [Plain Text, JSON]
+- retain : true or false
+- ssl : true or false (false)
+
+## Message Exchange when use MQTT-Websocket Plug-in of Rabbit MQ
+
+```
+If use MQTT-Websocket Plug-in of Rabbit MQ,
+it is routed by 'amq.topic' exchange of durable 'topic' type.
+Therefore, the topic property of the above MQTT Data Source acts as a routing key.
+
+To receive from MQTT Data Source using AMQP of Rabbit MQ,
+see the JavaScript sample code below.
+```
+
+```
+var amqp = require('amqplib/callback_api');
+
+amqp.connect('amqp://hatiolab:hatiolab@mq.hatiolab.com', function(err, conn) {
+  if(err) {
+    console.error(err);
+    return;
+  }
+
+  conn.createChannel(function (err, ch) {
+    // Set exchange to amq.topic and durable option to true.
+    var ex = 'amq.topic';
+
+    ch.assertExchange(ex, 'topic', { durable: true });
+
+    var location = {
+      x: 100,
+      y: 200
+    };
+
+    // When set the topic property to location
+    ch.publish(ex, 'location', new Buffer(JSON.stringify(location)));
+  });
+});
+```
+
+## build
+
+`$ yarn build`
+
+| type | filename                | for            | tested |
+| ---- | ----------------------- | -------------- | ------ |
+| UMD  | things-scene-mqtt.js    | modern browser | X      |
+| UMD  | things-scene-mqtt-ie.js | ie 11          | O      |
+| ESM  | things-scene-mqtt.mjs   | modern browser | X      |
+
+## publish
+
+`$ yarn publish`

package/README_KR.md

@@ -0,0 +1,119 @@
+# Things Scene을 위한 MQTT 데이타소스 컴포넌트
+
+## 개념
+
+- MQTT 웹소켓 프로토콜로 토픽을 서브스크라이브 한다.
+- 데이타 확산(Spread)는 데이터 바인딩에서 설정한다.
+
+## 개발환경 만들기 (MacOS를 기준으로 함)
+
+### MQTT 브로커로 mosquitto 설치하기
+
+- homebrew를 이용해서 mosquitto를 설치한다.
+
+```
+$ brew install mosquitto
+```
+
+- Things Scene은 브라우저용이므로, MQTT 브로커에 웹소켓으로 접속할 수 있어야 한다. 그래서, mosquitto에 웹서비스 기능을 활성화한다.
+
+```
+$ echo -e "listener 1884\nprotocol websockets\nlistener 1883\nprotocol mqtt" >> /usr/local/opt/mosquitto/etc/mosquitto/mosquitto.conf
+$ brew services restart mosquitto
+```
+
+## 설정
+
+### MQTT 브로커로 mosquitto를 사용한 경우
+
+- broker : hostname of the broker
+- port : websocket service port number (default 1884)
+- path : '/mqtt'
+- user : username or blank
+- password : password or blank
+- topic : topic
+- qos : QOS level [0, 1, 2]
+- client-id : (unique) client id
+- role : [publisher, subscriber]
+
+```
+클라이언트 아이디는 (브로커 입장에서) 유일한 연결 노드의 이름을 의미하며, 브로커에서 모니터링하기 위한 용도로 유일하게 적어준다.
+클라이언트 아이디 속성을 비워두면, 자동으로 'THINGS-BOARD-{role}-{timestamp}‘로 자동 생성된다.
+클라이언트 아이디 속성을 입력하면, 자동으로 '{client-id}-{role}-{timestamp}'로 자동 생성된다.
+클라이언트 아이디 속성에 timestamp를 추가하는 이유는, 유일한 아이디를 만들기 위해서이다.
+```
+
+- data-format : [Plain Text, JSON]
+- retain : true or false
+- ssl : true or false (false)
+
+### RabbitMQ의 MQTT-Websocket 플러그인을 사용한 경우
+
+- broker : hostname of the broker
+- port : websocket service port number (default 15675)
+- path : '/ws'
+- user : username or blank
+- password : password or blank
+- topic : topic
+- qos : QOS level [0, 1, 2]
+- client-id : (unique) client id
+- role : [publisher, subscriber]
+
+```
+클라이언트 아이디는 (브로커 입장에서) 유일한 연결 노드의 이름을 의미하며, 브로커에서 모니터링하기 위한 용도로 유일하게 적어준다.
+클라이언트 아이디 속성을 비워두면, 자동으로 'THINGS-BOARD-{role}-{timestamp}‘로 자동 생성된다.
+클라이언트 아이디 속성을 입력하면, 자동으로 '{client-id}-{role}-{timestamp}'로 자동 생성된다.
+클라이언트 아이디 속성에 timestamp를 추가하는 이유는, 유일한 아이디를 만들기 위해서이다.
+```
+
+- data-format : [Plain Text, JSON]
+- retain : true or false
+- ssl : true or false (false)
+
+## Rabbit MQ의 MQTT-Websocket 플러그인을 사용하는 경우 메시지 Exchange
+
+```
+Rabbit MQ의 MQTT-Websocket 플러그인을 사용하는 경우,
+durable 'topic' 타입의 'amq.topic' exchange에 의해서 라우팅된다.
+따라서, 위 MQTT Data Source의 topic 속성은 라우팅 키의 역할을 한다.
+
+Rabbit MQ의 AMQP를 사용해서 MQTT Data Source에서 받을 수 있도록 하려면,
+아래의 javascript 샘플 코드를 참조하라.
+```
+
+```
+var amqp = require('amqplib/callback_api');
+
+amqp.connect('amqp://hatiolab:hatiolab@mq.hatiolab.com', function(err, conn) {
+  if(err) {
+    console.error(err);
+    return;
+  }
+
+  conn.createChannel(function (err, ch) {
+    // exchange를 amq.topic 으로 설정하고, durable option을 true로 한다.
+    var ex = 'amq.topic';
+
+    ch.assertExchange(ex, 'topic', { durable: true });
+
+    var location = {
+      x: 100,
+      y: 200
+    };
+
+    // topic 속성을 location 으로 설정한 경우.
+    ch.publish(ex, 'location', new Buffer(JSON.stringify(location)));
+  });
+});
+```
+
+# Module
+
+## UMD
+
+- things-scene-mqtt.js (for modern browser)
+- things-scene-mqtt-ie.js (for ie 11)
+
+## ES Module
+
+- things-scene-mqtt.mjs

package/dist/index.d.ts

@@ -0,0 +1 @@
+export { default as Mqtt } from './mqtt';

package/dist/index.js

@@ -0,0 +1,5 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+export { default as Mqtt } from './mqtt';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nexport { default as Mqtt } from './mqtt'\n"]}

package/dist/mqtt.d.ts

@@ -0,0 +1,55 @@
+import { Properties, Shape } from '@hatiolab/things-scene';
+declare const Mqtt_base: (new (...args: any[]) => {
+    isDataSource(): boolean;
+    _convertDataFormat(data: any, format: string): any;
+}) & typeof Shape;
+export default class Mqtt extends Mqtt_base {
+    private static _image;
+    private _client?;
+    static get image(): HTMLImageElement;
+    ready(): void;
+    _initMqttConnection(): void;
+    dispose(): void;
+    _draw(context: CanvasRenderingContext2D): void;
+    get message(): any;
+    set message(message: any);
+    onchange(after: Properties, before: Properties): void;
+    get nature(): {
+        mutable: boolean;
+        resizable: boolean;
+        rotatable: boolean;
+        properties: ({
+            type: string;
+            label: string;
+            name: string;
+            placeholder: string;
+            property?: undefined;
+        } | {
+            type: string;
+            label: string;
+            name: string;
+            placeholder?: undefined;
+            property?: undefined;
+        } | {
+            type: string;
+            label: string;
+            name: string;
+            property: string;
+            placeholder?: undefined;
+        } | {
+            type: string;
+            label: string;
+            name: string;
+            property: {
+                options: {
+                    display: string;
+                    value: string;
+                }[];
+            };
+            placeholder?: undefined;
+        })[];
+        'value-property': string;
+        help: string;
+    };
+}
+export {};

package/dist/mqtt.js

@@ -0,0 +1,198 @@
+import mqtt from 'mqtt';
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ */
+import { Component, DataSource, RectPath, Shape } from '@hatiolab/things-scene';
+const NATURE = {
+    mutable: false,
+    resizable: true,
+    rotatable: true,
+    properties: [
+        {
+            type: 'string',
+            label: 'broker',
+            name: 'broker',
+            placeholder: 'WebSocket hostname'
+        },
+        {
+            type: 'number',
+            label: 'port',
+            name: 'port',
+            placeholder: '15675'
+        },
+        {
+            type: 'string',
+            label: 'path',
+            name: 'path',
+            placeholder: '/mqtt or /ws'
+        },
+        {
+            type: 'string',
+            label: 'user',
+            name: 'user'
+        },
+        {
+            type: 'string',
+            label: 'password',
+            name: 'password',
+            property: 'password'
+        },
+        {
+            type: 'string',
+            label: 'topic',
+            name: 'topic'
+        },
+        {
+            type: 'number',
+            label: 'qos',
+            name: 'qos',
+            placeholder: '0..2'
+        },
+        {
+            type: 'string',
+            label: 'client-id',
+            name: 'clientId'
+        },
+        {
+            type: 'select',
+            label: 'data-format',
+            name: 'dataFormat',
+            property: {
+                options: [
+                    {
+                        display: 'Plain Text',
+                        value: 'text'
+                    },
+                    {
+                        display: 'JSON',
+                        value: 'json'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'checkbox',
+            label: 'retain',
+            name: 'retain'
+        },
+        {
+            type: 'checkbox',
+            label: 'ssl',
+            name: 'ssl'
+        }
+    ],
+    'value-property': 'message',
+    help: 'scene/component/mqtt'
+};
+const MQTT_IMAGE = 'data:image/png;base64,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';
+export default class Mqtt extends DataSource(RectPath(Shape)) {
+    static get image() {
+        if (!Mqtt._image) {
+            Mqtt._image = new Image();
+            Mqtt._image.src = MQTT_IMAGE;
+        }
+        return Mqtt._image;
+    }
+    ready() {
+        super.ready();
+        if (!this.app.isViewMode)
+            return;
+        this._initMqttConnection();
+    }
+    _initMqttConnection() {
+        try {
+            this._client && this._client.end(true, () => { });
+        }
+        catch (e) {
+            console.error(e);
+        }
+        delete this._client;
+        var { broker, port = 8441, clientId = 'THINGS-FACTORY', topic, qos = 1, retain = false, path = '/mqtt', dataFormat = 'text', user, password, ssl = false } = this.model;
+        if (!broker) {
+            console.warn('broker not defined');
+            return;
+        }
+        clientId = [clientId, Date.now()].join('-');
+        var client = mqtt.connect(`ws://${broker}:${port}${path}`, {
+            keepalive: 10,
+            clientId,
+            protocolId: 'MQTT',
+            protocolVersion: 4,
+            clean: true,
+            reconnectPeriod: 1000,
+            connectTimeout: 30 * 1000,
+            will: {
+                topic: 'WillMsg',
+                payload: 'Connection Closed abnormally..!',
+                qos: 0,
+                retain: false
+            },
+            username: user,
+            password: password,
+            rejectUnauthorized: false
+        });
+        client.on('error', err => {
+            console.error(err);
+            client.end();
+        });
+        client.on('connect', packet => {
+            console.log('client connected:', clientId, packet);
+            client.subscribe(topic, {
+                qos
+            }, (err, granted) => {
+                if (!err) {
+                    console.error('subscription failed', err);
+                }
+                else {
+                    console.log('mqtt subscription success for topic - ', topic);
+                }
+            });
+        });
+        client.on('message', (topic, message, packet) => {
+            this.data = this._convertDataFormat(message.toString(), dataFormat);
+        });
+        client.on('close', () => {
+            console.log(clientId + ' disconnected');
+        });
+        this._client = client;
+    }
+    dispose() {
+        try {
+            this._client && this._client.end(true, () => { });
+        }
+        catch (e) {
+            console.error(e);
+        }
+        delete this._client;
+        super.dispose();
+    }
+    _draw(context) {
+        var { left, top, width, height } = this.bounds;
+        context.beginPath();
+        this.drawImage(context, Mqtt.image, left, top, width, height);
+    }
+    get message() {
+        return this.getState('message');
+    }
+    set message(message) {
+        this.setState('message', message);
+    }
+    onchange(after, before) {
+        if ('message' in after) {
+            const { message } = after;
+            if (!this._client || !this._client.connected) {
+                return;
+            }
+            var { topic } = this.state;
+            this._client.publish(topic, JSON.stringify(message), {
+                qos: 0,
+                retain: false
+            });
+        }
+    }
+    get nature() {
+        return NATURE;
+    }
+}
+Component.register('mqtt', Mqtt);
+//# sourceMappingURL=mqtt.js.map

package/dist/mqtt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mqtt.js","sourceRoot":"","sources":["../src/mqtt.ts"],"names":[],"mappings":"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","sourcesContent":["import mqtt from 'mqtt'\n\n/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\nimport { Component, DataSource, Properties, RectPath, Shape } from '@hatiolab/things-scene'\n\nconst NATURE = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'string',\n      label: 'broker',\n      name: 'broker',\n      placeholder: 'WebSocket hostname'\n    },\n    {\n      type: 'number',\n      label: 'port',\n      name: 'port',\n      placeholder: '15675'\n    },\n    {\n      type: 'string',\n      label: 'path',\n      name: 'path',\n      placeholder: '/mqtt or /ws'\n    },\n    {\n      type: 'string',\n      label: 'user',\n      name: 'user'\n    },\n    {\n      type: 'string',\n      label: 'password',\n      name: 'password',\n      property: 'password'\n    },\n    {\n      type: 'string',\n      label: 'topic',\n      name: 'topic'\n    },\n    {\n      type: 'number',\n      label: 'qos',\n      name: 'qos',\n      placeholder: '0..2'\n    },\n    {\n      type: 'string',\n      label: 'client-id',\n      name: 'clientId'\n    },\n    {\n      type: 'select',\n      label: 'data-format',\n      name: 'dataFormat',\n      property: {\n        options: [\n          {\n            display: 'Plain Text',\n            value: 'text'\n          },\n          {\n            display: 'JSON',\n            value: 'json'\n          }\n        ]\n      }\n    },\n    {\n      type: 'checkbox',\n      label: 'retain',\n      name: 'retain'\n    },\n    {\n      type: 'checkbox',\n      label: 'ssl',\n      name: 'ssl'\n    }\n  ],\n  'value-property': 'message',\n  help: 'scene/component/mqtt'\n}\n\nconst MQTT_IMAGE =\n  'data:image/png;base64,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'\n\nexport default class Mqtt extends DataSource(RectPath(Shape)) {\n  private static _image: HTMLImageElement\n\n  private _client?: mqtt.MqttClient\n\n  static get image() {\n    if (!Mqtt._image) {\n      Mqtt._image = new Image()\n      Mqtt._image.src = MQTT_IMAGE\n    }\n\n    return Mqtt._image\n  }\n\n  ready() {\n    super.ready()\n\n    if (!this.app.isViewMode) return\n\n    this._initMqttConnection()\n  }\n\n  _initMqttConnection() {\n    try {\n      this._client && this._client.end(true, () => {})\n    } catch (e) {\n      console.error(e)\n    }\n    delete this._client\n\n    var {\n      broker,\n      port = 8441,\n      clientId = 'THINGS-FACTORY',\n      topic,\n      qos = 1,\n      retain = false,\n      path = '/mqtt',\n      dataFormat = 'text',\n      user,\n      password,\n      ssl = false\n    } = this.model\n\n    if (!broker) {\n      console.warn('broker not defined')\n      return\n    }\n\n    clientId = [clientId, Date.now()].join('-')\n\n    var client = mqtt.connect(`ws://${broker}:${port}${path}`, {\n      keepalive: 10,\n      clientId,\n      protocolId: 'MQTT',\n      protocolVersion: 4,\n      clean: true,\n      reconnectPeriod: 1000,\n      connectTimeout: 30 * 1000,\n      will: {\n        topic: 'WillMsg',\n        payload: 'Connection Closed abnormally..!',\n        qos: 0,\n        retain: false\n      },\n      username: user,\n      password: password,\n      rejectUnauthorized: false\n    })\n\n    client.on('error', err => {\n      console.error(err)\n      client.end()\n    })\n\n    client.on('connect', packet => {\n      console.log('client connected:', clientId, packet)\n\n      client.subscribe(\n        topic,\n        {\n          qos\n        },\n        (err, granted) => {\n          if (!err) {\n            console.error('subscription failed', err)\n          } else {\n            console.log('mqtt subscription success for topic - ', topic)\n          }\n        }\n      )\n    })\n\n    client.on('message', (topic, message, packet) => {\n      this.data = this._convertDataFormat(message.toString(), dataFormat)\n    })\n\n    client.on('close', () => {\n      console.log(clientId + ' disconnected')\n    })\n\n    this._client = client\n  }\n\n  dispose() {\n    try {\n      this._client && this._client.end(true, () => {})\n    } catch (e) {\n      console.error(e)\n    }\n    delete this._client\n\n    super.dispose()\n  }\n\n  _draw(context: CanvasRenderingContext2D): void {\n    var { left, top, width, height } = this.bounds\n\n    context.beginPath()\n    this.drawImage(context, Mqtt.image, left, top, width, height)\n  }\n\n  get message() {\n    return this.getState('message')\n  }\n\n  set message(message) {\n    this.setState('message', message)\n  }\n\n  onchange(after: Properties, before: Properties): void {\n    if ('message' in after) {\n      const { message } = after\n\n      if (!this._client || !this._client.connected) {\n        return\n      }\n\n      var { topic } = this.state\n\n      this._client.publish(topic, JSON.stringify(message), {\n        qos: 0,\n        retain: false\n      })\n    }\n  }\n\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('mqtt', Mqtt)\n"]}