export default {
  properties: {

    // Data ID needed by every element
    uid: {
      type: String,
      observer: '_initUid'
    },

    // Data associated with this UID
    data: Object,

    // Whether the element is editable
    editable: Boolean,

    // Keep reference to internal observers
    _observers: Array

  },

  // Connect the element's data to Simpla
  _initUid(uid) {
    let observer,
        setToValue = ({ data }) => {
          this.data = data;
        };

    if (!uid) {
      return;
    }

    // Get initial data from Simpla
    Simpla.get(this.uid).then(setToValue);

    // Observe any future changes to this UIDs data
    observer = Simpla.observe(this.uid, setToValue);

    // Store it in _observers so we can remove it on detatch
    this._observers.push(observer);
  },

  // Mirror element's editable prop to Simpla editable state
  _observeEditable() {
    let observer,
        setEditable = (editable) => this.editable = editable;

    // Check initial editable state on attach
    setEditable(Simpla.getState('editable'));

    // Observe any future changes to editable state
    observer = Simpla.observeState('editable', setEditable);

    // Store it in _observers so we can remove it on detatch
    this._observers.push(observer);
  },

  // Sync element's value to Simpla's buffer
  _syncToSimpla(href) {
    Simpla.set(this.uid, {
      type: this.is,
      data: href
    });
  },

  attached() {
    this._observeEditable();
  },

  detatched() {
    // Clean up observers
    this._observers.forEach((observer) => {
      observer.unobserve();
    });
  }
}