Signature settings refactoring.

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

@@ -86,7 +86,7 @@ define([
                     '<tr><td colspan="2" class="padding-large"><label class="header"><%= header %></label></td></tr>',
                     '<% _.each(signatures, function(item) { %>',
                     '<tr>',
-                        '<td style="padding-bottom: 3px;"><label style="overflow: hidden; max-height: 15px;"><%= Common.Utils.String.htmlEncode(item.name) %></label></td>',
+                        '<td style="padding-bottom: 5px;"><label class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.name) %></label></td>',
                         '<td style="padding: 0 5px; vertical-align: top; text-align: right;"><label class="link-solid signature-sign-link" data-value="<%= item.guid %>">' + this.strSign + '</label></td>',
                     '</tr>',
                     '<% }); %>',
@@ -100,10 +100,10 @@ define([
                     '<tr><td colspan="2" class="padding-large"><label class="header"><%= header %></label></td></tr>',
                     '<% _.each(signatures, function(item) { %>',
                     '<tr>',
-                        '<td><div style="overflow: hidden; max-height: 15px;"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
+                        '<td><div class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
                         '<td rowspan="2" style="padding: 0 5px; vertical-align: top; text-align: right;"><label class="link-solid signature-view-link" data-value="<%= item.guid %>">' + this.strView + '</label></td>',
                     '</tr>',
-                    '<tr><td style="padding-bottom: 3px;"><%= Common.Utils.String.htmlEncode(item.date) %></td></tr>',
+                    '<tr><td style="padding-bottom: 3px;"><label class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.date) %></label></td></tr>',
                     '<% }); %>',
                 '</table>',
                 '</td>'
@@ -202,7 +202,13 @@ define([
             // this.cntInvalidSign.html(this.templateValid({signatures: [{name: 'Mary White', guid: '111', date: '18/05/2017'}, {name: 'John Black', guid: '456', date: '18/05/2017'}], header: this.strInvalid}));
 
             this.$linksSign = $('.signature-sign-link', this.$el);
+            var width = this.$linksSign.width();
+            $('.signature-sign-name', this.cntRequestedSign).css('max-width', 170-width);
+
             this.$linksView = $('.signature-view-link', this.$el);
+            width = this.$linksView.width();
+            $('.signature-sign-name', this.cntValidSign).css('max-width', 170-width);
+            $('.signature-sign-name', this.cntInvalidSign).css('max-width', 170-width);
         },
 
         addVisibleSign: function(btn) {

apps/documenteditor/main/resources/less/rightmenu.less

@@ -269,3 +269,9 @@ button:active:not(.disabled) .btn-change-shape    {background-position: -56px  -
 .gradient-radial-center {
     background-position: -100px -150px;
 }
+
+.signature-sign-name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}

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

@@ -84,10 +84,10 @@ define([
                     '<tr><td colspan="2" class="padding-large"><label class="header"><%= header %></label></td></tr>',
                     '<% _.each(signatures, function(item) { %>',
                     '<tr>',
-                        '<td><div style="overflow: hidden; max-height: 15px;"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
+                        '<td><div class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
                         '<td rowspan="2" style="padding: 0 5px; vertical-align: top; text-align: right;"><label class="link-solid signature-view-link" data-value="<%= item.guid %>">' + this.strView + '</label></td>',
                     '</tr>',
-                    '<tr><td style="padding-bottom: 3px;"><%= Common.Utils.String.htmlEncode(item.date) %></td></tr>',
+                    '<tr><td style="padding-bottom: 3px;"><label class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.date) %></label></td></tr>',
                     '<% }); %>',
                 '</table>',
                 '</td>'
@@ -172,6 +172,9 @@ define([
             // this.cntInvalidSign.html(this.templateValid({signatures: [{name: 'Mary White', guid: '111', date: '18/05/2017'}, {name: 'John Black', guid: '456', date: '18/05/2017'}], header: this.strInvalid}));
 
             this.$linksView = $('.signature-view-link', this.$el);
+            var width = this.$linksView.width();
+            $('.signature-sign-name', this.cntValidSign).css('max-width', 170-width);
+            $('.signature-sign-name', this.cntInvalidSign).css('max-width', 170-width);
         },
 
         addInvisibleSign: function(btn) {

apps/presentationeditor/main/resources/less/rightmenu.less

@@ -204,4 +204,10 @@ button:active:not(.disabled) .btn-change-shape    {background-position: -56px  -
 
 .gradient-radial-center {
     background-position: -100px -150px;
+}
+
+.signature-sign-name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }

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

@@ -86,7 +86,7 @@ define([
                     '<tr><td colspan="2" class="padding-large"><label class="header"><%= header %></label></td></tr>',
                     '<% _.each(signatures, function(item) { %>',
                     '<tr>',
-                        '<td style="padding-bottom: 3px;"><label style="overflow: hidden; max-height: 15px;"><%= Common.Utils.String.htmlEncode(item.name) %></label></td>',
+                        '<td style="padding-bottom: 5px;"><label class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.name) %></label></td>',
                         '<td style="padding: 0 5px; vertical-align: top; text-align: right;"><label class="link-solid signature-sign-link" data-value="<%= item.guid %>">' + this.strSign + '</label></td>',
                     '</tr>',
                     '<% }); %>',
@@ -100,10 +100,10 @@ define([
                     '<tr><td colspan="2" class="padding-large"><label class="header"><%= header %></label></td></tr>',
                     '<% _.each(signatures, function(item) { %>',
                     '<tr>',
-                        '<td><div style="overflow: hidden; max-height: 15px;"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
+                        '<td><div class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.name) %></div></td>',
                         '<td rowspan="2" style="padding: 0 5px; vertical-align: top; text-align: right;"><label class="link-solid signature-view-link" data-value="<%= item.guid %>">' + this.strView + '</label></td>',
                     '</tr>',
-                    '<tr><td style="padding-bottom: 3px;"><%= Common.Utils.String.htmlEncode(item.date) %></td></tr>',
+                    '<tr><td style="padding-bottom: 3px;"><label class="signature-sign-name"><%= Common.Utils.String.htmlEncode(item.date) %></label></td></tr>',
                     '<% }); %>',
                 '</table>',
                 '</td>'
@@ -202,7 +202,13 @@ define([
             // this.cntInvalidSign.html(this.templateValid({signatures: [{name: 'Mary White', guid: '111', date: '18/05/2017'}, {name: 'John Black', guid: '456', date: '18/05/2017'}], header: this.strInvalid}));
 
             this.$linksSign = $('.signature-sign-link', this.$el);
+            var width = this.$linksSign.width();
+            $('.signature-sign-name', this.cntRequestedSign).css('max-width', 170-width);
+
             this.$linksView = $('.signature-view-link', this.$el);
+            width = this.$linksView.width();
+            $('.signature-sign-name', this.cntValidSign).css('max-width', 170-width);
+            $('.signature-sign-name', this.cntInvalidSign).css('max-width', 170-width);
         },
 
         addVisibleSign: function(btn) {

apps/spreadsheeteditor/main/resources/less/rightmenu.less

@@ -332,6 +332,12 @@ button:active:not(.disabled) .btn-change-shape    {background-position: -56px  -
     background-position: -150px -300px;
 }
 
-#table-combo-template .combo-dataview{
+#table-combo-template .combo-dataview {
     .combo-template(60px);
+}
+
+.signature-sign-name {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
 }