@operato/scene-restful 1.1.23 → 1.1.27

package/CHANGELOG.md

@@ -3,6 +3,24 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+### [1.1.27](https://github.com/things-scene/operato-scene/compare/v1.1.26...v1.1.27) (2023-01-11)
+
+
+### :bug: Bug Fix
+
+* reinvent scene-restful ([52bc04a](https://github.com/things-scene/operato-scene/commit/52bc04a429c7eb6a8c4de010efd6ce2c6d8de7c1))
+
+
+
+### [1.1.26](https://github.com/things-scene/operato-scene/compare/v1.1.25...v1.1.26) (2023-01-11)
+
+
+### :bug: Bug Fix
+
+* reinvent scene-restful component ([91097d0](https://github.com/things-scene/operato-scene/commit/91097d0c20948c0cdfd31e47a24f621613c4870a))
+
+
+
 ### [1.1.23](https://github.com/things-scene/operato-scene/compare/v1.1.22...v1.1.23) (2022-12-18)
 
 

package/dist/restful.d.ts

@@ -7,29 +7,24 @@ declare const Restful_base: (new (...args: any[]) => {
 export default class Restful extends Restful_base {
     static _image: HTMLImageElement;
     static get image(): HTMLImageElement;
+    private _repeatTimer;
+    private _isStarted;
     get url(): any;
     set url(url: any);
     get period(): number;
     set period(period: number);
+    get value(): any;
+    set value(value: any);
     get withCredentials(): boolean;
     set withCredentials(withCredentials: boolean);
-    _repeatTimer: NodeJS.Timeout;
-    _httpRequest?: any;
-    _isStarted: boolean;
     get repeatTimer(): NodeJS.Timeout;
     set repeatTimer(repeatTimer: NodeJS.Timeout);
-    get httpRequest(): any;
-    set httpRequest(httpRequest: any);
     ready(): void;
-    _initRestful(): void;
+    _initRestful(force?: boolean): void;
     dispose(): void;
     _startRepeater(): void;
     _stopRepeater(): void;
-    _makeRequest(url: string): boolean;
-    _makeRequestJsonp(url: string): void;
-    _abortRequest(): void;
-    onDataReceived(): void;
-    callAjax(): void;
+    fetch(): Promise<void>;
     _draw(context: CanvasRenderingContext2D): void;
     ondblclick(e: Event): void;
     get controls(): never[];

package/dist/restful.js

@@ -5,16 +5,40 @@ const NATURE = {
     resizable: true,
     rotatable: true,
     properties: [
+        {
+            type: 'select',
+            label: 'method',
+            name: 'method',
+            property: {
+                options: [
+                    {
+                        display: 'GET',
+                        value: 'GET'
+                    },
+                    {
+                        display: 'POST',
+                        value: 'POST'
+                    },
+                    {
+                        display: 'PUT',
+                        value: 'PUT'
+                    },
+                    {
+                        display: 'DELETE',
+                        value: 'DELETE'
+                    }
+                ]
+            }
+        },
         {
             type: 'string',
             label: 'url',
             name: 'url'
         },
         {
-            type: 'number',
-            label: 'period',
-            name: 'period',
-            placeholder: 'SECONDS'
+            type: 'string',
+            label: 'authorization',
+            name: 'authorization'
         },
         {
             type: 'select',
@@ -23,27 +47,194 @@ const NATURE = {
             property: {
                 options: [
                     {
-                        display: 'Plain Text',
+                        display: 'json',
+                        value: 'json'
+                    },
+                    {
+                        display: 'jsonp',
+                        value: 'jsonp'
+                    },
+                    {
+                        display: 'text',
                         value: 'text'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'content-type',
+            name: 'contentType',
+            property: {
+                options: [
+                    {
+                        display: 'application/json',
+                        value: 'application/json'
                     },
                     {
-                        display: 'JSON',
-                        value: 'json'
+                        display: 'application/x-www-form-urlencoded',
+                        value: 'application/x-www-form-urlencoded'
                     },
                     {
-                        display: 'JSONP',
-                        value: 'jsonp'
+                        display: 'text/plain',
+                        value: 'text/plain'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'mode',
+            name: 'mode',
+            property: {
+                options: [
+                    {
+                        display: 'cors',
+                        value: 'cors'
+                    },
+                    {
+                        display: 'no-cors',
+                        value: 'no-cors'
+                    },
+                    {
+                        display: 'same-origin',
+                        value: 'same-origin'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'credentials',
+            name: 'credentials',
+            property: {
+                options: [
+                    {
+                        display: 'same-origin',
+                        value: 'same-origin'
+                    },
+                    {
+                        display: 'include',
+                        value: 'include'
+                    },
+                    {
+                        display: 'omit',
+                        value: 'omit'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'cache',
+            name: 'cache',
+            property: {
+                options: [
+                    {
+                        display: 'default',
+                        value: 'default'
+                    },
+                    {
+                        display: 'no-cache',
+                        value: 'no-cache'
+                    },
+                    {
+                        display: 'reload',
+                        value: 'reload'
+                    },
+                    {
+                        display: 'force-cache',
+                        value: 'force-cache'
+                    },
+                    {
+                        display: 'only-if-cached',
+                        value: 'only-if-cached'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'redirect',
+            name: 'redirect',
+            property: {
+                options: [
+                    {
+                        display: 'follow',
+                        value: 'follow'
+                    },
+                    {
+                        display: 'manual',
+                        value: 'manual'
+                    },
+                    {
+                        display: 'error',
+                        value: 'error'
+                    }
+                ]
+            }
+        },
+        {
+            type: 'select',
+            label: 'referrer-policy',
+            name: 'referrerPolicy',
+            property: {
+                options: [
+                    {
+                        display: 'no-referrer-when-downgrade',
+                        value: 'no-referrer-when-downgrade'
+                    },
+                    {
+                        display: 'no-referrer',
+                        value: 'no-referrer'
+                    },
+                    {
+                        display: 'origin',
+                        value: 'origin'
+                    },
+                    {
+                        display: 'origin-when-cross-origin',
+                        value: 'origin-when-cross-origin'
+                    },
+                    {
+                        display: 'same-origin',
+                        value: 'same-origin'
+                    },
+                    {
+                        display: 'strict-origin',
+                        value: 'strict-origin'
+                    },
+                    {
+                        display: 'strict-origin-when-cross-origin',
+                        value: 'strict-origin-when-cross-origin'
+                    },
+                    {
+                        display: 'unsafe-url',
+                        value: 'unsafe-url'
                     }
                 ]
             }
         },
+        {
+            type: 'select',
+            label: 'value-usage',
+            name: 'valueUsage',
+            property: {
+                options: ['body', 'url']
+            }
+        },
+        {
+            type: 'number',
+            label: 'period',
+            name: 'period',
+            placeholder: 'SECONDS'
+        },
         {
             type: 'checkbox',
-            label: 'with-credentials',
-            name: 'withCredentials'
+            label: 'fetch-on-load',
+            name: 'fetchOnLoad'
         }
     ],
-    'value-property': 'url',
     help: 'scene/component/restful'
 };
 const REST_IMAGE = 'data:image/png;base64,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';
@@ -68,12 +259,19 @@ export default class Restful extends DataSource(RectPath(Shape)) {
         this._initRestful();
     }
     get period() {
-        return this.state.period * 1000;
+        return Number(this.state.period) * 1000;
     }
     set period(period) {
-        this.setState('period', period);
+        this.setState('period', Number(period));
         this._initRestful();
     }
+    get value() {
+        return this.state.value;
+    }
+    set value(value) {
+        this.setState('value', value);
+        this._initRestful(true);
+    }
     get withCredentials() {
         return !!this.getState('withCredentials');
     }
@@ -88,16 +286,10 @@ export default class Restful extends DataSource(RectPath(Shape)) {
         this._stopRepeater();
         this._repeatTimer = repeatTimer;
     }
-    get httpRequest() {
-        return this._httpRequest;
-    }
-    set httpRequest(httpRequest) {
-        this._httpRequest = httpRequest;
-    }
     ready() {
-        this._initRestful();
+        this._initRestful(this.state.fetchOnLoad);
     }
-    _initRestful() {
+    _initRestful(force = false) {
         if (!this.app.isViewMode)
             return;
         if (!this.url) {
@@ -105,7 +297,12 @@ export default class Restful extends DataSource(RectPath(Shape)) {
             return;
         }
         this._stopRepeater();
-        this._startRepeater();
+        if (this.period > 0) {
+            this._startRepeater();
+        }
+        else {
+            force && this.fetch();
+        }
     }
     dispose() {
         super.dispose();
@@ -114,12 +311,11 @@ export default class Restful extends DataSource(RectPath(Shape)) {
     _startRepeater() {
         this._isStarted = true;
         var self = this;
-        // requestAnimationFrame 이 호출되지 않을 때는 ajax 호출도 하지 않도록 함.
         function _() {
             if (!self._isStarted) {
                 return;
             }
-            self.callAjax();
+            self.fetch();
             if (!self.period) {
                 self._stopRepeater();
                 return;
@@ -131,73 +327,57 @@ export default class Restful extends DataSource(RectPath(Shape)) {
         requestAnimationFrame(_);
     }
     _stopRepeater() {
-        this._abortRequest();
-        if (this.repeatTimer)
-            clearTimeout(this._repeatTimer);
         this._isStarted = false;
-    }
-    _makeRequest(url) {
-        if (window.XMLHttpRequest) {
-            // Mozilla, Safari, ...
-            this.httpRequest = new XMLHttpRequest();
-            // @ts-ignore
+        if (this.repeatTimer) {
+            clearTimeout(this._repeatTimer);
         }
-        else if (window.ActiveXObject) {
-            // IE
-            try {
-                // @ts-ignore
-                this.httpRequest = new ActiveXObject('Msxml2.XMLHTTP');
+    }
+    async fetch() {
+        var { url, method = 'GET', mode = 'cors', cache = 'default', credentials = 'same-origin', redirect = 'follow', referrerPolicy = 'no-referrer-when-downgrade', contentType = 'application/json', dataFormat = 'json', value } = this.state;
+        if (dataFormat == 'jsonp') {
+            if (value && typeof value == 'string') {
+                url = value;
             }
-            catch (e) {
-                try {
-                    // @ts-ignore
-                    this.httpRequest = new ActiveXObject('Microsoft.XMLHTTP');
+            jsonp(url, {}, (self, data) => {
+                if (this._isStarted && data) {
+                    this.data = data;
                 }
-                catch (e) { }
-            }
+            });
+            return;
         }
-        if (!this.httpRequest) {
-            warn('Giving up :( Cannot create an XMLHTTP instance');
-            return false;
+        var options = {
+            method,
+            mode,
+            cache,
+            credentials,
+            headers: {
+                'Content-Type': contentType
+            },
+            redirect,
+            referrerPolicy
+        };
+        if (method != 'GET' && method != 'HEAD') {
+            if (contentType == 'application/json') {
+                options.body = JSON.stringify(value);
+            }
+            else {
+                options.body = value;
+            }
         }
-        this.httpRequest.withCredentials = this.withCredentials;
-        this.httpRequest.open('GET', url);
-        this.httpRequest.onreadystatechange = this.onDataReceived.bind(this);
-        return true;
-    }
-    _makeRequestJsonp(url) {
-        jsonp(url, {}, (self, data) => {
-            if (!data)
-                return;
-            this.data = data;
-        });
-    }
-    _abortRequest() {
-        if (this.httpRequest)
-            this.httpRequest.abort();
-    }
-    onDataReceived() {
-        var { dataFormat = 'text' } = this.state;
-        if (this.httpRequest.readyState === 4) {
-            if (this.httpRequest.status === 200) {
-                var data = this.httpRequest.responseText;
-                if (!data)
-                    return;
-                this.data = this._convertDataFormat(data, dataFormat);
+        else {
+            if (value && typeof value == 'string') {
+                options.url = value;
             }
         }
-    }
-    callAjax() {
-        var { dataFormat = 'text' } = this.state;
-        if (dataFormat == 'jsonp') {
-            // @ts-ignore TODO add substitute property to things-scene.d.ts
-            this._makeRequestJsonp(this.substitute(this.url, this));
+        const response = await fetch(url, options);
+        if (!this._isStarted) {
+            return;
         }
-        else {
-            // @ts-ignore TODO add substitute property to things-scene.d.ts
-            if (!this._makeRequest(this.substitute(this.url, this)))
-                return;
-            this.httpRequest.send();
+        if (dataFormat === 'json') {
+            this.data = response.json();
+        }
+        else if (dataFormat === 'text') {
+            this.data = response.text();
         }
     }
     _draw(context) {
@@ -210,7 +390,7 @@ export default class Restful extends DataSource(RectPath(Shape)) {
             warn(WARN_NO_URL);
             return;
         }
-        this.callAjax();
+        this.fetch();
     }
     get controls() {
         return [];

package/dist/restful.js.map

@@ -1 +1 @@
-{"version":3,"file":"restful.js","sourceRoot":"","sources":["../src/restful.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentNature, DataSource, RectPath, Shape, warn } from '@hatiolab/things-scene'\n\nimport jsonp from './jsonp'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'string',\n      label: 'url',\n      name: 'url'\n    },\n    {\n      type: 'number',\n      label: 'period',\n      name: 'period',\n      placeholder: 'SECONDS'\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            display: 'JSONP',\n            value: 'jsonp'\n          }\n        ]\n      }\n    },\n    {\n      type: 'checkbox',\n      label: 'with-credentials',\n      name: 'withCredentials'\n    }\n  ],\n  'value-property': 'url',\n  help: 'scene/component/restful'\n}\n\nconst REST_IMAGE =\n  'data:image/png;base64,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'\n\nconst WARN_NO_URL = 'Valid URL property required'\n\nexport default class Restful extends DataSource(RectPath(Shape)) {\n  static _image: HTMLImageElement\n\n  static get image() {\n    if (!Restful._image) {\n      Restful._image = new Image()\n      Restful._image.src = REST_IMAGE\n    }\n\n    return Restful._image\n  }\n\n  get url() {\n    return this.getState('url')\n  }\n\n  set url(url) {\n    this.setState('url', url)\n    this._initRestful()\n  }\n\n  get period() {\n    return this.state.period * 1000\n  }\n\n  set period(period) {\n    this.setState('period', period)\n    this._initRestful()\n  }\n\n  get withCredentials() {\n    return !!this.getState('withCredentials')\n  }\n\n  set withCredentials(withCredentials) {\n    this.setState('withCredentials', withCredentials)\n    this._initRestful()\n  }\n\n  _repeatTimer!: NodeJS.Timeout\n  _httpRequest?: any\n  _isStarted = false\n\n  get repeatTimer() {\n    return this._repeatTimer\n  }\n\n  set repeatTimer(repeatTimer) {\n    this._stopRepeater()\n    this._repeatTimer = repeatTimer\n  }\n\n  get httpRequest() {\n    return this._httpRequest\n  }\n\n  set httpRequest(httpRequest) {\n    this._httpRequest = httpRequest\n  }\n\n  ready() {\n    this._initRestful()\n  }\n\n  _initRestful() {\n    if (!this.app.isViewMode) return\n\n    if (!this.url) {\n      warn(WARN_NO_URL)\n      return\n    }\n\n    this._stopRepeater()\n    this._startRepeater()\n  }\n\n  dispose() {\n    super.dispose()\n    this._stopRepeater()\n  }\n\n  _startRepeater() {\n    this._isStarted = true\n\n    var self = this\n\n    // requestAnimationFrame 이 호출되지 않을 때는 ajax 호출도 하지 않도록 함.\n    function _() {\n      if (!self._isStarted) {\n        return\n      }\n      self.callAjax()\n\n      if (!self.period) {\n        self._stopRepeater()\n        return\n      }\n\n      self._repeatTimer = setTimeout(() => {\n        requestAnimationFrame(_)\n      }, self.period)\n    }\n\n    requestAnimationFrame(_)\n  }\n\n  _stopRepeater() {\n    this._abortRequest()\n\n    if (this.repeatTimer) clearTimeout(this._repeatTimer)\n    this._isStarted = false\n  }\n\n  _makeRequest(url: string) {\n    if (window.XMLHttpRequest) {\n      // Mozilla, Safari, ...\n      this.httpRequest = new XMLHttpRequest()\n      // @ts-ignore\n    } else if (window.ActiveXObject) {\n      // IE\n      try {\n        // @ts-ignore\n        this.httpRequest = new ActiveXObject('Msxml2.XMLHTTP')\n      } catch (e) {\n        try {\n          // @ts-ignore\n          this.httpRequest = new ActiveXObject('Microsoft.XMLHTTP')\n        } catch (e) {}\n      }\n    }\n\n    if (!this.httpRequest) {\n      warn('Giving up :( Cannot create an XMLHTTP instance')\n      return false\n    }\n    this.httpRequest.withCredentials = this.withCredentials\n    this.httpRequest.open('GET', url)\n    this.httpRequest.onreadystatechange = this.onDataReceived.bind(this)\n\n    return true\n  }\n\n  _makeRequestJsonp(url: string) {\n    jsonp(url, {}, (self, data) => {\n      if (!data) return\n\n      this.data = data\n    })\n  }\n\n  _abortRequest() {\n    if (this.httpRequest) this.httpRequest.abort()\n  }\n\n  onDataReceived() {\n    var { dataFormat = 'text' } = this.state\n\n    if (this.httpRequest.readyState === 4) {\n      if (this.httpRequest.status === 200) {\n        var data = this.httpRequest.responseText\n\n        if (!data) return\n\n        this.data = this._convertDataFormat(data, dataFormat)\n      }\n    }\n  }\n\n  callAjax() {\n    var { dataFormat = 'text' } = this.state\n\n    if (dataFormat == 'jsonp') {\n      // @ts-ignore TODO add substitute property to things-scene.d.ts\n      this._makeRequestJsonp(this.substitute(this.url, this))\n    } else {\n      // @ts-ignore TODO add substitute property to things-scene.d.ts\n      if (!this._makeRequest(this.substitute(this.url, this))) return\n\n      this.httpRequest.send()\n    }\n  }\n\n  _draw(context: CanvasRenderingContext2D) {\n    var { left, top, width, height } = this.bounds\n\n    context.beginPath()\n    this.drawImage(context, Restful.image, left, top, width, height)\n  }\n\n  ondblclick(e: Event) {\n    if (!this.url) {\n      warn(WARN_NO_URL)\n      return\n    }\n\n    this.callAjax()\n  }\n\n  get controls() {\n    return []\n  }\n\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('restful', Restful)\n"]}
+{"version":3,"file":"restful.js","sourceRoot":"","sources":["../src/restful.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentNature, DataSource, RectPath, Shape, warn } from '@hatiolab/things-scene'\n\nimport jsonp from './jsonp'\n\nconst NATURE: ComponentNature = {\n  mutable: false,\n  resizable: true,\n  rotatable: true,\n  properties: [\n    {\n      type: 'select',\n      label: 'method',\n      name: 'method',\n      property: {\n        options: [\n          {\n            display: 'GET',\n            value: 'GET'\n          },\n          {\n            display: 'POST',\n            value: 'POST'\n          },\n          {\n            display: 'PUT',\n            value: 'PUT'\n          },\n          {\n            display: 'DELETE',\n            value: 'DELETE'\n          }\n        ]\n      }\n    },\n    {\n      type: 'string',\n      label: 'url',\n      name: 'url'\n    },\n    {\n      type: 'string',\n      label: 'authorization',\n      name: 'authorization'\n    },\n    {\n      type: 'select',\n      label: 'data-format',\n      name: 'dataFormat',\n      property: {\n        options: [\n          {\n            display: 'json',\n            value: 'json'\n          },\n          {\n            display: 'jsonp',\n            value: 'jsonp'\n          },\n          {\n            display: 'text',\n            value: 'text'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'content-type',\n      name: 'contentType',\n      property: {\n        options: [\n          {\n            display: 'application/json',\n            value: 'application/json'\n          },\n          {\n            display: 'application/x-www-form-urlencoded',\n            value: 'application/x-www-form-urlencoded'\n          },\n          {\n            display: 'text/plain',\n            value: 'text/plain'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'mode',\n      name: 'mode',\n      property: {\n        options: [\n          {\n            display: 'cors',\n            value: 'cors'\n          },\n          {\n            display: 'no-cors',\n            value: 'no-cors'\n          },\n          {\n            display: 'same-origin',\n            value: 'same-origin'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'credentials',\n      name: 'credentials',\n      property: {\n        options: [\n          {\n            display: 'same-origin',\n            value: 'same-origin'\n          },\n          {\n            display: 'include',\n            value: 'include'\n          },\n          {\n            display: 'omit',\n            value: 'omit'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'cache',\n      name: 'cache',\n      property: {\n        options: [\n          {\n            display: 'default',\n            value: 'default'\n          },\n          {\n            display: 'no-cache',\n            value: 'no-cache'\n          },\n          {\n            display: 'reload',\n            value: 'reload'\n          },\n          {\n            display: 'force-cache',\n            value: 'force-cache'\n          },\n          {\n            display: 'only-if-cached',\n            value: 'only-if-cached'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'redirect',\n      name: 'redirect',\n      property: {\n        options: [\n          {\n            display: 'follow',\n            value: 'follow'\n          },\n          {\n            display: 'manual',\n            value: 'manual'\n          },\n          {\n            display: 'error',\n            value: 'error'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'referrer-policy',\n      name: 'referrerPolicy',\n      property: {\n        options: [\n          {\n            display: 'no-referrer-when-downgrade',\n            value: 'no-referrer-when-downgrade'\n          },\n          {\n            display: 'no-referrer',\n            value: 'no-referrer'\n          },\n          {\n            display: 'origin',\n            value: 'origin'\n          },\n          {\n            display: 'origin-when-cross-origin',\n            value: 'origin-when-cross-origin'\n          },\n          {\n            display: 'same-origin',\n            value: 'same-origin'\n          },\n          {\n            display: 'strict-origin',\n            value: 'strict-origin'\n          },\n          {\n            display: 'strict-origin-when-cross-origin',\n            value: 'strict-origin-when-cross-origin'\n          },\n          {\n            display: 'unsafe-url',\n            value: 'unsafe-url'\n          }\n        ]\n      }\n    },\n    {\n      type: 'select',\n      label: 'value-usage',\n      name: 'valueUsage',\n      property: {\n        options: ['body', 'url']\n      }\n    },\n    {\n      type: 'number',\n      label: 'period',\n      name: 'period',\n      placeholder: 'SECONDS'\n    },\n    {\n      type: 'checkbox',\n      label: 'fetch-on-load',\n      name: 'fetchOnLoad'\n    }\n  ],\n  help: 'scene/component/restful'\n}\n\nconst REST_IMAGE =\n  'data:image/png;base64,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'\n\nconst WARN_NO_URL = 'Valid URL property required'\n\nexport default class Restful extends DataSource(RectPath(Shape)) {\n  static _image: HTMLImageElement\n\n  static get image() {\n    if (!Restful._image) {\n      Restful._image = new Image()\n      Restful._image.src = REST_IMAGE\n    }\n\n    return Restful._image\n  }\n\n  private _repeatTimer!: NodeJS.Timeout\n  private _isStarted = false\n\n  get url() {\n    return this.getState('url')\n  }\n\n  set url(url) {\n    this.setState('url', url)\n    this._initRestful()\n  }\n\n  get period() {\n    return Number(this.state.period) * 1000\n  }\n\n  set period(period) {\n    this.setState('period', Number(period))\n    this._initRestful()\n  }\n\n  get value() {\n    return this.state.value\n  }\n\n  set value(value) {\n    this.setState('value', value)\n    this._initRestful(true)\n  }\n\n  get withCredentials() {\n    return !!this.getState('withCredentials')\n  }\n\n  set withCredentials(withCredentials) {\n    this.setState('withCredentials', withCredentials)\n    this._initRestful()\n  }\n\n  get repeatTimer() {\n    return this._repeatTimer\n  }\n\n  set repeatTimer(repeatTimer) {\n    this._stopRepeater()\n    this._repeatTimer = repeatTimer\n  }\n\n  ready() {\n    this._initRestful(this.state.fetchOnLoad)\n  }\n\n  _initRestful(force: boolean = false) {\n    if (!this.app.isViewMode) return\n\n    if (!this.url) {\n      warn(WARN_NO_URL)\n      return\n    }\n\n    this._stopRepeater()\n    if (this.period > 0) {\n      this._startRepeater()\n    } else {\n      force && this.fetch()\n    }\n  }\n\n  dispose() {\n    super.dispose()\n    this._stopRepeater()\n  }\n\n  _startRepeater() {\n    this._isStarted = true\n\n    var self = this\n\n    function _() {\n      if (!self._isStarted) {\n        return\n      }\n      self.fetch()\n\n      if (!self.period) {\n        self._stopRepeater()\n        return\n      }\n\n      self._repeatTimer = setTimeout(() => {\n        requestAnimationFrame(_)\n      }, self.period)\n    }\n\n    requestAnimationFrame(_)\n  }\n\n  _stopRepeater() {\n    this._isStarted = false\n    if (this.repeatTimer) {\n      clearTimeout(this._repeatTimer)\n    }\n  }\n\n  async fetch() {\n    var {\n      url,\n      method = 'GET',\n      mode = 'cors',\n      cache = 'default',\n      credentials = 'same-origin',\n      redirect = 'follow',\n      referrerPolicy = 'no-referrer-when-downgrade',\n      contentType = 'application/json',\n      dataFormat = 'json',\n      value\n    } = this.state\n\n    if (dataFormat == 'jsonp') {\n      if (value && typeof value == 'string') {\n        url = value\n      }\n\n      jsonp(url, {}, (self, data) => {\n        if (this._isStarted && data) {\n          this.data = data\n        }\n      })\n\n      return\n    }\n\n    var options: any = {\n      method,\n      mode,\n      cache,\n      credentials,\n      headers: {\n        'Content-Type': contentType\n      },\n      redirect,\n      referrerPolicy\n    }\n\n    if (method != 'GET' && method != 'HEAD') {\n      if (contentType == 'application/json') {\n        options.body = JSON.stringify(value)\n      } else {\n        options.body = value\n      }\n    } else {\n      if (value && typeof value == 'string') {\n        options.url = value\n      }\n    }\n\n    const response = await fetch(url, options)\n\n    if (!this._isStarted) {\n      return\n    }\n\n    if (dataFormat === 'json') {\n      this.data = response.json()\n    } else if (dataFormat === 'text') {\n      this.data = response.text()\n    }\n  }\n\n  _draw(context: CanvasRenderingContext2D) {\n    var { left, top, width, height } = this.bounds\n\n    context.beginPath()\n    this.drawImage(context, Restful.image, left, top, width, height)\n  }\n\n  ondblclick(e: Event) {\n    if (!this.url) {\n      warn(WARN_NO_URL)\n      return\n    }\n\n    this.fetch()\n  }\n\n  get controls() {\n    return []\n  }\n\n  get nature() {\n    return NATURE\n  }\n}\n\nComponent.register('restful', Restful)\n"]}

package/helps/scene/component/restful.ko.md

@@ -1,12 +1,14 @@
 # restful
-URL를 제공 받고 URL로만 데이터를 조회할 경우 사용하는 컴포넌트.
 
-## properties
+브라우저의 Fetch API를 활용해서, HTTP request 기능을 제공하는 컴포넌트이다.
 
-  - url : 데이터 조회 URL
-  - period : 데이터 조회 주기
-  - data format : Plain Text, JSON, JSONP등 데이터 포멧
-    - Plain Text : 서버에서 데이터를 Plain Text로 반환할 경우 사용
-    - JSON : 서버에서 데이터를 JSON으로 제공할 경우 
-    - JSONP : 데이터를 function형태로 전달 받을 경우 해당 function을 받아서 처리해 주는 기능
-  - with credentials : Cross site request 설정
+호출 기능과 각 속성값은 아래 링크된 문서에서 참조할 수 있다.
+
+https://developer.mozilla.org/ko/docs/Web/API/Fetch_API/Using_Fetch
+
+예외) dataFormat이 jsonp(JSON with Padding)인 경우에는, Fetch API를 사용하지 않는다. 이 경우에는 URL 파라미터만 의미를 갖는다.
+
+## value property
+
+이 컴포넌트의 value 속성은 HTTP request 과정에서 body나 URL로 사용된다.
+GET 메쏘드에서는 URL로 활용되며, 그 밖의 메쏘드에서는 body에 사용된다.

package/helps/scene/component/restful.md

@@ -1,11 +1,14 @@
 # restful
-A component used when a URL is provided and data is retrieved only with a URL.
-
-## properties
-  - url : Data inquiry URL
-  - period : Data inquiry cycle
-  - data format : Plain Text, JSON, JSONP Data format
-     - Plain Text : Used when the server returns data in Plain Text.
-     - JSON : When the server provides data as JSON
-     - JSONP : When data is received in the form of a function, the function is received and processed.
-  - with credentials : Cross site request
+
+"restful" is a component that provides HTTP request function by utilizing the browser's Fetch API.
+
+You can refer to the calling function and each property value in the document linked below.
+
+https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
+
+Exception case) When dataFormat is jsonp (JSON with Padding), Fetch API is not used. In this case, only the URL parameters have meaning.
+
+## value property
+
+The value property of this component is used as the body or URL in the HTTP request process.
+In the GET method, it is used as a URL, and in other methods, it is used as the body.