diff --git a/src/editor/components/sePalette.js b/src/editor/components/sePalette.js index 1272a7c2..66844a1a 100644 --- a/src/editor/components/sePalette.js +++ b/src/editor/components/sePalette.js @@ -1,5 +1,4 @@ /* eslint-disable max-len */ -/* gl#bals svgEditor */ const palette = [ // Todo: Make into configuration item? 'none', '#000000', '#3f3f3f', '#7f7f7f', '#bfbfbf', '#ffffff', @@ -78,8 +77,7 @@ template.innerHTML = ` } } -
+
@@ -127,6 +125,35 @@ export class SEPalette extends HTMLElement { }); } + /** + * @function init + * @param {any} name + * @returns {void} + */ + init (i18next) { + this.setAttribute('ui-palette_info', i18next.t('ui.palette_info')); + } + /** + * @function observedAttributes + * @returns {any} observed + */ + static get observedAttributes () { + return [ 'ui-palette_info' ]; + } + /** + * @function attributeChangedCallback + * @param {string} name + * @param {string} oldValue + * @param {string} newValue + * @returns {void} + */ + attributeChangedCallback (name, oldValue, newValue) { + let node; + if (name === 'ui-palette_info') { + node = this._shadowRoot.querySelector('#palette_holder'); + node.setAttribute('title', newValue); + } + } /** * @function connectedCallback * @returns {void} diff --git a/src/editor/panels/BottomPanel.js b/src/editor/panels/BottomPanel.js index 34191440..0e46d1be 100644 --- a/src/editor/panels/BottomPanel.js +++ b/src/editor/panels/BottomPanel.js @@ -215,6 +215,7 @@ class BottomPanel { `; this.editor.$svgEditor.append(template.content.cloneNode(true)); $id('palette').addEventListener('change', this.handlePalette.bind(this)); + $id('palette').init(i18next); const { curConfig } = this.editor.configObj; $id('fill_color').setPaint(new jGraduate.Paint({ alpha: 100, solidColor: curConfig.initFill.color })); $id('stroke_color').setPaint(new jGraduate.Paint({ alpha: 100, solidColor: curConfig.initStroke.color }));