{"version":3,"sources":["https://lively-kernel.org/lively4/BP2019RH1/components/bp2019-theme-group-widget.js"],"names":["Morph","assertListenerInterface","ThemeGroupAddedAction","ThemeGroupUpdatedAction","ThemeGroupRemovedAction","generate_UUID","COLOR_PICKER_BASE_ID","ThemeGroupWidget","initialize","name","isGlobal","listeners","themeSelect","get","addEventListener","_addThemeGroup","themeGroupList","addListener","listener","push","initializeWithData","themes","_setSelectionOptions","data","_clearSelectOptions","forEach","attribute","appendChild","Option","select","options","length","remove","themeGroupUUID","_generateCSSValidUUID","_getSelectedThemes","themeGroupName","_getThemeGroupName","_addThemeGroupToList","_applyThemeGroupAdded","selectedThemes","availableOptionsCount","i","option","selected","value","themeGroup","_createThemeGroup","rootDiv","id","themeGroupNameHeading","innerHTML","themeGroupColorPicker","_createThemeGroupColorPicker","themeGroupRemoveButton","_createThemeGroupRemoveButton","themesList","theme","themeItem","pickerWrapper","colorPickerId","picker","_applyThemeGroupUpdated","buttonWrapper","button","_removeThemeGroup","color","themeGroupAddedAction","_createNewThemeGroupAddedAction","_applyActionToAllListeners","checked","_removeThemeGroupFromList","_applyThemeGroupRemoved","removeChild","themeGroupRemovedAction","_createNewThemeGroupRemovedAction","themeGroupUpdatedAction","_createNewThemeGroupUpdatedAction","themeGroupAction","applyAction"],"mappings":"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","file":"bp2019-theme-group-widget.js","sourcesContent":["import Morph from 'src/components/widgets/lively-morph.js'\nimport { assertListenerInterface } from '../src/internal/individuals-as-points/common/interfaces.js'\nimport { ThemeGroupAddedAction, ThemeGroupUpdatedAction, ThemeGroupRemovedAction} from '../src/internal/individuals-as-points/common/actions.js'\nimport { generate_UUID } from \"../src/internal/individuals-as-points/common/utils.js\"\n\n\nconst COLOR_PICKER_BASE_ID = \"theme-group-color-picker\"\n\nexport default class ThemeGroupWidget extends Morph {\n  async initialize() {\n    this.name = \"group\"\n    this.isGlobal = false\n    this.listeners = []\n    this.themeSelect = this.get('#theme-select')\n    this.get('#add-theme-group').addEventListener('click', () => this._addThemeGroup()) \n    \n    this.themeGroupList = this.get('#applied-theme-groups-container')\n  }\n  \n  // ------------------------------------------\n  // Public Methods\n  // ------------------------------------------\n  \n  addListener(listener) {\n    assertListenerInterface(listener)\n    this.listeners.push(listener)\n  }\n  \n  initializeWithData(themes) {\n    this._setSelectionOptions(themes)\n  }\n   \n  // ------------------------------------------\n  // Private Methods\n  // ------------------------------------------\n  \n  _setSelectionOptions(data) {\n    this._clearSelectOptions(this.themeSelect) \n    data.forEach( (attribute) => {\n      this.themeSelect.appendChild(new Option(attribute)) \n    }) \n  }\n  \n   _clearSelectOptions(select) {\n    while(select.options.length > 0) {\n      select.options.remove(0) \n    }\n  }\n   \n  _addThemeGroup() {\n    let themeGroupUUID = this._generateCSSValidUUID()\n    debugger;\n    let themes = this._getSelectedThemes()\n    let themeGroupName = this._getThemeGroupName()\n\n    this._addThemeGroupToList(themeGroupUUID, themes, themeGroupName)\n    this._applyThemeGroupAdded(themeGroupUUID, themes, themeGroupName)\n  }\n  \n  _generateCSSValidUUID(){\n    return \"a\" + generate_UUID()\n  }\n  \n  \n  _getSelectedThemes() {\n    let selectedThemes = [] \n    let availableOptionsCount = this.themeSelect.options.length \n    \n    for(let i = 0; i < availableOptionsCount; i++){\n      let option = this.themeSelect.options[i] \n      if(option.selected){\n        selectedThemes.push(option.value) \n      }\n    }\n      \n    return selectedThemes \n  }\n  \n  _getThemeGroupName() {\n    return this.get('#theme-group-name').value\n  }\n  \n  _addThemeGroupToList(themeGroupUUID, themes, themeGroupName) {\n    let themeGroup = this._createThemeGroup(themeGroupUUID, themeGroupName, themes)\n    this.themeGroupList.appendChild(themeGroup)\n  }\n  \n  _createThemeGroup(themeGroupUUID, themeGroupName, themes) {\n    let rootDiv = <div class=\"row mt-2 bg-light m-1 p-1 align-items-center\"></div>;\n    rootDiv.id = themeGroupUUID\n    \n    let themeGroupNameHeading = <div class=\"col-8 pb-1 font-weight-bold justify-items-center\"></div>;\n    themeGroupNameHeading.innerHTML = themeGroupName\n    \n    let themeGroupColorPicker = this._createThemeGroupColorPicker(themeGroupName)\n    \n    let themeGroupRemoveButton = this._createThemeGroupRemoveButton(themeGroupUUID)\n    \n    let themesList = <ul class=\"col list-group pr-0\"></ul>;\n    \n    themes.forEach(theme => {\n      let themeItem = <li class=\"list-group-item py-1\"></li>;\n      themeItem.innerHTML = theme\n      themesList.appendChild(themeItem)\n    })\n    \n    rootDiv.appendChild(themeGroupRemoveButton)\n    rootDiv.appendChild(themeGroupNameHeading)\n    rootDiv.appendChild(themeGroupColorPicker)\n    rootDiv.appendChild(themesList)\n    \n    return rootDiv\n  }\n  \n  _createThemeGroupColorPicker(themeGroupUUID){\n    let pickerWrapper = <div class=\"col-2 pb-1 px-0 align-items-center\"></div>;\n    let colorPickerId = COLOR_PICKER_BASE_ID + themeGroupUUID\n    let picker = <input type=\"color\"></input>;\n    picker.id = colorPickerId\n    picker.addEventListener(\n      'change', () => this._applyThemeGroupUpdated(themeGroupUUID))\n    \n    pickerWrapper.appendChild(picker)\n    return pickerWrapper\n  \n  }\n  \n  _createThemeGroupRemoveButton(themeGroupUUID) {\n    let buttonWrapper = <div class=\"col-2 pb-1 px-0 align-items-center\"></div>;\n    let button = <button> x </button>;\n    button.addEventListener('click', () => this._removeThemeGroup(themeGroupUUID))\n    \n    buttonWrapper.appendChild(button)\n    return buttonWrapper\n  }\n  \n  _applyThemeGroupAdded(themeGroupUUID, themes, themeGroupName){\n    let color = this.get('#' + COLOR_PICKER_BASE_ID + themeGroupName).value\n    let themeGroupAddedAction = this._createNewThemeGroupAddedAction(themeGroupUUID, themeGroupName, themes, color)\n    \n    this._applyActionToAllListeners(themeGroupAddedAction)\n  }\n  \n  _createNewThemeGroupAddedAction(themeGroupUUID, themeGroupName, themes, color){\n    let isGlobal = this.get('#is-global').checked\n    \n    return new ThemeGroupAddedAction(themeGroupUUID, themeGroupName, themes, isGlobal, color)\n  }\n  \n  _removeThemeGroup(themeGroupUUID) {\n    this._removeThemeGroupFromList(themeGroupUUID)\n    this._applyThemeGroupRemoved(themeGroupUUID)\n  }\n  \n  _removeThemeGroupFromList(themeGroupUUID) {\n    let themeGroup = this.get('#' + themeGroupUUID)\n    this.themeGroupList.removeChild(themeGroup)\n  }\n  \n \n  _applyThemeGroupRemoved(themeGroupUUID){\n    let themeGroupRemovedAction = this._createNewThemeGroupRemovedAction(themeGroupUUID)\n    this._applyActionToAllListeners(themeGroupRemovedAction)\n\n  }\n  \n  _createNewThemeGroupRemovedAction(themeGroupUUID){\n    let isGlobal = this.get('#is-global').checked\n    \n    return new ThemeGroupRemovedAction(themeGroupUUID, isGlobal)\n  }\n  \n  \n  _applyThemeGroupUpdated(themeGroupUUID) {\n    let color = this.get('#' + COLOR_PICKER_BASE_ID + themeGroupUUID).value\n    let themeGroupUpdatedAction = this._createNewThemeGroupUpdatedAction(themeGroupUUID, [], color)\n    \n    this._applyActionToAllListeners(themeGroupUpdatedAction)\n  }\n  \n   _createNewThemeGroupUpdatedAction(themeGroupUUID, themes, color){\n    let isGlobal = this.get('#is-global').checked\n    \n    return new ThemeGroupUpdatedAction(themeGroupUUID, themes, isGlobal, color)\n  }\n  \n   \n  _applyActionToAllListeners(themeGroupAction) {\n    this.listeners.forEach(listener => {\n      listener.applyAction(themeGroupAction)\n    })\n  }\n  \n}"]}