web-sdk/web-sdk-request.js at master · arc-archive/web-sdk · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
class WebSdkRequestElement extends HTMLElement {
  static get observedAttributes() {
    return ['endpoint', 'method', 'auto'];
  }

  constructor() {
    super();
    this.__data__ = {};
  }

  get sdk() {
    return this.__data__.sdk;
  }

  set sdk(value) {
    this.__setDataValue('sdk', value);
    this.__requestPropertiesChanged();
  }

  get endpoint() {
    return this.__data__.endpoint;
  }

  set endpoint(value) {
    this.__setDataValue('endpoint', value, {
      reflectToAttribute: true
    });
    this.__requestPropertiesChanged();
  }

  get method() {
    return this.__data__.method;
  }

  set method(value) {
    this.__setDataValue('method', value, {
      reflectToAttribute: true
    });
    this.__requestPropertiesChanged();
  }

  get auto() {
    return this.__data__.auto;
  }

  set auto(value) {
    this.__setDataValue('auto', value, {
      reflectToAttribute: true
    });
    this.__requestPropertiesChanged();
  }

  __setDataValue(prop, value, opts) {
    if (this.__data__[prop] === value) {
      return;
    }
    this.__data__[prop] = value;
    if (!opts) {
      return;
    }
    if (opts.reflectToAttribute) {
      if (this.getAttribute(prop) !== value) {
        if (!value) {
          this.removeAttribute(prop);
        } else {
          if (typeof value === 'boolean') {
            this.setAttribute(prop, '');
          } else {
            this.setAttribute(prop, value);
          }
        }
      }
    }
  }

  attributeChangedCallback(attrName, oldVal, newVal) {
    switch (attrName) {
      case 'endpoint': this.endpoint = newVal; break;
      case 'method': this.method = newVal; break;
      case 'auto':
        this.auto = newVal === null ? false : true;
        break;
    }
  }

  __requestPropertiesChanged() {
    if (!this.auto || this.__tryAutoScheduled) {
      return;
    }
    this.__tryAutoScheduled = true;
    requestAnimationFrame(() => {
      setTimeout(() => {
        this.__tryAutoScheduled = false;
        this._tryAutoExecute();
      });
    });
  }

  _tryAutoExecute() {
    if (!this.method || !this.endpoint || !this.sdk) {
      return;
    }
    console.log('Request execution.');
  }
}
window.customElements.define('web-sdk-request', WebSdkRequestElement);