{"version":3,"sources":["https://lively-kernel.org/lively4/lively4-bp2019/src/components/draft/lively-tab-view.js"],"names":["Morph","TabView","attachedCallback","tabBar","shadowRoot","querySelector","tabList","initObserver","renderTabBar","hideAllContents","showDefaultContent","detachedCallback","contentObserver","disconnect","attributeChangedCallback","attrName","oldValue","newValue","MutationObserver","record","observerCallback","observe","childList","i","children","length","child","attributes","attributeFilter","reInitObserver","mutationRecord","contentViews","hasChildNodes","bars","querySelectorAll","bar","remove","renderContentViewIntoTab","view","id","title","hasAttribute","getAttribute","barTitle","document","createElement","tab","innerHTML","addEventListener","e","showContent","changeEvent","CustomEvent","detail","dispatchEvent","appendChild","showContentFromTabList","n","classList","add","showElement","identifier","tabKey","parseInt","hideElement","element"],"mappings":"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","file":"lively-tab-view.js","sourcesContent":["'use strict'\n\nimport Morph from 'src/components/widgets/lively-morph.js';\n\nexport default class TabView extends Morph {\n  /*\n   * HTMLElement callbacks\n   */\n  attachedCallback() {\n    this.tabBar = this.shadowRoot.querySelector('#tab-bar');\n\n    this.tabList = [];\n    this.initObserver();\n\n    this.renderTabBar();\n    this.hideAllContents();\n    this.showDefaultContent();\n  }\n\n  detachedCallback() {\n    if (this.contentObserver) {\n      this.contentObserver.disconnect();\n    }\n  }\n\n  attributeChangedCallback(attrName, oldValue, newValue) {\n\n  }\n\n  initObserver() {\n    this.contentObserver = new MutationObserver((record) => this.observerCallback(record));\n\n    //observe for added/removed tab elements\n    this.contentObserver.observe(this, {\n      childList: true\n    });\n\n    //observe each tab element for title changes\n    for(let i = 0; i < this.children.length; i++) {\n      let child = this.children[i];\n\n      this.contentObserver.observe(child, {\n        attributes: true,\n        attributeFilter: ['title']\n      });\n    }\n  }\n\n  reInitObserver() {\n    this.contentObserver.disconnect();\n    this.initObserver();\n  }\n\n  observerCallback(mutationRecord) {\n    this.renderTabBar();\n    this.hideAllContents();\n    this.showDefaultContent();\n\n    this.reInitObserver();\n  }\n\n  renderTabBar() {\n    let contentViews = this.children;\n    this.tabList = [];\n\n    if(this.tabBar.hasChildNodes()) {\n      let bars = this.tabBar.querySelectorAll('*');\n\n      for(let i = 0; i < bars.length; i++) {\n        let bar = bars[i];\n        bar.remove();\n      }\n    }\n\n    for(let i = 0; i < contentViews.length; i++) {\n      this.renderContentViewIntoTab(contentViews[i], i);\n    }\n  }\n\n  renderContentViewIntoTab(view, id) {\n    let title = \"\";\n\n    if(view.hasAttribute('title')) {\n      title = view.getAttribute('title');\n    } else {\n      title = \"TAB[\" + id + \"]\";\n    }\n\n    this.tabList[id] = {\n      title: title,\n      view: view,\n      id: view.id\n    };\n\n    let barTitle = document.createElement('span');\n    let tab = document.createElement('li');\n    barTitle.innerHTML = title;\n    barTitle.addEventListener('click', (e) => {\n      this.showContent(id);\n\n      let changeEvent = new CustomEvent(\"tabChange\", {\n        detail: {\n          title: title,\n          id: view.id\n        }\n      });\n      this.dispatchEvent(changeEvent);\n    });\n    tab.appendChild(barTitle);\n    this.tabBar.appendChild(tab);\n  }\n\n  showContentFromTabList(i) {\n    let tab = this.tabList[i];\n    if(typeof tab === 'undefined') {\n      return false;\n    }\n\n    for (let n = 0; n < this.tabBar.children.length; n++) {\n      if (n === i) {\n        this.tabBar.children[n].classList.add('active');\n      } else {\n        this.tabBar.children[n].classList.remove('active');\n      }\n    }\n\n    this.hideAllContents();\n    this.showElement(tab.view);\n  }\n\n  showContent(identifier) {\n    this.showContentFromTabList(identifier);\n\n    //in case this identifier is a node id\n    //we need to run through our tab list \n    for(let tabKey in this.tabList) {\n      let tab = this.tabList[tabKey];\n\n      if(tab.id && tab.id == identifier) {\n        this.showContentFromTabList(parseInt(tabKey));\n      }\n    }\n  }\n\n  hideAllContents() {\n    for(let tab of this.tabList) {\n      this.hideElement(tab.view);\n    }\n  }\n\n  showDefaultContent() {\n    if(this.tabList.length > 0) {\n      this.showContent(0);\n    }\n  }\n\n  hideElement(element) {\n    element.classList.add(\"tab-view-inactive\");\n  }\n\n  showElement(element) {\n    element.classList.remove(\"tab-view-inactive\");\n  }\n}\n"]}