Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[DE] Bug 36794 (Insert Page Number)

Browse source
This commit is contained in:
Julia Svinareva 2019-09-25 16:52:15 +03:00
parent f92ad5f015
commit a94086468e
2 changed files with 48 additions and 76 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

121
apps/documenteditor/main/app/view/InsertPageNumberDialog.js
View file

@ -44,7 +44,7 @@ define([
DE.Views.InsertPageNumberDialog = Common.UI.Window.extend(_.extend({ DE.Views.InsertPageNumberDialog = Common.UI.Window.extend(_.extend({
options: { options: {
width: 338, width: 330,
header: true, header: true,
style: 'min-width: 338px;', style: 'min-width: 338px;',
cls: 'modal-dlg', cls: 'modal-dlg',
@ -59,16 +59,23 @@ define([
this.template = [ this.template = [
'<div class="box" style="">', '<div class="box" style="">',
'<div style="display: inline-block; width: 130px; height: 205px; vertical-align: top;">', '<div style="display: inline-block; vertical-align: top; margin-bottom: 15px;">',
'<label style="margin-left: 6px; margin-bottom: 2px;">' + this.textAlignment + '</label>',
'<div id="insert-page-number-picker-position" class="menu-pageposition"></div>',
'<button id="insert-page-number-cur-pos" class="btn btn-text-default" style="margin-left: 6px; margin-top: 6px; width: 117px;">' + this.textToCurrentPosition + '</button>',
'</div>',
'<div style="display: inline-block; height: 205px; vertical-align: top; float: right;">',
'<label>' + this.textNumberingStyle + '</label>', '<label>' + this.textNumberingStyle + '</label>',
'<div id="insert-page-number-style-list" style="height: 150px; width: 150px; margin-top: 5px;"></div>', '<div id="insert-page-number-style-list" style="height: 162px; width: 150px; margin-top: 6px;"></div>',
'<div id="insert-page-number-checkbox" style="margin-top: 12px;"></div>',
'</div>', '</div>',
'<div style="display: inline-block; width: 131px; height: 184px; vertical-align: top; float: right; position: relative;">',
'<label style="margin-bottom: 5px;">' + this.textAlignment + '</label>',
'<div>',
'<div id="page-number-button-top-left" style="display: inline-block; margin: 0 10px 10px 0;"></div>',
'<div id="page-number-button-top-center" style="display: inline-block; margin: 0 10px 10px 0;"></div>',
'<div id="page-number-button-top-right" style="display: inline-block;"></div>',
'<div id="page-number-button-bottom-left" style="display: inline-block; margin: 0 10px 10px 0;"></div>',
'<div id="page-number-button-bottom-center" style="display: inline-block; margin: 0 10px 10px 0;"></div>',
'<div id="page-number-button-bottom-right" style="display: inline-block;"></div>',
'</div>',
'<button id="insert-page-number-cur-pos" class="btn btn-text-default" style="width: 131px;">' + this.textToCurrentPosition + '</button>',
'</div>',
'<div id="insert-page-number-checkbox" style=""></div>',
'</div>', '</div>',
].join(''); ].join('');
@ -80,62 +87,27 @@ define([
render: function() { render: function() {
Common.UI.Window.prototype.render.call(this); Common.UI.Window.prototype.render.call(this);
this.pageNumberPosPicker = new Common.UI.DataView({ var _arrPosition = [
el: $('#insert-page-number-picker-position'), [c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-tl', 'page-number-button-top-left', this.textTopLeft],
allowScrollbar: false, [c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-tc', 'page-number-button-top-center', this.textTopCenter],
store: new Common.UI.DataViewStore([ [c_pageNumPosition.PAGE_NUM_POSITION_TOP, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-tr', 'page-number-button-top-right', this.textTopRight],
{ [c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_LEFT, 'icon-right-panel btn-colontitul-bl', 'page-number-button-bottom-left', this.textBottomLeft],
offsety: 132, [c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_CENTER, 'icon-right-panel btn-colontitul-bc', 'page-number-button-bottom-center', this.textBottomCenter],
allowSelected: false, [c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM, c_pageNumPosition.PAGE_NUM_POSITION_RIGHT, 'icon-right-panel btn-colontitul-br', 'page-number-button-bottom-right', this.textBottomRight]
data: { ];
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP, this._btnsPosition = [];
subtype: c_pageNumPosition.PAGE_NUM_POSITION_LEFT _.each(_arrPosition, function(item, index, list){
} var _btn = new Common.UI.Button({
}, cls: 'btn-options huge',
{ iconCls: item[2],
offsety: 99, posWhere:item[0],
allowSelected: false, posAlign:item[1],
data: { hint: item[4]
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP, });
subtype: c_pageNumPosition.PAGE_NUM_POSITION_CENTER _btn.render( $('#'+item[3])) ;
} _btn.on('click', _.bind(this.onPageNumberPosClick, this));
}, this._btnsPosition.push( _btn );
{ }, this);
offsety: 66,
allowSelected: false,
data: {
type: c_pageNumPosition.PAGE_NUM_POSITION_TOP,
subtype: c_pageNumPosition.PAGE_NUM_POSITION_RIGHT
}
},
{
offsety: 33,
allowSelected: false,
data: {
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
subtype: c_pageNumPosition.PAGE_NUM_POSITION_LEFT
}
},
{
offsety: 0,
allowSelected: false,
data: {
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
subtype: c_pageNumPosition.PAGE_NUM_POSITION_CENTER
}
},
{
offsety: 165,
allowSelected: false,
data: {
type: c_pageNumPosition.PAGE_NUM_POSITION_BOTTOM,
subtype: c_pageNumPosition.PAGE_NUM_POSITION_RIGHT
}
}
]),
itemTemplate: _.template('<div id="<%= id %>" class="item-pagenumber" style="background-position: 0 -<%= offsety %>px"></div>')
});
this.pageNumberPosPicker.on('item:click', this.onPageNumberPosClick);
this.btnPageNumCurrentPos = new Common.UI.Button({ this.btnPageNumCurrentPos = new Common.UI.Button({
el: $('#insert-page-number-cur-pos') el: $('#insert-page-number-cur-pos')
@ -198,16 +170,13 @@ define([
return this; return this;
}, },
onPageNumberPosClick: function(picker, item, record) { onPageNumberPosClick: function(event) {
var type = record.get('data').type, event.$el.parent().parent().find('.active').removeClass('active');
subtype = record.get('data').subtype; event.$el.find('button').addClass('active');
item.$el.parent().find('.item-pagenumber.active').removeClass('active');
this.$el.parent().find('#insert-page-number-cur-pos').removeClass('active');
item.$el.find('.item-pagenumber').addClass('active');
}, },
onPageNumCurrentPosClick: function(event) { onPageNumCurrentPosClick: function(event) {
event.$el.parent().find('.item-pagenumber.active').removeClass('active'); event.$el.parent().find('.active').removeClass('active');
event.$el.toggleClass('active'); event.$el.toggleClass('active');
}, },
@ -222,6 +191,12 @@ define([
textPg1of10: 'Pg. 1 of 10', textPg1of10: 'Pg. 1 of 10',
text1pipePage: '1 | Page', text1pipePage: '1 | Page',
text1Pg: '1 pg.', text1Pg: '1 pg.',
textStartAt2Page: 'Start at 2 page' textStartAt2Page: 'Start at second page',
textTopLeft: 'Top Left',
textTopRight: 'Top Right',
textTopCenter: 'Top Center',
textBottomLeft: 'Bottom Left',
textBottomRight: 'Bottom Right',
textBottomCenter: 'Bottom Center'
}, DE.Views.InsertPageNumberDialog || {})) }, DE.Views.InsertPageNumberDialog || {}))
}); });

3
apps/documenteditor/main/resources/less/toolbar.less
View file

@ -120,9 +120,6 @@
.background-ximage('@{app-image-path}/toolbar/colontitules.png', '@{app-image-path}/toolbar/colontitules@2x.png', 33px); .background-ximage('@{app-image-path}/toolbar/colontitules.png', '@{app-image-path}/toolbar/colontitules@2x.png', 33px);
width: 33px; width: 33px;
height: 33px; height: 33px;
&.active {
.box-shadow(0 0 0 2px @primary-hover);
}
} }
} }