From 72f25d8a0609743610c92c1216173ff2fc90df40 Mon Sep 17 00:00:00 2001 From: Diego Vilar Date: Mon, 24 Oct 2016 13:28:40 -0300 Subject: [PATCH] =?UTF-8?q?Vers=C3=A3o=201.1.0-rc.1=20(vide=20changelog.tx?= =?UTF-8?q?t)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- TODO.TXT | 2 +- bower.json | 2 +- changelog.txt | 7 +++ package.json | 2 +- src/bootstrap.ts | 14 +++--- src/component.ts | 36 ++++++++++++++- src/module.ts | 108 +++++++++++++++++++++++++------------------ src/view.ts | 10 +++- typings/tng/tng.d.ts | 21 +++++++-- 9 files changed, 138 insertions(+), 64 deletions(-) create mode 100644 changelog.txt diff --git a/TODO.TXT b/TODO.TXT index a5c82af..2c857ca 100644 --- a/TODO.TXT +++ b/TODO.TXT @@ -1,3 +1,3 @@ UI Bootstrap - - $modal.open() needs to be decorated to handle modal options trated during the opening and closing of modals \ No newline at end of file + - $modal.open() needs to be decorated to handle modal options during the opening and closing of modals \ No newline at end of file diff --git a/bower.json b/bower.json index 82f356f..c028aed 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "tng", - "version": "1.0.0", + "version": "1.1.0-rc.1", "description": "Angular 1 on TypeScript", "homepage": "https://github.com/diegovilar/tng", "authors": [ diff --git a/changelog.txt b/changelog.txt new file mode 100644 index 0000000..15c3dc7 --- /dev/null +++ b/changelog.txt @@ -0,0 +1,7 @@ +1.1.0-rc.1 + + - Nova opção "styles" em ViewOpttions; + - ModuleOptions#dependencies: elementos podem ser vetores de dependências; + - publishModule: novas assinaturas, permitindo informar dependencias adicionais às + configuradas no módulo e parâmetros e serem passados ao construtor do módulo; + - bootstrap: novas assinaturas para acomodar as novas possibilidades de publishModule. \ No newline at end of file diff --git a/package.json b/package.json index b245043..5a51331 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tng", - "version": "1.0.0", + "version": "1.1.0-rc.1", "description": "Angular 1 on TypeScript", "main": "build/prod/tng.js", "scripts": { diff --git a/src/bootstrap.ts b/src/bootstrap.ts index ebe5851..61ab6dd 100644 --- a/src/bootstrap.ts +++ b/src/bootstrap.ts @@ -26,15 +26,17 @@ import {assert} from './assert'; import {getAnnotations, mergeAnnotations} from './reflection'; import {create} from './utils'; import {ApplicationConstructor, ApplicationAnnotation} from './application'; -import {ModuleConstructor, ModuleAnnotation, publishModule} from './module'; +import {ModuleConstructor, ModuleAnnotation, publishModule, DependenciesArray} from './module'; /** * */ -export function bootstrap(applicationClass: ApplicationConstructor): ng.auto.IInjectorService; -export function bootstrap(moduleClass: ModuleConstructor, element: Element|Document): ng.auto.IInjectorService; -// export function bootstrap(moduleClass: ModuleConstructor, selector: string): ng.auto.IInjectorService; -export function bootstrap(moduleClass: ModuleConstructor, element?: Element|Document): ng.auto.IInjectorService { +export function bootstrap(applicationClass: ApplicationConstructor, element?: Element|Document, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.auto.IInjectorService; +export function bootstrap(moduleClass: ModuleConstructor, element: Element|Document, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.auto.IInjectorService; +export function bootstrap(moduleClass: ModuleConstructor, element?: Element|Document, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.auto.IInjectorService { // Reflect.decorate apply decorators reversely, so we need to reverse // the extracted annotations before merging them @@ -51,7 +53,7 @@ export function bootstrap(moduleClass: ModuleConstructor, element?: Element|Docu // TODO debug only? assert(element, 'element must be provided'); - var ngModule = publishModule(moduleClass); + var ngModule = publishModule(moduleClass, null, dependencies, constructorParameters); return angular.bootstrap( element, [ngModule.name]); diff --git a/src/component.ts b/src/component.ts index 8c5d274..009cb07 100644 --- a/src/component.ts +++ b/src/component.ts @@ -2,7 +2,7 @@ import {assert} from './assert' import {Inject, injectable, isAnnotated} from './di' -import {makeDecorator, Map, setIfInterface, isFunction, isDefined} from './utils' +import {isDefined, isFunction, makeDecorator, Map, setIfInterface} from "./utils"; import {FunctionReturningString, FunctionReturningNothing, parseSelector, SelectorType} from './utils' import {hasAnnotation, hasOwnAnnotation, getAnnotations, mergeAnnotations, addAnnotation} from './reflection' import {ViewAnnotation} from './view' @@ -87,6 +87,8 @@ export interface ComponentDefinitionObject extends DirectiveDefinitionObject { controllerAs?: string; template?: string|FunctionReturningString; templateUrl?: string|FunctionReturningString; + styles?: string|string[]; + // stylesUrls?: string[]; templateNamespace?: string; } @@ -125,7 +127,10 @@ export function makeComponentDO(componentClass: ComponentConstructor): Component if (isDefined(view.controllerAs)) cdo.controllerAs = view.controllerAs; if (isDefined(view.namespace)) cdo.templateNamespace = NAMESPACE_MAP[view.namespace]; - // TODO styleUrl + if (isDefined(view.styles)) { + cdo.styles = typeof view.styles === "string" ? [ view.styles] : view.styles; + } + // else if (isDefined(view.stylesUrls)) cdo.stylesUrls = view.stylesUrls; if (isDefined(view.template)) cdo.template = view.template; else if (isDefined(view.templateUrl)) cdo.templateUrl = view.templateUrl; @@ -172,6 +177,16 @@ export function makeComponentFactory(componentClass: ComponentConstructor) { var cdo = makeComponentDO(componentClass); var factory = injectable(['$injector'], function directiveFactory($injector: ng.auto.IInjectorService): ng.IDirective { + + if (cdo.styles) { + for (let i = 0; i < cdo.styles.length; i++) { + insertStyle(cdo.styles[i], `tng-component_${cdo.imperativeName}_${i}`); + } + } + // else if (cdo.stylesUrls) { + // TODO + // } + return inFactory(inFactoryDirective(cdo, $injector), $injector); }); @@ -180,4 +195,21 @@ export function makeComponentFactory(componentClass: ComponentConstructor) { factory: factory }; +} + +function insertStyle(style: string, id: string) { + + id = `#${id}`; + let head = document.head; + + if (head.querySelector(id)) { + return; + } + + let el = document.createElement("style"); + el.id = id; + el.type = "text/css" + el.textContent = style; + head.insertBefore(el, head.querySelector("style")); + } \ No newline at end of file diff --git a/src/module.ts b/src/module.ts index 9247fee..d54ff88 100644 --- a/src/module.ts +++ b/src/module.ts @@ -21,7 +21,8 @@ import {registerRoutes} from './ui/router/routes' const PUBLISHED_ANNOTATION_KEY = 'tng:module-published-as'; -type DependenciesArray = (string|Function|ConstantWrapper|ValueWrapper)[]; +export type Dependency = string|Function|ConstantWrapper|ValueWrapper; +export type DependenciesArray = (Dependency|Dependency[])[]; /** * Options available when decorating a class as a module @@ -103,7 +104,8 @@ function getNewModuleName() { /** * @internal */ -export function publishModule(moduleClass: ModuleConstructor, name?: string): ng.IModule { +export function publishModule(moduleClass: ModuleConstructor, name?: string, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.IModule { // Reflect.decorate apply decorators reversely, so we need to reverse // the extracted annotations before merging them @@ -131,60 +133,74 @@ export function publishModule(moduleClass: ModuleConstructor, name?: string): ng var directives: any[] = []; var modules: any[] = []; - // TODO optimize this.. to much reflection queries - if (annotation.dependencies) { - for (let dep of annotation.dependencies) { - // Regular angular module - if (isString(dep)) { - modules.push(dep); - } - else if (hasAnnotation(dep, ModuleAnnotation)) { - // If the module has alrady been published, we just push it's name - // if (publishedAs = Reflect.getOwnMetadata(PUBLISHED_ANNOTATION_KEY, dep)) { - // modules.push(publishedAs); - // } - // else { - modules.push(publishModule( dep).name); - // } - } - else if (dep instanceof ConstantWrapper) { - constants.push(dep); - } - else if (dep instanceof ValueWrapper) { - values.push(dep); - } - else if (hasAnnotation(dep, ServiceAnnotation)) { - services.push(dep); - } - else if (hasAnnotation(dep, DecoratorAnnotation)) { - decorators.push(dep); - } - else if (hasAnnotation(dep, FilterAnnotation)) { - filters.push(dep); - } - else if (hasAnnotation(dep, AnimationAnnotation)) { - animations.push(dep); - } - else if (hasAnnotation(dep, ComponentAnnotation)) { - components.push(dep); - } - else if (hasAnnotation(dep, DirectiveAnnotation)) { - directives.push(dep); - } - else { - // TODO WTF? - throw new Error(`I don't recognize what kind of dependency this is: ${dep}`); + // TODO optimize this.. too much reflection queries + function processDependency(dep: Dependency|Dependency[]): void { + + // Regular angular module + if (isString(dep)) { + modules.push(dep); + } + else if (isArray(dep)) { + for (let _dep of dep) { + processDependency(_dep); } } + else if (hasAnnotation(dep, ModuleAnnotation)) { + // If the module has alrady been published, we just push it's name + // if (publishedAs = Reflect.getOwnMetadata(PUBLISHED_ANNOTATION_KEY, dep)) { + // modules.push(publishedAs); + // } + // else { + modules.push(publishModule( dep).name); + // } + } + else if (dep instanceof ConstantWrapper) { + constants.push(dep); + } + else if (dep instanceof ValueWrapper) { + values.push(dep); + } + else if (hasAnnotation(dep, ServiceAnnotation)) { + services.push(dep); + } + else if (hasAnnotation(dep, DecoratorAnnotation)) { + decorators.push(dep); + } + else if (hasAnnotation(dep, FilterAnnotation)) { + filters.push(dep); + } + else if (hasAnnotation(dep, AnimationAnnotation)) { + animations.push(dep); + } + else if (hasAnnotation(dep, ComponentAnnotation)) { + components.push(dep); + } + else if (hasAnnotation(dep, DirectiveAnnotation)) { + directives.push(dep); + } + else { + // TODO WTF? + throw new Error(`I don't recognize what kind of dependency this is: ${dep}`); + } + } + let allDeps = [].concat( + (annotation.dependencies || []), + (dependencies || []) + ); + + allDeps.forEach((dep) => processDependency(dep)); + name = name || annotation.name || getNewModuleName(); // Register the module on Angular var ngModule = angular.module(name, modules); // Instantiate the module - var module = new moduleClass(ngModule); + // var module = new moduleClass(ngModule); + let module = Object.create(moduleClass.prototype); + moduleClass.apply(module, [ngModule].concat(constructorParameters || [])) // Register config functions var configFns: Function[] = []; diff --git a/src/view.ts b/src/view.ts index 5fbc016..f610899 100644 --- a/src/view.ts +++ b/src/view.ts @@ -30,7 +30,12 @@ export interface ViewOptions { /** * TODO */ - styleUrl?: string; + styles?: string|string[]; + + /** + * TODO + */ + // stylesUrls?: string[]; } @@ -41,7 +46,8 @@ export class ViewAnnotation { template: string|FunctionReturningString = void 0; templateUrl: string|FunctionReturningString = void 0; - styleUrl: string = void 0; + styles: string|string[] = void 0; + // stylesUrls: string[] = void 0; controllerAs: string = void 0; constructor(options: ViewOptions) { diff --git a/typings/tng/tng.d.ts b/typings/tng/tng.d.ts index 28d5b68..e16aa98 100644 --- a/typings/tng/tng.d.ts +++ b/typings/tng/tng.d.ts @@ -319,10 +319,15 @@ declare module "tng/view" { */ templateUrl?: string|FunctionReturningString; + /** + * + */ + styles?: string|string[]; + /** * */ - styleUrl?: string; + // stylesUrls?: string[]; } @@ -473,7 +478,8 @@ declare module "tng/module" { import {ConstantWrapper} from 'tng/constant'; import {ValueWrapper} from 'tng/value'; - type DependenciesArray = (string|Function|ConstantWrapper|ValueWrapper)[]; + export type Dependency = (string|Function|ConstantWrapper|ValueWrapper); + export type DependenciesArray = (Dependency|Dependency[])[]; /** * Options available when decorating a class as a module @@ -512,7 +518,8 @@ declare module "tng/module" { /** * Publishe a TNG module, registering it and its dependencies on Angular. */ - export function publishModule(moduleController: Function, name?: string): ng.IModule; + export function publishModule(moduleController: Function, name?: string, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.IModule; // -- Internal API @@ -569,15 +576,19 @@ declare module "tng/application" { declare module "tng/bootstrap" { + import {DependenciesArray} from "tng/module"; + /** * TODO document */ - export function bootstrap(applicationClass: Function): ng.auto.IInjectorService; + export function bootstrap(applicationClass: Function, element?: Element|Document, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.auto.IInjectorService; /** * TODO document */ - export function bootstrap(moduleClass: Function, element: Element|Document): ng.auto.IInjectorService; + export function bootstrap(moduleClass: Function, element: Element|Document, + dependencies?: DependenciesArray, constructorParameters?: any[]): ng.auto.IInjectorService; /** * TODO document