How to use pane-registry - 10 common examples

} catch (e) {
                    console.log(
                      'Error occurs while editing ' + s1 + ':\n\t' + e
                    )
                    return
                  }
                  kb.remove(s)
                  kb.add(s.subject, selectedPredicate, textTerm, s.why) // was: newStat =
                  // a subtle bug occurs here, if foaf:nick hasn't been dereferneced,
                  // this add will cause a repainting
                }
                var enclosingTd = UI.utils.ancestor(
                  this.lastModified.parentNode.parentNode,
                  'TD'
                )
                const defaultPane = panes.byName('default') // @@ check
                outline.outlineExpand(enclosingTd, s.subject, {
                  pane: defaultPane,
                  already: true
                })
                outline.walk('right', outline.focusTd)
                // 
              } else {
                this.fillInRequest(
                  'object',
                  this.lastModified.parentNode,
                  kb.literal(this.lastModified.value)
                )
                return // The new Td is already generated by fillInRequest, so it's done.
              }
              break
          }

*/
      for (var i = 0; i < obj.elements.length; i++) {
        var elt = obj.elements[i]
        var row = rep.appendChild(dom.createElement('tr'))
        var numcell = row.appendChild(dom.createElement('td'))
        numcell.setAttribute(
          'style',
          'margin: 0.2em; border: none; padding: 0; vertical-align: top;'
        )
        numcell.setAttribute('notSelectable', 'false')
        numcell.setAttribute('about', obj.toNT())
        numcell.innerHTML = i + 1 + ')'
        row.appendChild(thisOutline.outlineObjectTD(elt))
      }
    } else if (obj.termType === 'Graph') {
      rep = panes
        .byName('dataContentPane')
        .statementsAsTables(obj.statements, context)
      rep.setAttribute('class', 'nestedFormula')
    } else {
      UI.log.error('Object ' + obj + ' has unknown term type: ' + obj.termType)
      rep = dom.createTextNode('[unknownTermType:' + obj.termType + ']')
    } // boring defaults.
    UI.log.debug('contents: ' + rep.innerHTML)
    return rep
  } // boring_default

function renderMain (containerDiv, item) {
      // Items are pane names
      const pane = panes.byName(item.paneName) // 20190701
      containerDiv.innerHTML = ''
      const table = containerDiv.appendChild(dom.createElement('table'))
      const me = UI.authn.currentUser()
      thisOutline.GotoSubject(
        item.subject || me,
        true,
        pane,
        false,
        undefined,
        table
      )
    }

function expandMouseDownListener (e) {
    // For icon (UI.icons.originalIconBase + 'tbl-expand-trans.png')
    var target = thisOutline.targetOf(e)
    var p = target.parentNode
    var subject = UI.utils.getAbout(kb, target)
    var pane = e.altKey ? panes.byName('internal') : undefined // set later: was panes.defaultPane

    if (e.shiftKey) {
      // Shift forces a refocus - bring this to the top
      outlineRefocus(p, subject, pane)
    } else {
      if (e.altKey) {
        // To investigate screw ups, dont wait show internals
        outlineExpand(p, subject, {
          pane: panes.byName('internal'),
          immediate: true
        })
      } else {
        outlineExpand(p, subject)
      }
    }
  }

function expandMouseDownListener (e) {
    // For icon (UI.icons.originalIconBase + 'tbl-expand-trans.png')
    var target = thisOutline.targetOf(e)
    var p = target.parentNode
    var subject = UI.utils.getAbout(kb, target)
    var pane = e.altKey ? panes.byName('internal') : undefined // set later: was panes.defaultPane

    if (e.shiftKey) {
      // Shift forces a refocus - bring this to the top
      outlineRefocus(p, subject, pane)
    } else {
      if (e.altKey) {
        // To investigate screw ups, dont wait show internals
        outlineExpand(p, subject, {
          pane: panes.byName('internal'),
          immediate: true
        })
      } else {
        outlineExpand(p, subject)
      }
    }
  }

// eslint-disable-next-line no-case-declarations
        const obj = UI.utils.getAbout(kb, selectedTd)
        if (obj) {
          var walk = this.walk

          if (selectedTd.nextSibling) {
            // when selectedTd is a predicate
            this.walk('right')
            return
          }
          if (selectedTd.firstChild.tagName !== 'TABLE') {
            // not expanded
            sf.addCallback('done', setSelectedAfterward)
            sf.addCallback('fail', setSelectedAfterward)
            outlineExpand(selectedTd, obj, {
              pane: panes.byName('defaultPane')
            })
          }
          setSelectedAfterward()
        }
        break
      case 38: // up
      case 40: // down
        break
      default:
        switch (e.charCode) {
          case 99: // c for Copy
            if (e.ctrlKey) {
              thisOutline.UserInput.copyToClipboard(
                thisOutline.clipboardAddress,
                selectedTd
              )

render: function (subject, dom) {
    var outliner = panes.getOutliner(dom)
    var kb = UI.store
    var arg = UI.ns.arg

    subject = kb.canon(subject)
    // var types = kb.findTypeURIs(subject)

    var div = dom.createElement('div')
    div.setAttribute('class', 'argumentPane')

    // var title = kb.any(subject, UI.ns.dc('title'))

    var comment = kb.any(subject, UI.ns.rdfs('comment'))
    if (comment) {
      var para = dom.createElement('p')
      para.setAttribute('style', 'margin-left: 2em; font-style: italic;')
      div.appendChild(para)

const loadResource = (resourcePath: string) => {
      panes.getOutliner(dom).GotoSubject($rdf.sym(resourcePath), true, undefined, true)
    }
    // TODO: Update the value of WebID when the user logs in/out:

// This has common outline mode functionality for the default and other other panes
// A separate outline manager is required per DOM in cases like a browser extension
// where there are many occurrences of window and of window.document
// But each DOM should have just one outline manager.

panes.OutlineManager = require('./outline/manager.js')
panes.getOutliner = function (dom) {
  if (!dom.outlineManager) {
    dom.outlineManager = panes.OutlineManager(dom)
  }
  return dom.outlineManager
}
if (typeof window !== 'undefined') {
  var dom = window.document
  panes.getOutliner(dom)
}

/*  Note that the earliest panes have priority. So the most specific ones are first.
**
*/
// Developer designed:

let register = panes.register

register(require('issue-pane'))
register(require('contacts-pane'))

register(require('./pad/padPane').default)
register(require('./scratchpad/paneWrapper').default)
// register(require('./argument/argumentPane.js')) // A position in an argument tree

** relevant to a given subject, returning null if not.
** If it is relevant, then it returns a suitable tooltip for a control which selects the pane
*/

// create the unique UI module on which to attach panes (no, don't attach as UI dot panes any more)
// var UI = require('solid-ui') // Note we will add the panes register to this.

const panes = require('pane-registry')

module.exports = panes

// We attach the solid-UI lower-level system for convenience
// Currently most panes are built using it anyway.
// It also gives access to rdflib as panes.UI.rdf

panes.UI = require('solid-ui') // Pass on directly to any who needs it

// This has common outline mode functionality for the default and other other panes
// A separate outline manager is required per DOM in cases like a browser extension
// where there are many occurrences of window and of window.document
// But each DOM should have just one outline manager.

panes.OutlineManager = require('./outline/manager.js')
panes.getOutliner = function (dom) {
  if (!dom.outlineManager) {
    dom.outlineManager = panes.OutlineManager(dom)
  }
  return dom.outlineManager
}
if (typeof window !== 'undefined') {
  var dom = window.document
  panes.getOutliner(dom)