Skip to content

Commit

Permalink
refactor(ng-table): use of idomatic typescript
Browse files Browse the repository at this point in the history
  • Loading branch information
@ccrowhurstram
ccrowhurstram committed Dec 6, 2016
1 parent a7b71db commit a237e70
Show file tree
Hide file tree
Showing 31 changed files with 827 additions and 668 deletions.
2 changes: 1 addition & 1 deletion karma.conf.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ var debug = process.env.npm_lifecycle_event === 'test:debug'
const webpackConfig = require('./webpack.config')({ test: true, noCoverage: debug });

module.exports = function (config) {
let reporters = ['dots', 'spec'];
let reporters = ['jasmine-diff', 'dots', 'spec'];
if (!debug) {
reporters.push('coverage');
}
Expand Down
14 changes: 14 additions & 0 deletions npm-shrinkwrap.json
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -58,6 +58,7 @@
"karma-coverage": "1.1.1",
"karma-firefox-launcher": "1.0.0",
"karma-jasmine": "1.0.2",
"karma-jasmine-diff-reporter": "^0.6.3",
"karma-phantomjs-launcher": "1.0.1",
"karma-spec-reporter": "0.0.26",
"karma-webpack": "^1.8.0",
Expand Down
40 changes: 18 additions & 22 deletions src/browser/ngTable.directive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,35 +45,31 @@ export function ngTable($q: IQService, $parse: IParseService) : IDirective {
scope: true,
controller: 'ngTableController',
compile: function(element: IAugmentedJQuery) {
var columns: IColumnDef[] = [],
let columns: IColumnDef[] = [],
i = 0,
dataRow: IAugmentedJQuery,
groupRow: IAugmentedJQuery,
rows: IAugmentedJQuery[] = [];
dataRow: JQuery,
groupRow: JQuery
const rows: JQuery[] = [];

ng1.forEach(element.find('tr'), function(tr) {
ng1.forEach(element.find('tr'), (tr: JQuery) => {
rows.push(ng1.element(tr))
});
dataRow = rows.filter(function(tr){
return !tr.hasClass('ng-table-group');
})[0];
groupRow = rows.filter(function(tr){
return tr.hasClass('ng-table-group');
})[0];
dataRow = rows.filter(tr => !tr.hasClass('ng-table-group'))[0];
groupRow = rows.filter(tr => tr.hasClass('ng-table-group'))[0];

if (!dataRow) {
return undefined;
}
ng1.forEach(dataRow.find('td'), function(item) {
var el = ng1.element(item);
ng1.forEach(dataRow.find('td'), (item: JQuery) => {
const el = ng1.element(item);
if (el.attr('ignore-cell') && 'true' === el.attr('ignore-cell')) {
return;
}

var getAttrValue = function(attr: string){
const getAttrValue = function(attr: string){
return el.attr('x-data-' + attr) || el.attr('data-' + attr) || el.attr(attr);
};
var setAttrValue = function(attr: string, value: string){
const setAttrValue = function(attr: string, value: string){
if (el.attr('x-data-' + attr)){
el.attr('x-data-' + attr, value)
} else if (el.attr('data' + attr)){
Expand All @@ -83,21 +79,21 @@ export function ngTable($q: IQService, $parse: IParseService) : IDirective {
}
};

var parsedAttribute = function<T>(attr: string): IColumnField<T> {
var expr = getAttrValue(attr);
const parsedAttribute = function<T>(attr: string): IColumnField<T> {
const expr = getAttrValue(attr);
if (!expr){
return undefined;
}

var localValue: any;
var getter = function (context: ColumnFieldContext) {
let localValue: any;
const getter = (context: ColumnFieldContext) => {
if (localValue !== undefined){
return localValue as T;
}
return $parse(expr)(context) as T;
};
(getter as any).assign = function($scope: ColumnFieldContext, value: any){
var parsedExpr = $parse(expr);
(getter as any).assign = ($scope: ColumnFieldContext, value: any) => {
const parsedExpr = $parse(expr);
if (parsedExpr.assign) {
// we should be writing back to the parent scope as this is where the expression
// came from
Expand All @@ -108,7 +104,7 @@ export function ngTable($q: IQService, $parse: IParseService) : IDirective {
};
return getter as IColumnField<T>;
};
var titleExpr = getAttrValue('title-alt') || getAttrValue('title');
const titleExpr = getAttrValue('title-alt') || getAttrValue('title');
if (titleExpr){
el.attr('data-title-text', '{{' + titleExpr + '}}'); // this used in responsive table
}
Expand Down
66 changes: 31 additions & 35 deletions src/browser/ngTableColumn.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ function isScopeLike(object: any) {
* Service to construct a $column definition used by {@link ngTable ngTable} directive
*/
export class NgTableColumn<TCol extends IColumnDef | IDynamicTableColDef> {
static $inject : string[] = [];
static $inject: string[] = [];

/**
* Creates a $column for use within a header template
Expand All @@ -34,9 +34,9 @@ export class NgTableColumn<TCol extends IColumnDef | IDynamicTableColDef> {
*/
buildColumn(column: TCol, defaultScope: IScope, columns: IColumnDef[]): IColumnDef {
// note: we're not modifying the original column object. This helps to avoid unintended side affects
var extendedCol = Object.create(column);
var defaults = this.createDefaults();
for (var prop in defaults) {
const extendedCol = Object.create(column);
const defaults = this.createDefaults();
for (const prop in defaults) {
if (extendedCol[prop] === undefined) {
extendedCol[prop] = defaults[prop];
}
Expand All @@ -45,40 +45,36 @@ export class NgTableColumn<TCol extends IColumnDef | IDynamicTableColDef> {
// - this is to ensure consistency with how ngTable.compile builds columns
// - note that the original column object is being "proxied"; this is important
// as it ensure that any changes to the original object will be returned by the "getter"
(function (prop1: string) {
var getterSetter = function getterSetter(/*[value] || [$scope, locals]*/) {
if (arguments.length === 1 && !isScopeLike(arguments[0])) {
(getterSetter as any).assign(null, arguments[0]);
} else {
return column[prop1];
}
};
(getterSetter as any).assign = function ($scope: IScope, value: any) {
column[prop1] = value;
};
extendedCol[prop1] = getterSetter;
})(prop);
}
(function (prop1: string) {
// satisfy the arguments expected by the function returned by parsedAttribute in the ngTable directive
var getterFn = extendedCol[prop1];
extendedCol[prop1] = function () {
const getterSetter = function getterSetter(/*[value] || [$scope, locals]*/) {
if (arguments.length === 1 && !isScopeLike(arguments[0])) {
getterFn.assign(null, arguments[0]);
(getterSetter as any).assign(null, arguments[0]);
} else {
var scope = arguments[0] || defaultScope;
var context = Object.create(scope);
ng1.extend(context, {
$column: extendedCol,
$columns: columns
});
return getterFn.call(column, context);
return column[prop];
}
};
if (getterFn.assign) {
extendedCol[prop1].assign = getterFn.assign;
(getterSetter as any).assign = function ($scope: IScope, value: any) {
column[prop] = value;
};
extendedCol[prop] = getterSetter;
}
// satisfy the arguments expected by the function returned by parsedAttribute in the ngTable directive
const getterFn = extendedCol[prop];
extendedCol[prop] = function () {
if (arguments.length === 1 && !isScopeLike(arguments[0])) {
getterFn.assign(null, arguments[0]);
} else {
const scope = arguments[0] || defaultScope;
const context = Object.create(scope);
ng1.extend(context, {
$column: extendedCol,
$columns: columns
});
return getterFn.call(column, context);
}
})(prop);
};
if (getterFn.assign) {
extendedCol[prop].assign = getterFn.assign;
}
}
return extendedCol as IColumnDef;
}
Expand All @@ -99,8 +95,8 @@ export class NgTableColumn<TCol extends IColumnDef | IDynamicTableColDef> {
}

private createGetterSetter(initialValue: any) {
var value = initialValue;
var getterSetter = function getterSetter(/*[value] || [$scope, locals]*/) {
let value = initialValue;
const getterSetter = function getterSetter(/*[value] || [$scope, locals]*/) {
if (arguments.length === 1 && !isScopeLike(arguments[0])) {
(getterSetter as any).assign(null, arguments[0]);
} else {
Expand Down
8 changes: 4 additions & 4 deletions src/browser/ngTableColumnsBinding.directive.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,18 +33,18 @@ ngTableColumnsBinding.$inject = ["$parse"];
* ```
*/
export function ngTableColumnsBinding<T>($parse: IParseService) : IDirective {
var directive = {
const directive = {
restrict: 'A',
require: 'ngTable',
link: linkFn
};
return directive;

function linkFn($scope: ITableScope<T>, $element: IAugmentedJQuery, $attrs: IInputAttributes){
var setter = $parse($attrs.ngTableColumnsBinding).assign;
const setter = $parse($attrs.ngTableColumnsBinding).assign;
if (setter){
$scope.$watch<IColumnDef[]>('$columns', function(newColumns){
var shallowClone = (newColumns || []).slice(0);
$scope.$watch<IColumnDef[]>('$columns', newColumns => {
const shallowClone = (newColumns || []).slice(0);
setter($scope, shallowClone);
});
}
Expand Down
34 changes: 17 additions & 17 deletions src/browser/ngTableController.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -67,7 +67,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
private ngTableColumn: NgTableColumn<TCol>,
private ngTableEventsChannel: NgTableEventsChannel) {

var isFirstTimeLoad = true;
const isFirstTimeLoad = true;
$scope.$filterRow = { disabled: false };
$scope.$loading = false;

Expand All @@ -79,7 +79,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
}

this.delayFilter = (function () {
var timer: IPromise<any>;
let timer: IPromise<any>;
return (callback: () => void, ms: number) => {
$timeout.cancel(timer);
timer = $timeout(callback, ms);
Expand All @@ -106,11 +106,11 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
return;
}

var currentParams = this.$scope.params;
var filterOptions = currentParams.settings().filterOptions;
const currentParams = this.$scope.params;
const filterOptions = currentParams.settings().filterOptions;

if (currentParams.hasFilterChanges()) {
var applyFilter = () => {
const applyFilter = () => {
currentParams.page(1);
currentParams.reload();
};
Expand All @@ -131,10 +131,10 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
pagination: (this.$attrs.templatePagination ? this.$attrs.templatePagination : 'ng-table/pager.html')
};
this.$element.addClass('ng-table');
var headerTemplate: IAugmentedJQuery = null;
let headerTemplate: IAugmentedJQuery = null;

// $element.find('> thead').length === 0 doesn't work on jqlite
var theadFound = false;
let theadFound = false;
ng1.forEach(this.$element.children(), (e) => {
if (e.tagName === 'THEAD') {
theadFound = true;
Expand All @@ -144,7 +144,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
headerTemplate = ng1.element('<thead ng-include="templates.header"></thead>', this.$document);
this.$element.prepend(headerTemplate);
}
var paginationTemplate = ng1.element(
const paginationTemplate = ng1.element(
'<div ng-table-pagination="params" template-url="templates.pagination"></div>',
this.$document
);
Expand All @@ -158,15 +158,15 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC

loadFilterData($columns: IColumnDef[]) {
ng1.forEach($columns, ($column) => {
var result = $column.filterData(this.$scope);
const result = $column.filterData(this.$scope);
if (!result) {
delete $column.filterData;
return undefined;
}

if (isPromiseLike(result)) {
delete $column.filterData;
return result.then(function (data) {
return result.then(data => {
// our deferred can eventually return arrays, functions and objects
if (!ng1.isArray(data) && !ng1.isFunction(data) && !ng1.isObject(data)) {
// if none of the above was found - we just want an empty array
Expand All @@ -188,7 +188,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC

buildColumns(columns: TCol[]): IColumnDef[] {
// todo: use strictNullChecks and remove guard clause
var result: IColumnDef[] = [];
const result: IColumnDef[] = [];
(columns || []).forEach(col => {
result.push(this.ngTableColumn.buildColumn(col, this.$scope, result));
});
Expand All @@ -197,7 +197,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC

parseNgTableDynamicExpr(attr: string) {
if (!attr || attr.indexOf(" with ") > -1) {
var parts = attr.split(/\s+with\s+/);
const parts = attr.split(/\s+with\s+/);
return {
tableParams: parts[0],
columns: parts[1]
Expand Down Expand Up @@ -246,7 +246,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
private setupGroupRowBindingsToInternalScope() {
this.$scope.$groupRow = { show: false };
if (this.$attrs.showGroup) {
var showGroupGetter = this.$parse(this.$attrs.showGroup);
const showGroupGetter = this.$parse(this.$attrs.showGroup);
this.$scope.$parent.$watch<boolean>(showGroupGetter, (value) => {
this.$scope.$groupRow.show = value;
});
Expand Down Expand Up @@ -277,7 +277,7 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC

this.ngTableEventsChannel.onAfterReloadData<TParams>(
(params, newDatapage) => {
var visibleColumns = this.getVisibleColumns();
const visibleColumns = this.getVisibleColumns();
if (params.hasGroup()) {
this.$scope.$groups = (newDatapage || []) as GroupedDataResults<TParams>;
this.$scope.$groups.visibleColumnCount = visibleColumns.length;
Expand All @@ -300,9 +300,9 @@ export class NgTableController<TParams, TCol extends IColumnDef | IDynamicTableC
}

private some<T>(array: T[], predicate: (item: T) => boolean) {
var found = false;
for (var i = 0; i < array.length; i++) {
var obj = array[i];
let found = false;
for (let i = 0; i < array.length; i++) {
const obj = array[i];
if (predicate(obj)) {
found = true;
break;
Expand Down
Loading

0 comments on commit a237e70

Please sign in to comment.