Merge commit '0fc80429ac73139ab3e15c91345d5ea3db59c40c' into releases

.travis.yml

@@ -32,7 +32,7 @@ before_script:
 after_script:
   - kill %1 # kill e2e server
 before_deploy:
-- npm run build-dist
+- npm run build:prod-module
 deploy:
   - provider: npm
     skip_cleanup: true

build/webpack.prod.js

@@ -10,7 +10,9 @@ const BANNER =
   Version: ${VERSION}
   Repo: https://github.com/Rebilly/ReDoc`;
 
-module.exports = {
+const IS_MODULE = process.env.IS_MODULE != null;
+
+const config = {
   context: root(),
   devtool: 'source-map',
 
@@ -35,13 +37,13 @@ module.exports = {
     setImmediate: false
   },
   entry: {
-    'redoc': ['./lib/polyfills.ts', './lib/vendor.ts', './lib/index.ts']
+    'redoc': IS_MODULE ? ['./lib/vendor.ts', './lib/redoc.module.ts'] : ['./lib/polyfills.ts', './lib/vendor.ts', './lib/index.ts']
   },
 
   output: {
     path: root('dist'),
-    filename: '[name].min.js',
+    filename: IS_MODULE ? '[name]-module.js' : '[name].min.js',
-    sourceMapFilename: '[name].min.map',
+    sourceMapFilename: IS_MODULE ? '[name]-module.map' : '[name].min.map',
     library: 'Redoc',
     libraryTarget: 'umd',
     umdNamedDefine: true
@@ -60,9 +62,14 @@ module.exports = {
       test: /\.ts$/,
       loader: 'awesome-typescript-loader',
       exclude: /(node_modules)/
+    }, {
+      test: /lib[\\\/].*\.css$/,
+      loaders: ['raw-loader'],
+      exclude: [/redoc-initial-styles\.css$/]
     }, {
       test: /\.css$/,
-      loaders: ['style', 'css?-import']
+      loaders: ['style', 'css?-import'],
+      exclude: [/lib[\\\/](?!.*redoc-initial-styles).*\.css$/]
     }]
   },
 
@@ -90,3 +97,31 @@ module.exports = {
     })
   ],
 }
+
+if (IS_MODULE) {
+  config.externals = {
+    'jquery': 'jQuery',
+    'esprima': 'esprima', // optional dep of ys-yaml not needed for redoc
+    '@angular/platform-browser-dynamic': '@angular/platform-browser-dynamic',
+    '@angular/platform-browser': '@angular/platform-browser',
+    '@angular/core': '@angular/core',
+    '@angular/common': '@angular/common',
+    '@angular/forms': '@angular/forms',
+    'core-js': 'core-js',
+    'rxjs': 'rxjs',
+    'zone.js/dist/zone': 'zone.js/dist/zone'
+  };
+
+  config.module.rules.push({
+    test: /\.ts$/,
+    loader: 'angular2-template-loader',
+    exclude: [/\.(spec|e2e)\.ts$/]
+  });
+
+  config.module.rules.push({
+    test: /\.html$/,
+    loader: 'raw-loader'
+  });
+}
+
+module.exports = config;

lib/components/Redoc/redoc.html

@@ -1,4 +1,4 @@
-<div class="redoc-wrap">
+<div class="redoc-wrap" *ngIf="specLoaded">
   <div class="menu-content" sticky-sidebar [scrollParent]="options.$scrollParent" [scrollYOffset]="options.scrollYOffset">
       <api-logo> </api-logo>
       <side-menu> </side-menu>

lib/components/Redoc/redoc.ts

@@ -1,6 +1,7 @@
 'use strict';
 
-import { ElementRef, ComponentRef, AfterViewInit, Component, ChangeDetectionStrategy} from '@angular/core';
+import { ElementRef, ComponentRef, ChangeDetectorRef, Input,
+  Component, OnInit, ChangeDetectionStrategy} from '@angular/core';
 
 import { BrowserDomAdapter as DOM } from '../../utils/browser-adapter';
 import { BaseComponent } from '../base';
