return process.argv.join('').indexOf(flag) > -1
}
+function isWebpackDevServer () {
+ return process.argv[1] && !!(/webpack-dev-server$/.exec(process.argv[1]))
+}
+
function root (args) {
args = Array.prototype.slice.call(arguments, 0)
return path.join.apply(path, [ROOT].concat(args))
}
exports.hasProcessFlag = hasProcessFlag
+exports.isWebpackDevServer = isWebpackDevServer
exports.root = root
* Webpack Plugins
*/
-var CopyWebpackPlugin = (CopyWebpackPlugin = require('copy-webpack-plugin'), CopyWebpackPlugin.default || CopyWebpackPlugin)
+const CopyWebpackPlugin = require('copy-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const ForkCheckerPlugin = require('awesome-typescript-loader').ForkCheckerPlugin
const WebpackNotifierPlugin = require('webpack-notifier')
*/
const METADATA = {
title: 'PeerTube',
- baseUrl: '/'
+ baseUrl: '/',
+ isDevServer: helpers.isWebpackDevServer()
}
/*
root: helpers.root('src'),
// remove other default values
- modulesDirectories: [ 'node_modules' ],
-
- packageAlias: 'browser'
-
+ modulesDirectories: [ 'node_modules' ]
},
output: {
*/
preLoaders: [
- /*
- * Tslint loader support for *.ts files
- *
- * See: https://github.com/wbuchwalter/tslint-loader
- */
- // { test: /\.ts$/, loader: 'tslint-loader', exclude: [ helpers.root('node_modules') ] },
-
- /*
- * Source map loader support for *.js files
- * Extracts SourceMaps for source files that as added as sourceMappingURL comment.
- *
- * See: https://github.com/webpack/source-map-loader
- */
{
- test: /\.js$/,
- loader: 'source-map-loader',
- exclude: [
- // these packages have problems with their sourcemaps
- helpers.root('node_modules/rxjs'),
- helpers.root('node_modules/@angular')
- ]
+ test: /\.ts$/,
+ loader: 'string-replace-loader',
+ query: {
+ search: '(System|SystemJS)(.*[\\n\\r]\\s*\\.|\\.)import\\((.+)\\)',
+ replace: '$1.import($3).then(mod => mod.__esModule ? mod.default : mod)',
+ flags: 'g'
+ },
+ include: [helpers.root('src')]
}
],
*/
{
test: /\.ts$/,
- loader: 'awesome-typescript-loader',
+ loaders: [
+ 'awesome-typescript-loader',
+ 'angular2-template-loader',
+ '@angularclass/hmr-loader'
+ ],
exclude: [/\.(spec|e2e)\.ts$/]
},
*/
new ForkCheckerPlugin(),
- /*
- * Plugin: OccurenceOrderPlugin
- * Description: Varies the distribution of the ids to get the smallest id length
- * for often used ids.
- *
- * See: https://webpack.github.io/docs/list-of-plugins.html#occurrenceorderplugin
- * See: https://github.com/webpack/docs/wiki/optimization#minimize
- */
- new webpack.optimize.OccurenceOrderPlugin(true),
-
/*
* Plugin: CommonsChunkPlugin
* Description: Shares common code between the pages.
* Webpack Plugins
*/
const DefinePlugin = require('webpack/lib/DefinePlugin')
+const NamedModulesPlugin = require('webpack/lib/NamedModulesPlugin')
/**
* Webpack Constants
*/
const ENV = process.env.ENV = process.env.NODE_ENV = 'development'
+const HOST = process.env.HOST || 'localhost'
+const PORT = process.env.PORT || 3000
const HMR = helpers.hasProcessFlag('hot')
const METADATA = webpackMerge(commonConfig.metadata, {
- host: 'localhost',
- port: 3000,
+ host: HOST,
+ port: PORT,
ENV: ENV,
HMR: HMR
})
*
* See: http://webpack.github.io/docs/configuration.html#output-chunkfilename
*/
- chunkFilename: '[id].chunk.js'
+ chunkFilename: '[id].chunk.js',
+
+ library: 'ac_[name]',
+ libraryTarget: 'var'
},
'NODE_ENV': JSON.stringify(METADATA.ENV),
'HMR': METADATA.HMR
}
- })
+ }),
+
+ new NamedModulesPlugin()
],
/**
resourcePath: 'src'
},
+ devServer: {
+ port: METADATA.port,
+ host: METADATA.host,
+ historyApiFallback: true,
+ watchOptions: {
+ aggregateTimeout: 300,
+ poll: 1000
+ },
+ outputPath: helpers.root('dist')
+ },
+
/*
* Include polyfills or mocks for various node stuff
* Description: Node configuration
/**
* Webpack Plugins
*/
+// const ProvidePlugin = require('webpack/lib/ProvidePlugin')
const DefinePlugin = require('webpack/lib/DefinePlugin')
-const DedupePlugin = require('webpack/lib/optimize/DedupePlugin')
+const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin')
+// const IgnorePlugin = require('webpack/lib/IgnorePlugin')
+// const DedupePlugin = require('webpack/lib/optimize/DedupePlugin')
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin')
-const CompressionPlugin = require('compression-webpack-plugin')
const WebpackMd5Hash = require('webpack-md5-hash')
/**
* See: https://webpack.github.io/docs/list-of-plugins.html#defineplugin
* See: https://github.com/webpack/docs/wiki/optimization#deduplication
*/
- new DedupePlugin(),
+ // new DedupePlugin(),
/**
* Plugin: DefinePlugin
// comments: true, //debug
beautify: false, // prod
-
- mangle: {
- screw_ie8: true,
- keep_fnames: true
- }, // prod
-
- compress: {
- screw_ie8: true
- }, // prod
-
+ mangle: { screw_ie8: true, keep_fnames: true }, // prod
+ compress: { screw_ie8: true }, // prod
comments: false // prod
}),
+ new NormalModuleReplacementPlugin(
+ /angular2-hmr/,
+ helpers.root('config/modules/angular2-hmr-prod.js')
+ ),
+
/**
* Plugin: CompressionPlugin
* Description: Prepares compressed versions of assets to serve
"url": "git://github.com/Chocobozzz/PeerTube.git"
},
"scripts": {
- "postinstall": "typings install",
"test": "standard && tslint -c ./tslint.json src/**/*.ts",
"webpack": "webpack"
},
"license": "GPLv3",
"dependencies": {
- "@angular/common": "2.0.0-rc.4",
- "@angular/compiler": "2.0.0-rc.4",
- "@angular/core": "2.0.0-rc.4",
- "@angular/forms": "^0.2.0",
- "@angular/http": "2.0.0-rc.4",
- "@angular/platform-browser": "2.0.0-rc.4",
- "@angular/platform-browser-dynamic": "2.0.0-rc.4",
- "@angular/router": "3.0.0-beta.2",
- "angular-pipes": "^2.0.0",
- "awesome-typescript-loader": "^0.17.0",
+ "@angular/common": "2.0.0-rc.6",
+ "@angular/compiler": "2.0.0-rc.6",
+ "@angular/core": "2.0.0-rc.6",
+ "@angular/forms": "2.0.0-rc.6",
+ "@angular/http": "2.0.0-rc.6",
+ "@angular/platform-browser": "2.0.0-rc.6",
+ "@angular/platform-browser-dynamic": "2.0.0-rc.6",
+ "@angular/router": "3.0.0-rc.2",
+ "@angularclass/hmr": "^1.0.1",
+ "@angularclass/hmr-loader": "^1.0.1",
+ "@types/core-js": "^0.9.28",
+ "@types/node": "^6.0.38",
+ "@types/source-map": "^0.1.26",
+ "@types/uglify-js": "^2.0.27",
+ "@types/webpack": "^1.12.29",
+ "angular-pipes": "^3.0.0",
+ "angular2-template-loader": "^0.5.0",
+ "awesome-typescript-loader": "^2.2.1",
"bootstrap-loader": "^1.0.8",
"bootstrap-sass": "^3.3.6",
"compression-webpack-plugin": "^0.3.1",
"ie-shim": "^0.1.0",
"intl": "^1.2.4",
"json-loader": "^0.5.4",
- "ng2-bootstrap": "1.0.24",
+ "ng2-bootstrap": "1.1.1",
"ng2-file-upload": "^1.0.3",
"node-sass": "^3.7.0",
"normalize.css": "^4.1.1",
"raw-loader": "^0.5.1",
"reflect-metadata": "0.1.3",
"resolve-url-loader": "^1.4.3",
- "rxjs": "5.0.0-beta.6",
+ "rxjs": "5.0.0-beta.11",
"sass-loader": "^3.2.0",
"source-map-loader": "^0.1.5",
+ "string-replace-loader": "^1.0.3",
"style-loader": "^0.13.1",
"ts-helpers": "^1.1.1",
- "tslint": "^3.7.4",
+ "tslint": "3.15.0-dev.0",
"tslint-loader": "^2.1.4",
- "typescript": "^1.8.10",
- "typings": "^1.0.4",
+ "typescript": "^2.0.0",
"url-loader": "^0.5.7",
- "webpack": "^1.13.1",
+ "webpack": "^2.1.0-beta.21",
"webpack-md5-hash": "0.0.5",
- "webpack-merge": "^0.13.0",
+ "webpack-merge": "^0.14.1",
"webpack-notifier": "^1.3.0",
"webtorrent": "^0.96.0",
- "zone.js": "0.6.12"
+ "zone.js": "0.6.17"
},
"devDependencies": {
"codelyzer": "0.0.28",
-import { Validators } from '@angular/common';
+import { } from '@angular/common';
import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { AccountService } from './account.service';
@Component({
selector: 'my-account',
- template: require('./account.component.html'),
- providers: [ AccountService ],
- directives: [ REACTIVE_FORM_DIRECTIVES ]
+ template: require('./account.component.html')
})
export class AccountComponent implements OnInit {
export * from './account.component';
export * from './account.routes';
+export * from './account.service';
import { Component } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
- template: '<router-outlet></router-outlet>',
- directives: [ ROUTER_DIRECTIVES ]
+ template: '<router-outlet></router-outlet>'
})
export class AdminComponent {
-import { RouterConfig } from '@angular/router';
+import { Routes } from '@angular/router';
import { AdminComponent } from './admin.component';
import { FriendsRoutes } from './friends';
import { UsersRoutes } from './users';
-export const AdminRoutes: RouterConfig = [
+export const AdminRoutes: Routes = [
{
path: 'admin',
component: AdminComponent,
import { Component, OnInit } from '@angular/core';
-import { FormControl, FormGroup, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
+import { FormControl, FormGroup } from '@angular/forms';
import { Router } from '@angular/router';
import { validateUrl } from '../../../shared';
@Component({
selector: 'my-friend-add',
template: require('./friend-add.component.html'),
- styles: [ require('./friend-add.component.scss') ],
- directives: [ REACTIVE_FORM_DIRECTIVES ]
+ styles: [ require('./friend-add.component.scss') ]
})
export class FriendAddComponent implements OnInit {
friendAddForm: FormGroup;
this.friendService.makeFriends(notEmptyUrls).subscribe(
status => {
- if (status === 409) {
- alert('Already made friends!');
- } else {
+ // TODO: extractdatastatus
+ // if (status === 409) {
+ // alert('Already made friends!');
+ // } else {
alert('Make friends request sent!');
this.router.navigate([ '/admin/friends/list' ]);
- }
+ // }
},
error => alert(error)
);
import { Component, OnInit } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
import { Friend, FriendService } from '../shared';
@Component({
selector: 'my-friend-list',
template: require('./friend-list.component.html'),
- styles: [ require('./friend-list.component.scss') ],
- directives: [ ROUTER_DIRECTIVES ]
+ styles: [ require('./friend-list.component.scss') ]
})
export class FriendListComponent implements OnInit {
friends: Friend[];
import { Component } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
-
-import { FriendService } from './shared';
@Component({
- template: '<router-outlet></router-outlet>',
- directives: [ ROUTER_DIRECTIVES ],
- providers: [ FriendService ]
+ template: '<router-outlet></router-outlet>'
})
export class FriendsComponent {
-import { RouterConfig } from '@angular/router';
+import { Routes } from '@angular/router';
import { FriendsComponent } from './friends.component';
import { FriendAddComponent } from './friend-add';
import { FriendListComponent } from './friend-list';
-export const FriendsRoutes: RouterConfig = [
+export const FriendsRoutes: Routes = [
{
path: 'friends',
component: FriendsComponent,
export * from './friend-add';
export * from './friend-list';
export * from './shared';
+export * from './friends.component';
export * from './friends.routes';
+export * from './friends';
export * from './users';
export * from './admin.component';
export * from './admin.routes';
import { Component } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'my-menu-admin',
- template: require('./menu-admin.component.html'),
- directives: [ ROUTER_DIRECTIVES ]
+ template: require('./menu-admin.component.html')
})
export class MenuAdminComponent { }
-import { Validators } from '@angular/common';
import { Component, OnInit } from '@angular/core';
-import { FormGroup, FormControl, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
+import { FormGroup, FormControl, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { UserService } from '../shared';
@Component({
selector: 'my-user-add',
- template: require('./user-add.component.html'),
- directives: [ REACTIVE_FORM_DIRECTIVES ]
+ template: require('./user-add.component.html')
})
export class UserAddComponent implements OnInit {
userAddForm: FormGroup;
import { Component, OnInit } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
import { User } from '../../../shared';
import { UserService } from '../shared';
@Component({
selector: 'my-user-list',
template: require('./user-list.component.html'),
- styles: [ require('./user-list.component.scss') ],
- directives: [ ROUTER_DIRECTIVES ]
+ styles: [ require('./user-list.component.scss') ]
})
export class UserListComponent implements OnInit {
totalUsers: number;
import { Component } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
-
-import { UserService } from './shared';
@Component({
- template: '<router-outlet></router-outlet>',
- directives: [ ROUTER_DIRECTIVES ],
- providers: [ UserService ]
+ template: '<router-outlet></router-outlet>'
})
export class UsersComponent {
-import { RouterConfig } from '@angular/router';
+import { Routes } from '@angular/router';
import { UsersComponent } from './users.component';
import { UserAddComponent } from './user-add';
import { UserListComponent } from './user-list';
-export const UsersRoutes: RouterConfig = [
+export const UsersRoutes: Routes = [
{
path: 'users',
component: UsersComponent,
import { Component } from '@angular/core';
-import { Router, ROUTER_DIRECTIVES } from '@angular/router';
-
-import { MenuAdminComponent } from './admin';
-import { MenuComponent } from './menu.component';
-import { RestExtractor, RestService, SearchComponent, SearchService } from './shared';
-import { VideoService } from './videos';
+import { Router } from '@angular/router';
@Component({
selector: 'my-app',
template: require('./app.component.html'),
- styles: [ require('./app.component.scss') ],
- directives: [ MenuAdminComponent, MenuComponent, ROUTER_DIRECTIVES, SearchComponent ],
- providers: [ RestExtractor, RestService, VideoService, SearchService ]
+ styles: [ require('./app.component.scss') ]
})
export class AppComponent {
--- /dev/null
+import { NgModule, ApplicationRef } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { HttpModule, RequestOptions, XHRBackend } from '@angular/http';
+import { RouterModule } from '@angular/router';
+import { removeNgStyles, createNewHosts } from '@angularclass/hmr';
+
+import { FileSelectDirective } from 'ng2-file-upload/ng2-file-upload';
+import { ProgressbarModule } from 'ng2-bootstrap/components/progressbar';
+import { PaginationModule } from 'ng2-bootstrap/components/pagination';
+import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
+
+/*
+ * Platform and Environment providers/directives/pipes
+ */
+import { ENV_PROVIDERS } from './environment';
+import { routes } from './app.routes';
+// App is our top level component
+import { AppComponent } from './app.component';
+import { AppState } from './app.service';
+import { AccountComponent, AccountService } from './account';
+import { LoginComponent } from './login';
+import {
+ LoaderComponent,
+ VideosComponent,
+ VideoAddComponent,
+ VideoListComponent,
+ VideoMiniatureComponent,
+ VideoSortComponent,
+ VideoWatchComponent,
+ VideoService
+} from './videos';
+import {
+ FriendsComponent,
+ FriendAddComponent,
+ FriendListComponent,
+ FriendService,
+ UsersComponent,
+ UserAddComponent,
+ UserListComponent,
+ UserService,
+ AdminComponent,
+ MenuAdminComponent
+} from './admin';
+import { MenuComponent } from './menu.component';
+import { AuthService, AuthHttp, RestExtractor, RestService, SearchComponent, SearchService } from './shared';
+
+// Application wide providers
+const APP_PROVIDERS = [
+ AppState,
+
+ {
+ provide: AuthHttp,
+ useFactory: (backend: XHRBackend, defaultOptions: RequestOptions, authService: AuthService) => {
+ return new AuthHttp(backend, defaultOptions, authService);
+ },
+ deps: [ XHRBackend, RequestOptions, AuthService ]
+ },
+
+ AuthService,
+ RestExtractor,
+ RestExtractor, RestService, VideoService, SearchService, FriendService, UserService, AccountService
+];
+/**
+ * `AppModule` is the main entry point into Angular2's bootstraping process
+ */
+@NgModule({
+ bootstrap: [ AppComponent ],
+ declarations: [
+ AppComponent,
+ BytesPipe,
+ FileSelectDirective,
+ AccountComponent,
+ LoginComponent,
+ LoaderComponent,
+ VideosComponent,
+ VideoAddComponent,
+ VideoListComponent,
+ VideoSortComponent,
+ VideoMiniatureComponent,
+ VideoWatchComponent,
+ FriendsComponent,
+ FriendAddComponent,
+ FriendListComponent,
+ UsersComponent,
+ UserAddComponent,
+ UserListComponent,
+ AdminComponent,
+ MenuAdminComponent,
+ MenuComponent,
+ SearchComponent
+ ],
+ imports: [ // import Angular's modules
+ BrowserModule,
+ FormsModule,
+ ReactiveFormsModule,
+ HttpModule,
+ RouterModule.forRoot(routes),
+ ProgressbarModule,
+ PaginationModule
+ ],
+ providers: [ // expose our Services and Providers into Angular's dependency injection
+ ENV_PROVIDERS,
+ APP_PROVIDERS
+ ]
+})
+export class AppModule {
+ constructor(public appRef: ApplicationRef, public appState: AppState) {}
+ hmrOnInit(store) {
+ if (!store || !store.state) return;
+ console.log('HMR store', store);
+ this.appState._state = store.state;
+ this.appRef.tick();
+ delete store.state;
+ }
+ hmrOnDestroy(store) {
+ const cmpLocation = this.appRef.components.map(cmp => cmp.location.nativeElement);
+ // recreate elements
+ const state = this.appState._state;
+ store.state = state;
+ store.disposeOldHosts = createNewHosts(cmpLocation);
+ // remove styles
+ removeNgStyles();
+ }
+ hmrAfterDestroy(store) {
+ // display new elements
+ store.disposeOldHosts();
+ delete store.disposeOldHosts;
+ }
+}
-import { RouterConfig } from '@angular/router';
+import { Routes } from '@angular/router';
import { AccountRoutes } from './account';
import { LoginRoutes } from './login';
import { AdminRoutes } from './admin';
import { VideosRoutes } from './videos';
-export const routes: RouterConfig = [
+export const routes: Routes = [
{
path: '',
redirectTo: '/videos/list',
--- /dev/null
+
+import { Injectable } from '@angular/core';
+
+@Injectable()
+export class AppState {
+ _state = { };
+
+ constructor() { ; }
+
+ // already return a clone of the current state
+ get state() {
+ return this._state = this._clone(this._state);
+ }
+ // never allow mutation
+ set state(value) {
+ throw new Error('do not mutate the `.state` directly');
+ }
+
+
+ get(prop?: any) {
+ // use our state getter for the clone
+ const state = this.state;
+ return state.hasOwnProperty(prop) ? state[prop] : state;
+ }
+
+ set(prop: string, value: any) {
+ // internally mutate our state
+ return this._state[prop] = value;
+ }
+
+
+ _clone(object) {
+ // simple object clone
+ return JSON.parse(JSON.stringify( object ));
+ }
+}
--- /dev/null
+
+// Angular 2
+// rc2 workaround
+import { enableDebugTools, disableDebugTools } from '@angular/platform-browser';
+import { enableProdMode, ApplicationRef } from '@angular/core';
+// Environment Providers
+let PROVIDERS = [
+ // common env directives
+];
+
+// Angular debug tools in the dev console
+// https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md
+let _decorateModuleRef = function identity(value) { return value; };
+
+if ('production' === ENV) {
+ // Production
+ disableDebugTools();
+ enableProdMode();
+
+ PROVIDERS = [
+ ...PROVIDERS,
+ // custom providers in production
+ ];
+
+} else {
+
+ _decorateModuleRef = (modRef: any) => {
+ const appRef = modRef.injector.get(ApplicationRef);
+ const cmpRef = appRef.components[0];
+
+ let _ng = (<any>window).ng;
+ enableDebugTools(cmpRef);
+ (<any>window).ng.probe = _ng.probe;
+ (<any>window).ng.coreTokens = _ng.coreTokens;
+ return modRef;
+ };
+
+ // Development
+ PROVIDERS = [
+ ...PROVIDERS,
+ // custom providers in development
+ ];
+
+}
+
+export const decorateModuleRef = _decorateModuleRef;
+
+export const ENV_PROVIDERS = [
+ ...PROVIDERS
+];
--- /dev/null
+export * from './app.module';
import { Component, OnInit } from '@angular/core';
-import { Validators } from '@angular/common';
-import { FormControl, FormGroup, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
import { AuthService } from '../shared';
@Component({
selector: 'my-login',
- template: require('./login.component.html'),
- directives: [ REACTIVE_FORM_DIRECTIVES ]
+ template: require('./login.component.html')
})
export class LoginComponent implements OnInit {
import { Component, OnInit } from '@angular/core';
-import { Router, ROUTER_DIRECTIVES } from '@angular/router';
+import { Router } from '@angular/router';
import { AuthService, AuthStatus } from './shared';
@Component({
selector: 'my-menu',
- template: require('./menu.component.html'),
- directives: [ ROUTER_DIRECTIVES ]
+ template: require('./menu.component.html')
})
export class MenuComponent implements OnInit {
isLoggedIn: boolean;
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
-import { DROPDOWN_DIRECTIVES} from 'ng2-bootstrap/components/dropdown';
-
import { Search } from './search.model';
import { SearchField } from './search-field.type';
import { SearchService } from './search.service';
@Component({
- selector: 'my-search',
- template: require('./search.component.html'),
- directives: [ DROPDOWN_DIRECTIVES ]
+ selector: 'my-search',
+ template: require('./search.component.html')
})
export class SearchComponent implements OnInit {
-import { Validators } from '@angular/common';
import { Component, ElementRef, OnInit } from '@angular/core';
-import { FormControl, FormGroup, REACTIVE_FORM_DIRECTIVES } from '@angular/forms';
+import { FormControl, FormGroup, Validators } from '@angular/forms';
import { Router } from '@angular/router';
-import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
-import { PROGRESSBAR_DIRECTIVES } from 'ng2-bootstrap/components/progressbar';
-import { FileSelectDirective, FileUploader } from 'ng2-file-upload/ng2-file-upload';
+import { FileUploader } from 'ng2-file-upload/ng2-file-upload';
import { AuthService } from '../../shared';
@Component({
selector: 'my-videos-add',
styles: [ require('./video-add.component.scss') ],
- template: require('./video-add.component.html'),
- directives: [ FileSelectDirective, PROGRESSBAR_DIRECTIVES, REACTIVE_FORM_DIRECTIVES ],
- pipes: [ BytesPipe ]
+ template: require('./video-add.component.html')
})
export class VideoAddComponent implements OnInit {
import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
-import { AsyncPipe } from '@angular/common';
-import { ActivatedRoute, Router, ROUTER_DIRECTIVES } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
-import { PAGINATION_DIRECTIVES } from 'ng2-bootstrap/components/pagination';
-
import {
- LoaderComponent,
SortField,
Video,
VideoService
} from '../shared';
import { AuthService, AuthUser, RestPagination, Search, SearchField } from '../../shared';
-import { VideoMiniatureComponent } from './video-miniature.component';
-import { VideoSortComponent } from './video-sort.component';
import { SearchService } from '../../shared';
@Component({
selector: 'my-videos-list',
styles: [ require('./video-list.component.scss') ],
- pipes: [ AsyncPipe ],
- template: require('./video-list.component.html'),
- directives: [ LoaderComponent, PAGINATION_DIRECTIVES, ROUTER_DIRECTIVES, VideoMiniatureComponent, VideoSortComponent ]
+ template: require('./video-list.component.html')
})
export class VideoListComponent implements OnInit, OnDestroy {
-import { DatePipe } from '@angular/common';
import { Component, Input, Output, EventEmitter } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
import { SortField, Video, VideoService } from '../shared';
import { User } from '../../shared';
@Component({
selector: 'my-video-miniature',
styles: [ require('./video-miniature.component.scss') ],
- template: require('./video-miniature.component.html'),
- directives: [ ROUTER_DIRECTIVES ],
- pipes: [ DatePipe ]
+ template: require('./video-miniature.component.html')
})
export class VideoMiniatureComponent {
import { Component, ElementRef, NgZone, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
-import { BytesPipe } from 'angular-pipes/src/math/bytes.pipe';
-
-import { LoaderComponent, Video, VideoService } from '../shared';
+import { Video, VideoService } from '../shared';
import { WebTorrentService } from './webtorrent.service';
@Component({
selector: 'my-video-watch',
template: require('./video-watch.component.html'),
- styles: [ require('./video-watch.component.scss') ],
- providers: [ WebTorrentService ],
- directives: [ LoaderComponent ],
- pipes: [ BytesPipe ]
+ styles: [ require('./video-watch.component.scss') ]
})
export class VideoWatchComponent implements OnInit, OnDestroy {
import { Component } from '@angular/core';
-import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
- template: '<router-outlet></router-outlet>',
- directives: [ ROUTER_DIRECTIVES ]
+ template: '<router-outlet></router-outlet>'
})
export class VideosComponent {
-import { RouterConfig } from '@angular/router';
+import { Routes } from '@angular/router';
import { VideoAddComponent } from './video-add';
import { VideoListComponent } from './video-list';
import { VideosComponent } from './videos.component';
import { VideoWatchComponent } from './video-watch';
-export const VideosRoutes: RouterConfig = [
+export const VideosRoutes: Routes = [
{
path: 'videos',
component: VideosComponent,
/*
* Custom Type Definitions
* When including 3rd party modules you also need to include the type definition for the module
- * if they don't provide one within the module. You can try to install it with typings
+ * if they don't provide one within the module. You can try to install it with @types
-typings install node --save
+npm install @types/node
+npm install @types/lodash
- * If you can't find the type definition in the registry we can make an ambient definition in
+ * If you can't find the type definition in the registry we can make an ambient/global definition in
* this file for now. For example
-declare module "my-module" {
- export function doesSomething(value: string): string;
+declare module 'my-module' {
+ export function doesSomething(value: string): string;
+}
+
+ * If you are using a CommonJS module that is using module.exports then you will have to write your
+ * types using export = yourObjectOrFunction with a namespace above it
+ * notice how we have to create a namespace that is equal to the function we're
+ * assigning the export to
+
+declare module 'jwt-decode' {
+ function jwtDecode(token: string): any;
+ namespace jwtDecode {}
+ export = jwtDecode;
}
*
*
declare var assert: any;
+declare var _: any;
+declare var $: any;
*
* If you're importing a module that uses Node.js modules which are CommonJS you need to import as
+ * in the files such as main.browser.ts or any file within app/
*
import * as _ from 'lodash'
- * You can include your type definitions in this file until you create one for the typings registry
- * see https://github.com/typings/registry
+ * You can include your type definitions in this file until you create one for the @types
*
*/
+// support NodeJS modules without type definitions
+declare module '*';
// Extra variables that live on Global that will be replaced by webpack DefinePlugin
declare var ENV: string;
declare var HMR: boolean;
+declare var System: SystemJS;
+
+interface SystemJS {
+ import: (path?: string) => Promise<any>;
+}
+
interface GlobalEnvironment {
ENV;
HMR;
+ SystemJS: SystemJS;
+ System: SystemJS;
}
+interface Es6PromiseLoader {
+ (id: string): (exportName?: string) => Promise<any>;
+}
+
+type FactoryEs6PromiseLoader = () => Es6PromiseLoader;
+type FactoryPromise = () => Promise<any>;
+
+type AsyncRoutes = {
+ [component: string]: Es6PromiseLoader |
+ Function |
+ FactoryEs6PromiseLoader |
+ FactoryPromise
+};
+
+
+type IdleCallbacks = Es6PromiseLoader |
+ Function |
+ FactoryEs6PromiseLoader |
+ FactoryPromise ;
+
interface WebpackModule {
hot: {
data?: any,
idle: any,
accept(dependencies?: string | string[], callback?: (updatedDependencies?: any) => void): void;
- decline(dependencies?: string | string[]): void;
+ decline(deps?: any | string | string[]): void;
dispose(callback?: (data?: any) => void): void;
addDisposeHandler(callback?: (data?: any) => void): void;
removeDisposeHandler(callback?: (data?: any) => void): void;
};
}
+
interface WebpackRequire {
- context(file: string, flag?: boolean, exp?: RegExp): any;
+ (id: string): any;
+ (paths: string[], callback: (...modules: any[]) => void): void;
+ ensure(ids: string[], callback: (req: WebpackRequire) => void, chunkName?: string): void;
+ context(directory: string, useSubDirectories?: boolean, regExp?: RegExp): WebpackContext;
}
+interface WebpackContext extends WebpackRequire {
+ keys(): string[];
+}
interface ErrorStackTraceLimit {
stackTraceLimit: number;
}
-
// Extend typings
interface NodeRequire extends WebpackRequire {}
interface ErrorConstructor extends ErrorStackTraceLimit {}
+interface NodeRequireFunction extends Es6PromiseLoader {}
interface NodeModule extends WebpackModule {}
interface Global extends GlobalEnvironment {}
-
-
-declare namespace Reflect {
- function decorate(decorators: ClassDecorator[], target: Function): Function;
- function decorate(
- decorators: (PropertyDecorator | MethodDecorator)[],
- target: Object,
- targetKey: string | symbol,
- descriptor?: PropertyDescriptor): PropertyDescriptor;
-
- function metadata(metadataKey: any, metadataValue: any): {
- (target: Function): void;
- (target: Object, propertyKey: string | symbol): void;
- };
- function defineMetadata(metadataKey: any, metadataValue: any, target: Object): void;
- function defineMetadata(
- metadataKey: any,
- metadataValue: any,
- target: Object,
- targetKey: string | symbol): void;
- function hasMetadata(metadataKey: any, target: Object): boolean;
- function hasMetadata(metadataKey: any, target: Object, targetKey: string | symbol): boolean;
- function hasOwnMetadata(metadataKey: any, target: Object): boolean;
- function hasOwnMetadata(metadataKey: any, target: Object, targetKey: string | symbol): boolean;
- function getMetadata(metadataKey: any, target: Object): any;
- function getMetadata(metadataKey: any, target: Object, targetKey: string | symbol): any;
- function getOwnMetadata(metadataKey: any, target: Object): any;
- function getOwnMetadata(metadataKey: any, target: Object, targetKey: string | symbol): any;
- function getMetadataKeys(target: Object): any[];
- function getMetadataKeys(target: Object, targetKey: string | symbol): any[];
- function getOwnMetadataKeys(target: Object): any[];
- function getOwnMetadataKeys(target: Object, targetKey: string | symbol): any[];
- function deleteMetadata(metadataKey: any, target: Object): boolean;
- function deleteMetadata(metadataKey: any, target: Object, targetKey: string | symbol): boolean;
-}
-
-
-// We need this here since there is a problem with Zone.js typings
-interface Thenable<T> {
- then<U>(
- onFulfilled?: (value: T) => U | Thenable<U>,
- onRejected?: (error: any) => U | Thenable<U>): Thenable<U>;
- then<U>(
- onFulfilled?: (value: T) => U | Thenable<U>,
- onRejected?: (error: any) => void): Thenable<U>;
- catch<U>(onRejected?: (error: any) => U | Thenable<U>): Thenable<U>;
-}
-import { enableProdMode, provide } from '@angular/core';
-import { disableDeprecatedForms, provideForms } from '@angular/forms';
-import {
- HTTP_PROVIDERS,
- RequestOptions,
- XHRBackend
-} from '@angular/http';
-import { bootstrap } from '@angular/platform-browser-dynamic';
-import { provideRouter } from '@angular/router';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+import { decorateModuleRef } from './app/environment';
+import { bootloader } from '@angularclass/hmr';
+/*
+ * App Module
+ * our top level module that holds all of our components
+ */
+import { AppModule } from './app';
-import { routes } from './app/app.routes';
-import { AuthHttp, AuthService, RestExtractor } from './app/shared';
-import { AppComponent } from './app/app.component';
-
-if (process.env.ENV === 'production') {
- enableProdMode();
+/*
+ * Bootstrap our Angular app with a top level NgModule
+ */
+export function main(): Promise<any> {
+ return platformBrowserDynamic()
+ .bootstrapModule(AppModule)
+ .then(decorateModuleRef)
+ .catch(err => console.error(err));
}
-bootstrap(AppComponent, [
- HTTP_PROVIDERS,
- provide(AuthHttp, {
- useFactory: (backend: XHRBackend, defaultOptions: RequestOptions, authService: AuthService) => {
- return new AuthHttp(backend, defaultOptions, authService);
- },
- deps: [ XHRBackend, RequestOptions, AuthService ]
- }),
-
- AuthService,
- RestExtractor,
-
- provideRouter(routes),
-
- disableDeprecatedForms(),
- provideForms()
-]);
+bootloader(main);
import 'ie-shim'; // Internet Explorer
// Prefer CoreJS over the polyfills above
-import 'core-js/es6';
+import 'core-js/es6/symbol';
+import 'core-js/es6/object';
+import 'core-js/es6/function';
+import 'core-js/es6/parse-int';
+import 'core-js/es6/parse-float';
+import 'core-js/es6/number';
+import 'core-js/es6/math';
+import 'core-js/es6/string';
+import 'core-js/es6/date';
+import 'core-js/es6/array';
+import 'core-js/es6/regexp';
+import 'core-js/es6/map';
+import 'core-js/es6/set';
+import 'core-js/es6/weak-map';
+import 'core-js/es6/weak-set';
+import 'core-js/es6/typed';
+import 'core-js/es6/reflect';
+// see issue https://github.com/AngularClass/angular2-webpack-starter/issues/709
+// import 'core-js/es6/promise';
+
import 'core-js/es7/reflect';
-require('zone.js/dist/zone');
+import 'zone.js/dist/zone';
// Typescript emit helpers polyfill
import 'ts-helpers';
import '@angular/http';
import '@angular/router';
+import '@angularclass/hmr';
+
// RxJS
import 'rxjs/Observable';
import 'rxjs/Subject';
import 'rxjs/add/operator/catch';
+import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/map';
import 'rxjs/add/observable/throw';
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
- "sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
- "noImplicitAny": false,
- "noEmitHelpers": true
+ "allowSyntheticDefaultImports": true,
+ "sourceMap": true,
+ "noEmitHelpers": true,
+ "strictNullChecks": false,
+ "baseUrl": "./src",
+ "paths": [
+ ],
+ "lib": [
+ "dom",
+ "es6"
+ ],
+ "types": [
+ "hammerjs",
+ "jasmine",
+ "node",
+ "protractor",
+ "selenium-webdriver",
+ "source-map",
+ "uglify-js",
+ "webpack"
+ ]
},
+ "exclude": [
+ "node_modules",
+ "dist"
+ ],
"awesomeTypescriptLoaderOptions": {
- "forkChecker": true
+ "forkChecker": true,
+ "useWebpackText": true
},
"compileOnSave": false,
"buildOnSave": false,
- "filesGlob": [
- "**/*.ts",
- "!node_modules/**"
- ],
- "exclude": [
- "node_modules",
- "typings/main",
- "typings/main.d.ts"
- ]
+ "atom": { "rewriteTsconfig": false }
}
+++ /dev/null
-{
- "globalDependencies": {
- "es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654",
- "jasmine": "registry:dt/jasmine#2.2.0+20160412134438",
- "node": "registry:dt/node#4.0.0+20160509154515"
- }
-}
projects / oweals / peertube.git / commitdiff