feat(build): ng-tables updated to common:

- style guide -release\build\ci flow Added tests runner BREAKING CHANGES: - selector changed from to ngTable to ng-table
valor-software · May 18, 2016 · 91c07af · 91c07af
1 parent 2cade91
commit 91c07af
Show file tree

Hide file tree

Showing 29 changed files with 631 additions and 314 deletions.
diff --git a/.config/bundle-system.js b/.config/bundle-system.js
@@ -0,0 +1,107 @@
+#!/usr/bin/env node
+'use strict';
+
+/*eslint no-console: 0, no-sync: 0*/
+
+// System.js bundler
+// simple and yet reusable system.js bundler
+// bundles, minifies and gzips
+
+const fs = require('fs');
+const del = require('del');
+const path = require('path');
+const zlib = require('zlib');
+const async = require('async');
+const Builder = require('systemjs-builder');
+
+const pkg = require('../package.json');
+const name = pkg.name;
+const targetFolder = path.resolve('./bundles');
+
+async.waterfall([
+  cleanBundlesFolder,
+  getSystemJsBundleConfig,
+  buildSystemJs({minify: false, sourceMaps: true, mangle: false}),
+  getSystemJsBundleConfig,
+  buildSystemJs({minify: true, sourceMaps: true, mangle: false}),
+  gzipSystemJsBundle
+], err => {
+  if (err) {
+    throw err;
+  }
+});
+
+function getSystemJsBundleConfig(cb) {
+  const config = {
+    baseURL: '..',
+    transpiler: 'typescript',
+    typescriptOptions: {
+      module: 'cjs'
+    },
+    map: {
+      typescript: path.resolve('node_modules/typescript/lib/typescript.js'),
+      '@angular/core': path.resolve('node_modules/@angular/core/index.js'),
+      '@angular/common': path.resolve('node_modules/@angular/common/index.js'),
+      '@angular/compiler': path.resolve('node_modules/@angular/compiler/index.js'),
+      '@angular/platform-browser': path.resolve('node_modules/@angular/platform-browser/index.js'),
+      '@angular/platform-browser-dynamic': path.resolve('node_modules/@angular/platform-browser-dynamic/'),
+      rxjs: path.resolve('node_modules/rxjs')
+    },
+    paths: {
+      '*': '*.js'
+    }
+  };
+
+  config.meta = ['@angular/common','@angular/compiler','@angular/core',
+    '@angular/platform-browser','@angular/platform-browser-dynamic', 'rxjs'].reduce((memo, currentValue) => {
+    memo[path.resolve(`node_modules/${currentValue}/*`)] = {build: false};
+    return memo;
+  }, {});
+  config.meta.moment = {build: false};
+  return cb(null, config);
+}
+
+function cleanBundlesFolder(cb) {
+  return del(targetFolder)
+    .then(paths => {
+      console.log('Deleted files and folders:\n', paths.join('\n'));
+      cb();
+    });
+}
+
+function buildSystemJs(options) {
+  return (config, cb) => {
+    const minPostFix = options && options.minify ? '.min' : '';
+    const fileName = `${name}${minPostFix}.js`;
+    const dest = path.resolve(__dirname, targetFolder, fileName);
+    const builder = new Builder();
+
+    console.log('Bundling system.js file:', fileName, options);
+    builder.config(config);
+    return builder
+      .bundle([name, name].join('/'), dest, options)
+      .then(() => cb())
+      .catch(cb);
+  };
+}
+
+function gzipSystemJsBundle(cb) {
+  const files = fs
+    .readdirSync(path.resolve(targetFolder))
+    .map(file => path.resolve(targetFolder, file))
+    .filter(file => fs.statSync(file).isFile())
+    .filter(file => path.extname(file) !== 'gz');
+
+  return async.eachSeries(files, (file, gzipcb) => {
+    process.nextTick(() => {
+      console.log('Gzipping ', file);
+      const gzip = zlib.createGzip({level: 9});
+      const inp = fs.createReadStream(file);
+      const out = fs.createWriteStream(`${file}.gz`);
+
+      inp.on('end', () => gzipcb());
+      inp.on('error', err => gzipcb(err));
+      return inp.pipe(gzip).pipe(out);
+    });
+  }, cb);
+}
diff --git a/.eslintrc.json b/.eslintrc.json
@@ -0,0 +1,6 @@
+{
+  "extends": "./node_modules/eslint-config-valorsoft/.eslintrc.json",
+  "env": {
+    "node": true
+  }
+}
diff --git a/.gitignore b/.gitignore
@@ -10,11 +10,15 @@ npm-debug.log
 .idea
 
 # ignore build and dist for now
