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

[DE] added buttons on toolbar

Browse source
This commit is contained in:
Maxim Kadushkin 2017-03-29 19:24:20 +03:00
parent 344b669103
commit 2352646ec7
6 changed files with 133 additions and 21 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
apps/common/main/lib/view/ReviewChanges.js
View file

@ -413,17 +413,20 @@ define([
var template = var template =
'<section id="review-changes-panel" class="panel" data-tab="review">' + '<section id="review-changes-panel" class="panel" data-tab="review">' +
'<div class="group">' + '<div class="group">' +
'<span id="btn-review-on"></span>' + '<span id="slot-set-lang" class="btn-slot text x-huge"></span>' +
'<span id="slot-btn-spelling" class="btn-slot text x-huge"></span>' +
'</div>' + '</div>' +
'<div class="separator long"/>' + '<div class="separator long"/>' +
'<div class="group">' + '<div class="group">' +
'<span id="btn-change-prev"></span>' + '<span class="btn-slot text x-huge slot-comment"></span>' +
'<span id="btn-change-next"></span>' +
'</div>' + '</div>' +
'<div class="separator long"/>' + '<div class="separator long"/>' +
'<div class="group">' + '<div class="group">' +
'<span id="btn-change-accept"></span>' + '<span id="btn-review-on" class="btn-slot text x-huge"></span>' +
'<span id="btn-change-reject"></span>' + '<span id="btn-change-prev" class="btn-slot text x-huge"></span>' +
'<span id="btn-change-next" class="btn-slot text x-huge"></span>' +
'<span id="btn-change-accept" class="btn-slot text x-huge"></span>' +
'<span id="btn-change-reject" class="btn-slot text x-huge"></span>' +
'</div>' + '</div>' +
'</section>'; '</section>';

31
apps/documenteditor/main/app/controller/Toolbar.js
View file

@ -185,6 +185,37 @@ define([
var $panel = DE.getController('Common.Controllers.ReviewChanges').createToolbarPanel(); var $panel = DE.getController('Common.Controllers.ReviewChanges').createToolbarPanel();
if ( $panel ) { if ( $panel ) {
var button = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-ic-docspell',
caption: 'Spell checking',
enableToggle: true
}).render($panel.find('#slot-btn-spelling'));
button.on('click', function (e) {
console.log('spell checking button');
});
button = new Common.UI.Button({
cls: 'btn-toolbar x-huge icon-top',
iconCls: 'btn-ic-doclang',
caption: 'Language',
menu: new Common.UI.Menu({
items: [
{
caption: 'Content\'s language',
value: 'current'
}, {
caption: 'Document\'s language',
value: 'all'
}
]
})
}).render($panel.find('#slot-set-lang'));
button.on('click', function (e) {
console.log('lang button');
});
me.toolbar.addTab(tab, $panel, 3); me.toolbar.addTab(tab, $panel, 3);
} }
} }

34
apps/documenteditor/main/app/template/Toolbar.template
View file

@ -127,7 +127,6 @@
<span class="btn-slot text" id="slot-btn-editheader"></span> <span class="btn-slot text" id="slot-btn-editheader"></span>
</div> </div>
</div> </div>
<div class="separator long"></div>
<div class="group"> <div class="group">
<div class="elset"> <div class="elset">
<span class="btn-slot text" id="slot-btn-insimage"></span> <span class="btn-slot text" id="slot-btn-insimage"></span>
@ -152,7 +151,6 @@
<span class="btn-slot text" id="slot-btn-insshape"></span> <span class="btn-slot text" id="slot-btn-insshape"></span>
</div> </div>
</div> </div>
<div class="separator long"></div>
<div class="group"> <div class="group">
<div class="elset"> <div class="elset">
<span class="btn-slot text" id="slot-btn-dropcap"></span> <span class="btn-slot text" id="slot-btn-dropcap"></span>
@ -166,6 +164,7 @@
<span class="btn-slot text" id="slot-btn-notes"></span> <span class="btn-slot text" id="slot-btn-notes"></span>
</div> </div>
<div class="elset"> <div class="elset">
<span class="btn-slot text slot-comment"></span>
</div> </div>
</div> </div>
</section> </section>
@ -186,6 +185,37 @@
<span class="btn-slot text" id="slot-btn-columns"></span> <span class="btn-slot text" id="slot-btn-columns"></span>
</div> </div>
</div> </div>
<div class="group">
<div class="elset">
<span class="btn-slot text slot-break"></span>
</div>
<div class="elset">
</div>
</div>
<div class="separator long"></div>
<div class="group">
<div class="elset">
<span class="btn-slot text" id="slot-img-align"></span>
</div>
<div class="elset">
<span class="btn-slot text" id="slot-img-group"></span>
</div>
</div>
<div class="group">
<div class="elset">
<span class="btn-slot text" id="slot-img-movefrwd"></span>
</div>
<div class="elset">
<span class="btn-slot text" id="slot-img-movebkwd"></span>
</div>
</div>
<div class="group">
<div class="elset">
<span class="btn-slot text" id="slot-img-wrapping"></span>
</div>
<div class="elset">
</div>
</div>
</section> </section>
</section> </section>
</section> </section>

