Added Text Decoration options

src/svgcanvas/elem-get-set.js

@@ -593,6 +593,56 @@ export const setBoldMethod = function (b) {
   }
 }
 
+/**
+ * Check whether selected element has the given text decoration value or not.
+ * @returns {boolean} Indicates whether or not element has the text decoration value
+ */
+export const hasTextDecorationMethod = function (value) {
+  const selectedElements = svgCanvas.getSelectedElements();
+  const selected = selectedElements[0];
+
+  if (!isNullish(selected) && selected.tagName === 'text' && isNullish(selectedElements[1])) {
+    const attribute = selected.getAttribute('text-decoration') || '';
+    return attribute.includes(value);
+  }
+
+  return false;
+}
+
+/**
+ * Adds the given text decoration value
+ * @param value The text decoration value
+ * @returns {void}
+ */
+export const addTextDecorationMethod = function (value) {
+  const selectedElements = svgCanvas.getSelectedElements();
+  const selected = selectedElements[0];
+  if (!isNullish(selected) && selected.tagName === 'text' && isNullish(selectedElements[1])) {
+    const oldValue = selected.getAttribute('text-decoration') || '';
+    svgCanvas.changeSelectedAttribute('text-decoration', (oldValue + ' ' + value).trim())
+  }
+  if (selectedElements.length > 0 && !selectedElements[0].textContent) {
+    svgCanvas.textActions.setCursor()
+  }
+}
+
+/**
+ * Removes the given text decoration value
+ * @param value The text decoration value
+ * @returns {void}
+ */
+export const removeTextDecorationMethod = function (value) {
+  const selectedElements = svgCanvas.getSelectedElements();
+  const selected = selectedElements[0];
+  if (!isNullish(selected) && selected.tagName === 'text' && isNullish(selectedElements[1])) {
+    const actualValues = selected.getAttribute('text-decoration') || '';
+    svgCanvas.changeSelectedAttribute('text-decoration', actualValues.replace(value, '').trim())
+  }
+  if (selectedElements.length > 0 && !selectedElements[0].textContent) {
+    svgCanvas.textActions.setCursor()
+  }
+}
+
 /**
 * Check whether selected element is in italics or not.
 * @function module:svgcanvas.SvgCanvas#getItalic

src/svgcanvas/sanitize.js

@@ -56,7 +56,7 @@ const svgWhiteList_ = {
   svg: ['clip-path', 'clip-rule', 'enable-background', 'filter', 'height', 'mask', 'preserveAspectRatio', 'requiredFeatures', 'systemLanguage', 'version', 'viewBox', 'width', 'x', 'xmlns', 'xmlns:se', 'xmlns:xlink', 'xmlns:oi', 'oi:animations', 'y', 'stroke-linejoin', 'fill-rule', 'aria-label', 'stroke-width', 'fill-rule', 'xml:space'],
   switch: ['requiredFeatures', 'systemLanguage'],
   symbol: ['fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'opacity', 'overflow', 'preserveAspectRatio', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'systemLanguage', 'viewBox', 'width', 'height'],
-  text: ['clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'systemLanguage', 'text-anchor', 'x', 'xml:space', 'y'],
+  text: ['clip-path', 'clip-rule', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'mask', 'opacity', 'requiredFeatures', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'systemLanguage', 'text-anchor', 'text-decoration', 'x', 'xml:space', 'y'],
   textPath: ['method', 'requiredFeatures', 'spacing', 'startOffset', 'systemLanguage', 'xlink:href'],
   title: [],
   tspan: ['clip-path', 'clip-rule', 'dx', 'dy', 'fill', 'fill-opacity', 'fill-rule', 'filter', 'font-family', 'font-size', 'font-style', 'font-weight', 'mask', 'opacity', 'requiredFeatures', 'rotate', 'stroke', 'stroke-dasharray', 'stroke-dashoffset', 'stroke-linecap', 'stroke-linejoin', 'stroke-miterlimit', 'stroke-opacity', 'stroke-width', 'systemLanguage', 'text-anchor', 'textLength', 'x', 'xml:space', 'y'],

src/svgcanvas/svgcanvas.js

@@ -923,6 +923,9 @@ class SvgCanvas {
     this.setBold = elemGetSet.setBoldMethod // Make the selected element bold or normal.
     this.getItalic = elemGetSet.getItalicMethod // Check whether selected element is in italics or not.
     this.setItalic = elemGetSet.setItalicMethod // Make the selected element italic or normal.
+    this.hasTextDecoration = elemGetSet.hasTextDecorationMethod // Check whether the selected element has the given text decoration or not.
+    this.addTextDecoration = elemGetSet.addTextDecorationMethod // Adds the given value to the text decoration
+    this.removeTextDecoration = elemGetSet.removeTextDecorationMethod // Removes the given value from the text decoration
     this.setTextAnchor = elemGetSet.setTextAnchorMethod // Set the new text anchor.
     this.getFontFamily = elemGetSet.getFontFamilyMethod // The current font family
     this.setFontFamily = elemGetSet.setFontFamilyMethod // Set the new font family.