-/build
+/bundles
+/demo-build
 /dist
+/coverage
+/ts
 
 /demo/**/*.js
 /demo/**/*.js.map
+/demo/**/*.d.ts
 /components/**/*.js
 /components/**/*.js.map
 /components/**/*.d.ts

diff --git a/.npmignore b/.npmignore
@@ -1,9 +1,24 @@
 .idea
-demo
 gulp-tasks
 logs
 
-tsd.d.ts
+# typings
 typings
 
+# testing
+karma.conf.js
+test.bundle.js
+coverage
+
+# demo build
+demo
+demo-build
 webpack.config.js
+
+#typescript sources
+*.ts
+*.js.map
+!*.d.ts
+/components/**/*.ts
+!/components/**/*.d.ts
+
diff --git a/.travis.yml b/.travis.yml
@@ -0,0 +1,21 @@
+language: node_js
+node_js:
+  - "6"
+
+script:
+  - npm run flow.install:typings
+  - npm test
+
+after_success:
+  - ./node_modules/.bin/codecov
+
+addons:
+  # sauce labs tunel connector (read more https://docs.travis-ci.com/user/sauce-connect/ )
+  sauce_connect: true
+  firefox: "42.0"
+  apt:
+    sources:
+    - ubuntu-toolchain-r-test
+    # required by node-gyp to build some packages
+    packages:
+    - g++-4.8
diff --git a/LICENSE b/LICENSE
@@ -1,7 +1,7 @@
 The MIT License (MIT)
 
-Copyright (c) 2015 Dmitriy Shekhovtsov <valorkin@gmail.com>
-Copyright (c) 2015 Valor Software
+Copyright (c) 2015-2016 Dmitriy Shekhovtsov <valorkin@gmail.com>
+Copyright (c) 2015-2016 Valor Software
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

diff --git a/README.md b/README.md
@@ -1,8 +1,10 @@
 # ng2-table [![npm version](https://badge.fury.io/js/ng2-table.svg)](http://badge.fury.io/js/ng2-table)
 Simple table extension with sorting, filtering, paging... for Angular2 apps
 
