Merge pull request #663 from ONLYOFFICE/feature/bug-42912

Feature/bug 42912

apps/documenteditor/main/app/controller/Toolbar.js

@@ -260,6 +260,7 @@ define([
             toolbar.btnPaste.on('click',                                _.bind(this.onCopyPaste, this, false));
             toolbar.btnIncFontSize.on('click',                          _.bind(this.onIncrease, this));
             toolbar.btnDecFontSize.on('click',                          _.bind(this.onDecrease, this));
+            toolbar.mnuChangeCase.on('item:click',                      _.bind(this.onChangeCase, this));
             toolbar.btnBold.on('click',                                 _.bind(this.onBold, this));
             toolbar.btnItalic.on('click',                               _.bind(this.onItalic, this));
             toolbar.btnUnderline.on('click',                            _.bind(this.onUnderline, this));
@@ -1337,6 +1338,12 @@ define([
             }
         },
 
+        onChangeCase: function(menu, item, e) {
+            if (this.api)
+                this.api.asc_ChangeTextCase(item.value);
+            Common.NotificationCenter.trigger('edit:complete', this.toolbar);
+        },
+
         onSelectBullets: function(btn, picker, itemView, record) {
             var rawData = {},
                 isPickerSelect = _.isFunction(record.toJSON);

apps/documenteditor/main/app/template/Toolbar.template

@@ -35,6 +35,7 @@
                         <span class="btn-slot" id="slot-field-fontsize"></span>
                         <span class="btn-slot" id="slot-btn-incfont"></span>
                         <span class="btn-slot" id="slot-btn-decfont"></span>
+                        <span class="btn-slot split" id="slot-btn-changecase"></span>
                     </div>
                     <div class="elset font-attr">
                         <span class="btn-slot" id="slot-btn-bold"></span>

apps/documenteditor/main/app/view/Toolbar.js

@@ -290,6 +290,22 @@ define([
                     this.paragraphControls.push(this.btnParagraphColor);
                     this.textOnlyControls.push(this.btnParagraphColor);
 
+                    this.btnChangeCase = new Common.UI.Button({
+                        id: 'id-toolbar-btn-case',
+                        cls: 'btn-toolbar',
+                        iconCls: 'toolbar__icon btn-change-case',
+                        menu: new Common.UI.Menu({
+                            items: [
+                                {caption: this.mniSentenceCase, value: Asc.c_oAscChangeTextCaseType.SentenceCase},
+                                {caption: this.mniLowerCase, value: Asc.c_oAscChangeTextCaseType.LowerCase},
+                                {caption: this.mniUpperCase, value: Asc.c_oAscChangeTextCaseType.UpperCase},
+                                {caption: this.mniCapitalizeWords, value: Asc.c_oAscChangeTextCaseType.CapitalizeWords},
+                                {caption: this.mniToggleCase, value: Asc.c_oAscChangeTextCaseType.ToggleCase}
+                            ]
+                        })
+                    });
+                    this.paragraphControls.push(this.btnChangeCase);
+
                     this.btnAlignLeft = new Common.UI.Button({
                         id: 'id-toolbar-btn-align-left',
                         cls: 'btn-toolbar',
@@ -1095,6 +1111,7 @@ define([
                     this.mnuInsertImage = this.btnInsertImage.menu;
                     this.mnuPageSize = this.btnPageSize.menu;
                     this.mnuColorSchema = this.btnColorSchemas.menu;
+                    this.mnuChangeCase = this.btnChangeCase.menu;
 
                     this.cmbFontSize = new Common.UI.ComboBox({
                         cls: 'input-group-nr',
@@ -1347,6 +1364,7 @@ define([
                 _injectComponent('#slot-btn-subscript', this.btnSubscript);
                 _injectComponent('#slot-btn-highlight', this.btnHighlightColor);
                 _injectComponent('#slot-btn-fontcolor', this.btnFontColor);
+                _injectComponent('#slot-btn-changecase', this.btnChangeCase);
                 _injectComponent('#slot-btn-align-left', this.btnAlignLeft);
                 _injectComponent('#slot-btn-align-center', this.btnAlignCenter);
                 _injectComponent('#slot-btn-align-right', this.btnAlignRight);
@@ -1638,6 +1656,7 @@ define([
                 this.btnHighlightColor.updateHint(this.tipHighlightColor);
                 this.btnFontColor.updateHint(this.tipFontColor);
                 this.btnParagraphColor.updateHint(this.tipPrColor);
+                this.btnChangeCase.updateHint(this.tipChangeCase);
                 this.btnAlignLeft.updateHint(this.tipAlignLeft + Common.Utils.String.platformKey('Ctrl+L'));
                 this.btnAlignCenter.updateHint(this.tipAlignCenter + Common.Utils.String.platformKey('Ctrl+E'));
                 this.btnAlignRight.updateHint(this.tipAlignRight + Common.Utils.String.platformKey('Ctrl+R'));
@@ -2397,7 +2416,13 @@ define([
             textRestartEachSection: 'Restart Each Section',
             textSuppressForCurrentParagraph: 'Suppress for Current Paragraph',
             textCustomLineNumbers: 'Line Numbering Options',
-            tipLineNumbers: 'Show line numbers'
+            tipLineNumbers: 'Show line numbers',
+            tipChangeCase: 'Change case',
+            mniSentenceCase: 'Sentence case.',
+            mniLowerCase: 'lowercase',
+            mniUpperCase: 'UPPERCASE',
+            mniCapitalizeWords: 'Capitalize Each Word',
+            mniToggleCase: 'tOGGLE cASE'
         }
     })(), DE.Views.Toolbar || {}));
 });

apps/documenteditor/main/locale/en.json

@@ -2636,6 +2636,12 @@
   "DE.Views.Toolbar.txtScheme7": "Equity",
   "DE.Views.Toolbar.txtScheme8": "Flow",
   "DE.Views.Toolbar.txtScheme9": "Foundry",
+  "DE.Views.Toolbar.tipChangeCase:": "Change case",
+  "DE.Views.Toolbar.mniSentenceCase": "Sentence case.",
+  "DE.Views.Toolbar.mniLowerCase": "lowercase",
+  "DE.Views.Toolbar.mniUpperCase": "UPPERCASE",
+  "DE.Views.Toolbar.mniCapitalizeWords": "Capitalize Each Word",
+  "DE.Views.Toolbar.mniToggleCase": "tOGGLE cASE",
   "DE.Views.WatermarkSettingsDialog.textAuto": "Auto",
   "DE.Views.WatermarkSettingsDialog.textBold": "Bold",
   "DE.Views.WatermarkSettingsDialog.textColor": "Text color",

apps/documenteditor/main/resources/less/toolbar.less

@@ -217,7 +217,7 @@
 
 #slot-field-fontname {
     float: left;
-    width: 117px;
+    width: 84px;
 }
 
 #slot-field-fontsize {
@@ -226,7 +226,7 @@
     margin-left: 2px;
 }
 
-#slot-btn-incfont, #slot-btn-decfont {
+#slot-btn-incfont, #slot-btn-decfont, #slot-btn-changecase {
     margin-left: 2px;
 }