Bindable using an instance cache and uuids in datasets

bindable-dataset.js

window.Bindable = (function() {
  'use strict';

  function Bindable(context, dataKey) {
    this.uuid = 0
    this.cache = {}
    this.context = context || document
    this.dataKey = dataKey || 'data-bindable'
    this.instanceKey = this.dataKey.replace(/data-/g, '') + 'Id'
  }


  Bindable.prototype.bindables = function(context) {
    if (context == null) {
      var context = this.context;
    }
    return context.querySelectorAll('[' + this.dataKey + ']')
  };


  Bindable.prototype.rebind = function(context, fn) {
    this.dispose(context)
    if (typeof fn === 'function') {
      fn()
    }
    this.bindAll(context)
  };


  Bindable.prototype.bindAll = function(context) {
    var bindables = this.bindables(context)
    for (var i = 0, len = bindables.length; i < len; i += 1) {
      this.bind(bindables[i])
    }
    return this
  };


  Bindable.prototype.getInstanceFromEl = function(el) {
    return this.cache[this.cacheId(el)]
  };

  Bindable.prototype.cacheId = function(el) {
    if (!el.dataset[this.instanceKey]) return;
    return parseInt(el.dataset[this.instanceKey], 10)
  };

  Bindable.prototype.getRefs = function(context) {
    var bindables = this.bindables(context)
    var refs = []
    for (var i = 0, len = bindables.length; i < len; i += 1) {
      refs.push(this.getInstanceFromEl(bindables[i]))
    }
    return refs
  };


  Bindable.prototype.removeInstance = function(el) {
    var instance, id;
    console.log('removeInstance', this.cacheId(el))
    if (instance = this.getInstanceFromEl(el)) {
      console.log('instance', instance)
      if (typeof instance.dispose === 'function') {
        console.log('instance.dispose', instance.dispose)
        instance.dispose()
      }
      id = el.dataset[this.instanceKey]
      delete this.cache[id]
      delete el.dataset[this.instanceKey]
    }
    else { console.log(el, el.dataset) }
  };


  Bindable.prototype.dispose = function(context) {
    var instance, bindable;
    var bindables = this.bindables(context)
    for (var i = 0, len = bindables.length; i < len; i += 1) {
      this.removeInstance(bindables[i])
    }
    bindables = []
    return this
  };


  Bindable.prototype.bind = function(el, dataKey) {
    var _class, key, id;
    dataKey = dataKey || this.dataKey
    key = el.getAttribute(dataKey)
    if (_class = this.constructor.getClass(key)) {
      if (!el.dataset[this.instanceKey]) {
        id = ++this.uuid
        el.dataset[this.instanceKey] = id
        this.cache[id] = new _class(el)
      }
      return this.getInstanceFromEl(el)
    } else  {
      if (typeof console !== "undefined" && console !== null) {
        console.error('Bindable for key: ' + key + ' not found in Bindable.registry for instance ' + el)
      }
      return void 0
    }
  };


  Bindable.getClass = function(key) {
    var _key = "" + key
    return (this.registry[_key] ? this.registry[_key]['class'] : void 0)
  };


  Bindable.register = function(key, klass) {
    var _key = "" + key
    this.registry = this.registry || {}
    this.registry[_key] = {'class': klass}
    return this.registry
  };


  return Bindable

})();