dc/ng2-file-upload
4
0
Fork 0
Code Issues 395 Pull Requests 27 Packages Projects Releases 4 Wiki Activity

Feat RC.6 #379

Merged
adrianfaciu merged 4 commits from feat-rc6 into development 2016-09-15 07:46:23 +00:00
Conversation 10 Commits 4 Files Changed 10 +127 -114
10 changed files with 127 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
components/file-upload/file-drop.directive.spec.ts
View File

@@ -1,20 +1,27 @@
import {Component} from '@angular/core'; import { Component} from '@angular/core';
import {it, inject, beforeEachProviders} from '@angular/core/testing'; import { inject, ComponentFixture, TestBed } from '@angular/core/testing';
import {ComponentFixture} from '@angular/compiler/testing';
import {FileUploader} from './file-uploader.class'; import { FileUploader } from './file-uploader.class';
import {FileSelectDirective} from './file-select.directive'; import { FileUploadModule } from './file-upload.module';
@Component({ @Component({
selector: 'container', selector: 'container',
template: `<input type="file" ng2FileSelect [uploader]="uploader" />`, template: `<input type="file" ng2FileSelect [uploader]="uploader" />`
directives: [FileSelectDirective]
}) })
export class ContainerComponent { export class ContainerComponent {
public uploader:FileUploader = new FileUploader({url: 'localhost:3000'}); public uploader:FileUploader = new FileUploader({url: 'localhost:3000'});
} }
describe('Directive: FileSelectDirective', () => { describe('Directive: FileSelectDirective', () => {
beforeEachProviders(() => [
ContainerComponent beforeEach(() => {
]); TestBed.configureTestingModule({
imports: [FileUploadModule],
declarations: [ContainerComponent],
providers: [ContainerComponent]
});
});
it('should be fine', inject([ContainerComponent], (fixture:ComponentFixture<ContainerComponent>) => { it('should be fine', inject([ContainerComponent], (fixture:ComponentFixture<ContainerComponent>) => {
expect(fixture).not.toBeNull(); expect(fixture).not.toBeNull();
})); }));

13
components/file-upload/file-upload.module.ts Normal file
View File

@@ -0,0 +1,13 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FileDropDirective } from './file-drop.directive';
import { FileSelectDirective } from './file-select.directive';
@NgModule({
imports: [CommonModule],
declarations: [FileDropDirective, FileSelectDirective],
exports: [FileDropDirective, FileSelectDirective]
})
export class FileUploadModule {
}

34
demo/app.component.ts Normal file
View File

@@ -0,0 +1,34 @@
import {Component} from '@angular/core';
let gettingStarted = require('./getting-started.md');
@Component({
selector: 'app',
template: `
<main class="bd-pageheader">
<div class="container">
<h1>ng2-file-upload</h1>
<p>The Angular2 File Upload directives</p>
<a class="btn btn-primary" href="https://github.com/valor-software/ng2-file-upload">View on GitHub</a>
<div class="row">
<div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
<div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
</div>
</div>
</main>
<div class="container">
<section id="getting-started">${gettingStarted}</section>
<file-upload-section class="col-md-12"></file-upload-section>
</div>
<footer class="footer">
<div class="container">
<p class="text-muted text-center"><a href="https://github.com/valor-software/ng2-file-upload">ng2-file-upload</a> is maintained by <a href="https://github.com/valor-software">valor-software</a>.</p>
</div>
</footer>
`
})
export class DemoComponent {
}

44
demo/components/file-upload-section.ts
View File

@@ -1,10 +1,5 @@
import {Component} from '@angular/core'; import {Component} from '@angular/core';
import {CORE_DIRECTIVES} from '@angular/common';
import {TAB_DIRECTIVES} from 'ng2-bootstrap/ng2-bootstrap';
import {SimpleDemoComponent} from './file-upload/simple-demo';
let name = 'File Upload';
let doc = require('../../components/file-upload/readme.md'); let doc = require('../../components/file-upload/readme.md');
let tabDesc:Array<any> = [ let tabDesc:Array<any> = [
@@ -16,13 +11,16 @@ let tabDesc:Array<any> = [
} }
]; ];
let tabsContent:string = ``; @Component({
tabDesc.forEach((desc:any) => { selector: 'file-upload-section',
tabsContent += ` template: `
<tab heading="${desc.heading}" (select)="select($event)"> <section [id]="name.toLowerCase()">
<div class="row">
<tabset>
<tab *ngFor="let desc of tabs" heading="{{desc.heading}}" (select)="select($event)">
<div class="card card-block panel panel-default panel-body"> <div class="card card-block panel panel-default panel-body">
<${desc.heading.toLowerCase()}-demo *ngIf="currentHeading === '${desc.heading}'"></${desc.heading.toLowerCase()}-demo> <simple-demo></simple-demo>
<br> <br>
@@ -30,48 +28,38 @@ tabDesc.forEach((desc:any) => {
<tabset> <tabset>
<tab heading="Markup"> <tab heading="Markup">
<div class="card card-block panel panel-default panel-body"> <div class="card card-block panel panel-default panel-body">
<pre class="language-html"><code class="language-html" ng-non-bindable>${desc.html}</code></pre> <pre class="language-html"><code class="language-html" ng-non-bindable [innerHTML]="desc.html"></code></pre>
</div> </div>
</tab> </tab>
<tab heading="TypeScript"> <tab heading="TypeScript">
<div class="card card-block panel panel-default panel-body"> <div class="card card-block panel panel-default panel-body">
<pre class="language-typescript"><code class="language-typescript" ng-non-bindable>${desc.ts}</code></pre> <pre class="language-typescript"><code class="language-typescript" ng-non-bindable [innerHTML]="desc.ts"></code></pre>
</div> </div>
</tab> </tab>
<tab heading="Backend Demo"> <tab heading="Backend Demo">
<div class="card card-block panel panel-default panel-body"> <div class="card card-block panel panel-default panel-body">
<pre class="language-javascript"><code class="language-javascript" ng-non-bindable>${desc.js}</code></pre> <pre class="language-javascript"><code class="language-javascript" ng-non-bindable [innerHTML]="desc.js"></code></pre>
</div> </div>
</tab> </tab>
</tabset> </tabset>
</div> </div>
</div> </div>
</tab> </tab>
`;
});
@Component({
selector: 'file-upload-section',
template: `
<section id="${name.toLowerCase()}">
<div class="row">
<tabset>
${tabsContent}
</tabset> </tabset>
</div> </div>
<div class="row"> <div class="row">
<h2>API</h2> <h2>API</h2>
<div class="card card-block panel panel-default panel-body">${doc}</div> <div class="card card-block panel panel-default panel-body" [innerHTML]="doc"></div>
</div> </div>
</section> </section>
`, `
directives: [SimpleDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES]
}) })
export class FileUploadSectionComponent { export class FileUploadSectionComponent {
public name:string = 'File Upload';
public currentHeading:string = 'Simple'; public currentHeading:string = 'Simple';
public doc:string = doc;
public tabs:any = tabDesc;
public select(e:any):void { public select(e:any):void {
if (e.heading) { if (e.heading) {

8
demo/components/file-upload/simple-demo.ts
View File

@@ -1,6 +1,5 @@
import {Component} from '@angular/core'; import { Component } from '@angular/core';
import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgStyle} from '@angular/common'; import { FileUploader } from '../../../ng2-file-upload';
import {FILE_UPLOAD_DIRECTIVES, FileUploader} from '../../../ng2-file-upload';
// webpack html imports // webpack html imports
let template = require('./simple-demo.html'); let template = require('./simple-demo.html');
@@ -10,8 +9,7 @@ const URL = 'https://evening-anchorage-3159.herokuapp.com/api/';
@Component({ @Component({
selector: 'simple-demo', selector: 'simple-demo',
template: template, template: template
directives: [FILE_UPLOAD_DIRECTIVES, NgClass, NgStyle, CORE_DIRECTIVES, FORM_DIRECTIVES]
}) })
export class SimpleDemoComponent { export class SimpleDemoComponent {
public uploader:FileUploader = new FileUploader({url: URL}); public uploader:FileUploader = new FileUploader({url: URL});

46
demo/index.ts
View File

@@ -1,44 +1,4 @@
import {bootstrap} from '@angular/platform-browser-dynamic'; import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import {Component} from '@angular/core'; import { NgFileUploadDemo } from './ng2-file-upload-demo.module';
import {NgClass} from '@angular/common';
import {FileUploadSectionComponent} from './components/file-upload-section'; platformBrowserDynamic().bootstrapModule(NgFileUploadDemo);
let gettingStarted = require('./getting-started.md');
@Component({
selector: 'app',
template: `
<main class="bd-pageheader">
<div class="container">
<h1>ng2-file-upload</h1>
<p>The Angular2 File Upload directives</p>
<a class="btn btn-primary" href="https://github.com/valor-software/ng2-file-upload">View on GitHub</a>
<div class="row">
<div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=star&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
<div class="col-lg-1"><iframe src="https://ghbtns.com/github-btn.html?user=valor-software&repo=ng2-file-upload&type=fork&count=true" frameborder="0" scrolling="0" width="170px" height="20px"></iframe></div>
</div>
</div>
</main>
<div class="container">
<section id="getting-started">${gettingStarted}</section>
<file-upload-section class="col-md-12"></file-upload-section>
</div>
<footer class="footer">
<div class="container">
<p class="text-muted text-center"><a href="https://github.com/valor-software/ng2-file-upload">ng2-file-upload</a> is maintained by <a href="https://github.com/valor-software">valor-software</a>.</p>
</div>
</footer>
`,
directives: [
NgClass,
FileUploadSectionComponent
]
})
export class DemoComponent {
}
bootstrap(DemoComponent);

18
demo/ng2-file-upload-demo.module.ts Normal file
View File

@@ -0,0 +1,18 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { BrowserModule } from '@angular/platform-browser';
import { Ng2BootstrapModule } from 'ng2-bootstrap/ng2-bootstrap';
import { FileUploadModule } from '../components/file-upload/file-upload.module';
import { DemoComponent } from './app.component.ts';
import { FileUploadSectionComponent } from './components/file-upload-section';
import { SimpleDemoComponent } from './components/file-upload/simple-demo';
@NgModule({
imports: [BrowserModule, CommonModule, FileUploadModule, Ng2BootstrapModule, FormsModule],
declarations: [DemoComponent, FileUploadSectionComponent, SimpleDemoComponent],
bootstrap: [DemoComponent]
})
export class NgFileUploadDemo {
}

11
ng2-file-upload.ts
View File

@@ -2,13 +2,4 @@ export * from './components/file-upload/file-select.directive';
export * from './components/file-upload/file-drop.directive'; export * from './components/file-upload/file-drop.directive';
export * from './components/file-upload/file-uploader.class'; export * from './components/file-upload/file-uploader.class';
import {FileSelectDirective} from './components/file-upload/file-select.directive'; export { FileUploadModule } from './components/file-upload/file-upload.module';
import {FileDropDirective} from './components/file-upload/file-drop.directive';
export const FILE_UPLOAD_DIRECTIVES:[any] = [FileSelectDirective, FileDropDirective];
export default {
directives: [
FILE_UPLOAD_DIRECTIVES
]
};

21
package.json
View File

@@ -48,15 +48,16 @@
"homepage": "https://github.com/valor-software/ng2-file-upload#readme", "homepage": "https://github.com/valor-software/ng2-file-upload#readme",
"dependencies": {}, "dependencies": {},
"peerDependencies": { "peerDependencies": {
"@angular/common": "^2.0.0-rc.1", "@angular/common": "2.0.0-rc.6",
"@angular/core": "^2.0.0-rc.1" "@angular/core": "2.0.0-rc.6"
}, },
"devDependencies": { "devDependencies": {
"@angular/common": "^2.0.0-rc.1", "@angular/common": "2.0.0-rc.6",
"@angular/compiler": "^2.0.0-rc.1", "@angular/compiler": "2.0.0-rc.6",
"@angular/core": "^2.0.0-rc.1", "@angular/core": "2.0.0-rc.6",
"@angular/platform-browser": "^2.0.0-rc.1", "@angular/platform-browser": "2.0.0-rc.6",
"@angular/platform-browser-dynamic": "^2.0.0-rc.1", "@angular/platform-browser-dynamic": "2.0.0-rc.6",
"@angular/forms": "2.0.0-rc.6",
"async": "1.5.2", "async": "1.5.2",
"bootstrap": "3.3.6", "bootstrap": "3.3.6",
"codecov": "1.0.1", "codecov": "1.0.1",
@@ -92,7 +93,7 @@
"lite-server": "2.2.0", "lite-server": "2.2.0",
"markdown-loader": "0.1.7", "markdown-loader": "0.1.7",
"marked": "0.3.5", "marked": "0.3.5",
"ng2-bootstrap": "1.0.17", "ng2-bootstrap": "1.1.1",
"phantomjs-polyfill": "0.0.2", "phantomjs-polyfill": "0.0.2",
"phantomjs-prebuilt": "2.1.7", "phantomjs-prebuilt": "2.1.7",
"pre-commit": "1.1.3", "pre-commit": "1.1.3",
@@ -101,7 +102,7 @@
"raw-loader": "0.5.1", "raw-loader": "0.5.1",
"reflect-metadata": "0.1.2", "reflect-metadata": "0.1.2",
"require-dir": "0.3.0", "require-dir": "0.3.0",
"rxjs": "5.0.0-beta.6", "rxjs": "5.0.0-beta.11",
"source-map-loader": "0.1.5", "source-map-loader": "0.1.5",
"systemjs-builder": "0.15.19", "systemjs-builder": "0.15.19",
"ts-loader": "0.8.2", "ts-loader": "0.8.2",
@@ -110,7 +111,7 @@
"typings": "0.8.1", "typings": "0.8.1",
"webpack": "1.13.1", "webpack": "1.13.1",
"webpack-dev-server": "1.14.1", "webpack-dev-server": "1.14.1",
"zone.js": "0.6.12" "zone.js": "0.6.17"
}, },
"contributors": [ "contributors": [
{ {

19
test.bundle.js
View File

@@ -17,18 +17,21 @@ require('es6-promise');
require('es6-shim'); require('es6-shim');
require('es7-reflect-metadata/dist/browser'); require('es7-reflect-metadata/dist/browser');
// require('zone.js'); require('zone.js/dist/zone');
require('zone.js/dist/zone.js'); require('zone.js/dist/long-stack-trace-zone');
require('zone.js/dist/long-stack-trace-zone.js'); require('zone.js/dist/async-test');
require('zone.js/dist/jasmine-patch.js'); require('zone.js/dist/fake-async-test');
require('zone.js/dist/async-test.js'); require('zone.js/dist/sync-test');
require('zone.js/dist/proxy');
require('zone.js/dist/jasmine-patch');
var testing = require('@angular/core/testing'); var testing = require('@angular/core/testing');
var browser = require('@angular/platform-browser-dynamic/testing'); var browser = require('@angular/platform-browser-dynamic/testing');
testing.setBaseTestProviders( testing.TestBed.initTestEnvironment(
browser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, browser.BrowserDynamicTestingModule,
browser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); browser.platformBrowserDynamicTesting()
);
/* /*
Ok, this is kinda crazy. We can use the the context method on Ok, this is kinda crazy. We can use the the context method on