65
apps/documenteditor/main/app/view/Toolbar.js
View file

@ -1100,6 +1100,40 @@ define([
}); });
this.toolbarControls.push(this.btnAdvSettings); this.toolbarControls.push(this.btnAdvSettings);
me.btnImgAlign = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'btn-hidenchars',
caption: me.capImgAlign,
menu: true
});
me.btnImgGroup = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'btn-hidenchars',
caption: me.capImgGroup,
menu: true
});
me.btnImgForward = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'btn-hidenchars',
caption: me.capImgForward,
menu: true
});
me.btnImgBackward = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'btn-hidenchars',
caption: me.capImgBackward,
menu: true
});
me.btnImgWrapping = new Common.UI.Button({
cls: 'btn-toolbar',
iconCls: 'btn-hidenchars',
caption: me.capImgWrapping,
menu: true
});
me.toolbarControls.push( me.btnImgAlign,
me.btnImgGroup, me.btnImgForward, me.btnImgBackward, me.btnImgWrapping);
// //
// Menus // Menus
// //
@ -1433,6 +1467,12 @@ define([
_injectComponent('#slot-btn-halign', this.btnHorizontalAlign); _injectComponent('#slot-btn-halign', this.btnHorizontalAlign);
_injectComponent('#slot-btn-mailrecepients', this.btnMailRecepients); _injectComponent('#slot-btn-mailrecepients', this.btnMailRecepients);
_injectComponent('#slot-btn-notes', this.btnNotes); _injectComponent('#slot-btn-notes', this.btnNotes);
_injectComponent('#slot-img-align', this.btnImgAlign);
_injectComponent('#slot-img-group', this.btnImgGroup);
_injectComponent('#slot-img-movefrwd', this.btnImgForward);
_injectComponent('#slot-img-movebkwd', this.btnImgBackward);
_injectComponent('#slot-img-wrapping', this.btnImgWrapping);
return $host; return $host;
}, },
@ -2370,24 +2410,23 @@ define([
config.tabs[after + 1] = tab; config.tabs[after + 1] = tab;
var _after_action = _get_tab_action( after ); var _after_action = _get_tab_action( after );
if ( $tabs ) { var _elements = $tabs || config.$dom.find('.tabs');
// $tabs.find('a[data-tab=' + after + ']').parent() var $target = _elements.find('a[data-tab=' + _after_action + ']');
// .after( _.template(_tpl, tab) ); if ( $target.length ) {
} else { $target.parent().after( _.template(_tplTab, tab) );
var $toolbar = config.$dom;
var $el = $toolbar.find('.tabs a[data-tab=' + _after_action + ']');
if ( $el.length ) {
$el.parent().after( _.template(_tplTab, tab));
if ( panel ) { if ( panel ) {
$el = $toolbar.find('.box-panels > .panel[data-tab=' + _after_action + ']'); _elements = $panels || config.$dom.find('.box-panels > .panel');
$target = _elements.filter('[data-tab=' + _after_action + ']');
if ( $el.length ) { if ( $target.length ) {
$el.after(panel); $target.after(panel);
}
} }
} }
// synchronize matched elements
$tabs && ($tabs = $boxTabs.find('> li'));
$panels && ($panels = this.$el.find('.box-panels > .panel'));
} }
}, },

5
apps/documenteditor/main/locale/en.json
View file

@ -1602,6 +1602,11 @@
"DE.Views.Toolbar.capBtnPageOrient": "Orientation", "DE.Views.Toolbar.capBtnPageOrient": "Orientation",
"DE.Views.Toolbar.capBtnMargins": "Margins", "DE.Views.Toolbar.capBtnMargins": "Margins",
"DE.Views.Toolbar.capBtnPageSize": "Size", "DE.Views.Toolbar.capBtnPageSize": "Size",
"DE.Views.Toolbar.capImgAlign": "Align",
"DE.Views.Toolbar.capImgGroup": "Group",
"DE.Views.Toolbar.capImgForward": "Move forward",
"DE.Views.Toolbar.capImgBackward": "Move backward",
"DE.Views.Toolbar.capImgWrapping": "Wrapping",
"DE.Views.Toolbar.txtScheme1": "Office", "DE.Views.Toolbar.txtScheme1": "Office",
"DE.Views.Toolbar.txtScheme10": "Median", "DE.Views.Toolbar.txtScheme10": "Median",
"DE.Views.Toolbar.txtScheme11": "Metro", "DE.Views.Toolbar.txtScheme11": "Metro",

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

@ -203,6 +203,10 @@
width: 22px; width: 22px;
height: 22px; height: 22px;
} }
&.x-huge {
height: 45px;
}
} }
&.masked { &.masked {