[PDF] Add changing mode button to toolbar

apps/common/main/lib/component/Button.js

@@ -196,7 +196,7 @@ define([
         '<i class="caret"></i>';
 
     var templateHugeCaption =
-            '<button type="button" class="btn <%= cls %>" id="<%= id %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>" <% if (dataHintTitle) { %> data-hint-title="<%= dataHintTitle %>" <% } %>> ' +
+            '<button type="button" class="btn <%= cls %>" id="<%= id %>" style="<%= style %>" data-hint="<%= dataHint %>" data-hint-direction="<%= dataHintDirection %>" data-hint-offset="<%= dataHintOffset %>" <% if (dataHintTitle) { %> data-hint-title="<%= dataHintTitle %>" <% } %>> ' +
                 '<div class="inner-box-icon">' +
                     templateBtnIcon +
                 '</div>' +

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

@@ -218,6 +218,10 @@ define([
             toolbar.btnAddComment.on('click', function (btn, e) {
                 Common.NotificationCenter.trigger('app:comment:add', 'toolbar');
             });
+            toolbar.btnEditMode.on('click', function (btn, e) {
+                Common.NotificationCenter.trigger('pdf:mode-apply', btn.pressed ? 'edit' : 'view');
+            });
+            Common.NotificationCenter.on('pdf:mode-changed', _.bind(this.changePDFMode, this));
             toolbar.btnStrikeout.on('click',                            _.bind(this.onBtnStrikeout, this));
             toolbar.mnuStrikeoutColorPicker.on('select',                _.bind(this.onSelectStrikeoutColor, this));
             toolbar.mnuStrikeoutTransparent.on('click',                 _.bind(this.onStrikeoutTransparentClick, this));
@@ -2221,6 +2225,10 @@ define([
             this._setMarkerColor('transparent', 'menu');
         },
 
+        changePDFMode: function(data) {
+            this.toolbar && this.toolbar.btnEditMode && this.toolbar.btnEditMode.toggle(!!this.mode.isPDFEdit, true);
+        },
+
         onPluginToolbarMenu: function(data) {
             this.toolbar && Array.prototype.push.apply(this.toolbar.lockControls, Common.UI.LayoutManager.addCustomItems(this.toolbar, data));
         },

apps/pdfeditor/main/app/template/Toolbar.template

@@ -34,6 +34,10 @@
                 </div>
             </div>
             <div class="separator long"></div>
+            <div class="group">
+                <span class="btn-slot text x-huge" id="slot-btn-tb-edit-mode"></span>
+            </div>
+            <div class="separator long"></div>
             <div class="group annotate">
                 <span class="btn-slot text x-huge" id="slot-btn-hand-tool"></span>
                 <span class="btn-slot text x-huge" id="slot-btn-select-tool"></span>
@@ -87,10 +91,6 @@
                     <span class="btn-slot text x-huge" id="slot-btn-form-save"></span>
                 </div>
                 <% } else { %>
-                <div class="group pdfedit">
-                    <span class="btn-slot text x-huge" id="slot-btn-edittext"></span>
-                </div>
-                <div class="separator long pdfedit"></div>
                 <div class="group small pdfedit">
                     <div class="elset" style="width:230px;">
                         <span class="btn-slot float-left" id="slot-field-fontname"></span>
@@ -127,6 +127,10 @@
                     </div>
                 </div>
                 <div class="separator long pdfedit"></div>
+                <div class="group pdfedit">
+                    <span class="btn-slot text x-huge" id="slot-btn-edittext"></span>
+                </div>
+                <div class="separator long pdfedit"></div>
                 <div class="group pdfedit">
                     <span class="btn-slot text x-huge slot-instext"></span>
                     <span class="btn-slot text x-huge slot-insertimg"></span>

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

@@ -143,7 +143,7 @@ define([
                     cls: 'btn-toolbar x-huge icon-top',
                     iconCls: 'toolbar__icon btn-edit-text',
                     lock: [_set.lostConnect, _set.disableOnStart],
-                    caption: this.capBtnEditText,
+                    caption: this.capBtnRecognize,
                     dataHint: '1',
                     dataHintDirection: 'bottom',
                     dataHintOffset: 'small'
@@ -862,6 +862,19 @@ define([
                             ]}
                     });
 
+                    this.btnEditMode = new Common.UI.Button({
+                        cls: 'btn-toolbar x-huge icon-top',
+                        iconCls: 'toolbar__icon btn-edit-text',
+                        style: 'min-width: 45px;',
+                        lock: [_set.lostConnect, _set.disableOnStart],
+                        caption: this.textEditMode,
+                        enableToggle: true,
+                        dataHint: '1',
+                        dataHintDirection: 'bottom',
+                        dataHintOffset: 'small'
+                    });
+                    this.toolbarControls.push(this.btnEditMode);
+
                     config.isPDFEdit && this.applyLayoutPDFEdit(config);
                 } else if ( config.isRestrictedEdit ) {
                     Common.UI.Mixtbar.prototype.initialize.call(this, {
@@ -1244,6 +1257,7 @@ define([
                 _injectComponent('#slot-btn-underline', this.btnUnderline);
                 _injectComponent('#slot-btn-highlight', this.btnHighlight);
                 _injectComponent('#slot-btn-text-comment', this.btnTextComment);
+                _injectComponent('#slot-btn-tb-edit-mode', this.btnEditMode);
                 // _injectComponent('#slot-btn-rotate', this.btnRotate);
             },
 
@@ -1435,6 +1449,7 @@ define([
                 this.btnHighlight.updateHint(this.textHighlight);
                 // this.btnTextComment.updateHint([this.tipInsertTextComment, this.tipInsertText]);
                 this.btnTextComment.updateHint(this.tipInsertTextComment);
+                this.btnEditMode.updateHint(this.tipEditMode);
                 // this.btnRotate.updateHint(this.tipRotate);
 
             },
@@ -1443,7 +1458,7 @@ define([
                 if (!this.mode.isPDFEdit) return;
 
                 this.updateMetricUnit();
-                this.btnEditText.updateHint(this.tipEditText);
+                this.btnEditText.updateHint(this.tipRecognize);
                 this.btnIncFontSize.updateHint(this.tipIncFont + Common.Utils.String.platformKey('Ctrl+]'));
                 this.btnDecFontSize.updateHint(this.tipDecFont + Common.Utils.String.platformKey('Ctrl+['));
                 this.btnBold.updateHint(this.textBold + Common.Utils.String.platformKey('Ctrl+B'));
@@ -1845,7 +1860,11 @@ define([
             capBtnTextCallout: 'Text Callout',
             tipInsertTextComment: 'Insert text comment',
             tipInsertTextCallout: 'Insert text callout',
-            tipInsertText: 'Insert text'
+            tipInsertText: 'Insert text',
+            textEditMode: 'Edit PDF',
+            tipEditMode: 'Add or edit text, shapes, images etc.',
+            capBtnRecognize: 'Recognize Page',
+            tipRecognize: 'Recognize page',
         }
     })(), PDFE.Views.Toolbar || {}));
 });

apps/pdfeditor/main/locale/en.json

@@ -1926,5 +1926,9 @@
   "PDFE.Views.ViewTab.tipFitToPage": "Fit to page",
   "PDFE.Views.ViewTab.tipFitToWidth": "Fit to width",
   "PDFE.Views.ViewTab.tipHeadings": "Headings",
-  "PDFE.Views.ViewTab.tipInterfaceTheme": "Interface theme"
+  "PDFE.Views.ViewTab.tipInterfaceTheme": "Interface theme",
+  "PDFE.Views.ViewTab.textEditMode": "Edit PDF",
+  "PDFE.Views.ViewTab.tipEditMode": "Add or edit text, shapes, images etc.",
+  "PDFE.Views.ViewTab.capBtnRecognize": "Recognize Page",
+  "PDFE.Views.ViewTab.tipRecognize": "Recognize page"
 }