Enhancement: Add text anchor to texts

src/editor/index.html

@@ -309,6 +309,9 @@
         </div>
         <div id="text_panel">
           <div class="toolset">
+            <div class="tool_button" id="tool_text_anchor_start" title="Align the text in start"></div>
+            <div class="tool_button" id="tool_text_anchor_middle" title="Align the text in middle"></div>
+            <div class="tool_button" id="tool_text_anchor_end" title="Align the text in end"></div>
             <div class="tool_button" id="tool_bold" title="Bold Text [B]"><span></span>B</div>
             <div class="tool_button" id="tool_italic" title="Italic Text [I]"><span></span>i</div>
           </div>
@@ -729,4 +732,4 @@
   </div>
 </body>
 
-</html>
+</html>

src/editor/locale.js

@@ -288,6 +288,9 @@ export const readLang = function (langData) {
     tool_angle: properties.angle,
     tool_blur: properties.blur,
     tool_bold: properties.bold,
+    tool_text_anchor_start: properties.text_anchor_start,
+    tool_text_anchor_middle: properties.text_anchor_middle,
+    tool_text_anchor_end: properties.text_anchor_end,
     tool_circle: tools.mode_circle,
     tool_clone: tools.clone,
     tool_clone_multi: tools.clone,
@@ -303,6 +306,7 @@ export const readLang = function (langData) {
     tool_link_url: tools.set_link_url,
     tool_image: tools.mode_image,
     tool_italic: properties.italic,
+
     tool_line: tools.mode_line,
     tool_move_bottom: tools.move_bottom,
     tool_move_top: tools.move_top,

src/editor/locale/lang.af.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Lettertipe verander Familie',
     font_size: 'Verandering Lettertipe Grootte',
     bold: 'Vetgedrukte teks',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ar.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'تغيير الخط الأسرة',
     font_size: 'تغيير حجم الخط',
     bold: 'نص جريء',
-    italic: 'مائل نص'
+    italic: 'مائل نص',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.az.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Font Family',
     font_size: 'Change Font Size',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.be.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Змены Сямейства шрыфтоў',
     font_size: 'Змяніць памер шрыфта',
     bold: 'Тоўсты тэкст',
-    italic: 'Нахілены тэкст'
+    italic: 'Нахілены тэкст',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.bg.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Промяна на шрифта Семейство',
     font_size: 'Промени размера на буквите',
     bold: 'Получер текст',
-    italic: 'Курсив текст'
+    italic: 'Курсив текст',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ca.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Canviar la font Família',
     font_size: 'Change Font Size',
     bold: 'Text en negreta',
-    italic: 'Text en cursiva'
+    italic: 'Text en cursiva',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.cs.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Změnit font',
     font_size: 'Změnit velikost písma',
     bold: 'Tučně',
-    italic: 'Kurzíva'
+    italic: 'Kurzíva',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Hlavní menu',

src/editor/locale/lang.cy.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Newid Font Teulu',
     font_size: 'Newid Maint Ffont',
     bold: 'Testun Bras',
-    italic: 'Italig Testun'
+    italic: 'Italig Testun',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.da.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Skift Font Family',
     font_size: 'Skift skriftstørrelse',
     bold: 'Fed tekst',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.de.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Schriftart wählen',
     font_size: 'Schriftgröße einstellen',
     bold: 'Fetter Text',
-    italic: 'Kursiver Text'
+    italic: 'Kursiver Text',
+    text_anchor_start: 'Den Text linksbündig ausrichten',
+    text_anchor_middle: 'Den Text zentriert ausrichten',
+    text_anchor_end: 'Den Text rechtsbündig ausrichten'
   },
   tools: {
     main_menu: 'Hauptmenü',

src/editor/locale/lang.el.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Αλλαγή γραμματοσειράς Οικογένεια',
     font_size: 'Αλλαγή μεγέθους γραμματοσειράς',
     bold: 'Bold Text',
-    italic: 'Πλάγιους'
+    italic: 'Πλάγιους',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.en.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Font Family',
     font_size: 'Change Font Size',
     bold: 'Bold Text [B]',
-    italic: 'Italic Text [I]'
+    italic: 'Italic Text [I]',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.es.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Tipo de fuente',
     font_size: 'Tamaño de la fuente',
     bold: 'Texto en negrita',
-    italic: 'Texto en cursiva'
+    italic: 'Texto en cursiva',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menú principal',

src/editor/locale/lang.et.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Muutke Kirjasinperhe',
     font_size: 'Change font size',
     bold: 'Rasvane kiri',
-    italic: 'Kursiiv'
+    italic: 'Kursiiv',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.fa.js

@@ -70,7 +70,10 @@ export default {
     font_family: '‫تغییر خانواده قلم‬',
     font_size: '‫تغییر اندازه قلم‬',
     bold: '‫متن توپر ‬',
-    italic: '‫متن کج ‬'
+    italic: '‫متن کج ‬',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.fi.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Muuta Font Family',
     font_size: 'Muuta fontin kokoa',
     bold: 'Lihavoitu teksti',
-    italic: 'Kursivoitu'
+    italic: 'Kursivoitu',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.fr.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Changer la famille de police',
     font_size: 'Changer la taille de la police',
     bold: 'Texte en gras',
-    italic: 'Texte en italique'
+    italic: 'Texte en italique',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menu principal',

src/editor/locale/lang.fy.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Lettertype oanpasse',
     font_size: 'Lettergrutte oanpasse',
     bold: 'Fet',
-    italic: 'Skean'
+    italic: 'Skean',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ga.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Athraigh an Cló Teaghlaigh',
     font_size: 'Athraigh Clómhéid',
     bold: 'Trom Téacs',
-    italic: 'Iodálach Téacs'
+    italic: 'Iodálach Téacs',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.gl.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Cambiar fonte Familia',
     font_size: 'Mudar tamaño de letra',
     bold: 'Bold Text',
-    italic: 'Texto en cursiva'
+    italic: 'Texto en cursiva',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.he.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'שינוי גופן משפחה',
     font_size: 'שנה גודל גופן',
     bold: 'טקסט מודגש',
-    italic: 'טקסט נטוי'
+    italic: 'טקסט נטוי',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.hi.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'बदलें फ़ॉन्ट परिवार',
     font_size: 'फ़ॉन्ट का आकार बदलें',
     bold: 'मोटा पाठ',
-    italic: 'इटैलिक पाठ'
+    italic: 'इटैलिक पाठ',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.hr.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Promjena fontova',
     font_size: 'Change font size',
     bold: 'Podebljani tekst',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.hu.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Betűcsalád',
     font_size: 'Change font size',
     bold: 'Félkövér szöveg',
-    italic: 'Dőlt szöveg'
+    italic: 'Dőlt szöveg',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.hy.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Font Family',
     font_size: 'Change Font Size',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.id.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Ubah Font Keluarga',
     font_size: 'Ubah Ukuran Font',
     bold: 'Bold Teks',
-    italic: 'Italic Teks'
+    italic: 'Italic Teks',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.is.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Leturfjölskylda',
     font_size: 'Breyta leturstærð',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.it.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Cambia il tipo di Font',
     font_size: 'Modifica dimensione carattere',
     bold: 'Grassetto',
-    italic: 'Corsivo'
+    italic: 'Corsivo',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menù principale',

src/editor/locale/lang.ja.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'フォントファミリーの変更',
     font_size: '文字サイズの変更',
     bold: '太字',
-    italic: 'イタリック体'
+    italic: 'イタリック体',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ko.js

@@ -70,7 +70,10 @@ export default {
     font_family: '글꼴 변경 패밀리',
     font_size: '글꼴 크기 변경',
     bold: '굵은 텍스트',
-    italic: '기울임꼴 텍스트'
+    italic: '기울임꼴 텍스트',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.lt.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Pakeistišriftą Šeima',
     font_size: 'Change font size',
     bold: 'Pusjuodis',
-    italic: 'Kursyvas'
+    italic: 'Kursyvas',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.lv.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Mainīt fonta Family',
     font_size: 'Mainīt fonta izmēru',
     bold: 'Bold Text',
-    italic: 'Kursīvs'
+    italic: 'Kursīvs',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.mk.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Смени фонт Фамилија',
     font_size: 'Изменифонт Големина',
     bold: 'Задебелен текст',
-    italic: 'Italic текст'
+    italic: 'Italic текст',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ms.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Tukar Font Keluarga',
     font_size: 'Ubah Saiz Font',
     bold: 'Bold Teks',
-    italic: 'Italic Teks'
+    italic: 'Italic Teks',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.mt.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Bidla Font Familja',
     font_size: 'Change font size',
     bold: 'Bold Test',
-    italic: 'Test korsiv'
+    italic: 'Test korsiv',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.nl.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Verander lettertype',
     font_size: 'Verander lettertype grootte',
     bold: 'Vet',
-    italic: 'Cursief'
+    italic: 'Cursief',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Hoofdmenu',

src/editor/locale/lang.no.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Font Family',
     font_size: 'Endre skriftstørrelse',
     bold: 'Fet tekst',
-    italic: 'Kursiv tekst'
+    italic: 'Kursiv tekst',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.pl.js

@@ -71,7 +71,10 @@ export default {
     font_family: 'Zmień krój czcionki',
     font_size: 'Zmień rozmiar czcionki',
     bold: 'Pogrubienie textu',
-    italic: 'Kursywa'
+    italic: 'Kursywa',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menu główne',

src/editor/locale/lang.pt-BR.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Mudar o estilo da fonte',
     font_size: 'Mudar o tamanho da fonte',
     bold: 'Negrito',
-    italic: 'Italico'
+    italic: 'Italico',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menu Principal',

src/editor/locale/lang.pt-PT.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Alterar fonte Família',
     font_size: 'Alterar tamanho de letra',
     bold: 'Bold Text',
-    italic: 'Texto em itálico'
+    italic: 'Texto em itálico',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.ro.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Modificare familie de fonturi',
     font_size: 'Schimbă dimensiunea fontului',
     bold: 'Text Îngroşat',
-    italic: 'Text Înclinat'
+    italic: 'Text Înclinat',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Menu Principal',

src/editor/locale/lang.ru.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Изменить семейство шрифтов',
     font_size: 'Изменить размер шрифта',
     bold: 'Жирный',
-    italic: 'Курсив'
+    italic: 'Курсив',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Главное меню',

src/editor/locale/lang.sk.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Zmeniť font',
     font_size: 'Zmeniť veľkosť písma',
     bold: 'Tučné',
-    italic: 'Kurzíva'
+    italic: 'Kurzíva',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Hlavné menu',

src/editor/locale/lang.sl.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Spremeni tip pisave',
     font_size: 'Spremeni velikost pisave',
     bold: 'Krepko',
-    italic: 'Poševno'
+    italic: 'Poševno',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Glavni meni',

src/editor/locale/lang.sq.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Ndryshimi Font Family',
     font_size: 'Ndryshimi Font Size',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.sr.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Цханге фонт породицу',
     font_size: 'Цханге фонт сизе',
     bold: 'Подебљан текст',
-    italic: 'Италиц текст'
+    italic: 'Италиц текст',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.sv.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Ändra Typsnitt',
     font_size: 'Ändra textstorlek',
     bold: 'Fet text',
-    italic: 'Kursiv text'
+    italic: 'Kursiv text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.sw.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change font Family',
     font_size: 'Change font Size',
     bold: 'Bold Nakala',
-    italic: 'Italiki Nakala'
+    italic: 'Italiki Nakala',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.test.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Change Font Family',
     font_size: 'Change Font Size',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.th.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'ครอบครัว Change Font',
     font_size: 'เปลี่ยนขนาดตัวอักษร',
     bold: 'ข้อความตัวหนา',
-    italic: 'ข้อความตัวเอียง'
+    italic: 'ข้อความตัวเอียง',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.tl.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Baguhin ang Pamilya ng Font',
     font_size: 'Baguhin ang Laki ng Font',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.tr.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Font değiştir Aile',
     font_size: 'Change font size',
     bold: 'Kalın Yazı',
-    italic: 'Italik yazı'
+    italic: 'Italik yazı',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.uk.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Зміни Сімейство шрифтів',
     font_size: 'Змінити розмір шрифту',
     bold: 'Товстий текст',
-    italic: 'Похилий текст'
+    italic: 'Похилий текст',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.vi.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'Thay đổi Font Gia đình',
     font_size: 'Thay đổi cỡ chữ',
     bold: 'Bold Text',
-    italic: 'Italic Text'
+    italic: 'Italic Text',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.yi.js

@@ -70,7 +70,10 @@ export default {
     font_family: 'ענדערן פאָנט פאַמילי',
     font_size: 'בייטן פאָנט גרייס',
     bold: 'דרייסט טעקסט',
-    italic: 'יטאַליק טעקסט'
+    italic: 'יטאַליק טעקסט',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.zh-CN.js

@@ -70,7 +70,10 @@ export default {
     font_family: '更改字体样式',
     font_size: '更改字体大小',
     bold: '粗体',
-    italic: '斜体'
+    italic: '斜体',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: '主菜单',

src/editor/locale/lang.zh-HK.js

@@ -70,7 +70,10 @@ export default {
     font_family: '更改字体家族',
     font_size: '更改字体大小',
     bold: '粗体',
-    italic: '斜体文本'
+    italic: '斜体文本',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/locale/lang.zh-TW.js

@@ -70,7 +70,10 @@ export default {
     font_family: '更改字體',
     font_size: '更改字體大小',
     bold: '粗體',
-    italic: '斜體'
+    italic: '斜體',
+    text_anchor_start: 'Align the text in start',
+    text_anchor_middle: 'Align the text in middle',
+    text_anchor_end: 'Align the text in end'
   },
   tools: {
     main_menu: 'Main Menu',

src/editor/svgedit.js

@@ -1159,9 +1159,9 @@ editor.init = () => {
         '#tool_ungroup': 'ungroup',
         '#tool_unlink_use': 'unlink_use',
 
-        '#tool_alignleft, #tool_posleft': 'align_left',
-        '#tool_aligncenter, #tool_poscenter': 'align_center',
-        '#tool_alignright, #tool_posright': 'align_right',
+        '#tool_alignleft, #tool_posleft, #tool_text_anchor_start': 'align_left',
+        '#tool_aligncenter, #tool_poscenter, #tool_text_anchor_middle': 'align_center',
+        '#tool_alignright, #tool_posright, #tool_text_anchor_end': 'align_right',
         '#tool_aligntop, #tool_postop': 'align_top',
         '#tool_alignmiddle, #tool_posmiddle': 'align_middle',
         '#tool_alignbottom, #tool_posbottom': 'align_bottom',
@@ -2246,6 +2246,26 @@ editor.init = () => {
           } else {
             $('#tool_bold').removeClass('push_button_pressed').addClass('tool_button');
           }
+          const textAnchorStart = $('#tool_text_anchor_start');
+          const textAnchorMiddle = $('#tool_text_anchor_middle');
+          const textAnchorEnd = $('#tool_text_anchor_end');
+          switch (elem.getAttribute('text-anchor')) {
+          case 'start':
+            textAnchorStart.addClass('push_button_pressed').removeClass('tool_button');
+            textAnchorMiddle.removeClass('push_button_pressed').addClass('tool_button');
+            textAnchorEnd.removeClass('push_button_pressed').addClass('tool_button');
+            break;
+          case 'middle':
+            textAnchorStart.removeClass('push_button_pressed').addClass('tool_button');
+            textAnchorMiddle.addClass('push_button_pressed').removeClass('tool_button');
+            textAnchorEnd.removeClass('push_button_pressed').addClass('tool_button');
+            break;
+          case 'end':
+            textAnchorStart.removeClass('push_button_pressed').addClass('tool_button');
+            textAnchorMiddle.removeClass('push_button_pressed').addClass('tool_button');
+            textAnchorEnd.addClass('push_button_pressed').removeClass('tool_button');
+            break;
+          }
           $('#font_family').val(elem.getAttribute('font-family'));
           $('#font_size').val(elem.getAttribute('font-size'));
           $('#text').val(elem.textContent);
@@ -4258,6 +4278,16 @@ editor.init = () => {
     return false;
   };
 
+  /**
+   *
+   * @returns {false}
+   */
+  const clickTextAnchor = function (value) {
+    svgCanvas.setTextAnchor(value);
+    updateContextPanel();
+    return false;
+  };
+
   /**
   *
   * @returns {void}
@@ -5443,6 +5473,9 @@ editor.init = () => {
       // {sel: '#tools_ellipse_show', fn: clickEllipse, evt: 'click'},
       {sel: '#tool_bold', fn: clickBold, evt: 'mousedown'},
       {sel: '#tool_italic', fn: clickItalic, evt: 'mousedown'},
+      {sel: '#tool_text_anchor_start', fn () { clickTextAnchor('start'); }, evt: 'mousedown'},
+      {sel: '#tool_text_anchor_middle', fn () { clickTextAnchor('middle'); }, evt: 'mousedown'},
+      {sel: '#tool_text_anchor_end', fn () { clickTextAnchor('end'); }, evt: 'mousedown'},
       {sel: '#sidepanel_handle', fn: toggleSidePanel, key: ['X']},
       {sel: '#copy_save_done', fn: cancelOverlays, evt: 'click'},
 

src/svgcanvas/elem-get-set.js

@@ -606,6 +606,25 @@ isNullish(selectedElements[1])) {
     elemContext_.getCanvas().textActions.setCursor();
   }
 };
+
+/**
+ * Set the new text anchor
+ * @function module:svgcanvas.SvgCanvas#setTextAnchor
+ * @param {string} value - The text anchor value (start, middle or end)
+ * @returns {void}
+ */
+export const setTextAnchorMethod = function (value) {
+  const selectedElements = elemContext_.getSelectedElements();
+  const selected = selectedElements[0];
+  if (!isNullish(selected) && selected.tagName === 'text' &&
+      isNullish(selectedElements[1])) {
+    elemContext_.getCanvas().changeSelectedAttribute('text-anchor', value);
+  }
+  if (!selectedElements[0].textContent) {
+    elemContext_.getCanvas().textActions.setCursor();
+  }
+};
+
 /**
 * @function module:svgcanvas.SvgCanvas#getFontFamily
 * @returns {string} The current font family

src/svgcanvas/svgcanvas.js

@@ -57,7 +57,7 @@ import {
   setDocumentTitleMethod, setResolutionMethod, getEditorNSMethod, setBBoxZoomMethod,
   setZoomMethod, setColorMethod, setGradientMethod, findDuplicateGradient, setPaintMethod,
   setStrokeWidthMethod, setStrokeAttrMethod, getBoldMethod, setBoldMethod, getItalicMethod,
-  setItalicMethod, getFontFamilyMethod, setFontFamilyMethod, setFontColorMethod, getFontColorMethod,
+  setItalicMethod, setTextAnchorMethod, getFontFamilyMethod, setFontFamilyMethod, setFontColorMethod, getFontColorMethod,
   getFontSizeMethod, setFontSizeMethod, getTextMethod, setTextContentMethod,
   setImageURLMethod, setLinkURLMethod, setRectRadiusMethod, makeHyperlinkMethod,
   removeHyperlinkMethod, setSegTypeMethod, setBackgroundMethod
@@ -2215,6 +2215,14 @@ class SvgCanvas {
 */
     this.setItalic = setItalicMethod;
 
+    /**
+* Set the new text anchor.
+* @function module:svgcanvas.SvgCanvas#setTextAnchor
+* @param {string} textAnchor - The value of the text anchor (start, middle or end)
+* @returns {void}
+*/
+    this.setTextAnchor = setTextAnchorMethod;
+
     /**
 * @function module:svgcanvas.SvgCanvas#getFontFamily
 * @returns {string} The current font family