@@ -16,31 +17,32 @@ import { OptionsService, RedocEventsService } from '../../services/index';
   styleUrls: ['./redoc.css'],
   changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class Redoc extends BaseComponent implements AfterViewInit {
+export class Redoc extends BaseComponent implements OnInit {
   static appRef: ComponentRef<any>;
   static _preOptions: any;
+  specLoaded: boolean;
 
   public options: any;
 
   private element: any;
 
-  static showLoadingAnimation() {
+  @Input() specUrl: string;
-    let elem = DOM.query('redoc');
+
-    DOM.addClass(elem, 'loading');
+  // TODO: refactor in separate component/service
+  showLoadingAnimation() {
+    DOM.addClass(this.element, 'loading');
   }
 
-  static hideLoadingAnimation() {
+  hideLoadingAnimation() {
-    let redocEl = DOM.query('redoc');
+    DOM.addClass(this.element, 'loading-remove');
-    if (!redocEl) return;
-    DOM.addClass(redocEl, 'loading-remove');
     setTimeout(() => {
-      DOM.removeClass(redocEl, 'loading-remove');
+      DOM.removeClass(this.element, 'loading-remove');
-      DOM.removeClass(redocEl, 'loading');
+      DOM.removeClass(this.element, 'loading');
     }, 400);
   }
 
-  static displayError(err) {
+  static displayError(err, elem?) {
-    let redocEl = DOM.query('redoc');
+    let redocEl = elem || DOM.query('redoc');
     if (!redocEl) return;
     let heading = 'Oops... ReDoc failed to render this spec';
     let details = err.message;
@@ -51,10 +53,10 @@ export class Redoc extends BaseComponent implements AfterViewInit {
   }
 
   constructor(specMgr: SpecManager, optionsMgr:OptionsService, elementRef:ElementRef,
-    public events:RedocEventsService) {
+    public events:RedocEventsService, private changeDetector: ChangeDetectorRef) {
     super(specMgr);
     // merge options passed before init
-    optionsMgr.options = Redoc._preOptions;
+    optionsMgr.options = Redoc._preOptions || {};
     this.element = elementRef.nativeElement;
     //parse options (top level component doesn't support inputs)
     optionsMgr.parseOptions( this.element );
@@ -62,12 +64,27 @@ export class Redoc extends BaseComponent implements AfterViewInit {
     if (scrollParent === DOM.defaultDoc().body) scrollParent = window;
     optionsMgr.options.$scrollParent = scrollParent;
     this.options = optionsMgr.options;
-    this.events = events;
   }
 
-  ngAfterViewInit() {
+  load() {
-    setTimeout( () => {
+    this.showLoadingAnimation();
+    SpecManager.instance().load(this.options.specUrl).then(() => {
+      this.specLoaded = true;
+      this.changeDetector.markForCheck();
+      //this.changeDetector.detectChanges();
       this.events.bootstrapped.next({});
-    });
+      this.hideLoadingAnimation();
+    }).catch((err) => {
+      this.hideLoadingAnimation();
+      Redoc.displayError(err, this.element);
+      throw err;
+    })
+  }
+
+  ngOnInit() {
+    if (this.specUrl) {
+      this.options.specUrl = this.specUrl;
+    }
+    this.load();
   }
 }

lib/index.ts

@@ -29,18 +29,11 @@ export function init(specUrl:string, options:any = {}) {
 
   Redoc._preOptions = options;
   options.specUrl = options.specUrl || specUrl;
-
+  return bootstrapRedoc()
-  Redoc.showLoadingAnimation();
-  return SpecManager.instance().load(specUrl)
-  .then(() => {
-    return bootstrapRedoc();
-  })
   .then(appRef => {
-    Redoc.hideLoadingAnimation();
     moduleRef = appRef;
     console.log('ReDoc initialized!');
   }).catch(err => {
-    Redoc.hideLoadingAnimation();
     Redoc.displayError(err);
     throw err;
   });
@@ -48,6 +41,7 @@ export function init(specUrl:string, options:any = {}) {
 
 export function destroy() {
   moduleRef.destroy();
+  moduleRef = null;
 };
 
 

lib/redoc.module.ts

@@ -21,7 +21,10 @@ import { SpecManager } from './utils/SpecManager';
     MenuService,
     WarningsService,
     OptionsService
-  ]
+  ],
+  exports: [Redoc]
 })
 export class RedocModule {
 }
+
+export { Redoc, SpecManager };

lib/services/schema-helper.service.ts

@@ -137,16 +137,16 @@ const injectors = {
     check: (propertySchema) => (propertySchema.type === 'integer' || propertySchema.type === 'number'),
     inject: (injectTo, propertySchema = injectTo) => {
       var range = '';
-      if (propertySchema.minimum && propertySchema.maximum) {
+      if (propertySchema.minimum != undefined && propertySchema.maximum != undefined) {
         range += propertySchema.exclusiveMinimum ? '( ' : '[ ';
         range += propertySchema.minimum;
         range += ' .. ';
         range += propertySchema.maximum;
         range += propertySchema.exclusiveMaximum ? ' )' : ' ]';
-      } else if (propertySchema.maximum) {
+      } else if (propertySchema.maximum != undefined) {
         range += propertySchema.exclusiveMaximum? '< ' : '<= ';
         range += propertySchema.maximum;
-      } else if (propertySchema.minimum) {
+      } else if (propertySchema.minimum != undefined) {
         range += propertySchema.exclusiveMinimum ? '> ' : '>= ';
         range += propertySchema.minimum;
       }
@@ -160,11 +160,11 @@ const injectors = {
     check: propertySchema => (propertySchema.type === 'string'),
     inject: (injectTo, propertySchema = injectTo) => {
       var range;
-      if (propertySchema.minLength && propertySchema.maxLength) {
+      if (propertySchema.minLength != undefined && propertySchema.maxLength != undefined) {
         range = `[ ${propertySchema.minLength} .. ${propertySchema.maxLength} ]`;
-      } else if (propertySchema.maxLength) {
+      } else if (propertySchema.maxLength != undefined) {
         range = '<= ' + propertySchema.maxLength;
-      } else if (propertySchema.minLength) {
+      } else if (propertySchema.minLength != undefined) {
         range = '>= ' + propertySchema.minLength;
       }
 

lib/utils/SpecManager.ts

@@ -30,10 +30,14 @@ export class SpecManager {
 
       JsonSchemaRefParser.bundle(url, {http: {withCredentials: false}})
       .then(schema => {
+        try {
           this._url = url;
           this._schema = schema;
           this.init();
-          return resolve(this._schema);
+          resolve(this._schema);
+        } catch(err) {
+          reject(err);
+        }
       }, err => reject(err));
     });
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "redoc",
   "description": "Swagger-generated API Reference Documentation",
-  "version": "1.3.3",
+  "version": "1.4.0",
   "repository": {
     "type": "git",
     "url": "git://github.com/Rebilly/ReDoc"
@@ -22,6 +22,7 @@
     "webpack:prod": "webpack --config build/webpack.prod.js --profile --bail",
     "build:sass": "node-sass -q -o lib lib",
     "build:prod": "npm run build:sass && npm run ngc && npm run webpack:prod",
+    "build:prod-module": "npm run build:sass && npm run ngc && npm run webpack:prod && IS_MODULE=true npm run webpack:prod",
     "build-dist": "npm run build:prod",
     "stats": "webpack --config build/webpack.prod.js --json > stats.json",
     "start": "webpack-dev-server --config build/webpack.dev.js --content-base demo",
@@ -44,7 +45,13 @@
   "author": "Roman Hotsiy",
   "license": "MIT",
   "devDependencies": {
-    "@angular/compiler-cli": "^0.6.3",
+    "@angular/common": "^2.1.0",
+    "@angular/compiler": "^2.1.0",
+    "@angular/compiler-cli": "^2.1.0",
+    "@angular/core": "^2.1.0",
+    "@angular/platform-browser": "^2.1.0",
+    "@angular/platform-browser-dynamic": "^2.1.0",
+    "@angular/platform-server": "^2.1.0",
     "@types/core-js": "^0.9.31",
     "@types/jasmine": "^2.2.32",
     "@types/requirejs": "^2.1.26",
@@ -53,8 +60,9 @@
     "awesome-typescript-loader": "^2.2.1",
     "branch-release": "^1.0.3",
     "chalk": "^1.1.3",
-    "codelyzer": "^1.0.0-beta.0",
+    "codelyzer": "^1.0.0-beta.2",
     "copy-webpack-plugin": "^3.0.1",
+    "core-js": "^2.4.1",
     "coveralls": "^2.11.9",
     "css-loader": "^0.24.0",
     "deploy-to-gh-pages": "^1.1.2",
@@ -78,6 +86,7 @@
     "phantomjs-prebuilt": "^2.1.7",
     "protractor": "^4.0.4",
     "raw-loader": "^0.5.1",
+    "rxjs": "^5.0.0-beta.12",
     "shelljs": "^0.7.0",
     "should": "^11.1.0",
     "sinon": "^1.17.2",
@@ -88,16 +97,10 @@
     "tslint-stylish": "^2.1.0-beta",
     "typescript": "^2.0.3",
     "webpack": "^2.1.0-beta.25",
-    "webpack-dev-server": "^2.1.0-beta.6"
+    "webpack-dev-server": "^2.1.0-beta.6",
+    "zone.js": "^0.6.25"
   },
   "dependencies": {
-    "@angular/common": "^2.0.1",
-    "@angular/compiler": "^2.0.1",
-    "@angular/core": "^2.0.1",
-    "@angular/platform-browser": "^2.0.1",
-    "@angular/platform-browser-dynamic": "^2.0.1",
-    "@angular/platform-server": "^2.0.1",
-    "core-js": "^2.4.1",
     "dropkickjs": "^2.1.10",
     "hint.css": "^2.3.2",
     "json-pointer": "^0.5.0",
@@ -105,10 +108,19 @@
     "openapi-sampler": "^0.3.1",
     "prismjs": "^1.5.1",
     "remarkable": "^1.6.2",
-    "rxjs": "^5.0.0-beta.12",
     "scrollparent": "^1.0.0",
     "slugify": "^1.0.2",
-    "stream-http": "^2.3.1",
+    "stream-http": "^2.3.1"
+  },
+  "peerDependencies": {
+    "@angular/common": "^2.1.0",
+    "@angular/compiler": "^2.1.0",
+    "@angular/core": "^2.1.0",
+    "@angular/platform-browser": "^2.1.0",
+    "@angular/platform-browser-dynamic": "^2.1.0",
+    "@angular/platform-server": "^2.1.0",
+    "core-js": "^2.4.1",
+    "rxjs": "5.0.0-beta.12",
     "zone.js": "^0.6.25"
   }
 }