{"ast":null,"code":"import snippet from 'tui-code-snippet';\nimport tuiColorPicker from 'tui-color-picker';\nconst PICKER_COLOR = ['#000000', '#2a2a2a', '#545454', '#7e7e7e', '#a8a8a8', '#d2d2d2', '#ffffff', '', '#ff4040', '#ff6518', '#ffbb3b', '#03bd9e', '#00a9ff', '#515ce6', '#9e5fff', '#ff5583'];\n/**\r\n * Colorpicker control class\r\n * @class\r\n * @ignore\r\n */\n\nclass Colorpicker {\n  constructor(colorpickerElement, defaultColor = '#7e7e7e', toggleDirection = 'up', usageStatistics) {\n    this.colorpickerElement = colorpickerElement;\n    this.usageStatistics = usageStatistics;\n    this._show = false;\n    this._colorpickerElement = colorpickerElement;\n    this._toggleDirection = toggleDirection;\n\n    this._makePickerButtonElement(defaultColor);\n\n    this._makePickerLayerElement(colorpickerElement, colorpickerElement.getAttribute('title'));\n\n    this._color = defaultColor;\n    this.picker = tuiColorPicker.create({\n      container: this.pickerElement,\n      preset: PICKER_COLOR,\n      color: defaultColor,\n      usageStatistics: this.usageStatistics\n    });\n\n    this._addEvent();\n  }\n  /**\r\n   * Destroys the instance.\r\n   */\n\n\n  destroy() {\n    this._removeEvent();\n\n    this.picker.destroy();\n    this.colorpickerElement.innerHTML = '';\n    snippet.forEach(this, (value, key) => {\n      this[key] = null;\n    });\n  }\n  /**\r\n   * Get color\r\n   * @returns {Number} color value\r\n   */\n\n\n  get color() {\n    return this._color;\n  }\n  /**\r\n   * Set color\r\n   * @param {string} color color value\r\n   */\n\n\n  set color(color) {\n    this._color = color;\n\n    this._changeColorElement(color);\n  }\n  /**\r\n   * Change color element\r\n   * @param {string} color color value\r\n   * #private\r\n   */\n\n\n  _changeColorElement(color) {\n    if (color) {\n      this.colorElement.classList.remove('transparent');\n      this.colorElement.style.backgroundColor = color;\n    } else {\n      this.colorElement.style.backgroundColor = '#fff';\n      this.colorElement.classList.add('transparent');\n    }\n  }\n  /**\r\n   * Make picker button element\r\n   * @param {string} defaultColor color value\r\n   * @private\r\n   */\n\n\n  _makePickerButtonElement(defaultColor) {\n    this.colorpickerElement.classList.add('tui-image-editor-button');\n    this.colorElement = document.createElement('div');\n    this.colorElement.className = 'color-picker-value';\n\n    if (defaultColor) {\n      this.colorElement.style.backgroundColor = defaultColor;\n    } else {\n      this.colorElement.classList.add('transparent');\n    }\n  }\n  /**\r\n   * Make picker layer element\r\n   * @param {HTMLElement} colorpickerElement color picker element\r\n   * @param {string} title picker title\r\n   * @private\r\n   */\n\n\n  _makePickerLayerElement(colorpickerElement, title) {\n    const label = document.createElement('label');\n    const triangle = document.createElement('div');\n    this.pickerControl = document.createElement('div');\n    this.pickerControl.className = 'color-picker-control';\n    this.pickerElement = document.createElement('div');\n    this.pickerElement.className = 'color-picker';\n    label.innerHTML = title;\n    triangle.className = 'triangle';\n    this.pickerControl.appendChild(this.pickerElement);\n    this.pickerControl.appendChild(triangle);\n    colorpickerElement.appendChild(this.pickerControl);\n    colorpickerElement.appendChild(this.colorElement);\n    colorpickerElement.appendChild(label);\n  }\n  /**\r\n   * Add event\r\n   * @private\r\n   */\n\n\n  _addEvent() {\n    this.picker.on('selectColor', value => {\n      this._changeColorElement(value.color);\n\n      this._color = value.color;\n      this.fire('change', value.color);\n    });\n    this.eventHandler = {\n      pickerToggle: this._pickerToggleEventHandler.bind(this),\n      pickerHide: () => this.hide()\n    };\n    this.colorpickerElement.addEventListener('click', this.eventHandler.pickerToggle);\n    document.body.addEventListener('click', this.eventHandler.pickerHide);\n  }\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\n\n\n  _removeEvent() {\n    this.colorpickerElement.removeEventListener('click', this.eventHandler.pickerToggle);\n    document.body.removeEventListener('click', this.eventHandler.pickerHide);\n    this.picker.off();\n  }\n  /**\r\n   * Picker toggle event handler\r\n   * @param {object} event - change event\r\n   * @private\r\n   */\n\n\n  _pickerToggleEventHandler(event) {\n    const {\n      target\n    } = event;\n\n    const isInPickerControl = target && this._isElementInColorPickerControl(target);\n\n    if (!isInPickerControl || isInPickerControl && this._isPaletteButton(target)) {\n      this._show = !this._show;\n      this.pickerControl.style.display = this._show ? 'block' : 'none';\n\n      this._setPickerControlPosition();\n\n      this.fire('changeShow', this);\n    }\n\n    event.stopPropagation();\n  }\n  /**\r\n   * Check hex input or not\r\n   * @param {Element} target - Event target element\r\n   * @returns {boolean}\r\n   * @private\r\n   */\n\n\n  _isPaletteButton(target) {\n    return target.className === 'tui-colorpicker-palette-button';\n  }\n  /**\r\n   * Check given element is in pickerControl element\r\n   * @param {Element} element - element to check\r\n   * @returns {boolean}\r\n   * @private\r\n   */\n\n\n  _isElementInColorPickerControl(element) {\n    let parentNode = element;\n\n    while (parentNode !== document.body) {\n      if (!parentNode) {\n        break;\n      }\n\n      if (parentNode === this.pickerControl) {\n        return true;\n      }\n\n      parentNode = parentNode.parentNode;\n    }\n\n    return false;\n  }\n\n  hide() {\n    this._show = false;\n    this.pickerControl.style.display = 'none';\n  }\n  /**\r\n   * Set picker control position\r\n   * @private\r\n   */\n\n\n  _setPickerControlPosition() {\n    const controlStyle = this.pickerControl.style;\n    const halfPickerWidth = this._colorpickerElement.clientWidth / 2 + 2;\n    const left = this.pickerControl.offsetWidth / 2 - halfPickerWidth;\n    let top = (this.pickerControl.offsetHeight + 10) * -1;\n\n    if (this._toggleDirection === 'down') {\n      top = 30;\n    }\n\n    controlStyle.top = `${top}px`;\n    controlStyle.left = `-${left}px`;\n  }\n\n}\n\nsnippet.CustomEvents.mixin(Colorpicker);\nexport default Colorpicker;","map":{"version":3,"sources":["C:/Users/kkwan_000/Desktop/git/2017110269/minsung/src/js/ui/tools/colorpicker.js"],"names":["snippet","tuiColorPicker","PICKER_COLOR","Colorpicker","constructor","colorpickerElement","defaultColor","toggleDirection","usageStatistics","_show","_colorpickerElement","_toggleDirection","_makePickerButtonElement","_makePickerLayerElement","getAttribute","_color","picker","create","container","pickerElement","preset","color","_addEvent","destroy","_removeEvent","innerHTML","forEach","value","key","_changeColorElement","colorElement","classList","remove","style","backgroundColor","add","document","createElement","className","title","label","triangle","pickerControl","appendChild","on","fire","eventHandler","pickerToggle","_pickerToggleEventHandler","bind","pickerHide","hide","addEventListener","body","removeEventListener","off","event","target","isInPickerControl","_isElementInColorPickerControl","_isPaletteButton","display","_setPickerControlPosition","stopPropagation","element","parentNode","controlStyle","halfPickerWidth","clientWidth","left","offsetWidth","top","offsetHeight","CustomEvents","mixin"],"mappings":"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","sourcesContent":["import snippet from 'tui-code-snippet';\r\nimport tuiColorPicker from 'tui-color-picker';\r\nconst PICKER_COLOR = [\r\n  '#000000',\r\n  '#2a2a2a',\r\n  '#545454',\r\n  '#7e7e7e',\r\n  '#a8a8a8',\r\n  '#d2d2d2',\r\n  '#ffffff',\r\n  '',\r\n  '#ff4040',\r\n  '#ff6518',\r\n  '#ffbb3b',\r\n  '#03bd9e',\r\n  '#00a9ff',\r\n  '#515ce6',\r\n  '#9e5fff',\r\n  '#ff5583',\r\n];\r\n\r\n/**\r\n * Colorpicker control class\r\n * @class\r\n * @ignore\r\n */\r\nclass Colorpicker {\r\n  constructor(\r\n    colorpickerElement,\r\n    defaultColor = '#7e7e7e',\r\n    toggleDirection = 'up',\r\n    usageStatistics\r\n  ) {\r\n    this.colorpickerElement = colorpickerElement;\r\n    this.usageStatistics = usageStatistics;\r\n\r\n    this._show = false;\r\n\r\n    this._colorpickerElement = colorpickerElement;\r\n    this._toggleDirection = toggleDirection;\r\n    this._makePickerButtonElement(defaultColor);\r\n    this._makePickerLayerElement(colorpickerElement, colorpickerElement.getAttribute('title'));\r\n    this._color = defaultColor;\r\n    this.picker = tuiColorPicker.create({\r\n      container: this.pickerElement,\r\n      preset: PICKER_COLOR,\r\n      color: defaultColor,\r\n      usageStatistics: this.usageStatistics,\r\n    });\r\n\r\n    this._addEvent();\r\n  }\r\n\r\n  /**\r\n   * Destroys the instance.\r\n   */\r\n  destroy() {\r\n    this._removeEvent();\r\n    this.picker.destroy();\r\n    this.colorpickerElement.innerHTML = '';\r\n    snippet.forEach(this, (value, key) => {\r\n      this[key] = null;\r\n    });\r\n  }\r\n\r\n  /**\r\n   * Get color\r\n   * @returns {Number} color value\r\n   */\r\n  get color() {\r\n    return this._color;\r\n  }\r\n\r\n  /**\r\n   * Set color\r\n   * @param {string} color color value\r\n   */\r\n  set color(color) {\r\n    this._color = color;\r\n    this._changeColorElement(color);\r\n  }\r\n\r\n  /**\r\n   * Change color element\r\n   * @param {string} color color value\r\n   * #private\r\n   */\r\n  _changeColorElement(color) {\r\n    if (color) {\r\n      this.colorElement.classList.remove('transparent');\r\n      this.colorElement.style.backgroundColor = color;\r\n    } else {\r\n      this.colorElement.style.backgroundColor = '#fff';\r\n      this.colorElement.classList.add('transparent');\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Make picker button element\r\n   * @param {string} defaultColor color value\r\n   * @private\r\n   */\r\n  _makePickerButtonElement(defaultColor) {\r\n    this.colorpickerElement.classList.add('tui-image-editor-button');\r\n\r\n    this.colorElement = document.createElement('div');\r\n    this.colorElement.className = 'color-picker-value';\r\n    if (defaultColor) {\r\n      this.colorElement.style.backgroundColor = defaultColor;\r\n    } else {\r\n      this.colorElement.classList.add('transparent');\r\n    }\r\n  }\r\n\r\n  /**\r\n   * Make picker layer element\r\n   * @param {HTMLElement} colorpickerElement color picker element\r\n   * @param {string} title picker title\r\n   * @private\r\n   */\r\n  _makePickerLayerElement(colorpickerElement, title) {\r\n    const label = document.createElement('label');\r\n    const triangle = document.createElement('div');\r\n\r\n    this.pickerControl = document.createElement('div');\r\n    this.pickerControl.className = 'color-picker-control';\r\n\r\n    this.pickerElement = document.createElement('div');\r\n    this.pickerElement.className = 'color-picker';\r\n\r\n    label.innerHTML = title;\r\n    triangle.className = 'triangle';\r\n\r\n    this.pickerControl.appendChild(this.pickerElement);\r\n    this.pickerControl.appendChild(triangle);\r\n\r\n    colorpickerElement.appendChild(this.pickerControl);\r\n    colorpickerElement.appendChild(this.colorElement);\r\n    colorpickerElement.appendChild(label);\r\n  }\r\n\r\n  /**\r\n   * Add event\r\n   * @private\r\n   */\r\n  _addEvent() {\r\n    this.picker.on('selectColor', (value) => {\r\n      this._changeColorElement(value.color);\r\n      this._color = value.color;\r\n      this.fire('change', value.color);\r\n    });\r\n\r\n    this.eventHandler = {\r\n      pickerToggle: this._pickerToggleEventHandler.bind(this),\r\n      pickerHide: () => this.hide(),\r\n    };\r\n\r\n    this.colorpickerElement.addEventListener('click', this.eventHandler.pickerToggle);\r\n    document.body.addEventListener('click', this.eventHandler.pickerHide);\r\n  }\r\n\r\n  /**\r\n   * Remove event\r\n   * @private\r\n   */\r\n  _removeEvent() {\r\n    this.colorpickerElement.removeEventListener('click', this.eventHandler.pickerToggle);\r\n    document.body.removeEventListener('click', this.eventHandler.pickerHide);\r\n    this.picker.off();\r\n  }\r\n\r\n  /**\r\n   * Picker toggle event handler\r\n   * @param {object} event - change event\r\n   * @private\r\n   */\r\n  _pickerToggleEventHandler(event) {\r\n    const { target } = event;\r\n    const isInPickerControl = target && this._isElementInColorPickerControl(target);\r\n\r\n    if (!isInPickerControl || (isInPickerControl && this._isPaletteButton(target))) {\r\n      this._show = !this._show;\r\n      this.pickerControl.style.display = this._show ? 'block' : 'none';\r\n      this._setPickerControlPosition();\r\n      this.fire('changeShow', this);\r\n    }\r\n    event.stopPropagation();\r\n  }\r\n\r\n  /**\r\n   * Check hex input or not\r\n   * @param {Element} target - Event target element\r\n   * @returns {boolean}\r\n   * @private\r\n   */\r\n  _isPaletteButton(target) {\r\n    return target.className === 'tui-colorpicker-palette-button';\r\n  }\r\n\r\n  /**\r\n   * Check given element is in pickerControl element\r\n   * @param {Element} element - element to check\r\n   * @returns {boolean}\r\n   * @private\r\n   */\r\n  _isElementInColorPickerControl(element) {\r\n    let parentNode = element;\r\n\r\n    while (parentNode !== document.body) {\r\n      if (!parentNode) {\r\n        break;\r\n      }\r\n\r\n      if (parentNode === this.pickerControl) {\r\n        return true;\r\n      }\r\n\r\n      parentNode = parentNode.parentNode;\r\n    }\r\n\r\n    return false;\r\n  }\r\n\r\n  hide() {\r\n    this._show = false;\r\n    this.pickerControl.style.display = 'none';\r\n  }\r\n\r\n  /**\r\n   * Set picker control position\r\n   * @private\r\n   */\r\n  _setPickerControlPosition() {\r\n    const controlStyle = this.pickerControl.style;\r\n    const halfPickerWidth = this._colorpickerElement.clientWidth / 2 + 2;\r\n    const left = this.pickerControl.offsetWidth / 2 - halfPickerWidth;\r\n    let top = (this.pickerControl.offsetHeight + 10) * -1;\r\n\r\n    if (this._toggleDirection === 'down') {\r\n      top = 30;\r\n    }\r\n\r\n    controlStyle.top = `${top}px`;\r\n    controlStyle.left = `-${left}px`;\r\n  }\r\n}\r\n\r\nsnippet.CustomEvents.mixin(Colorpicker);\r\nexport default Colorpicker;\r\n"]},"metadata":{},"sourceType":"module"}