{"version":3,"sources":["https://lively-kernel.org/lively4/BP2019RH-stable/components/bp2019-theme-group-list-item-widget.js"],"names":["Morph","ThemeGroupUpdatedAction","THEME_GROUP_COLOR_TRANSPARENCY","ThemeGroupWidget","initialize","colorPicker","get","heading","themesList","removeButton","editButton","rootContainer","_initializeCallbacks","_initializeColor","setParent","parent","setUUID","uuid","setName","name","_updateHTMLWithName","setThemes","themes","_updateHTMLWithThemes","updateName","_applyUpdate","updateThemes","getColor","value","color","style","backgroundColor","addEventListener","_updateColor","_removeSelf","_editSelf","innerHTML","_clearCurrentThemes","_addNewThemes","themeItems","querySelectorAll","index","length","themeItem","removeChild","forEach","theme","appendChild","removeThemeGroupListItem","editThemeGroupListItem","updatedAction","_createThemeGroupUpdatedAction","applyAction"],"mappings":"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","file":"bp2019-theme-group-list-item-widget.js","sourcesContent":["import Morph from 'src/components/widgets/lively-morph.js'\nimport { ThemeGroupUpdatedAction } from \"../src/internal/individuals-as-points/common/actions.js\"\n\nimport { THEME_GROUP_COLOR_TRANSPARENCY } from \"../src/internal/individuals-as-points/venn/venn-diagram.js\"\n\nexport default class ThemeGroupWidget extends Morph {\n  async initialize() {\n    this.colorPicker = this.get('#theme-group-color')\n    this.heading = this.get(\"#theme-group-name\")\n    this.themesList = this.get('#theme-group-themes')\n    this.removeButton = this.get('#theme-group-remove')\n    this.editButton = this.get('#theme-group-edit')\n    this.rootContainer = this.get('#root-container')\n    \n    this._initializeCallbacks()\n    this._initializeColor()\n    \n  }\n  \n  // ------------------------------------------\n  // Public Methods\n  // ------------------------------------------\n  \n  setParent(parent) {\n    this.parent = parent\n  }\n  \n  setUUID(uuid) {\n    this.uuid = uuid\n  }\n  \n  setName(name) {\n    this.name = name\n    this._updateHTMLWithName(name)\n  }\n  \n  setThemes(themes) {\n    this.themes = themes\n    this._updateHTMLWithThemes(themes)\n  }\n  \n  updateName(name) {\n    this.name = name\n    this._updateHTMLWithName(name)\n    this._applyUpdate()\n  }\n  \n  updateThemes(themes) {\n    this.themes = themes\n    this._updateHTMLWithThemes(themes)\n    this._applyUpdate()\n  }\n  \n  getColor() {\n    return this.colorPicker.value\n  }\n  \n\n  // ------------------------------------------\n  // Private Methods\n  // ------------------------------------------\n  \n  _initializeColor(){\n     this.color = this.colorPicker.value\n    this.rootContainer.style.backgroundColor = this.color + THEME_GROUP_COLOR_TRANSPARENCY\n  }\n  \n  _initializeCallbacks() {\n    this.colorPicker.addEventListener(\n      \"change\", () => this._updateColor())\n    this.removeButton.addEventListener(\n      \"click\", () => this._removeSelf())\n    this.editButton.addEventListener(\n      \"click\", () => this._editSelf())\n  }\n  \n  _updateHTMLWithName(name) {\n    this.heading.innerHTML = name\n  }\n  \n  _updateHTMLWithThemes(themes) {\n    this._clearCurrentThemes()\n    this._addNewThemes(themes)\n  }\n  \n  _clearCurrentThemes() {\n    let themeItems = this.themesList.querySelectorAll(\"li\")\n    for(let index=0; index<themeItems.length; index++){\n      let themeItem = themeItems[index]\n      this.themesList.removeChild(themeItem)\n    }\n  }\n  \n  _addNewThemes(themes) {\n    themes.forEach(theme => {\n      let themeItem = <li class=\"list-group-item py-1\"></li>;\n      themeItem.innerHTML = theme\n      this.themesList.appendChild(themeItem)\n    })\n  }\n  \n  _updateColor() {\n    this.color = this.colorPicker.value\n    this.rootContainer.style.backgroundColor = this.color + THEME_GROUP_COLOR_TRANSPARENCY\n    this._applyUpdate()\n  }\n  \n  _removeSelf(){\n    this.parent.removeThemeGroupListItem(this)\n  }\n  \n  _editSelf() {\n    this.parent.editThemeGroupListItem(this)\n  }\n  \n  _applyUpdate() {\n    let updatedAction = this._createThemeGroupUpdatedAction()\n    this.parent.applyAction(updatedAction)\n  }\n  \n  _createThemeGroupUpdatedAction() {\n    return new ThemeGroupUpdatedAction(\n      this.uuid,\n      this.name,\n      this.themes,\n      false,\n      this.color)\n  }\n  \n}"]}