building-rotavo-04.js

class InputKnob extends HTMLElement {
  constructor() {
    // Nothing to do in here at the moment, but we do need to call the parent
    // constructor
    super();
  }
  // Watch for changes on the 'value' attribute
  static get observedAttributes() {
    return ['value'];
  }
  // Map the JavaScript property to the HTML attribute
  get value() {
    return this.hasAttribute('value') ? this.getAttribute('value') : 0;
  }
  set value(value) {
    this.setAttribute('value', value);
  }
  // Respond to any changes to the observed attributes
  attributeChangedCallback(attrName, oldVal, newVal) {
    // nothing yet
  }
}
// Map the class to an element name and make it available to the page!
window.customElements.define('input-knob', InputKnob);