Create JS for segmented controllers to act like tabs about ratchet

[fat]

I wrote this javascript for this yesterday

!function () {
  var getTarget = function (target) {
    var i, popovers = document.querySelectorAll('.segmented-controller li');
    for (; target && target !== document; target = target.parentNode) {
      for (i = popovers.length; i--;) { if (popovers[i] === target) return target; }
    }
  };
  window.addEventListener("touchend", function (e) {
    var target = getTarget(e.target);
    if (!target) return;
    var active = target.parentNode.querySelector('.active');
    if (active) active.classList.remove('active');
    target.classList.add('active');
  });
}();

But then i decided you really probably want to be doing something with push state (going to a new page) when you are doing this tab stuff… so it only really makes sense in a demo context.

Unless you think it makes sense to have actual tabs which are in page and which we toggle the display of…

[dhg]

Right. Connor and I talked about this briefly. We could totally do traditional all in-page tabs (a la above code), but it would be really sick to be able to use the push state stuff.

[fat]

Ok - well the push stuff should just work then… so close?

[dhg]

Yeah, I think that should be fine. We just need to test it and make sure we document how they work!