From 18a165d6f4025784fc1f3678116e47ee70e6f7d4 Mon Sep 17 00:00:00 2001 From: SteveSandersonMS Date: Fri, 8 Apr 2016 13:54:41 +0100 Subject: [PATCH] Update Angular 2 Music Store sample to latest Angular 2 and other dependencies. Switch from asp-ng2-prerender-module to the more general asp-prerender-module. --- .../MusicStore/Views/Home/Index.cshtml | 11 +- .../MusicStore/Views/_ViewImports.cshtml | 2 +- samples/angular/MusicStore/gulpfile.js | 2 +- samples/angular/MusicStore/package.json | 20 +- samples/angular/MusicStore/tsd.json | 12 + .../MusicStore/typings/es6-shim/es6-shim.d.ts | 668 ++++++++++++++++++ samples/angular/MusicStore/typings/tsd.d.ts | 2 + .../MusicStore/typings/url-workaround.d.ts | 7 + .../app/bootstrap.ts => boot-client.ts} | 2 +- .../MusicStore/wwwroot/ng-app/boot-server.ts | 29 + .../components/admin/admin-home/admin-home.ts | 8 +- .../album-delete-prompt.ts | 4 +- .../admin/album-details/album-details.ts | 4 +- .../components/admin/album-edit/album-edit.ts | 4 +- .../admin/albums-list/albums-list.ts | 4 +- .../components/admin/form-field/form-field.ts | 4 +- .../wwwroot/ng-app/components/app/app.ts | 10 +- .../public/album-details/album-details.ts | 4 +- .../public/album-tile/album-tile.ts | 4 +- .../public/genre-contents/genre-contents.ts | 4 +- .../public/genres-list/genres-list.ts | 4 +- .../ng-app/components/public/home/home.ts | 4 +- 22 files changed, 754 insertions(+), 59 deletions(-) create mode 100644 samples/angular/MusicStore/tsd.json create mode 100644 samples/angular/MusicStore/typings/es6-shim/es6-shim.d.ts create mode 100644 samples/angular/MusicStore/typings/tsd.d.ts create mode 100644 samples/angular/MusicStore/typings/url-workaround.d.ts rename samples/angular/MusicStore/wwwroot/ng-app/{components/app/bootstrap.ts => boot-client.ts} (89%) create mode 100644 samples/angular/MusicStore/wwwroot/ng-app/boot-server.ts diff --git a/samples/angular/MusicStore/Views/Home/Index.cshtml b/samples/angular/MusicStore/Views/Home/Index.cshtml index 68d2c2c..9ac9f01 100755 --- a/samples/angular/MusicStore/Views/Home/Index.cshtml +++ b/samples/angular/MusicStore/Views/Home/Index.cshtml @@ -3,15 +3,12 @@ } - - Loading... - + Loading... + @await Html.PrimeCache(Url.Action("GenreMenuList", "GenresApi")) + @await Html.PrimeCache(Url.Action("MostPopular", "AlbumsApi")) @section scripts { - @await Html.PrimeCache(Url.Action("GenreMenuList", "GenresApi")) - @await Html.PrimeCache(Url.Action("MostPopular", "AlbumsApi")) - @@ -22,5 +19,5 @@ - + } diff --git a/samples/angular/MusicStore/Views/_ViewImports.cshtml b/samples/angular/MusicStore/Views/_ViewImports.cshtml index 15f1095..17fd71c 100755 --- a/samples/angular/MusicStore/Views/_ViewImports.cshtml +++ b/samples/angular/MusicStore/Views/_ViewImports.cshtml @@ -1,4 +1,4 @@ @using MusicStore @using Microsoft.AspNet.AngularServices @addTagHelper "*, Microsoft.AspNet.Mvc.TagHelpers" -@addTagHelper "*, Microsoft.AspNet.AngularServices" +@addTagHelper "*, Microsoft.AspNet.SpaServices" diff --git a/samples/angular/MusicStore/gulpfile.js b/samples/angular/MusicStore/gulpfile.js index 1605499..15a2938 100755 --- a/samples/angular/MusicStore/gulpfile.js +++ b/samples/angular/MusicStore/gulpfile.js @@ -38,7 +38,7 @@ gulp.task('build.lib', function () { gulp.task('build', ['build.lib'], function () { var tsProject = typescript.createProject('./tsconfig.json', { typescript: require('typescript') }); - var tsSrcInlined = gulp.src([webroot + '**/*.ts'], { base: webroot }) + var tsSrcInlined = gulp.src([webroot + '**/*.ts', 'typings/**/*.d.ts'], { base: webroot }) .pipe(inlineNg2Template({ base: webroot })); return tsSrcInlined .pipe(sourcemaps.init()) diff --git a/samples/angular/MusicStore/package.json b/samples/angular/MusicStore/package.json index 6ca76c5..3283a2b 100644 --- a/samples/angular/MusicStore/package.json +++ b/samples/angular/MusicStore/package.json @@ -2,18 +2,22 @@ "name": "MusicStore", "version": "0.0.0", "dependencies": { - "angular2": "2.0.0-beta.1", - "angular2-aspnet": "^0.0.4", - "angular2-universal-preview": "^0.32.2", + "angular2": "2.0.0-beta.13", + "angular2-aspnet": "^0.0.5", + "angular2-universal": "0.90.1", + "aspnet-prerendering": "^1.0.0", "bootstrap": "^3.3.5", - "es6-module-loader": "^0.15.0", + "css": "^2.2.1", + "es6-module-loader": "0.15.0", + "es6-shim": "^0.35.0", + "isomorphic-fetch": "^2.2.1", "jquery": "^2.1.4", "less": "^2.5.3", - "lodash": "^3.10.1", - "reflect-metadata": "0.1.2", - "rxjs": "5.0.0-beta.0", + "preboot": "^2.0.5", + "rxjs": "5.0.0-beta.2", "systemjs": "^0.19.3", - "traceur": "0.0.91" + "traceur": "0.0.106", + "zone.js": "^0.6.10" }, "devDependencies": { "del": "^2.0.2", diff --git a/samples/angular/MusicStore/tsd.json b/samples/angular/MusicStore/tsd.json new file mode 100644 index 0000000..dc2f967 --- /dev/null +++ b/samples/angular/MusicStore/tsd.json @@ -0,0 +1,12 @@ +{ + "version": "v4", + "repo": "borisyankov/DefinitelyTyped", + "ref": "master", + "path": "typings", + "bundle": "typings/tsd.d.ts", + "installed": { + "es6-shim/es6-shim.d.ts": { + "commit": "ec9eb4b28c74665a602c22db3457f0a76fa0fa23" + } + } +} diff --git a/samples/angular/MusicStore/typings/es6-shim/es6-shim.d.ts b/samples/angular/MusicStore/typings/es6-shim/es6-shim.d.ts new file mode 100644 index 0000000..1c3df0e --- /dev/null +++ b/samples/angular/MusicStore/typings/es6-shim/es6-shim.d.ts @@ -0,0 +1,668 @@ +// Type definitions for es6-shim v0.31.2 +// Project: https://github.com/paulmillr/es6-shim +// Definitions by: Ron Buckton +// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped + +declare type PropertyKey = string | number | symbol; + +interface IteratorResult { + done: boolean; + value?: T; +} + +interface IterableShim { + /** + * Shim for an ES6 iterable. Not intended for direct use by user code. + */ + "_es6-shim iterator_"(): Iterator; +} + +interface Iterator { + next(value?: any): IteratorResult; + return?(value?: any): IteratorResult; + throw?(e?: any): IteratorResult; +} + +interface IterableIteratorShim extends IterableShim, Iterator { + /** + * Shim for an ES6 iterable iterator. Not intended for direct use by user code. + */ + "_es6-shim iterator_"(): IterableIteratorShim; +} + +interface StringConstructor { + /** + * Return the String value whose elements are, in order, the elements in the List elements. + * If length is 0, the empty string is returned. + */ + fromCodePoint(...codePoints: number[]): string; + + /** + * String.raw is intended for use as a tag function of a Tagged Template String. When called + * as such the first argument will be a well formed template call site object and the rest + * parameter will contain the substitution values. + * @param template A well-formed template string call site representation. + * @param substitutions A set of substitution values. + */ + raw(template: TemplateStringsArray, ...substitutions: any[]): string; +} + +interface String { + /** + * Returns a nonnegative integer Number less than 1114112 (0x110000) that is the code point + * value of the UTF-16 encoded code point starting at the string element at position pos in + * the String resulting from converting this object to a String. + * If there is no element at that position, the result is undefined. + * If a valid UTF-16 surrogate pair does not begin at pos, the result is the code unit at pos. + */ + codePointAt(pos: number): number; + + /** + * Returns true if searchString appears as a substring of the result of converting this + * object to a String, at one or more positions that are + * greater than or equal to position; otherwise, returns false. + * @param searchString search string + * @param position If position is undefined, 0 is assumed, so as to search all of the String. + */ + includes(searchString: string, position?: number): boolean; + + /** + * Returns true if the sequence of elements of searchString converted to a String is the + * same as the corresponding elements of this object (converted to a String) starting at + * endPosition – length(this). Otherwise returns false. + */ + endsWith(searchString: string, endPosition?: number): boolean; + + /** + * Returns a String value that is made from count copies appended together. If count is 0, + * T is the empty String is returned. + * @param count number of copies to append + */ + repeat(count: number): string; + + /** + * Returns true if the sequence of elements of searchString converted to a String is the + * same as the corresponding elements of this object (converted to a String) starting at + * position. Otherwise returns false. + */ + startsWith(searchString: string, position?: number): boolean; + + /** + * Returns an HTML anchor element and sets the name attribute to the text value + * @param name + */ + anchor(name: string): string; + + /** Returns a HTML element */ + big(): string; + + /** Returns a HTML element */ + blink(): string; + + /** Returns a HTML element */ + bold(): string; + + /** Returns a HTML element */ + fixed(): string + + /** Returns a HTML element and sets the color attribute value */ + fontcolor(color: string): string + + /** Returns a HTML element and sets the size attribute value */ + fontsize(size: number): string; + + /** Returns a HTML element and sets the size attribute value */ + fontsize(size: string): string; + + /** Returns an HTML element */ + italics(): string; + + /** Returns an HTML element and sets the href attribute value */ + link(url: string): string; + + /** Returns a HTML element */ + small(): string; + + /** Returns a HTML element */ + strike(): string; + + /** Returns a HTML element */ + sub(): string; + + /** Returns a HTML element */ + sup(): string; + + /** + * Shim for an ES6 iterable. Not intended for direct use by user code. + */ + "_es6-shim iterator_"(): IterableIteratorShim; +} + +interface ArrayConstructor { + /** + * Creates an array from an array-like object. + * @param arrayLike An array-like object to convert to an array. + * @param mapfn A mapping function to call on every element of the array. + * @param thisArg Value of 'this' used to invoke the mapfn. + */ + from(arrayLike: ArrayLike, mapfn: (v: T, k: number) => U, thisArg?: any): Array; + + /** + * Creates an array from an iterable object. + * @param iterable An iterable object to convert to an array. + * @param mapfn A mapping function to call on every element of the array. + * @param thisArg Value of 'this' used to invoke the mapfn. + */ + from(iterable: IterableShim, mapfn: (v: T, k: number) => U, thisArg?: any): Array; + + /** + * Creates an array from an array-like object. + * @param arrayLike An array-like object to convert to an array. + */ + from(arrayLike: ArrayLike): Array; + + /** + * Creates an array from an iterable object. + * @param iterable An iterable object to convert to an array. + */ + from(iterable: IterableShim): Array; + + /** + * Returns a new array from a set of elements. + * @param items A set of elements to include in the new array object. + */ + of(...items: T[]): Array; +} + +interface Array { + /** + * Returns the value of the first element in the array where predicate is true, and undefined + * otherwise. + * @param predicate find calls predicate once for each element of the array, in ascending + * order, until it finds one where predicate returns true. If such an element is found, find + * immediately returns that element value. Otherwise, find returns undefined. + * @param thisArg If provided, it will be used as the this value for each invocation of + * predicate. If it is not provided, undefined is used instead. + */ + find(predicate: (value: T, index: number, obj: Array) => boolean, thisArg?: any): T; + + /** + * Returns the index of the first element in the array where predicate is true, and undefined + * otherwise. + * @param predicate find calls predicate once for each element of the array, in ascending + * order, until it finds one where predicate returns true. If such an element is found, find + * immediately returns that element value. Otherwise, find returns undefined. + * @param thisArg If provided, it will be used as the this value for each invocation of + * predicate. If it is not provided, undefined is used instead. + */ + findIndex(predicate: (value: T) => boolean, thisArg?: any): number; + + /** + * Returns the this object after filling the section identified by start and end with value + * @param value value to fill array section with + * @param start index to start filling the array at. If start is negative, it is treated as + * length+start where length is the length of the array. + * @param end index to stop filling the array at. If end is negative, it is treated as + * length+end. + */ + fill(value: T, start?: number, end?: number): T[]; + + /** + * Returns the this object after copying a section of the array identified by start and end + * to the same array starting at position target + * @param target If target is negative, it is treated as length+target where length is the + * length of the array. + * @param start If start is negative, it is treated as length+start. If end is negative, it + * is treated as length+end. + * @param end If not specified, length of the this object is used as its default value. + */ + copyWithin(target: number, start: number, end?: number): T[]; + + /** + * Returns an array of key, value pairs for every entry in the array + */ + entries(): IterableIteratorShim<[number, T]>; + + /** + * Returns an list of keys in the array + */ + keys(): IterableIteratorShim; + + /** + * Returns an list of values in the array + */ + values(): IterableIteratorShim; + + /** + * Shim for an ES6 iterable. Not intended for direct use by user code. + */ + "_es6-shim iterator_"(): IterableIteratorShim; +} + +interface NumberConstructor { + /** + * The value of Number.EPSILON is the difference between 1 and the smallest value greater than 1 + * that is representable as a Number value, which is approximately: + * 2.2204460492503130808472633361816 x 10‍−‍16. + */ + EPSILON: number; + + /** + * Returns true if passed value is finite. + * Unlike the global isFininte, Number.isFinite doesn't forcibly convert the parameter to a + * number. Only finite values of the type number, result in true. + * @param number A numeric value. + */ + isFinite(number: number): boolean; + + /** + * Returns true if the value passed is an integer, false otherwise. + * @param number A numeric value. + */ + isInteger(number: number): boolean; + + /** + * Returns a Boolean value that indicates whether a value is the reserved value NaN (not a + * number). Unlike the global isNaN(), Number.isNaN() doesn't forcefully convert the parameter + * to a number. Only values of the type number, that are also NaN, result in true. + * @param number A numeric value. + */ + isNaN(number: number): boolean; + + /** + * Returns true if the value passed is a safe integer. + * @param number A numeric value. + */ + isSafeInteger(number: number): boolean; + + /** + * The value of the largest integer n such that n and n + 1 are both exactly representable as + * a Number value. + * The value of Number.MIN_SAFE_INTEGER is 9007199254740991 2^53 − 1. + */ + MAX_SAFE_INTEGER: number; + + /** + * The value of the smallest integer n such that n and n − 1 are both exactly representable as + * a Number value. + * The value of Number.MIN_SAFE_INTEGER is −9007199254740991 (−(2^53 − 1)). + */ + MIN_SAFE_INTEGER: number; + + /** + * Converts a string to a floating-point number. + * @param string A string that contains a floating-point number. + */ + parseFloat(string: string): number; + + /** + * Converts A string to an integer. + * @param s A string to convert into a number. + * @param radix A value between 2 and 36 that specifies the base of the number in numString. + * If this argument is not supplied, strings with a prefix of '0x' are considered hexadecimal. + * All other strings are considered decimal. + */ + parseInt(string: string, radix?: number): number; +} + +interface ObjectConstructor { + /** + * Copy the values of all of the enumerable own properties from one or more source objects to a + * target object. Returns the target object. + * @param target The target object to copy to. + * @param sources One or more source objects to copy properties from. + */ + assign(target: any, ...sources: any[]): any; + + /** + * Returns true if the values are the same value, false otherwise. + * @param value1 The first value. + * @param value2 The second value. + */ + is(value1: any, value2: any): boolean; + + /** + * Sets the prototype of a specified object o to object proto or null. Returns the object o. + * @param o The object to change its prototype. + * @param proto The value of the new prototype or null. + * @remarks Requires `__proto__` support. + */ + setPrototypeOf(o: any, proto: any): any; +} + +interface RegExp { + /** + * Returns a string indicating the flags of the regular expression in question. This field is read-only. + * The characters in this string are sequenced and concatenated in the following order: + * + * - "g" for global + * - "i" for ignoreCase + * - "m" for multiline + * - "u" for unicode + * - "y" for sticky + * + * If no flags are set, the value is the empty string. + */ + flags: string; +} + +interface Math { + /** + * Returns the number of leading zero bits in the 32-bit binary representation of a number. + * @param x A numeric expression. + */ + clz32(x: number): number; + + /** + * Returns the result of 32-bit multiplication of two numbers. + * @param x First number + * @param y Second number + */ + imul(x: number, y: number): number; + + /** + * Returns the sign of the x, indicating whether x is positive, negative or zero. + * @param x The numeric expression to test + */ + sign(x: number): number; + + /** + * Returns the base 10 logarithm of a number. + * @param x A numeric expression. + */ + log10(x: number): number; + + /** + * Returns the base 2 logarithm of a number. + * @param x A numeric expression. + */ + log2(x: number): number; + + /** + * Returns the natural logarithm of 1 + x. + * @param x A numeric expression. + */ + log1p(x: number): number; + + /** + * Returns the result of (e^x - 1) of x (e raised to the power of x, where e is the base of + * the natural logarithms). + * @param x A numeric expression. + */ + expm1(x: number): number; + + /** + * Returns the hyperbolic cosine of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + cosh(x: number): number; + + /** + * Returns the hyperbolic sine of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + sinh(x: number): number; + + /** + * Returns the hyperbolic tangent of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + tanh(x: number): number; + + /** + * Returns the inverse hyperbolic cosine of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + acosh(x: number): number; + + /** + * Returns the inverse hyperbolic sine of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + asinh(x: number): number; + + /** + * Returns the inverse hyperbolic tangent of a number. + * @param x A numeric expression that contains an angle measured in radians. + */ + atanh(x: number): number; + + /** + * Returns the square root of the sum of squares of its arguments. + * @param values Values to compute the square root for. + * If no arguments are passed, the result is +0. + * If there is only one argument, the result is the absolute value. + * If any argument is +Infinity or -Infinity, the result is +Infinity. + * If any argument is NaN, the result is NaN. + * If all arguments are either +0 or −0, the result is +0. + */ + hypot(...values: number[]): number; + + /** + * Returns the integral part of the a numeric expression, x, removing any fractional digits. + * If x is already an integer, the result is x. + * @param x A numeric expression. + */ + trunc(x: number): number; + + /** + * Returns the nearest single precision float representation of a number. + * @param x A numeric expression. + */ + fround(x: number): number; + + /** + * Returns an implementation-dependent approximation to the cube root of number. + * @param x A numeric expression. + */ + cbrt(x: number): number; +} + +interface PromiseLike { + /** + * Attaches callbacks for the resolution and/or rejection of the Promise. + * @param onfulfilled The callback to execute when the Promise is resolved. + * @param onrejected The callback to execute when the Promise is rejected. + * @returns A Promise for the completion of which ever callback is executed. + */ + then(onfulfilled?: (value: T) => TResult | PromiseLike, onrejected?: (reason: any) => TResult | PromiseLike): PromiseLike; + then(onfulfilled?: (value: T) => TResult | PromiseLike, onrejected?: (reason: any) => void): PromiseLike; +} + +/** + * Represents the completion of an asynchronous operation + */ +interface Promise { + /** + * Attaches callbacks for the resolution and/or rejection of the Promise. + * @param onfulfilled The callback to execute when the Promise is resolved. + * @param onrejected The callback to execute when the Promise is rejected. + * @returns A Promise for the completion of which ever callback is executed. + */ + then(onfulfilled?: (value: T) => TResult | PromiseLike, onrejected?: (reason: any) => TResult | PromiseLike): Promise; + then(onfulfilled?: (value: T) => TResult | PromiseLike, onrejected?: (reason: any) => void): Promise; + + /** + * Attaches a callback for only the rejection of the Promise. + * @param onrejected The callback to execute when the Promise is rejected. + * @returns A Promise for the completion of the callback. + */ + catch(onrejected?: (reason: any) => T | PromiseLike): Promise; + catch(onrejected?: (reason: any) => void): Promise; +} + +interface PromiseConstructor { + /** + * A reference to the prototype. + */ + prototype: Promise; + + /** + * Creates a new Promise. + * @param executor A callback used to initialize the promise. This callback is passed two arguments: + * a resolve callback used resolve the promise with a value or the result of another promise, + * and a reject callback used to reject the promise with a provided reason or error. + */ + new (executor: (resolve: (value?: T | PromiseLike) => void, reject: (reason?: any) => void) => void): Promise; + + /** + * Creates a Promise that is resolved with an array of results when all of the provided Promises + * resolve, or rejected when any Promise is rejected. + * @param values An array of Promises. + * @returns A new Promise. + */ + all(values: IterableShim>): Promise; + + /** + * Creates a Promise that is resolved or rejected when any of the provided Promises are resolved + * or rejected. + * @param values An array of Promises. + * @returns A new Promise. + */ + race(values: IterableShim>): Promise; + + /** + * Creates a new rejected promise for the provided reason. + * @param reason The reason the promise was rejected. + * @returns A new rejected Promise. + */ + reject(reason: any): Promise; + + /** + * Creates a new rejected promise for the provided reason. + * @param reason The reason the promise was rejected. + * @returns A new rejected Promise. + */ + reject(reason: any): Promise; + + /** + * Creates a new resolved promise for the provided value. + * @param value A promise. + * @returns A promise whose internal state matches the provided promise. + */ + resolve(value: T | PromiseLike): Promise; + + /** + * Creates a new resolved promise . + * @returns A resolved promise. + */ + resolve(): Promise; +} + +declare var Promise: PromiseConstructor; + +interface Map { + clear(): void; + delete(key: K): boolean; + forEach(callbackfn: (value: V, index: K, map: Map) => void, thisArg?: any): void; + get(key: K): V; + has(key: K): boolean; + set(key: K, value?: V): Map; + size: number; + entries(): IterableIteratorShim<[K, V]>; + keys(): IterableIteratorShim; + values(): IterableIteratorShim; +} + +interface MapConstructor { + new (): Map; + new (iterable: IterableShim<[K, V]>): Map; + prototype: Map; +} + +declare var Map: MapConstructor; + +interface Set { + add(value: T): Set; + clear(): void; + delete(value: T): boolean; + forEach(callbackfn: (value: T, index: T, set: Set) => void, thisArg?: any): void; + has(value: T): boolean; + size: number; + entries(): IterableIteratorShim<[T, T]>; + keys(): IterableIteratorShim; + values(): IterableIteratorShim; +} + +interface SetConstructor { + new (): Set; + new (iterable: IterableShim): Set; + prototype: Set; +} + +declare var Set: SetConstructor; + +interface WeakMap { + delete(key: K): boolean; + get(key: K): V; + has(key: K): boolean; + set(key: K, value?: V): WeakMap; +} + +interface WeakMapConstructor { + new (): WeakMap; + new (iterable: IterableShim<[K, V]>): WeakMap; + prototype: WeakMap; +} + +declare var WeakMap: WeakMapConstructor; + +interface WeakSet { + add(value: T): WeakSet; + delete(value: T): boolean; + has(value: T): boolean; +} + +interface WeakSetConstructor { + new (): WeakSet; + new (iterable: IterableShim): WeakSet; + prototype: WeakSet; +} + +declare var WeakSet: WeakSetConstructor; + +declare namespace Reflect { + function apply(target: Function, thisArgument: any, argumentsList: ArrayLike): any; + function construct(target: Function, argumentsList: ArrayLike): any; + function defineProperty(target: any, propertyKey: PropertyKey, attributes: PropertyDescriptor): boolean; + function deleteProperty(target: any, propertyKey: PropertyKey): boolean; + function enumerate(target: any): IterableIteratorShim; + function get(target: any, propertyKey: PropertyKey, receiver?: any): any; + function getOwnPropertyDescriptor(target: any, propertyKey: PropertyKey): PropertyDescriptor; + function getPrototypeOf(target: any): any; + function has(target: any, propertyKey: PropertyKey): boolean; + function isExtensible(target: any): boolean; + function ownKeys(target: any): Array; + function preventExtensions(target: any): boolean; + function set(target: any, propertyKey: PropertyKey, value: any, receiver?: any): boolean; + function setPrototypeOf(target: any, proto: any): boolean; +} + +declare module "es6-shim" { + var String: StringConstructor; + var Array: ArrayConstructor; + var Number: NumberConstructor; + var Math: Math; + var Object: ObjectConstructor; + var Map: MapConstructor; + var Set: SetConstructor; + var WeakMap: WeakMapConstructor; + var WeakSet: WeakSetConstructor; + var Promise: PromiseConstructor; + namespace Reflect { + function apply(target: Function, thisArgument: any, argumentsList: ArrayLike): any; + function construct(target: Function, argumentsList: ArrayLike): any; + function defineProperty(target: any, propertyKey: PropertyKey, attributes: PropertyDescriptor): boolean; + function deleteProperty(target: any, propertyKey: PropertyKey): boolean; + function enumerate(target: any): Iterator; + function get(target: any, propertyKey: PropertyKey, receiver?: any): any; + function getOwnPropertyDescriptor(target: any, propertyKey: PropertyKey): PropertyDescriptor; + function getPrototypeOf(target: any): any; + function has(target: any, propertyKey: PropertyKey): boolean; + function isExtensible(target: any): boolean; + function ownKeys(target: any): Array; + function preventExtensions(target: any): boolean; + function set(target: any, propertyKey: PropertyKey, value: any, receiver?: any): boolean; + function setPrototypeOf(target: any, proto: any): boolean; + } +} diff --git a/samples/angular/MusicStore/typings/tsd.d.ts b/samples/angular/MusicStore/typings/tsd.d.ts new file mode 100644 index 0000000..8b614f9 --- /dev/null +++ b/samples/angular/MusicStore/typings/tsd.d.ts @@ -0,0 +1,2 @@ + +/// diff --git a/samples/angular/MusicStore/typings/url-workaround.d.ts b/samples/angular/MusicStore/typings/url-workaround.d.ts new file mode 100644 index 0000000..9d16760 --- /dev/null +++ b/samples/angular/MusicStore/typings/url-workaround.d.ts @@ -0,0 +1,7 @@ +// This file is a workaround for angular2-universal-preview version 0.84.2 relying on the declaration of +// Node's 'url' module. Ideally it would not declare dependencies on Node APIs except where it also supplies +// the definitions itself. + +declare module 'url' { + export interface Url {} +} diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/app/bootstrap.ts b/samples/angular/MusicStore/wwwroot/ng-app/boot-client.ts similarity index 89% rename from samples/angular/MusicStore/wwwroot/ng-app/components/app/bootstrap.ts rename to samples/angular/MusicStore/wwwroot/ng-app/boot-client.ts index d051c7a..65e24a0 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/app/bootstrap.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/boot-client.ts @@ -3,6 +3,6 @@ import { FormBuilder } from 'angular2/common'; import * as router from 'angular2/router'; import { Http, HTTP_PROVIDERS } from 'angular2/http'; import { CACHE_PRIMED_HTTP_PROVIDERS } from 'angular2-aspnet'; -import { App } from './app'; +import { App } from './components/app/app'; bootstrap(App, [router.ROUTER_BINDINGS, HTTP_PROVIDERS, CACHE_PRIMED_HTTP_PROVIDERS, FormBuilder]); diff --git a/samples/angular/MusicStore/wwwroot/ng-app/boot-server.ts b/samples/angular/MusicStore/wwwroot/ng-app/boot-server.ts new file mode 100644 index 0000000..0c37dd9 --- /dev/null +++ b/samples/angular/MusicStore/wwwroot/ng-app/boot-server.ts @@ -0,0 +1,29 @@ +import 'angular2-universal/polyfills'; +import { FormBuilder } from 'angular2/common'; +import * as ngCore from 'angular2/core'; +import * as ngRouter from 'angular2/router'; +import * as ngUniversal from 'angular2-universal'; +import { App } from './components/app/app'; + +export default function (params: any): Promise<{ html: string, globals?: any }> { + const serverBindings = [ + ngCore.provide(ngUniversal.BASE_URL, { useValue: params.absoluteUrl }), + ngCore.provide(ngUniversal.REQUEST_URL, { useValue: params.url }), + ngCore.provide(ngRouter.APP_BASE_HREF, { useValue: '/' }), + ngUniversal.NODE_HTTP_PROVIDERS, + ngUniversal.NODE_ROUTER_PROVIDERS, + FormBuilder + ]; + + return ngUniversal.bootloader({ + directives: [App], + providers: serverBindings, + async: true, + preboot: false, + // TODO: Render just the component instead of wrapping it inside an extra HTML document + // Waiting on https://github.com/angular/universal/issues/347 + template: '\n' + }).serializeApplication().then(html => { + return { html }; + }); +} diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/admin-home/admin-home.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/admin-home/admin-home.ts index cb057e6..47a501a 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/admin-home/admin-home.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/admin-home/admin-home.ts @@ -5,17 +5,15 @@ import { AlbumDetails } from '../album-details/album-details'; import { AlbumEdit } from '../album-edit/album-edit'; @ng.Component({ - selector: 'admin-home' + selector: 'admin-home', + templateUrl: './ng-app/components/admin/admin-home/admin-home.html', + directives: [router.ROUTER_DIRECTIVES] }) @router.RouteConfig([ { path: 'albums', name: 'Albums', component: AlbumsList }, { path: 'album/details/:albumId', name: 'AlbumDetails', component: AlbumDetails }, { path: 'album/edit/:albumId', name: 'AlbumEdit', component: AlbumEdit } ]) -@ng.View({ - templateUrl: './ng-app/components/admin/admin-home/admin-home.html', - directives: [router.ROUTER_DIRECTIVES] -}) export class AdminHome { } diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-delete-prompt/album-delete-prompt.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-delete-prompt/album-delete-prompt.ts index f9997ef..a303956 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-delete-prompt/album-delete-prompt.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-delete-prompt/album-delete-prompt.ts @@ -2,9 +2,7 @@ import * as ng from 'angular2/core'; import * as models from '../../../models/models'; @ng.Component({ - selector: 'album-delete-prompt' -}) -@ng.View({ + selector: 'album-delete-prompt', templateUrl: './ng-app/components/admin/album-delete-prompt/album-delete-prompt.html' }) export class AlbumDeletePrompt { diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-details/album-details.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-details/album-details.ts index 78140be..05ac4da 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-details/album-details.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-details/album-details.ts @@ -5,9 +5,7 @@ import { Http, HTTP_BINDINGS } from 'angular2/http'; import { AlbumDeletePrompt } from '../album-delete-prompt/album-delete-prompt'; @ng.Component({ - selector: 'album-details' -}) -@ng.View({ + selector: 'album-details', templateUrl: './ng-app/components/admin/album-details/album-details.html', directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts index c88a392..4b83c3b 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/album-edit/album-edit.ts @@ -9,9 +9,7 @@ import { FormField } from '../form-field/form-field'; import * as AspNet from 'angular2-aspnet'; @ng.Component({ - selector: 'album-edit' -}) -@ng.View({ + selector: 'album-edit', templateUrl: './ng-app/components/admin/album-edit/album-edit.html', directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt, FormField, FORM_DIRECTIVES] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/albums-list/albums-list.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/albums-list/albums-list.ts index 76e273c..989d6e9 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/albums-list/albums-list.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/albums-list/albums-list.ts @@ -5,9 +5,7 @@ import * as models from '../../../models/models'; import { AlbumDeletePrompt } from '../album-delete-prompt/album-delete-prompt'; @ng.Component({ - selector: 'albums-list' -}) -@ng.View({ + selector: 'albums-list', templateUrl: './ng-app/components/admin/albums-list/albums-list.html', directives: [router.ROUTER_DIRECTIVES, AlbumDeletePrompt] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/form-field/form-field.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/form-field/form-field.ts index c79e6fb..267d778 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/admin/form-field/form-field.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/admin/form-field/form-field.ts @@ -3,9 +3,7 @@ import { AbstractControl } from 'angular2/common'; @ng.Component({ selector: 'form-field', - properties: ['label', 'validate'] -}) -@ng.View({ + properties: ['label', 'validate'], templateUrl: './ng-app/components/admin/form-field/form-field.html' }) export class FormField { diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/app/app.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/app/app.ts index 50fb093..dc9ff67 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/app/app.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/app/app.ts @@ -9,7 +9,10 @@ import { AdminHome } from '../admin/admin-home/admin-home'; import * as models from '../../models/models'; @ng.Component({ - selector: 'app' + selector: 'app', + templateUrl: './ng-app/components/app/app.html', + styleUrls: ['./ng-app/components/app/app.css'], + directives: [router.ROUTER_DIRECTIVES] }) @router.RouteConfig([ { path: '/', component: Home, name: 'Home' }, @@ -18,11 +21,6 @@ import * as models from '../../models/models'; { path: '/genres', component: GenresList, name: 'GenresList' }, { path: '/admin/...', component: AdminHome, name: 'Admin' } ]) -@ng.View({ - templateUrl: './ng-app/components/app/app.html', - styleUrls: ['./ng-app/components/app/app.css'], - directives: [router.ROUTER_DIRECTIVES] -}) export class App { public genres: models.Genre[]; diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-details/album-details.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-details/album-details.ts index 6261a82..61d7d4e 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-details/album-details.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-details/album-details.ts @@ -4,9 +4,7 @@ import { Http } from 'angular2/http'; import * as models from '../../../models/models'; @ng.Component({ - selector: 'album-details' -}) -@ng.View({ + selector: 'album-details', templateUrl: './ng-app/components/public/album-details/album-details.html' }) export class AlbumDetails { diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-tile/album-tile.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-tile/album-tile.ts index 5029e23..d289ec9 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-tile/album-tile.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/public/album-tile/album-tile.ts @@ -4,9 +4,7 @@ import * as models from '../../../models/models'; @ng.Component({ selector: 'album-tile', - properties: ['albumData'] -}) -@ng.View({ + properties: ['albumData'], templateUrl: './ng-app/components/public/album-tile/album-tile.html', directives: [router.ROUTER_DIRECTIVES] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/public/genre-contents/genre-contents.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/public/genre-contents/genre-contents.ts index 57b840f..0571cc8 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/public/genre-contents/genre-contents.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/public/genre-contents/genre-contents.ts @@ -5,9 +5,7 @@ import * as models from '../../../models/models'; import { AlbumTile } from '../album-tile/album-tile'; @ng.Component({ - selector: 'genre-contents' -}) -@ng.View({ + selector: 'genre-contents', templateUrl: './ng-app/components/public/genre-contents/genre-contents.html', directives: [AlbumTile] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/public/genres-list/genres-list.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/public/genres-list/genres-list.ts index 7e8ebe4..f45b77a 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/public/genres-list/genres-list.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/public/genres-list/genres-list.ts @@ -4,9 +4,7 @@ import { Http } from 'angular2/http'; import * as models from '../../../models/models'; @ng.Component({ - selector: 'genres-list' -}) -@ng.View({ + selector: 'genres-list', templateUrl: './ng-app/components/public/genres-list/genres-list.html', directives: [router.ROUTER_DIRECTIVES] }) diff --git a/samples/angular/MusicStore/wwwroot/ng-app/components/public/home/home.ts b/samples/angular/MusicStore/wwwroot/ng-app/components/public/home/home.ts index 1044478..51989da 100644 --- a/samples/angular/MusicStore/wwwroot/ng-app/components/public/home/home.ts +++ b/samples/angular/MusicStore/wwwroot/ng-app/components/public/home/home.ts @@ -4,9 +4,7 @@ import { AlbumTile } from '../album-tile/album-tile'; import * as models from '../../../models/models'; @ng.Component({ - selector: 'home' -}) -@ng.View({ + selector: 'home', templateUrl: './ng-app/components/public/home/home.html', directives: [AlbumTile] })