Refactoring window component

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

@@ -63,6 +63,12 @@
  *      @cfg {Boolean} animate
  *      Makes the window to animate while showing or hiding
  *
+ *      @cfg {Object} buttons
+ *          Use an array for predefined buttons (ok, cancel, yes, no): @example ['yes', 'no']
+ *          Use a named array for the custom buttons: {value: caption, ...}
+ *              @param {String} value will be returned in callback function
+ *              @param {String} caption
+ *
  *      Methods
  *
  *      @method show
@@ -106,12 +112,6 @@
  *      @window Common.UI.warning
  *      Shows warning message.
  *      @cfg {String} msg
- *      @cfg {Object} buttons
- *          Use an array for predefined buttons (ok, cancel, yes, no): @example ['yes', 'no']
- *          Use a named array for the custom buttons: {value: caption, ...}
- *              @param {String} value will be returned in callback function
- *              @param {String} caption
- *
  *      @cfg {Function} callback
  *      @param {String} button
  *      If the window is closed via shortcut or header's close tool, the 'button' will be 'close'
@@ -167,7 +167,15 @@ define([
                                     '<div class="title"><%= title %></div> ' +
                                 '</div>' +
                             '<% } %>' +
-                            '<div class="body"><%= tpl %></div>' +
+                            '<div class="body"><%= tpl %>' +
+                                '<% if (typeof (buttons) !== "undefined" && _.size(buttons) > 0) { %>' +
+                                '<div class="footer">' +
+                                    '<% for(var bt in buttons) { %>' +
+                                        '<button class="btn normal dlg-btn <%= buttons[bt].cls %>" result="<%= bt %>"><%= buttons[bt].text %></button>'+
+                                    '<% } %>' +
+                                '</div>' +
+                                '<% } %>' +
+                            '</div>' +
                         '</div>';
 
         function _getMask() {
@@ -399,31 +407,9 @@ define([
 
         Common.UI.alert = function(options) {
             var me = this.Window.prototype;
-            var arrBtns = {ok: me.okButtonText, cancel: me.cancelButtonText,
-                yes: me.yesButtonText, no: me.noButtonText,
-                close: me.closeButtonText};
 
             if (!options.buttons) {
-                options.buttons = {};
+                options.buttons = ['ok'];
-                options.buttons['ok'] = {text: arrBtns['ok'], cls: 'primary'};
-            } else {
-                if (_.isArray(options.buttons)) {
-                    if (options.primary==undefined)
-                        options.primary = 'ok';
-                    var newBtns = {};
-                    _.each(options.buttons, function(b){
-                        if (typeof(b) == 'object') {
-                            if (b.value !== undefined)
-                                newBtns[b.value] = {text: b.caption, cls: 'custom' + ((b.primary || options.primary==b.value) ? ' primary' : '')};
-                        } else {
-                            newBtns[b] = {text: (b=='custom') ? options.customButtonText : arrBtns[b], cls: (options.primary==b) ? 'primary' : ''};
-                            if (b=='custom')
-                                newBtns[b].cls += ' custom';
-                        }
-                    });
-
-                    options.buttons = newBtns;
-                }
             }
             options.dontshow = options.dontshow || false;
 
@@ -435,14 +421,7 @@ define([
                                     '<% if (dontshow) { %><div class="dont-show-checkbox"></div><% } %>' +
                                 '</div>' +
                             '</div>' +
-                            '<% if (dontshow) { %><div class="separator horizontal" style="width: 100%;"/><% } %>' +
+                            '<% if (dontshow) { %><div class="separator horizontal" style="width: 100%;"/><% } %>';
-                            '<% if (_.size(buttons) > 0) { %>' +
-                                '<div class="footer <% if (dontshow) { %> dontshow <% } %>">' +
-                                    '<% for(var bt in buttons) { %>' +
-                                        '<button class="btn normal dlg-btn <%= buttons[bt].cls %>" result="<%= bt %>"><%= buttons[bt].text %></button>'+
-                                    '<% } %>' +
-                                '</div>' +
-                            '<% } %>';
 
             _.extend(options, {
                 cls: 'alert',
@@ -500,7 +479,9 @@ define([
 
             win.on({
                 'render:after': function(obj){
-                    obj.getChild('.footer .dlg-btn').on('click', onBtnClick);
+                    var footer = obj.getChild('.footer');
+                    options.dontshow && footer.addClass('dontshow');
+                    footer.find('.dlg-btn').on('click', onBtnClick);
                     chDontShow = new Common.UI.CheckBox({
                         el: win.$window.find('.dont-show-checkbox'),
                         labelText: win.textDontShow
@@ -572,6 +553,29 @@ define([
                 this.initConfig = {};
                 this.binding = {};
 
+                var arrBtns = {ok: this.okButtonText, cancel: this.cancelButtonText,
+                    yes: this.yesButtonText, no: this.noButtonText,
+                    close: this.closeButtonText};
+
+                if (options.buttons && _.isArray(options.buttons)) {
+                    if (options.primary==undefined)
+                        options.primary = 'ok';
+                    var newBtns = {};
+                    _.each(options.buttons, function(b){
+                        if (typeof(b) == 'object') {
+                            if (b.value !== undefined)
+                                newBtns[b.value] = {text: b.caption, cls: 'custom' + ((b.primary || options.primary==b.value) ? ' primary' : '')};
+                        } else {
+                            newBtns[b] = {text: (b=='custom') ? options.customButtonText : arrBtns[b], cls: (options.primary==b) ? 'primary' : ''};
+                            if (b=='custom')
+                                newBtns[b].cls += ' custom';
+                        }
+                    });
+
+                    options.buttons = newBtns;
+                    options.footerCls = options.footerCls || 'center';
+                }
+
                 _.extend(this.initConfig, config, options || {});
 
                 !this.initConfig.id && (this.initConfig.id = 'window-' + this.cid);
@@ -632,6 +636,8 @@ define([
                 };
                 Common.NotificationCenter.on('window:close', this.binding.winclose);
 
+                this.initConfig.footerCls && this.$window.find('.footer').addClass(this.initConfig.footerCls);
+
                 this.fireEvent('render:after',this);
                 return this;
             },

apps/common/main/lib/view/AdvancedSettingsWindow.js

@@ -51,7 +51,8 @@ define([
                 cls: 'advanced-settings-dlg',
                 toggleGroup: 'advanced-settings-group',
                 contentTemplate: '',
-                items: []
+                items: [],
+                buttons: ['ok', 'cancel']
             }, options);
 
             this.template = options.template || [
@@ -64,11 +65,7 @@ define([
                     '<div class="separator"/>',
                     '<div class="content-panel" >' + _options.contentTemplate + '</div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             _options.tpl = _.template(this.template)(_options);

apps/common/main/lib/view/CopyWarningDialog.js

@@ -50,12 +50,14 @@ define([
         options: {
             width   : 500,
             height  : 325,
-            cls     : 'modal-dlg copy-warning'
+            cls     : 'modal-dlg copy-warning',
+            buttons: ['ok']
         },
 
         initialize : function(options) {
             _.extend(this.options, {
-                title: this.textTitle
+                title: this.textTitle,
+                buttons: ['ok']
             }, options || {});
 
             this.template = [
@@ -77,10 +79,7 @@ define([
                     '</div>',
                     '<div id="copy-warning-checkbox" style="margin-top: 20px; text-align: left;"></div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary">' + this.okButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/common/main/lib/view/ExternalDiagramEditor.js

@@ -61,7 +61,7 @@ define([
                 '</div>',
                 '<div class="separator horizontal"/>',
                 '<div class="footer" style="text-align: center;">',
-                    '<button id="id-btn-diagram-editor-apply" class="btn normal dlg-btn primary custom" result="ok" style="margin-right: 10px;">' + this.textSave + '</button>',
+                    '<button id="id-btn-diagram-editor-apply" class="btn normal dlg-btn primary custom" result="ok">' + this.textSave + '</button>',
                     '<button id="id-btn-diagram-editor-cancel" class="btn normal dlg-btn" result="cancel">' + this.textClose + '</button>',
                 '</div>'
             ].join('');

apps/common/main/lib/view/ExternalMergeEditor.js

@@ -61,7 +61,7 @@ define([
                 '</div>',
                 '<div class="separator horizontal"/>',
                 '<div class="footer" style="text-align: center;">',
-                    '<button id="id-btn-merge-editor-apply" class="btn normal dlg-btn primary custom" result="ok" style="margin-right: 10px;">' + this.textSave + '</button>',
+                    '<button id="id-btn-merge-editor-apply" class="btn normal dlg-btn primary custom" result="ok">' + this.textSave + '</button>',
                     '<button id="id-btn-merge-editor-cancel" class="btn normal dlg-btn disabled" result="cancel">' + this.textClose + '</button>',
                 '</div>'
             ].join('');

apps/common/main/lib/view/ImageFromUrlDialog.js

@@ -46,7 +46,9 @@ define([
         options: {
             width: 330,
             header: false,
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -58,10 +60,6 @@ define([
                         '<label>' + this.textUrl + '</label>',
                     '</div>',
                     '<div id="id-dlg-url" class="input-row"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/common/main/lib/view/InsertTableDialog.js

@@ -51,7 +51,8 @@ define([
             height: 156,
             style: 'min-width: 230px;',
             cls: 'modal-dlg',
-            split: false
+            split: false,
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -67,10 +68,6 @@ define([
                     '<div class="input-row" style="margin-top: 10px;">',
                         '<label class="text rows-text" style="width: 130px;">' + this.txtRows + '</label><div class="rows-val" style="float: right;"></div>',
                     '</div>',
-                '</div>',
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/common/main/lib/view/LanguageDialog.js

@@ -51,25 +51,22 @@ define([
     options: {
         header: false,
         width: 350,
-        cls: 'modal-dlg'
+        cls: 'modal-dlg',
+        buttons: ['ok', 'cancel'],
+        footerCls: 'right'
     },
 
     template:   '<div class="box">' +
-    '<div class="input-row">' +
+        '<div class="input-row">' +
-    '<label><%= label %></label>' +
+        '<label><%= label %></label>' +
-    '</div>' +
+        '</div>' +
-    '<div class="input-row" id="id-document-language">' +
+        '<div class="input-row" id="id-document-language">' +
-    '</div>' +
+        '</div>' +
-    '</div>' +
+        '</div>',
-    '<div class="footer right">' +
-    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;"><%= btns.ok %></button>'+
-    '<button class="btn normal dlg-btn" result="cancel"><%= btns.cancel %></button>'+
-    '</div>',
 
     initialize : function(options) {
         _.extend(this.options, options || {}, {
-            label: this.labelSelect,
+            label: this.labelSelect
-            btns: {ok: this.okButtonText, cancel: this.cancelButtonText}
         });
         this.options.tpl = _.template(this.template)(this.options);
 

apps/common/main/lib/view/PasswordDialog.js

@@ -59,7 +59,8 @@ define([
                 header          : true,
                 cls             : 'modal-dlg',
                 contentTemplate : '',
-                title           : t.txtTitle
+                title           : t.txtTitle,
+                buttons: ['ok', 'cancel']
 
             }, options);
 
@@ -77,11 +78,7 @@ define([
                     '</div>',
                     '<div id="id-repeat-txt" class="input-row"></div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right:10px;">' + t.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + t.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.handler        =   options.handler;

apps/common/main/lib/view/Plugins.js

@@ -368,7 +368,7 @@ define([
                     '<div class="separator horizontal"/>',
                     '<div class="footer" style="text-align: center;">',
                         '<% for(var bt in buttons) { %>',
-                            '<button class="btn normal dlg-btn <%= buttons[bt].cls %>" result="<%= bt %>" style="margin-right: 10px;"><%= buttons[bt].text %></button>',
+                            '<button class="btn normal dlg-btn <%= buttons[bt].cls %>" result="<%= bt %>"><%= buttons[bt].text %></button>',
                         '<% } %>',
                     '</div>',
                 '<% } %>'

apps/common/main/lib/view/RenameDialog.js

@@ -47,7 +47,9 @@ define([
             width: 330,
             header: false,
             cls: 'modal-dlg',
-            filename: ''
+            filename: '',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -59,10 +61,6 @@ define([
                         '<label>' + this.textName + '</label>',
                     '</div>',
                     '<div id="id-dlg-newname" class="input-row"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/common/main/lib/view/SearchDialog.js

@@ -98,10 +98,10 @@
                 '</div>',
                 '<div class="separator horizontal"/>',
                 '<div class="footer right">',
-                    '<button class="btn normal dlg-btn" result="replace" style="margin-right: 6px;">'+this.txtBtnReplace+'</button>',
+                    '<button class="btn normal dlg-btn" result="replace">'+this.txtBtnReplace+'</button>',
-                    '<button class="btn normal dlg-btn" result="replaceall" style="margin-right: 10px;">'+this.txtBtnReplaceAll+'</button>',
+                    '<button class="btn normal dlg-btn" result="replaceall" style="margin-left: 6px;">'+this.txtBtnReplaceAll+'</button>',
-                    '<button class="btn normal dlg-btn iconic" result="back" style="margin-right: 6px;"><span class="icon img-commonctrl back" /></button>',
+                    '<button class="btn normal dlg-btn iconic" result="back"><span class="icon img-commonctrl back" /></button>',
-                    '<button class="btn normal dlg-btn iconic" result="next"><span class="icon img-commonctrl next" /></button>',
+                    '<button class="btn normal dlg-btn iconic" result="next" style="margin-left: 6px;"><span class="icon img-commonctrl next" /></button>',
                 '</div>'
             ].join('');
 

apps/common/main/lib/view/SignDialog.js

@@ -53,7 +53,8 @@ define([
         options: {
             width: 370,
             style: 'min-width: 350px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -106,10 +107,6 @@ define([
                         '</tr>',
                         '<tr><td><div id="id-dlg-sign-certificate" class="hidden" style="max-width: 212px;overflow: hidden;"></td></tr>',
                     '</table>',
-                '</div>',
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/common/main/lib/view/SignSettingsDialog.js

@@ -86,7 +86,7 @@ define([
                     '<div id="id-dlg-sign-settings-date"></div>',
                 '</div>',
                 '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
+                    '<button class="btn normal dlg-btn primary" result="ok">' + this.okButtonText + '</button>',
                     '<% if (type == "edit") { %>',
                     '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                     '<% } %>',

apps/common/main/resources/less/window.less

@@ -236,6 +236,14 @@
             cursor: inherit !important;
         }
     }
+
+    .footer {
+        button {
+            &:not(:first-child) {
+                margin-left: 10px;
+            }
+        }
+    }
 }
 
 .modal-dlg {

apps/documenteditor/main/app/view/BookmarksDialog.js

@@ -51,7 +51,8 @@ define([
     DE.Views.BookmarksDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({
         options: {
             contentWidth: 310,
-            height: 360
+            height: 360,
+            buttons: null
         },
 
         initialize : function(options) {

apps/documenteditor/main/app/view/CellsAddDialog.js

@@ -51,7 +51,8 @@ define([
             width: 214,
             header: true,
             style: 'min-width: 214px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -61,15 +62,12 @@ define([
 
             this.template = [
                 '<div class="box">',
-                '<div style="margin-bottom: 10px;">',
+                    '<div style="margin-bottom: 10px;">',
-                    '<div id="table-combo-row-col" class="input-group-nr" style="display: inline-block; margin-right: 5px;"></div>',
+                        '<div id="table-combo-row-col" class="input-group-nr" style="display: inline-block; margin-right: 5px;"></div>',
-                    '<div id="table-spin-row-col" style="display: inline-block;"></div>',
+                        '<div id="table-spin-row-col" style="display: inline-block;"></div>',
-                '</div>',
+                    '</div>',
-                '<div id="table-radio-before" style="padding-bottom: 8px;"></div>',
+                    '<div id="table-radio-before" style="padding-bottom: 8px;"></div>',
-                '<div id="table-radio-after" style="padding-bottom: 8px;"></div>',
+                    '<div id="table-radio-after" style="padding-bottom: 8px;"></div>',
-                '<div class="footer center">',
-                '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/documenteditor/main/app/view/CellsRemoveDialog.js

@@ -49,7 +49,8 @@ define([
             width: 214,
             header: true,
             style: 'min-width: 214px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -62,9 +63,6 @@ define([
                     '<div id="table-radio-cells-left" style="padding-bottom: 8px;"></div>',
                     '<div id="table-radio-cells-row" style="padding-bottom: 8px;"></div>',
                     '<div id="table-radio-cells-col" style="padding-bottom: 8px;"></div>',
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/documenteditor/main/app/view/ControlSettingsDialog.js

@@ -132,10 +132,6 @@ define([
                                 '</table>',
                             '</div></div>',
                         '</div>',
-                    '</div>',
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + me.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + me.cancelButtonText + '</button>',
                     '</div>'
                 ].join('')
             }, options);

apps/documenteditor/main/app/view/CustomColumnsDialog.js

@@ -49,7 +49,8 @@ define([
             width: 300,
             header: true,
             style: 'min-width: 216px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -69,11 +70,7 @@ define([
                         '<div id="custom-columns-separator"></div>',
                     '</div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/documenteditor/main/app/view/HyperlinkSettingsDialog.js

@@ -57,7 +57,9 @@ define([
         options: {
             width: 350,
             style: 'min-width: 230px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -88,10 +90,6 @@ define([
                         '<label>' + this.textTooltip + '</label>',
                     '</div>',
                     '<div id="id-dlg-hyperlink-tip" class="input-row" style="margin-bottom: 5px;"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/documenteditor/main/app/view/MailMergeEmailDlg.js

@@ -57,11 +57,7 @@ define([    'text!documenteditor/main/app/template/MailMergeEmailDlg.template',
                     '<div class="box" style="height:' + (this.options.height-85) + 'px;">',
                     '<div class="content-panel" style="padding: 0;">' + _.template(contentTemplate)({scope: this}) + '</div>',
                     '</div>',
-                    '<div class="separator horizontal"/>',
+                    '<div class="separator horizontal"/>'
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + this.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);
             Common.Views.AdvancedSettingsWindow.prototype.initialize.call(this, this.options);

apps/documenteditor/main/app/view/NoteSettingsDialog.js

@@ -49,7 +49,8 @@ define([
     DE.Views.NoteSettingsDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({
         options: {
             contentWidth: 300,
-            height: 380
+            height: 380,
+            buttons: null
         },
 
         initialize : function(options) {
@@ -122,8 +123,8 @@ define([
                         '</div>',
                     '</div>',
                     '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="insert" style="margin-right: 10px;  width: 86px;">' + me.textInsert + '</button>',
+                    '<button class="btn normal dlg-btn primary" result="insert" style="width: 86px;">' + me.textInsert + '</button>',
-                    '<button id="note-settings-btn-apply" class="btn normal dlg-btn" result="apply" style="margin-right: 10px;  width: 86px;">' + me.textApply + '</button>',
+                    '<button id="note-settings-btn-apply" class="btn normal dlg-btn" result="apply" style="width: 86px;">' + me.textApply + '</button>',
                     '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
                     '</div>'
                 ].join('')

apps/documenteditor/main/app/view/NumberingValueDialog.js

@@ -48,7 +48,8 @@ define([
             width: 214,
             header: true,
             style: 'min-width: 214px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -61,9 +62,6 @@ define([
                     '<div class="input-row">',
                         '<div id="id-spin-set-value"></div>',
                     '</div>',
-                '<div class="footer center">',
-                '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/documenteditor/main/app/view/PageMarginsDialog.js

@@ -49,7 +49,8 @@ define([
             header: true,
             style: 'min-width: 216px;',
             cls: 'modal-dlg',
-            id: 'window-page-margins'
+            id: 'window-page-margins',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -82,11 +83,7 @@ define([
                         '</tr>',
                     '</table>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/documenteditor/main/app/view/PageSizeDialog.js

@@ -49,7 +49,8 @@ define([
             header: true,
             style: 'min-width: 216px;',
             cls: 'modal-dlg',
-            id: 'window-page-size'
+            id: 'window-page-size',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -78,11 +79,7 @@ define([
                         '</tr>',
                     '</table>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/documenteditor/main/app/view/StyleTitleDialog.js

@@ -47,7 +47,9 @@ define([
             width: 350,
             height: 200,
             style: 'min-width: 230px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
             initialize : function(options) {
@@ -62,11 +64,6 @@ define([
 
                         '<label class="input-row" style="margin-bottom: -5px; margin-top: 5px;">' + this.textNextStyle + '</label>',
                         '<div id="id-dlg-style-next-par" class="input-group-nr" style="margin-bottom: 5px;" ></div>',
-                    '</div>',
-
-                    '<div class="footer right">',
-                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                        '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                     '</div>'
                 ].join('');
 

apps/documenteditor/main/app/view/TableFormulaDialog.js

@@ -47,7 +47,9 @@ define([
         options: {
             width: 300,
             style: 'min-width: 230px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -69,11 +71,7 @@ define([
                         '<div id="id-dlg-formula-function" style="display: inline-block; width: 50%; padding-right: 10px; float: left;"></div>',
                         '<div id="id-dlg-formula-bookmark" style="display: inline-block; width: 50%;"></div>',
                     '</div>',
-                    '</div>',
+                    '</div>'
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/documenteditor/main/app/view/TableOfContentsSettings.js

@@ -120,11 +120,7 @@ define([
                             '</div></div>',
                         '</div>',
                     '</div>',
-                    '<div class="separator horizontal"/>',
+                    '<div class="separator horizontal"/>'
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + me.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);
 

apps/documenteditor/main/app/view/WatermarkSettingsDialog.js

@@ -93,10 +93,6 @@ define(['text!documenteditor/main/app/template/WatermarkSettings.template',
                         template,
                         '</div></div>',
                         '</div>',
-                        '</div>',
-                        '<div class="footer center">',
-                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + me.okButtonText + '</button>',
-                        '<button class="btn normal dlg-btn" result="cancel">' + me.cancelButtonText + '</button>',
                         '</div>'
                     ].join('')
                 )({

apps/presentationeditor/main/app/view/DateTimeDialog.js

@@ -49,7 +49,8 @@ define([
         options: {
             width: 350,
             style: 'min-width: 230px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function (options) {
@@ -74,10 +75,6 @@ define([
                         '<div id="datetime-dlg-update" style="margin-top: 3px;"></div>',
                         '<button type="button" class="btn btn-text-default auto" id="datetime-dlg-default" style="float: right;">' + this.textDefault + '</button>',
                     '</div>',
-                '</div>',
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/presentationeditor/main/app/view/HeaderFooterDialog.js

@@ -48,7 +48,8 @@ define(['text!presentationeditor/main/app/template/HeaderFooterDialog.template',
     PE.Views.HeaderFooterDialog = Common.Views.AdvancedSettingsWindow.extend(_.extend({
         options: {
             contentWidth: 360,
-            height: 380
+            height: 380,
+            buttons: null
         },
 
         initialize : function(options) {
@@ -74,8 +75,8 @@ define(['text!presentationeditor/main/app/template/HeaderFooterDialog.template',
                         '</div>',
                         '<div class="separator horizontal"/>',
                         '<div class="footer center">',
-                            '<button class="btn normal dlg-btn primary" result="all" style="margin-right: 10px;width: auto; min-width: 86px;">' + me.applyAllText + '</button>',
+                            '<button class="btn normal dlg-btn primary" result="all" style="width: auto; min-width: 86px;">' + me.applyAllText + '</button>',
-                            '<button class="btn normal dlg-btn" result="ok" style="margin-right: 10px;width: auto; min-width: 86px;">' + me.applyText + '</button>',
+                            '<button class="btn normal dlg-btn" result="ok" style="width: auto; min-width: 86px;">' + me.applyText + '</button>',
                             '<button class="btn normal dlg-btn" result="cancel">' + me.cancelButtonText + '</button>',
                         '</div>'
                     ].join('')

apps/presentationeditor/main/app/view/HyperlinkSettingsDialog.js

@@ -60,7 +60,9 @@ define([
             width: 350,
             style: 'min-width: 230px;',
             cls: 'modal-dlg',
-            id: 'window-hyperlink-settings'
+            id: 'window-hyperlink-settings',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -95,11 +97,7 @@ define([
                     '<div class="input-row">',
                         '<label>' + this.textTipText + '</label>',
                     '</div>',
-                        '<div id="id-dlg-hyperlink-tip" class="input-row" style="margin-bottom: 5px;"></div>',
+                    '<div id="id-dlg-hyperlink-tip" class="input-row" style="margin-bottom: 5px;"></div>',
-                    '</div>',
-                    '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/presentationeditor/main/app/view/SlideSizeSettings.js

@@ -49,7 +49,8 @@ define([
             header: true,
             style: 'min-width: 250px;',
             cls: 'modal-dlg',
-            id: 'window-slide-size-settings'
+            id: 'window-slide-size-settings',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -80,11 +81,7 @@ define([
                     '</div>',
                     '<div id="slide-orientation-combo" class="" style="margin-bottom: 10px;"></div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/presentationeditor/main/app/view/SlideshowSettings.js

@@ -49,7 +49,8 @@ define([
             header: true,
             style: 'min-width: 315px;',
             cls: 'modal-dlg',
-            id: 'window-slideshow-settings'
+            id: 'window-slideshow-settings',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -61,11 +62,7 @@ define([
                 '<div class="box" style="height: 20px;">',
                     '<div id="slideshow-checkbox-loop"></div>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/spreadsheeteditor/main/app/view/AutoFilterDialog.js

@@ -84,7 +84,7 @@ define([
                 '</div>',
                 '<div class="separator horizontal" style="width:100%"></div>',
                 '<div class="footer right" style="margin-left:-15px;">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right:10px;">', t.okButtonText, '</button>',
+                    '<button class="btn normal dlg-btn primary" result="ok">', t.okButtonText, '</button>',
                     '<button class="btn normal dlg-btn" result="cancel">', t.cancelButtonText, '</button>',
                 '</div>'
             ].join('');
@@ -311,7 +311,8 @@ define([
                 cls             : 'filter-dlg',
                 contentTemplate : '',
                 title           : t.txtTitle,
-                items           : []
+                items           : [],
+                buttons: ['ok', 'cancel']
             }, options);
 
             this.template   =   options.template || [
@@ -331,11 +332,7 @@ define([
                         '</div>',
                     '</div>',
                 '</div>',
-                '<div class="separator horizontal" style="width:100%"></div>',
+                '<div class="separator horizontal" style="width:100%"></div>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right:10px;">', t.okButtonText, '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">', t.cancelButtonText, '</button>',
-                '</div>'
             ].join('');
 
             this.api        =   options.api;
@@ -545,7 +542,6 @@ define([
             this.btnOk = new Common.UI.Button({
                 cls: 'btn normal dlg-btn primary',
                 caption : this.okButtonText,
-                style: 'margin-right:10px;',
                 enableToggle: false,
                 allowDepress: false
             });

apps/spreadsheeteditor/main/app/view/CellRangeDialog.js

@@ -51,7 +51,9 @@ define([
         options: {
             width   : 350,
             cls     : 'modal-dlg',
-            modal   : false
+            modal   : false,
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -62,10 +64,6 @@ define([
             this.template = [
                 '<div class="box">',
                     '<div id="id-dlg-cell-range" class="input-row" style="margin-bottom: 5px;"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/FormatSettingsDialog.js

@@ -146,11 +146,7 @@ define([
                     '</div></div>',
                     '</div>',
                     '</div>',
-                    '<div class="separator horizontal"/>',
+                    '<div class="separator horizontal"/>'
-                    '<div class="footer center">',
-                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + me.okButtonText + '</button>',
-                        '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);
 

apps/spreadsheeteditor/main/app/view/FormulaDialog.js

@@ -62,7 +62,8 @@ define([
                 cls             : 'formula-dlg',
                 contentTemplate : '',
                 title           : t.txtTitle,
-                items           : []
+                items           : [],
+                buttons: ['ok', 'cancel']
             }, options);
 
             this.template   =   options.template || [
@@ -78,12 +79,7 @@ define([
 
                     '</div>',
                 '</div>',
-
+                '<div class="separator horizontal"/>'
-                '<div class="separator horizontal"/>',
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + t.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + t.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.api            =   options.api;

apps/spreadsheeteditor/main/app/view/GroupDialog.js

@@ -47,7 +47,8 @@ define([
             width: 214,
             header: true,
             style: 'min-width: 214px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -55,11 +56,8 @@ define([
 
             this.template = [
                 '<div class="box">',
-                '<div id="group-radio-rows" style="margin-bottom: 5px;"></div>',
+                    '<div id="group-radio-rows" style="margin-bottom: 5px;"></div>',
-                '<div id="group-radio-cols"></div>',
+                    '<div id="group-radio-cols"></div>',
-                '<div class="footer center">',
-                '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/HeaderFooterDialog.js

@@ -51,7 +51,8 @@ define([
             width: 647,
             style: 'min-width: 350px;',
             cls: 'modal-dlg enable-key-events',
-            animate: {mask: false}
+            animate: {mask: false},
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -156,10 +157,6 @@ define([
                             '</div>',
                         '</div>',
                     '</div>',
-                '</div>',
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/HyperlinkSettingsDialog.js

@@ -53,7 +53,9 @@ define([
         options: {
             width   : 350,
             style   : 'min-width: 230px;',
-            cls     : 'modal-dlg'
+            cls     : 'modal-dlg',
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -91,10 +93,6 @@ define([
                         '<label>' + this.textTipText + '</label>',
                     '</div>',
                     '<div id="id-dlg-hyperlink-tip" class="input-row" style="margin-bottom: 5px;"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/NameManagerDlg.js

@@ -53,7 +53,8 @@ define([  'text!spreadsheeteditor/main/app/template/NameManagerDlg.template',
         options: {
             alias: 'NameManagerDlg',
             contentWidth: 510,
-            height: 353
+            height: 353,
+            buttons: null
         },
 
         initialize: function (options) {

apps/spreadsheeteditor/main/app/view/NamedRangeEditDlg.js

@@ -93,11 +93,7 @@ define([
                             '</div></div>',
                         '</div>',
                     '</div>',
-                    '<div class="separator horizontal"></div>',
+                    '<div class="separator horizontal"></div>'
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + me.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);
 

apps/spreadsheeteditor/main/app/view/NamedRangePasteDlg.js

@@ -74,11 +74,7 @@ define([
                             '</div></div>',
                         '</div>',
                     '</div>',
-                    '<div class="separator horizontal"></div>',
+                    '<div class="separator horizontal"></div>'
-                    '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + me.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);
 

apps/spreadsheeteditor/main/app/view/PageMarginsDialog.js

@@ -49,7 +49,8 @@ define([
             header: true,
             style: 'min-width: 216px;',
             cls: 'modal-dlg',
-            id: 'window-page-margins'
+            id: 'window-page-margins',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -82,11 +83,7 @@ define([
                         '</tr>',
                     '</table>',
                 '</div>',
-                '<div class="separator horizontal"/>',
+                '<div class="separator horizontal"/>'
-                '<div class="footer center">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
-                '</div>'
             ].join('');
 
             this.options.tpl = _.template(this.template)(this.options);

apps/spreadsheeteditor/main/app/view/PrintSettings.js

@@ -51,7 +51,8 @@ define([    'text!spreadsheeteditor/main/app/template/PrintSettings.template',
         options: {
             alias: 'PrintSettings',
             contentWidth: 280,
-            height: 475
+            height: 475,
+            buttons: null
         },
 
         initialize : function(options) {
@@ -73,8 +74,8 @@ define([    'text!spreadsheeteditor/main/app/template/PrintSettings.template',
                     '</div>',
                     '<div class="separator horizontal"/>',
                     '<div class="footer justify">',
-                        '<button id="printadv-dlg-btn-hide" class="btn btn-text-default" style="margin-right: 55px; width: 100px;">' + this.textHideDetails + '</button>',
+                        '<button id="printadv-dlg-btn-hide" class="btn btn-text-default" style="width: 100px;">' + this.textHideDetails + '</button>',
-                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 150px;">' + ((this.type == 'print') ? this.btnPrint : this.btnDownload) + '</button>',
+                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-left: 55px;  width: 150px;">' + ((this.type == 'print') ? this.btnPrint : this.btnDownload) + '</button>',
                         '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + this.cancelButtonText + '</button>',
                     '</div>'
                 ].join('')

apps/spreadsheeteditor/main/app/view/SetValueDialog.js

@@ -48,7 +48,8 @@ define([
             width: 214,
             header: true,
             style: 'min-width: 214px;',
-            cls: 'modal-dlg'
+            cls: 'modal-dlg',
+            buttons: ['ok', 'cancel']
         },
 
         initialize : function(options) {
@@ -61,9 +62,6 @@ define([
                     '<div class="input-row">',
                         '<div id="id-spin-set-value"></div>',
                     '</div>',
-                '<div class="footer center">',
-                '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/Statusbar.js

@@ -551,7 +551,9 @@ define([
             options: {
                 header: false,
                 width: 280,
-                cls: 'modal-dlg'
+                cls: 'modal-dlg',
+                buttons: ['ok', 'cancel'],
+                footerCls: 'right'
             },
 
             template:   '<div class="box">' +
@@ -559,16 +561,11 @@ define([
                                 '<label><%= label %></label>' +
                             '</div>' +
                             '<div class="input-row" id="txt-sheet-name" />' +
-                        '</div>' +
-                        '<div class="footer right">' +
-                            '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;"><%= btns.ok %></button>'+
-                            '<button class="btn normal dlg-btn" result="cancel"><%= btns.cancel %></button>'+
                         '</div>',
 
             initialize : function(options) {
                 _.extend(this.options, options || {}, {
-                    label: this.labelSheetName,
+                    label: this.labelSheetName
-                    btns: {ok: this.okButtonText, cancel: this.cancelButtonText}
                 });
                 this.options.tpl = _.template(this.template)(this.options);
 
@@ -663,7 +660,9 @@ define([
             options: {
                 width: 270,
                 height: 300,
-                cls: 'modal-dlg'
+                cls: 'modal-dlg',
+                buttons: ['ok', 'cancel'],
+                footerCls: 'right'
             },
 
             template:   '<div class="box">' +
@@ -671,16 +670,11 @@ define([
                                 '<label><%= label %></label>' +
                             '</div>' +
                             '<div id="status-list-names" style="height: 170px;"/>' +
-                        '</div>' +
-                        '<div class="footer center">' +
-                            '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;"><%= btns.ok %></button>'+
-                            '<button class="btn normal dlg-btn" result="cancel"><%= btns.cancel %></button>'+
                         '</div>',
 
             initialize : function(options) {
                 _.extend(this.options, options || {}, {
-                    label: options.ismove ? this.textMoveBefore : this.textCopyBefore,
+                    label: options.ismove ? this.textMoveBefore : this.textCopyBefore
-                    btns: {ok: this.okButtonText, cancel: this.cancelButtonText}
                 });
                 this.options.tpl = _.template(this.template)(this.options);
 

apps/spreadsheeteditor/main/app/view/TableOptionsDialog.js

@@ -53,7 +53,9 @@ define([
         options: {
             width   : 350,
             cls     : 'modal-dlg',
-            modal   : false
+            modal   : false,
+            buttons: ['ok', 'cancel'],
+            footerCls: 'right'
         },
 
         initialize : function(options) {
@@ -65,10 +67,6 @@ define([
                 '<div class="box">',
                     '<div id="id-dlg-tableoptions-range" class="input-row"  style="margin-bottom: 5px;"></div>',
                     '<div class="input-row" id="id-dlg-tableoptions-title" style="margin-top: 5px;"></div>',
-                '</div>',
-                '<div class="footer right">',
-                    '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;">' + this.okButtonText + '</button>',
-                    '<button class="btn normal dlg-btn" result="cancel">' + this.cancelButtonText + '</button>',
                 '</div>'
             ].join('');
 

apps/spreadsheeteditor/main/app/view/ValueFieldSettingsDialog.js

@@ -108,11 +108,7 @@ define([
                     '</div></div>',
                     '</div>',
                     '</div>',
-                    '<div class="separator horizontal"/>',
+                    '<div class="separator horizontal"/>'
-                    '<div class="footer center">',
-                        '<button class="btn normal dlg-btn primary" result="ok" style="margin-right: 10px;  width: 86px;">' + me.textOk + '</button>',
-                        '<button class="btn normal dlg-btn" result="cancel" style="width: 86px;">' + me.cancelButtonText + '</button>',
-                    '</div>'
                 ].join('')
             }, options);