-Follow me at [twitter](https://twitter.com/valorkin) to be notified about new releases.
+Follow me [![twitter](https://img.shields.io/twitter/follow/valorkin.svg?style=social&label=%20valorkin)](https://twitter.com/valorkin) to be notified about new releases.
 
+[![Angular 2 Style Guide](https://mgechev.github.io/angular2-style-guide/images/badge.svg)](https://github.com/mgechev/angular2-style-guide)
+[![Build Status](https://travis-ci.org/valor-software/ng2-table.svg?branch=master)](https://travis-ci.org/valor-software/ng2-table)
 [![Code Climate](https://codeclimate.com/github/valor-software/ng2-table/badges/gpa.svg)](https://codeclimate.com/github/valor-software/ng2-table)
 [![Join the chat at https://gitter.im/valor-software/ng2-bootstrap](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/valor-software/ng2-bootstrap?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
 [![Dependency Status](https://david-dm.org/valor-software/ng2-table.svg)](https://david-dm.org/valor-software/ng2-table)
@@ -15,18 +17,20 @@ Follow me at [twitter](https://twitter.com/valorkin) to be notified about new re
 
 - - -
 
-## Quick start
+## Installation
 
 1. A recommended way to install ***ng2-table*** is through [npm](https://www.npmjs.com/search?q=ng2-table) package manager using the following command:
 
-  `npm i ng2-table --save`
+  ```bash
+  npm i ng2-table --save
+  ```
 
   Alternatively, you can [download it in a ZIP file](https://github.com/valor-software/ng2-table/archive/master.zip).
 
 2. More information regarding using of ***ng2-table*** is located in
   [demo](http://valor-software.github.io/ng2-table/) and [demo sources](https://github.com/valor-software/ng2-table/tree/master/demo).
 
-## API
+## Documentation
 
 ### Inputs (Properties)
 

diff --git a/components/ng-table-directives.ts b/components/ng-table-directives.ts
@@ -1,5 +1,5 @@
-import {NgTable} from './table/ng-table.component';
-import {NgTableFiltering} from './table/ng-table-filtering.directive';
-import {NgTablePaging} from './table/ng-table-paging.directive';
-import {NgTableSorting} from './table/ng-table-sorting.directive';
-export const NG_TABLE_DIRECTIVES = [NgTable, NgTableFiltering, NgTablePaging, NgTableSorting];
+import {NgTableComponent} from './table/ng-table.component';
+import {NgTableFilteringDirective} from './table/ng-table-filtering.directive';
+import {NgTablePagingDirective} from './table/ng-table-paging.directive';
+import {NgTableSortingDirective} from './table/ng-table-sorting.directive';
+export const NG_TABLE_DIRECTIVES = [NgTableComponent, NgTableFilteringDirective, NgTablePagingDirective, NgTableSortingDirective];
diff --git a/components/table/ng-table-filtering.directive.ts b/components/table/ng-table-filtering.directive.ts
@@ -1,33 +1,41 @@
-import {Directive, EventEmitter, ElementRef, Renderer} from '@angular/core';
-import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from '@angular/common';
+import {Directive, EventEmitter, ElementRef, Renderer, HostListener, Input, Output} from '@angular/core';
 
 // import {setProperty} from 'angular2/ts/src/core/forms/directives/shared';
-function setProperty(renderer:Renderer, elementRef:ElementRef, propName:string, propValue:any) {
+function setProperty(renderer:Renderer, elementRef:ElementRef, propName:string, propValue:any):void {
   renderer.setElementProperty(elementRef, propName, propValue);
 }
 
-@Directive({
-  selector: '[ngTableFiltering]',
-  inputs: ['config: ngTableFiltering'],
-  outputs: ['tableChanged'],
-  host: {
-    '(input)': 'onChangeFilter($event.target.value)'
-  }
-})
-export class NgTableFiltering {
-  public config:any = {
+@Directive({selector: '[ngTableFiltering]'})
+export class NgTableFilteringDirective {
+  @Input() public ngTableFiltering:any = {
     filterString: '',
     columnName: 'name'
   };
-  public tableChanged:EventEmitter<any> = new EventEmitter();
 
-  constructor(private element:ElementRef, private renderer:Renderer) {
-    // Set default value for filter
-    setProperty(this.renderer, this.element, 'value', this.config.filterString);
+  @Output() public tableChanged:EventEmitter<any> = new EventEmitter();
+
+  @Input()
+  public get config():any {
+    return this.ngTableFiltering;
+  }
+
+  public set config(value:any) {
+    this.ngTableFiltering = value;
   }
 
-  onChangeFilter(event:any) {
-    this.config.filterString = event;
-    this.tableChanged.emit({filtering: this.config});
+  private element:ElementRef;
+  private renderer:Renderer;
+
+  @HostListener('input', ['$event.target.value'])
+  public onChangeFilter(event:any):void {
+    this.ngTableFiltering.filterString = event;
+    this.tableChanged.emit({filtering: this.ngTableFiltering});
+  }
+
+  public constructor(element:ElementRef, renderer:Renderer) {
+    this.element = element;
+    this.renderer = renderer;
+    // Set default value for filter
+    setProperty(this.renderer, this.element, 'value', this.ngTableFiltering.filterString);
   }
 }
diff --git a/components/table/ng-table-paging.directive.ts b/components/table/ng-table-paging.directive.ts
@@ -1,21 +1,23 @@
-import {Directive, EventEmitter, ElementRef, Renderer} from '@angular/core';
-import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass} from '@angular/common';
+import {Directive, EventEmitter, Input, Output, HostListener} from '@angular/core';
 
-@Directive({
-  selector: '[ngTablePaging]',
-  inputs: ['config: ngTablePaging'],
-  outputs: ['tableChanged'],
-  host: {
-    '(pagechanged)': 'onChangePage($event)'
+@Directive({selector: '[ngTablePaging]'})
+export class NgTablePagingDirective {
+  @Input() public ngTablePaging:boolean = true;
+  @Output() public tableChanged:EventEmitter<any> = new EventEmitter();
+
+  @Input()
+  public get config():any {
+    return this.ngTablePaging;
+  }
+
+  public set config(value:any) {
+    this.ngTablePaging = value;
   }
-})
-export class NgTablePaging {
-  public config:boolean = true;
-  public tableChanged:EventEmitter<any> = new EventEmitter();
 
-  onChangePage(event:any) {
+  @HostListener('pagechanged', ['$event'])
+  public onChangePage(event:any):void {
     // Object.assign(this.config, event);
-    if (this.config) {
+    if (this.ngTablePaging) {
       this.tableChanged.emit({paging: event});
     }
   }

diff --git a/components/table/ng-table-sorting.directive.ts b/components/table/ng-table-sorting.directive.ts
@@ -1,25 +1,27 @@
-import {Directive, EventEmitter} from '@angular/core';
-import {FORM_DIRECTIVES, CORE_DIRECTIVES, NgClass} from '@angular/common';
+import {Directive, EventEmitter, Input, Output, HostListener} from '@angular/core';
 
-@Directive({
-  selector: '[ngTableSorting]',
-  inputs: ['config: ngTableSorting', 'column'],
-  outputs: ['sortChanged'],
-  host: {
-    '(click)': 'onToggleSort($event, $target)'
+@Directive({selector: '[ngTableSorting]'})
+export class NgTableSortingDirective {
+  @Input() public ngTableSorting:any;
+  @Input() public column:any;
+  @Output() public sortChanged:EventEmitter<any> = new EventEmitter();
+
+  @Input()
+  public get config():any {
+    return this.ngTableSorting;
+  }
+
+  public set config(value:any) {
+    this.ngTableSorting = value;
   }
-})
-export class NgTableSorting {
-  public config:any;
-  public column:any;
-  public sortChanged:EventEmitter<any> = new EventEmitter();
 
-  onToggleSort(event:any) {
+  @HostListener('click', ['$event', '$target'])
+  public onToggleSort(event:any):void {
     if (event) {
       event.preventDefault();
     }
 
-    if (this.config && this.column && this.column.sort !== false) {
+    if (this.ngTableSorting && this.column && this.column.sort !== false) {
       switch (this.column.sort) {
         case 'asc':
           this.column.sort = 'desc';

diff --git a/components/table/ng-table.component.spec.ts b/components/table/ng-table.component.spec.ts
@@ -0,0 +1,12 @@
+import {it, expect, describe, inject, beforeEachProviders} from '@angular/core/testing';
+import {ComponentFixture} from '@angular/compiler/testing';
+import {NgTableComponent} from './ng-table.component';
+
+describe('Directive: FileSelectDirective', () => {
+  beforeEachProviders(() => [
+    NgTableComponent
+  ]);
+  it('should be fine', inject([NgTableComponent], (fixture:ComponentFixture<NgTableComponent>) => {
+    expect(fixture).not.toBeNull();
+  }));
+});