Skip to content

Commit

Permalink
Merge branch 'release/3.6.1'
Browse files Browse the repository at this point in the history
  • Loading branch information
Lam, Doris T (319E) authored and Lam, Doris T (319E) committed Feb 4, 2020
2 parents 5ad2d6b + 903d5fa commit 1acf5f6
Show file tree
Hide file tree
Showing 6 changed files with 138 additions and 30 deletions.
2 changes: 1 addition & 1 deletion Gruntfile.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -364,7 +364,7 @@ module.exports = function(grunt) {
options: {
publish: [{
id: groupId + ':ve:zip',
version: '3.6.0',
version: '3.6.1',
path: 'deploy/'
}]
}
Expand Down
28 changes: 19 additions & 9 deletions app/assets/styles/ve/layout/_ve-table-filter.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@
.export-csv-button.btn,
.filter-table-button.btn,
.reset-sort-button.btn,
.fixed-header-label {
.table-button {
margin: 30px 0 6px;
font-weight:500;
}
Expand Down Expand Up @@ -89,18 +89,28 @@
input[type=checkbox].fixed-header-checkbox {
margin: 3px 0 0;
}
.table-fix-head {
overflow-y: auto;
//height: 700px;
table{
border-collapse: separate;
input[type=text].column-input {
margin: 0;
padding: 0;
}
.table-fix-head, .table-fix-column {
table {
border-collapse: separate;
//https://stackoverflow.com/questions/49209548/why-css-transform-translate-leaves-border-of-table-row-where-it-was
}
table th {
thead, th {
background-color: $ve-silver-lighter-1;
}

caption {
tbody, td, caption {
background-color: $white;
}
}
.table-fix-head {
overflow-y: auto;
}
.table-fix-column {
overflow-x: auto;
td.table-fixed-cell {
background-color: $ve-silver-lighter-1;
}
}
7 changes: 3 additions & 4 deletions app/js/mms/controllers/controller.utils.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -352,10 +352,6 @@ function MmsAppUtils($q, $uibModal, $timeout, $location, $window, growl,
printElementCopy.find('.no-print').remove();
printElementCopy.find('.ng-hide').remove();

//remove frozen headers
printElementCopy.find('.table-wrapper').css('height', '');
printElementCopy.find('.table-fix-head thead').css('transform', '').css('will-change', '');
printElementCopy.find('.table-fix-head caption').css('transform', '').css('will-change', '');
// word doesn't support svg only png.
if (mode === 2) {
printElementCopy.find('.mms-svg').remove();
Expand All @@ -376,6 +372,9 @@ function MmsAppUtils($q, $uibModal, $timeout, $location, $window, growl,
this.style.removeProperty('width');
this.style.removeProperty('min-width');
this.style.removeProperty('height');
//remove frozen headers and column
this.style.removeProperty('transform');
this.style.removeProperty('will-change');
});
printElementCopy.find('.math').remove(); //this won't work in chrome for popups since chrome can't display mathml
printElementCopy.find('script').remove();
Expand Down
2 changes: 1 addition & 1 deletion app/js/mms/directives/veNav.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -87,7 +87,7 @@ function veNav($templateCache, $rootScope, $state, hotkeys, growl, $location, $u
hotkeys.toggleCheatSheet();
};
scope.toggleAbout = function() {
scope.veV = '3.6.0';
scope.veV = '3.6.1';
scope.mmsV = 'Loading...';
ApplicationService.getMmsVersion().then(function(data) {
scope.mmsV = data;
Expand Down
112 changes: 105 additions & 7 deletions src/directives/mmsViewTable.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,10 @@ function mmsViewTable($compile, $timeout, $document, $window, UtilsService, Util
html = '<div class="tableSearch ve-table-filter">' +
'<button class="btn btn-sm export-csv-button btn-default" ng-click="makeCsv()">Export CSV</button> ' +
'<button class="btn btn-sm filter-table-button btn-default" ng-click="showFilter = !showFilter">Filter table</button> ' +
'<label class="btn btn-sm btn-default fixed-header-label"><input type="checkbox" class="fixed-header-checkbox" ng-model="fixedHeaders" ng-change="makeFixed()" /> Freeze Headers</label> ' +
'<label class="btn btn-sm btn-default table-button"><input type="checkbox" class="fixed-header-checkbox" ng-model="fixedHeaders" ng-change="makeFixedHeader()" /> Freeze Headers</label> ' +
'<label class="btn btn-sm btn-default table-button"><input type="checkbox" class="fixed-header-checkbox" ng-model="fixedColumns" ng-change="makeFixedColumn()" /> Freeze Columns</label> ' +
'<label class="btn btn-sm table-button column-input-label" ng-show="fixedColumns">Columns to Freeze <input type="text" ng-show="fixedColumns" size="3" class="column-input" ng-model="numFixedColumns" /></label> ' +
'<button class="btn btn-sm btn-default table-button" ng-show="fixedColumns" ng-click="updateFixedColumns()">Update</button> ' +
'<button class="btn btn-sm reset-sort-button btn-default reset-sort-fade" ng-show="showSortReset" ng-click="resetSort()">Reset Sort</button>' +
'<span class = "ve-show-filter" ng-show="showFilter">' +
'<form style="display: inline" class="ve-filter-table-form"><input type="text" size="75" placeholder="Filter table" ng-model-options="{debounce: '+ tableConfig.filterDebounceRate + '}" ng-model="searchTerm"></form>' +
Expand Down Expand Up @@ -66,21 +69,104 @@ function mmsViewTable($compile, $timeout, $document, $window, UtilsService, Util

var fixedHeaders = null;
scope.fixedHeaders = false;
scope.makeFixed = function() {
var fixedColumns = null;
scope.fixedColumns = false;
scope.numFixedColumns = 2;
var scroll = function() {
if (fixedColumns) {
fixedColumns.css('transform', 'translateX('+ this.scrollLeft +'px)');
}
if (fixedHeaders) {
fixedHeaders.css('transform', 'translateY('+ this.scrollTop +'px)');
}
if (fixedHeaders && fixedColumns) {
element.find('caption').css('transform', 'translate(' + this.scrollLeft + 'px, ' + this.scrollTop + 'px)');
}
};
scope.makeFixedHeader = function() {
if (!scope.fixedHeaders) {
element.find('.table-wrapper').removeClass('table-fix-head').css('height', '');
fixedHeaders.css('transform', '');
fixedHeaders.css('will-change', '');
fixedHeaders.css('transform', '').css('will-change', '');
fixedHeaders = null;
$window.localStorage.setItem('ve-table-header-' + scope.mmsPe.id, 'false');
return;
}
element.find('.table-wrapper').addClass('table-fix-head').css('height', $window.innerHeight - 36*3);
//heights for navbar, menu, toolbar
fixedHeaders = element.find('.table-fix-head thead').add(element.find('.table-fix-head caption'));
fixedHeaders = element.find('thead, caption');
fixedHeaders.css('will-change', 'transform'); //browser optimization
element.find('.table-fix-head').on('scroll', function() {
fixedHeaders.css('transform', 'translateY('+ this.scrollTop +'px)');
element.find('.table-fix-head').on('scroll', scroll);
$window.localStorage.setItem('ve-table-header-' + scope.mmsPe.id, 'true');
};
scope.makeFixedColumn = function() {
if (!scope.fixedColumns) {
element.find('.table-wrapper').removeClass('table-fix-column').css('width', '');
fixedColumns.css('transform', '').css('will-change', '').removeClass('table-fixed-cell');
fixedColumns = null;
$window.localStorage.setItem('ve-table-column-' + scope.mmsPe.id, 'false');
return;
}
element.find('.table-wrapper').addClass('table-fix-column').css('width', $window.innerWidth - 400);
fixedColumns = findColumnCells('thead', 'th', scope.numFixedColumns);
fixedColumns = fixedColumns.add(findColumnCells('tbody', 'td', scope.numFixedColumns));
fixedColumns = fixedColumns.add(element.find('.table-fix-column caption'));
fixedColumns.css('will-change', 'transform'); //browser optimization
fixedColumns.addClass('table-fixed-cell');
element.find('.table-fix-column').on('scroll', scroll);
$window.localStorage.setItem('ve-table-column-' + scope.mmsPe.id, scope.numFixedColumns);
};
scope.updateFixedColumns = function() {
scope.fixedColumns = false;
scope.makeFixedColumn();
scope.fixedColumns = true;
scope.makeFixedColumn();
};
var findColumnCells = function(bodyTag, cellTag, n) {
var spanData = {}; //if spanData[curRow][curCol] is true that means that 'cell' should be "" due to merged cell
var curRow = 0;
var data = $();
element.find('.table-fix-column table').children(bodyTag).children('tr').each(function() {
var curCol = 0;
$(this).children(cellTag).each(function() {
while(spanData[curRow] && spanData[curRow][curCol]) {
curCol++;
}
if (curCol >= n) {
return;
}
data = data.add($(this));
var rowspan = $(this).attr('rowspan');
if (rowspan) {
rowspan = parseInt(rowspan);
if (rowspan > 1) {
for (var i = 1; i < rowspan; i++) {
if (!spanData[curRow + i]) {
spanData[curRow + i] = {};
}
spanData[curRow + i][curCol] = true;
}
}
}
var colspan = $(this).attr('colspan');
if (!colspan) {
curCol++;
return;
}
colspan = parseInt(colspan);
while (colspan > 1) {
curCol++;
colspan--;
if (rowspan > 1) {
for (var j = 1; j < rowspan; j++) {
spanData[curRow + j][curCol] = true;
}
}
}
curCol++;
});
curRow++;
});
return data;
};

element[0].innerHTML = html;
Expand Down Expand Up @@ -110,6 +196,18 @@ function mmsViewTable($compile, $timeout, $document, $window, UtilsService, Util
nextIndex = first + 300;
if (nextIndex < lastIndex)
compile();
else {
if ($window.localStorage.getItem('ve-table-header-' + scope.mmsPe.id) == 'true') {
scope.fixedHeaders = true;
scope.makeFixedHeader();
}
var columnFix = $window.localStorage.getItem('ve-table-column-' + scope.mmsPe.id);
if (columnFix != 'false' && columnFix != null && columnFix != 'null') {
scope.fixedColumns = true;
scope.numFixedColumns = columnFix;
scope.makeFixedColumn();
}
}
}, 100, false);
}
compile();
Expand Down
17 changes: 9 additions & 8 deletions src/services/UtilsService.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -487,11 +487,6 @@ function UtilsService($q, $http, CacheService, URLService, ApplicationService, _
*/
var makeHtmlTable = function(table, isFilterable, isSortable, pe) {
var result = ['<table class="table-bordered table-condensed ' + (table.style ? table.style : '') + '">'];
if (ApplicationService.getState().inDoc && !table.excludeFromList) {
result.push('<caption>Table {{mmsPe._veNumber}}. {{table.title || mmsPe.name}}</caption>');
} else if (table.title) {
result.push('<caption>' + table.title + '</caption>');
}
if (table.colwidths && table.colwidths.length > 0) {
result.push('<colgroup>');
for (var i = 0; i < table.colwidths.length; i++) {
Expand All @@ -503,6 +498,10 @@ function UtilsService($q, $http, CacheService, URLService, ApplicationService, _
}
result.push('</colgroup>');
}
result.push('<tbody>'); //put tbody before thead to control stacking context so if freeze header/columns are both used headers cover cells (?)
//https://stackoverflow.com/questions/45676848/stacking-context-on-table-elementhead-and-body
result.push(makeTableBody(table.body, false));
result.push('</tbody>');
if (table.header && table.header.length) {
// only add styling to the filterable or sortable header
if ( isFilterable || isSortable ) {
Expand All @@ -514,9 +513,11 @@ function UtilsService($q, $http, CacheService, URLService, ApplicationService, _
result.push(makeTableBody(table.header, true, isFilterable, isSortable));
result.push('</thead>');
}
result.push('<tbody>');
result.push(makeTableBody(table.body, false));
result.push('</tbody>');
if (ApplicationService.getState().inDoc && !table.excludeFromList) {
result.push('<caption>Table {{mmsPe._veNumber}}. {{table.title || mmsPe.name}}</caption>');
} else if (table.title) {
result.push('<caption>' + table.title + '</caption>');
} //same for caption to control stacking context
result.push('</table>');
return result.join('');
};
Expand Down

0 comments on commit 1acf5f6

Please sign in to comment.