[PE] Bug 46920: Add change case button

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

@@ -279,6 +279,7 @@ define([
             toolbar.btnVerticalAlign.menu.on('item:click',              _.bind(this.onMenuVerticalAlignSelect, this));
             toolbar.btnDecLeftOffset.on('click',                        _.bind(this.onDecOffset, this));
             toolbar.btnIncLeftOffset.on('click',                        _.bind(this.onIncOffset, this));
+            toolbar.mnuChangeCase.on('item:click',                      _.bind(this.onChangeCase, this));
             toolbar.btnMarkers.on('click',                              _.bind(this.onMarkers, this));
             toolbar.btnNumbers.on('click',                              _.bind(this.onNumbers, this));
             toolbar.mnuMarkerSettings.on('click',                         _.bind(this.onMarkerSettingsClick, this, 0));
@@ -1106,6 +1107,12 @@ define([
             Common.component.Analytics.trackEvent('ToolBar', 'Indent');
         },
 
+        onChangeCase: function(menu, item, e) {
+            if (this.api)
+                this.api.asc_ChangeTextCase(item.value);
+            Common.NotificationCenter.trigger('edit:complete', this.toolbar);
+        },
+        
         onMenuHorizontalAlignSelect: function(menu, item) {
             this._state.pralign = undefined;
             var btnHorizontalAlign = this.toolbar.btnHorizontalAlign;

apps/presentationeditor/main/app/template/Toolbar.template

@@ -43,11 +43,12 @@
                 </div>
                 <div class="separator long"></div>
                 <div class="group">
-                    <div class="elset" style="width:175px;">
+                    <div class="elset" style="width:208px;">
                         <span class="btn-slot" style="float: left; width: 89px;" id="slot-field-fontname"></span>
                         <span class="btn-slot" style="float: left; width: 40px; margin-left: 2px;" 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/presentationeditor/main/app/view/Toolbar.js

@@ -350,6 +350,24 @@ define([
                     });
                     me.paragraphControls.push(me.btnFontColor);
 
+                    me.btnChangeCase = new Common.UI.Button({
+                        id: 'id-toolbar-btn-case',
+                        cls: 'btn-toolbar',
+                        iconCls: 'toolbar__icon btn-change-case',
+                        lock: [_set.slideDeleted, _set.paragraphLock, _set.lostConnect, _set.noSlides, _set.noTextSelected, _set.shapeLock],
+                        menu: new Common.UI.Menu({
+                            items: [
+                                {caption: me.mniSentenceCase, value: Asc.c_oAscChangeTextCaseType.SentenceCase},
+                                {caption: me.mniLowerCase, value: Asc.c_oAscChangeTextCaseType.LowerCase},
+                                {caption: me.mniUpperCase, value: Asc.c_oAscChangeTextCaseType.UpperCase},
+                                {caption: me.mniCapitalizeWords, value: Asc.c_oAscChangeTextCaseType.CapitalizeWords},
+                                {caption: me.mniToggleCase, value: Asc.c_oAscChangeTextCaseType.ToggleCase}
+                            ]
+                        })
+                    });
+                    me.paragraphControls.push(me.btnChangeCase);
+                    me.mnuChangeCase = me.btnChangeCase.menu;
+
                     me.btnClearStyle = new Common.UI.Button({
                         id: 'id-toolbar-btn-clearstyle',
                         cls: 'btn-toolbar',
@@ -907,7 +925,7 @@ define([
 
                     this.lockControls = [this.btnChangeSlide, this.btnSave,
                         this.btnCopy, this.btnPaste, this.btnUndo, this.btnRedo, this.cmbFontName, this.cmbFontSize, this.btnIncFontSize, this.btnDecFontSize,
-                        this.btnBold, this.btnItalic, this.btnUnderline, this.btnStrikeout, this.btnSuperscript,
+                        this.btnBold, this.btnItalic, this.btnUnderline, this.btnStrikeout, this.btnSuperscript, this.btnChangeCase,
                         this.btnSubscript, this.btnFontColor, this.btnClearStyle, this.btnCopyStyle, this.btnMarkers,
                         this.btnNumbers, this.btnDecLeftOffset, this.btnIncLeftOffset, this.btnLineSpace, this.btnHorizontalAlign, this.btnColumns,
                         this.btnVerticalAlign, this.btnShapeArrange, this.btnShapeAlign, this.btnInsertTable, this.btnInsertChart,
@@ -1019,6 +1037,7 @@ define([
                 _injectComponent('#slot-btn-incfont', this.btnIncFontSize);
                 _injectComponent('#slot-btn-decfont', this.btnDecFontSize);
                 _injectComponent('#slot-btn-fontcolor', this.btnFontColor);
+                _injectComponent('#slot-btn-changecase', this.btnChangeCase);
                 _injectComponent('#slot-btn-clearstyle', this.btnClearStyle);
                 _injectComponent('#slot-btn-copystyle', this.btnCopyStyle);
                 _injectComponent('#slot-btn-markers', this.btnMarkers);
@@ -1140,6 +1159,7 @@ define([
                 this.btnSuperscript.updateHint(this.textSuperscript);
                 this.btnSubscript.updateHint(this.textSubscript);
                 this.btnFontColor.updateHint(this.tipFontColor);
+                this.btnChangeCase.updateHint(this.tipChangeCase);
                 this.btnClearStyle.updateHint(this.tipClearStyle);
                 this.btnCopyStyle.updateHint(this.tipCopyStyle + Common.Utils.String.platformKey('Ctrl+Shift+C'));
                 this.btnMarkers.updateHint(this.tipMarkers);
@@ -1749,7 +1769,13 @@ define([
             textColumnsOne: 'One Column',
             textColumnsTwo: 'Two Columns',
             textColumnsThree: 'Three Columns',
-            textColumnsCustom: 'Custom Columns'
+            textColumnsCustom: 'Custom Columns',
+            tipChangeCase: 'Change case',
+            mniSentenceCase: 'Sentence case.',
+            mniLowerCase: 'lowercase',
+            mniUpperCase: 'UPPERCASE',
+            mniCapitalizeWords: 'Capitalize Each Word',
+            mniToggleCase: 'tOGGLE cASE'
         }
     }()), PE.Views.Toolbar || {}));
 });

apps/presentationeditor/main/locale/en.json

@@ -1842,6 +1842,11 @@
   "PE.Views.Toolbar.mniSlideAdvanced": "Advanced Settings",
   "PE.Views.Toolbar.mniSlideStandard": "Standard (4:3)",
   "PE.Views.Toolbar.mniSlideWide": "Widescreen (16:9)",
+  "PE.Views.Toolbar.mniCapitalizeWords": "Capitalize Each Word",
+  "PE.Views.Toolbar.mniLowerCase": "lowercase",
+  "PE.Views.Toolbar.mniSentenceCase": "Sentence case.",
+  "PE.Views.Toolbar.mniToggleCase": "tOGGLE cASE",
+  "PE.Views.Toolbar.mniUpperCase": "UPPERCASE",
   "PE.Views.Toolbar.textAlignBottom": "Align text to the bottom",
   "PE.Views.Toolbar.textAlignCenter": "Center text",
   "PE.Views.Toolbar.textAlignJust": "Justify",
@@ -1883,6 +1888,7 @@
   "PE.Views.Toolbar.textUnderline": "Underline",
   "PE.Views.Toolbar.tipAddSlide": "Add slide",
   "PE.Views.Toolbar.tipBack": "Back",
+  "PE.Views.Toolbar.tipChangeCase:": "Change case",
   "PE.Views.Toolbar.tipChangeChart": "Change chart type",
   "PE.Views.Toolbar.tipChangeSlide": "Change slide layout",
   "PE.Views.Toolbar.tipClearStyle": "Clear style",

apps/presentationeditor/main/resources/less/toolbar.less

@@ -142,6 +142,6 @@
     background-size: cover
 }
 
-#slot-btn-incfont, #slot-btn-decfont {
+#slot-btn-incfont, #slot-btn-decfont, #slot-btn-changecase {
     margin-left: 2px;
 }