GitHub PR Toggling

bookmarklet.js

javascript:(function(){function t(){this.types={}}function e(t,e){this.el=t,this.registry=e,this.init()}t.prototype={register:function(t){var e=t.type;this.types[e]=this.types[e]||[],this.types[e].push(t)},createNavigation:function(){var t=document.createElement("div");t.className="table-of-contents clearfix";var e=document.createElement("div");e.className="btn-group right",i.parentNode.insertBefore(t,i.nextSibling),t.appendChild(e),Object.keys(this.types).forEach(function(t){var i=!0,n=document.createElement("button");n.textContent=t,n.className="btn btn-sm selected",e.appendChild(n),n.addEventListener("click",function(e){i=!i,n.classList.toggle("selected",i),this.types[t].forEach(function(t){t.toggle(i)},this),e.preventDefault()}.bind(this))},this)}},e.prototype={init:function(){this.visible=!0,this.cacheElements(),this.addToggleButton(),this.bindEvents(),this.registerType()},cacheElements:function(){this.header=this.el.querySelector(".file-header"),this.actions=this.el.querySelector(".file-actions"),this.content=this.header.nextElementSibling},addToggleButton:function(){this.toggleButton=document.createElement("button"),this.toggleButton.className="btn btn-sm selected",this.toggleButton.textContent="Toggle",this.actions.appendChild(this.toggleButton)},bindEvents:function(){this.toggleButton.addEventListener("click",function(t){this.toggle(),t.preventDefault()}.bind(this))},registerType:function(){var t=this.el.querySelector(".file-info .js-selectable-text").textContent;this.type=t.slice(t.lastIndexOf("."),t.length).trim(),this.registry.register(this)},toggle:function(t){this.visible=void 0!==t?t:!this.visible,this.toggleButton.classList.toggle("selected",this.visible),this.content.style.display=this.visible?"block":"none"}};var i=document.getElementById("toc"),n=document.querySelectorAll(".file"),s=new t;[].slice.call(n,0).forEach(function(t){new e(t,s)}),s.createNavigation()})()

unminified-bookmarklet.js

(function() {

  // FileTypeRegistry
  function FileTypeRegistry() {
    this.types = {};
  }
  
  FileTypeRegistry.prototype = {
    register: function register(FileElementInstance) {
      var type = FileElementInstance.type;
  
      this.types[type] = this.types[type] || [];
      this.types[type].push(FileElementInstance);
    },
  
    createNavigation: function createNavigation() {
      // create group container
      var buttonGroupContainer = document.createElement('div');
      buttonGroupContainer.className = 'table-of-contents clearfix';
  
      // create button group
      var buttonGroup = document.createElement('div');
      buttonGroup.className = 'btn-group right';
  
      // insert button group container after TOC node
      tocNode.parentNode.insertBefore(buttonGroupContainer, tocNode.nextSibling);
      buttonGroupContainer.appendChild(buttonGroup);
  
      // loop over types and create toggle button and click handler
      Object.keys(this.types).forEach(function eacher(key) {
        // keep track of visible state inside this closure
        var visible = true;
  
        var button = document.createElement('button');
        button.textContent = key;
        button.className = 'btn btn-sm selected';
  
        buttonGroup.appendChild(button);
  
        button.addEventListener('click', function clickHandler(e) {
          visible = !visible;
          button.classList.toggle('selected', visible);
          
          // toggle all FileElements of this type
          this.types[key].forEach(function eacher(fileElement) {
            fileElement.toggle(visible);
          }, this);
  
          e.preventDefault();
        }.bind(this));
      }, this);
    }
  };
  
  
  // FileElement
  function FileElement(el, registry) {
    this.el = el;
    this.registry = registry;
    this.init();
  }
  
  FileElement.prototype = {
    init: function init() {
      this.visible = true;
      this.cacheElements();
      this.addToggleButton();
      this.bindEvents();
      this.registerType();
    },
  
    cacheElements: function cacheElements() {
      this.header  = this.el.querySelector('.file-header');
      this.actions = this.el.querySelector('.file-actions');
      this.content = this.header.nextElementSibling;
    },
  
    addToggleButton: function addToggleButton() {
      this.toggleButton = document.createElement('button');
      this.toggleButton.className = 'btn btn-sm selected';
      this.toggleButton.textContent = 'Toggle';
  
      this.actions.appendChild(this.toggleButton);
    },
  
    bindEvents: function bindEvents() {
      this.toggleButton.addEventListener('click', function(e) {
        this.toggle();
        e.preventDefault();
      }.bind(this));
    },
  
    registerType: function registerType() {
      var filepath = this.el.querySelector('.file-info .js-selectable-text').textContent;
      this.type = filepath.slice(filepath.lastIndexOf('.'), filepath.length).trim();
      this.registry.register(this);
    },
  
    toggle: function toggle(visible) {
      this.visible = visible !== undefined ? visible : !this.visible;
      this.toggleButton.classList.toggle('selected', this.visible);
      this.content.style.display = this.visible ? 'block' : 'none';
    }
  };
  
  var tocNode      = document.getElementById('toc');
  var fileElNodes  = document.querySelectorAll('.file');
  var TypeRegistry = new FileTypeRegistry();
  
  [].slice.call(fileElNodes, 0).forEach(function eacher(node) {
    new FileElement(node, TypeRegistry);
  });
  
  TypeRegistry.createNavigation();
}());