diff --git a/apps/common/main/lib/component/InputField.js b/apps/common/main/lib/component/InputField.js
index 9d3d138c37..63c03ce784 100644
--- a/apps/common/main/lib/component/InputField.js
+++ b/apps/common/main/lib/component/InputField.js
@@ -155,7 +155,7 @@ define([
if (!me.rendered) {
var el = this.cmpEl;
- this._input = this.cmpEl.find('input').addBack().filter('input');
+ this._input = this.cmpEl.find('input').addBack().filter('input').first();
if (this.editable) {
this._input.on('blur', _.bind(this.onInputChanged, this));
@@ -290,9 +290,11 @@ define([
disabled = !!disabled;
this.disabled = disabled;
$(this.el).toggleClass('disabled', disabled);
- disabled
- ? this._input.attr('disabled', true)
- : this._input.removeAttr('disabled');
+ if (this.rendered) {
+ disabled
+ ? this._input.attr('disabled', true)
+ : this._input.removeAttr('disabled');
+ }
},
isDisabled: function() {
@@ -730,4 +732,82 @@ define([
textDate: 'Select date'
}
})());
+
+ Common.UI.InputFieldFixed = Common.UI.InputField.extend((function() {
+ return {
+ options : {
+ id : null,
+ cls : '',
+ style : '',
+ value : '',
+ fixedValue : '',
+ type : 'text',
+ name : '',
+ validation : null,
+ allowBlank : true,
+ placeHolder : '',
+ blankError : null,
+ spellcheck : false,
+ maskExp : '',
+ validateOnChange: false,
+ validateOnBlur: true,
+ disabled: false,
+ editable: true,
+ btnHint: ''
+ },
+
+ template: _.template([
+ '',
+ ' ',
+ 'name="<%= name %>" ',
+ 'spellcheck="<%= spellcheck %>" ',
+ 'class="form-control <%= cls %>" ',
+ 'placeholder="<%= placeHolder %>" ',
+ 'value="<%= value %>"',
+ 'data-hint="<%= dataHint %>"',
+ 'data-hint-offset="<%= dataHintOffset %>"',
+ 'data-hint-direction="<%= dataHintDirection %>"',
+ '>',
+ '',
+ '' +
+ '
'
+ ].join('')),
+
+ initialize : function(options) {
+ this.fixedValue = options.fixedValue;
+
+ Common.UI.InputField.prototype.initialize.call(this, options);
+ },
+
+ render : function(parentEl) {
+ Common.UI.InputField.prototype.render.call(this, parentEl);
+
+ if (this.fixedValue)
+ this.setFixedValue(this.fixedValue);
+
+ return this;
+ },
+
+ setFixedValue: function(value) {
+ this.fixedValue = value;
+
+ if (this.rendered){
+ this.cmpEl.find('input.fixed-text').addBack().filter('input.fixed-text').val(value);
+ }
+ },
+
+ setDisabled: function(disabled) {
+ disabled = !!disabled;
+ this.disabled = disabled;
+ $(this.el).toggleClass('disabled', disabled);
+ if (this.rendered) {
+ var inputs = this.cmpEl.find('input').addBack().filter('input')
+ disabled
+ ? inputs.attr('disabled', true)
+ : inputs.removeAttr('disabled');
+ }
+ },
+ }
+ })());
});
\ No newline at end of file
diff --git a/apps/common/main/resources/less/input.less b/apps/common/main/resources/less/input.less
index d2c8f85a16..add44bec33 100644
--- a/apps/common/main/resources/less/input.less
+++ b/apps/common/main/resources/less/input.less
@@ -168,4 +168,42 @@ textarea.form-control:focus {
input {
.padding-x(3px, 20px);
}
+}
+
+.input-field-fixed {
+ position: relative;
+
+ input:not(.fixed-text) {
+ .text-align-right();
+ padding-right: 50%;
+ padding-right: calc(50% + 4px);
+ .rtl & {
+ padding-left: 50%;
+ padding-right: 0;
+ }
+ }
+
+ .fixed-text {
+ position: absolute;
+ right: 0;
+ top: 0;
+ width: 50%;
+ width: calc(50% + 4px);
+ border-color: transparent;
+ background: transparent;
+ .text-align-left();
+ .font-size-normal();
+ padding-left: 2px;
+ padding-right: 2px;
+ cursor: default;
+
+ .rtl & {
+ right: unset;
+ left: 0;
+ }
+ }
+ &.disabled .fixed-text {
+ opacity: @component-disabled-opacity-ie;
+ opacity: @component-disabled-opacity;
+ }
}
\ No newline at end of file
diff --git a/apps/pdfeditor/main/app/controller/Toolbar.js b/apps/pdfeditor/main/app/controller/Toolbar.js
index 4fd452e2a2..e42826dc29 100644
--- a/apps/pdfeditor/main/app/controller/Toolbar.js
+++ b/apps/pdfeditor/main/app/controller/Toolbar.js
@@ -66,7 +66,8 @@ define([
can_copycut: undefined,
clrstrike: undefined,
clrunderline: undefined,
- clrhighlight: undefined
+ clrhighlight: undefined,
+ pageCount: 1
};
this.editMode = true;
this.binding = {};
@@ -160,7 +161,7 @@ define([
/**
* UI Events
*/
-
+ var me = this;
toolbar.btnPrint.on('click', _.bind(this.onPrint, this));
toolbar.btnPrint.on('disabled', _.bind(this.onBtnChangeState, this, 'print:disabled'));
toolbar.btnSave.on('click', _.bind(this.onSave, this));
@@ -188,6 +189,15 @@ define([
toolbar.mnuHighlightTransparent.on('click', _.bind(this.onHighlightTransparentClick, this));
toolbar.btnHideComments.on('click', _.bind(this.onHideCommentsClick, this));
toolbar.btnRotate.on('click', _.bind(this.onRotateClick, this));
+ toolbar.fieldPages.on('changed:after', _.bind(this.onPagesChanged, this));
+ toolbar.fieldPages.on('inputleave', function(){ Common.NotificationCenter.trigger('edit:complete', me.toolbar);});
+ toolbar.fieldPages.cmpEl && toolbar.fieldPages.cmpEl.on('focus', 'input.form-control', function() {
+ setTimeout(function(){toolbar.fieldPages._input && toolbar.fieldPages._input.select();}, 1);
+ });
+ toolbar.btnFirstPage.on('click', _.bind(this.onGotoPage, this, 'first'));
+ toolbar.btnLastPage.on('click', _.bind(this.onGotoPage, this, 'last'));
+ toolbar.btnPrevPage.on('click', _.bind(this.onGotoPage, this, 'prev'));
+ toolbar.btnNextPage.on('click', _.bind(this.onGotoPage, this, 'next'));
this.onBtnChangeState('undo:disabled', toolbar.btnUndo, toolbar.btnUndo.isDisabled());
this.onBtnChangeState('redo:disabled', toolbar.btnRedo, toolbar.btnRedo.isDisabled());
@@ -208,6 +218,8 @@ define([
this.api.asc_registerCallback('asc_onCanCopyCut', _.bind(this.onApiCanCopyCut, this));
this.api.asc_registerCallback('asc_onContextMenu', _.bind(this.onContextMenu, this));
}
+ this.api.asc_registerCallback('asc_onCountPages', _.bind(this.onCountPages, this));
+ this.api.asc_registerCallback('asc_onCurrentPage', _.bind(this.onCurrentPage, this));
},
onChangeCompactView: function(view, compact) {
@@ -232,6 +244,33 @@ define([
this.toolbar.collapse();
},
+ onCountPages: function(count) {
+ this._state.pageCount = count;
+ this.toolbar && this.toolbar.fieldPages && this.toolbar.fieldPages.setFixedValue('/ ' + count);
+ },
+
+ onCurrentPage: function(value) {
+ this.toolbar && this.toolbar.fieldPages && this.toolbar.fieldPages.setValue(value + 1);
+ },
+
+ onPagesChanged: function() {
+ var value = parseInt(this.toolbar.fieldPages.getValue());
+ if (value>this._state.pageCount)
+ value = this._state.pageCount;
+ this.api && this.api.goToPage(value-1);
+ },
+
+ onGotoPage: function (type, btn, e) {
+ if (!this.api) return;
+
+ if (type==='first')
+ this.api.goToPage(0);
+ else if (type==='last')
+ this.api.goToPage(this._state.pageCount-1);
+ else
+ this.api.goToPage(this.api.getCurrentPage() + (type==='next' ? 1 : -1));
+ },
+
onApiCanRevert: function(which, can) {
if (which=='undo') {
if (this._state.can_undo !== can) {
diff --git a/apps/pdfeditor/main/app/template/Toolbar.template b/apps/pdfeditor/main/app/template/Toolbar.template
index 66d8c8eec9..6da2340a99 100644
--- a/apps/pdfeditor/main/app/template/Toolbar.template
+++ b/apps/pdfeditor/main/app/template/Toolbar.template
@@ -42,6 +42,18 @@
+
+
diff --git a/apps/pdfeditor/main/app/view/Toolbar.js b/apps/pdfeditor/main/app/view/Toolbar.js
index 1583b6a067..34ce222cdc 100644
--- a/apps/pdfeditor/main/app/view/Toolbar.js
+++ b/apps/pdfeditor/main/app/view/Toolbar.js
@@ -352,7 +352,68 @@ define([
});
this.paragraphControls.push(this.btnHighlight);
+ this.fieldPages = new Common.UI.InputFieldFixed({
+ id: 'id-toolbar-txt-pages',
+ style : 'width: 100%;',
+ maskExp : /[0-9]/,
+ allowBlank : true,
+ validateOnChange: false,
+ fixedValue: '/ 1',
+ value: 1,
+ lock: [_set.disableOnStart],
+ validation : function(value) {
+ if (/(^[0-9]+$)/.test(value)) {
+ value = parseInt(value);
+ if (value===undefined || value===null || value<1)
+ me.fieldPages.setValue(me.api.getCurrentPage()+1);
+ } else
+ me.fieldPages.setValue(me.api.getCurrentPage()+1);
+
+ return true;
+ }
+ });
+ this.toolbarControls.push(this.fieldPages);
+
+ this.btnFirstPage = new Common.UI.Button({
+ id : 'id-toolbar-btn-first-page',
+ cls : 'btn-toolbar',
+ iconCls : 'toolbar__icon btn-first-page',
+ lock: [_set.disableOnStart],
+ dataHint : '1',
+ dataHintDirection: 'bottom'
+ });
+ this.toolbarControls.push(this.btnFirstPage);
+
+ this.btnLastPage = new Common.UI.Button({
+ id : 'id-toolbar-btn-last-page',
+ cls : 'btn-toolbar',
+ iconCls : 'toolbar__icon btn-last-page',
+ lock: [_set.disableOnStart],
+ dataHint : '1',
+ dataHintDirection: 'bottom'
+ });
+ this.toolbarControls.push(this.btnLastPage);
+
+ this.btnPrevPage = new Common.UI.Button({
+ id : 'id-toolbar-btn-prev-page',
+ cls : 'btn-toolbar',
+ iconCls : 'toolbar__icon btn-prev-page',
+ lock: [_set.disableOnStart],
+ dataHint : '1',
+ dataHintDirection: 'bottom'
+ });
+ this.toolbarControls.push(this.btnPrevPage);
//
+ this.btnNextPage = new Common.UI.Button({
+ id : 'id-toolbar-btn-next-page',
+ cls : 'btn-toolbar',
+ iconCls : 'toolbar__icon btn-next-page',
+ lock: [_set.disableOnStart],
+ dataHint : '1',
+ dataHintDirection: 'bottom'
+ });
+ this.toolbarControls.push(this.btnNextPage);
+
// Menus
//
@@ -456,6 +517,11 @@ define([
_injectComponent('#slot-btn-highlight', this.btnHighlight);
_injectComponent('#slot-btn-hide-comments', this.btnHideComments);
_injectComponent('#slot-btn-rotate', this.btnRotate);
+ _injectComponent('#slot-btn-pages', this.fieldPages);
+ _injectComponent('#slot-btn-first-page', this.btnFirstPage);
+ _injectComponent('#slot-btn-last-page', this.btnLastPage);
+ _injectComponent('#slot-btn-prev-page', this.btnPrevPage);
+ _injectComponent('#slot-btn-next-page', this.btnNextPage);
this.btnPrint.menu && this.btnPrint.$el.addClass('split');
return $host;
@@ -575,6 +641,10 @@ define([
this.btnHighlight.updateHint(this.textHighlight);
this.btnHideComments.updateHint(this.tipHideComments);
this.btnRotate.updateHint(this.tipRotate);
+ this.btnFirstPage.updateHint(this.tipFirstPage);
+ this.btnLastPage.updateHint(this.tipLastPage);
+ this.btnPrevPage.updateHint(this.tipPrevPage);
+ this.btnNextPage.updateHint(this.tipNextPage);
},
onToolbarAfterRender: function(toolbar) {
@@ -744,7 +814,11 @@ define([
capBtnHideComments: 'Hide Comments',
tipHideComments: 'Hide comments',
capBtnRotate: 'Rotate',
- tipRotate: 'Rotate pages'
+ tipRotate: 'Rotate pages',
+ tipFirstPage: 'Go to the first page',
+ tipLastPage: 'Go to the last page',
+ tipPrevPage: 'Go to the previous page',
+ tipNextPage: 'Go to the next page'
}
})(), PDFE.Views.Toolbar || {}));
});