refactor(docs): make docs lint compatible

tiposaurio · Oct 16, 2017 · 782b8df · 782b8df
1 parent 0e8c260
commit 782b8df
Show file tree

Hide file tree

Showing 16 changed files with 87 additions and 76 deletions.
diff --git a/.angular-cli.json b/.angular-cli.json
@@ -122,6 +122,12 @@
     },
     {
       "project": "e2e/tsconfig.e2e.json"
+    },
+    {
+      "project": "docs/tsconfig.spec.json"
+    },
+    {
+      "project": "docs/tsconfig.app.json"
     }
   ],
   "test": {

diff --git a/docs/app/app.component.ts b/docs/app/app.component.ts
@@ -48,7 +48,7 @@ export class NgdAppComponent implements AfterViewInit, OnDestroy, OnInit {
       if (el) {
         el.scrollIntoView();
         if (new RegExp(/themes/i).test(this.router.url)) {
-          window.scrollBy(0, -235);//header + theme-header
+          window.scrollBy(0, -235); // header + theme-header
         } else {
           window.scrollBy(0, -80);
         }

diff --git a/docs/app/components/header/ngd-header.component.ts b/docs/app/components/header/ngd-header.component.ts
@@ -7,6 +7,7 @@ import { DocsService } from '../../docs/docs.service';
 @Component({
   selector: 'ngd-header',
   styleUrls: ['ngd-header.component.scss'],
+  // tslint:disable
   template: `
     <div class="logo-container">
       <a routerLink="/">
@@ -21,7 +22,7 @@ import { DocsService } from '../../docs/docs.service';
     <nb-menu class="mobile-menu" [class.active]="isMenuActive" [items]="menuItems" tag="mobileMenu"></nb-menu>
   `,
 })
-
+// tslint:enable
 export class NgdHeaderComponent implements OnInit, OnDestroy {
 
   isMenuActive: boolean = false;

diff --git a/docs/app/docs/docs.service.ts b/docs/app/docs/docs.service.ts
@@ -47,11 +47,13 @@ export class DocsService {
     return classStyles.map(item => {
       item.styles.map(prop => {
         prop.themedValues = [];
-        for (let themeName in PARSEDDOCS.themes) {
-          prop.themedValues.push({
-            theme: PARSEDDOCS.themes[themeName].name,
-            value: PARSEDDOCS.themes[themeName].data[prop.name].value,
-          });
+        for (const themeName in PARSEDDOCS.themes) {
+          if (PARSEDDOCS.themes.hasOwnProperty(themeName)) {
+            prop.themedValues.push({
+              theme: PARSEDDOCS.themes[themeName].name,
+              value: PARSEDDOCS.themes[themeName].data[prop.name].value,
+            });
+          }
         }
         return prop;
       });
@@ -80,9 +82,8 @@ export class DocsService {
     let menuItems = structure.map((item: any) => {
       if (item.name) {
         const menuItem: any = {};
-        const itemLink = item.type === 'block' ?
-          `${parentLink}`
-          : `${parentLink ? parentLink : ''}/${item.name.replace(/[^a-zA-Z0-9\s]+/g, '').replace(/\s/g, '-').toLowerCase()}`;
+        const name = item.name.replace(/[^a-zA-Z0-9\s]+/g, '').replace(/\s/g, '-').toLowerCase();
+        const itemLink = item.type === 'block' ? parentLink : `${parentLink ? parentLink : ''}/${name}`;
 
         if (item.type !== 'section' || !item.isSubpages) {
           menuItem['link'] = itemLink;

diff --git a/docs/app/docs/page/blocks/basic-blocks/ngd-examples-block.component.ts b/docs/app/docs/page/blocks/basic-blocks/ngd-examples-block.component.ts
@@ -18,7 +18,7 @@ declare var Prism;
       <p ngdDescription>{{example.description}}</p>
       <ngd-code-highlighter [code]="example.code.trim()"></ngd-code-highlighter>
       <pre><code [innerHTML]="getContent(example.code)"></code></pre>
-    </div>   
+    </div>
 `,
 })
 export class NgdExamplesBlockComponent {

diff --git a/docs/app/docs/page/blocks/basic-blocks/ngd-methods-block.component.ts b/docs/app/docs/page/blocks/basic-blocks/ngd-methods-block.component.ts
@@ -10,43 +10,44 @@ import { Component, Input } from '@angular/core';
   selector: 'ngd-methods-block',
   template: `
     <div class="block-container">
-      <p class="block-title"><a [routerLink]="" fragment="{{className}}Methods" ngdFragment></a> Methods</p>  
+      <p class="block-title"><a [routerLink]="" fragment="{{ className }}Methods" ngdFragment></a> Methods</p>
       <div class="table-container">
         <table class="table" *ngIf="classMethods?.length > 0">
           <thead>
-            <tr>
-              <td>Name</td>
-              <td>Description</td>
-            </tr>
+          <tr>
+            <td>Name</td>
+            <td>Description</td>
+          </tr>
           </thead>
           <tbody>
-            <tr *ngFor="let method of classMethods">
-              <ng-container *ngIf="method.shortDescription || method.description">
-                <td>{{ method.name }} <br><i *ngIf="method.isStatic">static method</i></td>
-                <td>
-                <div class="method-signature" *ngIf="method.params.length > 0 && method.type.length > 0 && method.type[0] !== 'void'">
+          <tr *ngFor="let method of classMethods">
+            <ng-container *ngIf="method.shortDescription || method.description">
+              <td>{{ method.name }} <br><i *ngIf="method.isStatic">static method</i></td>
+              <td>
+                <div class="method-signature"
+                     *ngIf="method.params.length > 0 && method.type.length > 0 && method.type[0] !== 'void'">
                   <div *ngIf="method.params.length > 0"><i>parameters:</i>
                     <span *ngFor="let param of method.params; let last = last">
                       {{param.name}}: <code>{{param.type}}</code><span *ngIf="!last">,</span>
-                    </span> 
+                    </span>
                   </div>
                   <div *ngIf="method.type.length > 0 && method.type[0] !== 'void'">
-                   <i>return type:</i> 
+                    <i>return type:</i>
                     <code>{{ method.type.join(",\\n") }}</code>
                   </div>
                 </div>
                 <div *ngIf="method.shortDescription || method.description" class="method-description" ngdDescription>
-                  {{method.shortDescription}} <br> {{ method.description }} 
+                  {{method.shortDescription}} <br> {{ method.description }}
                 </div>
-                </td>
-              </ng-container>
-            </tr>
+              </td>
+            </ng-container>
+          </tr>
           </tbody>
         </table>
       </div>
       <div *ngFor="let method of classMethods">
         <div *ngIf="method.examples.length > 0">
-          <ngd-examples-block  [blockData]="method" [title]="'Examples of usage ' + method.name"></ngd-examples-block>
+          <ngd-examples-block [blockData]="method" [title]="'Examples of usage ' + method.name"></ngd-examples-block>
         </div>
       </div>
     </div>

diff --git a/docs/app/docs/page/blocks/basic-blocks/ngd-props-block.component.ts b/docs/app/docs/page/blocks/basic-blocks/ngd-props-block.component.ts
@@ -9,7 +9,7 @@ import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'ngd-props-block',
-  template: `    
+  template: `
     <div  class="inputs block-container" *ngIf="classInputs.length > 0">
       <p class="block-title"><a [routerLink]="" fragment="{{className}}Inputs" ngdFragment></a> Inputs</p>
       <div class="table-container">
@@ -57,7 +57,7 @@ import { Component, Input } from '@angular/core';
           </tbody>
         </table>
       </div>
-    </div>  
+    </div>
   `,
 })
 export class NgdPropsBlockComponent {
@@ -67,8 +67,8 @@ export class NgdPropsBlockComponent {
 
   @Input('blockData')
   set setProps(blockData: any) {
-    this.classInputs = blockData.props.filter(item => item.kind === "input");
-    this.classOutputs = blockData.props.filter(item => item.kind === "output");
+    this.classInputs = blockData.props.filter(item => item.kind === 'input');
+    this.classOutputs = blockData.props.filter(item => item.kind === 'output');
     this.className = blockData.name;
   }
 

diff --git a/docs/app/docs/page/blocks/basic-blocks/ngd-styles-block.component.ts b/docs/app/docs/page/blocks/basic-blocks/ngd-styles-block.component.ts
@@ -11,7 +11,7 @@ import { DocsService } from '../../../docs.service';
   selector: 'ngd-styles-block',
   template: `
     <div class="block-container" *ngFor="let style of classStyles">
-      <p class="block-title"><a [routerLink]="" fragment="{{className}}Styles" ngdFragment></a>Component themable styles</p>
+      <p class="block-title"><a fragment="{{className}}Styles" ngdFragment></a>Component themable styles</p>
       <div class="table-container">
         <table class="table table-striped">
           <thead>
@@ -32,7 +32,7 @@ import { DocsService } from '../../../docs.service';
             </tr>
           </tbody>
         </table>
-      </div>    
+      </div>
     </div>
 `,
 })

diff --git a/docs/app/docs/page/blocks/ngd-component-block.component.ts b/docs/app/docs/page/blocks/ngd-component-block.component.ts
@@ -10,7 +10,7 @@ import { Component, Input } from '@angular/core';
       <ngd-props-block *ngIf="blockData?.props?.length > 0" [blockData]="blockData"></ngd-props-block>
       <ngd-methods-block *ngIf="isMethods()" [blockData]="blockData"></ngd-methods-block>
       <ngd-styles-block *ngIf="blockData?.styles?.length > 0" [blockData]="blockData"></ngd-styles-block>
-`
+`,
 })
 export class NgdComponentBlockComponent {
 

diff --git a/docs/app/docs/page/blocks/ngd-theme-block.component.ts b/docs/app/docs/page/blocks/ngd-theme-block.component.ts
@@ -1,51 +1,52 @@
-import { Component, Input, OnDestroy, Renderer2, ElementRef } from '@angular/core';
+import { Component, ElementRef, Input, OnDestroy, Renderer2 } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { Subscription } from 'rxjs/Subscription';
 import { DocsService } from '../../docs.service';
 
 @Component({
   selector: 'ngd-theme-block',
   template: `
-  <div class="theme-header" >
-    <div class="theme-title">{{ themeTitle }} Theme
-      <span *ngIf="parentTheme">inherited from {{parentTheme}} theme</span>
-    </div>
-    <div class="input-group">
-      <input #searchInput
-        type="text"
-        class="form-control"
-        [ngModel]="searchTermModel"
-        [class.form-control-warning]="isWarning && searchInput.value"
-        placeholder="Search for..."
-        (keyup.enter)="filterThemeContent(searchInput.value)">
-      <span class="input-group-btn">
+    <div class="theme-header">
+      <div class="theme-title">{{ themeTitle }} Theme
+        <span *ngIf="parentTheme">inherited from {{parentTheme}} theme</span>
+      </div>
+      <div class="input-group">
+        <input #searchInput
+               type="text"
+               class="form-control"
+               [ngModel]="searchTermModel"
+               [class.form-control-warning]="isWarning && searchInput.value"
+               placeholder="Search for..."
+               (keyup.enter)="filterThemeContent(searchInput.value)">
+        <span class="input-group-btn">
         <button
           class="btn btn-success"
           (click)="filterThemeContent(searchInput.value)">
           Search
         </button>
       </span>
+      </div>
+      <div *ngIf="isWarning && searchInput.value" class="filter-warning">Nothing found</div>
     </div>
-    <div *ngIf="isWarning && searchInput.value" class="filter-warning">Nothing found</div>
-  </div>
-  <div class="table-container">  
-    <table class="table-striped table theme-table">
-      <thead>
+    <div class="table-container">
+      <table class="table-striped table theme-table">
+        <thead>
         <tr>
           <td>Name</td>
           <td>Value</td>
           <td>Parent</td>
         </tr>
-      </thead>
-      <tbody>
+        </thead>
+        <tbody>
         <tr *ngFor="let prop of filteredContent;" fragment="{{prop.name}}" tableCell ngdFragment>
           <td>
             <a [routerLink]="" fragment="{{prop.name}}" class="fragment"></a>
             <a [routerLink]="" fragment="{{prop.name}}">{{ prop.name }}</a>
           </td>
           <td ngdSassValue>{{ prop.value }}</td>
           <td class="theme-parents-cell">
-            <a routerLink="/docs/themes/{{prop.parents[0]?.theme}}" fragment="{{prop.parents[0]?.prop}}" tableCell ngdFragment>
+            <a routerLink="/docs/themes/{{prop.parents[0]?.theme}}"
+               fragment="{{prop.parents[0]?.prop}}" tableCell ngdFragment>
               {{ prop.parents[0]?.prop }}
               <span *ngIf="prop.parents[0] && prop.parents[0].theme !== themeName">({{prop.parents[0]?.theme}})</span>
             </a>
@@ -60,10 +61,10 @@ import { DocsService } from '../../docs.service';
             </div>
           </td>
         </tr>
-      </tbody>
-    </table>
-  </div>
-`,
+        </tbody>
+      </table>
+    </div>
+  `,
 })
 export class NgdThemeComponent implements OnDestroy {
   themeTitle: string;
@@ -111,7 +112,7 @@ export class NgdThemeComponent implements OnDestroy {
       this.filteredContent = filterResult;
       this.isWarning = !(filterResult.length > 0);
       this.renderer.setProperty(document.body, 'scrollTop', 0);
-      this.router.navigate([], { relativeTo: this.route });
+      this.router.navigate([], {relativeTo: this.route});
     }
   }
 

diff --git a/docs/app/docs/page/page.component.ts b/docs/app/docs/page/page.component.ts
@@ -70,7 +70,7 @@ export class NgdPageComponent implements OnDestroy, OnInit {
       this.currentItem.children[0].block !== 'theme';
 
     this.titleService.setTitle(`Nebular Documentation - ${event.item.data.name}`);
-    window.scrollTo(0,0);
+    window.scrollTo(0, 0);
   }
 
   ngOnDestroy() {

diff --git a/docs/app/docs/utils/code-highlighter.component.ts b/docs/app/docs/utils/code-highlighter.component.ts
@@ -1,5 +1,5 @@
-import { Component, Input } from '@angular/core';
-declare var Prism;
+import { Component, Input, OnInit } from '@angular/core';
+declare const Prism;
 
 
 @Component({
@@ -8,12 +8,12 @@ declare var Prism;
     <div *ngIf="isHideEnable" class="code-title" (click)="showCode()">
       Example Code
       <i [hidden]="isCodeShown" class="ion-chevron-down"></i>
-      <i [hidden]="!isCodeShown" class="ion-chevron-up"></i>  
+      <i [hidden]="!isCodeShown" class="ion-chevron-up"></i>
       </div>
     <pre [hidden]="!isCodeShown"><code [innerHtml]="code"></code></pre>
-`
+`,
 })
-export class NgdHighlighterComponent {
+export class NgdHighlighterComponent implements OnInit {
   @Input() code: string;
   isCodeShown: boolean = true;
   isHideEnable: boolean = false;

diff --git a/docs/app/docs/utils/ngd-color-swatch.directive.ts b/docs/app/docs/utils/ngd-color-swatch.directive.ts
@@ -1,15 +1,15 @@
-import { Directive, ElementRef, AfterViewInit, Renderer2 } from '@angular/core';
+import { Directive, ElementRef, AfterViewInit } from '@angular/core';
 
 @Directive({
     selector: '[ngdSassValue]',
 })
 export class NgdSassPropValueDirective implements AfterViewInit {
-  constructor(private el: ElementRef,
-              private renderer: Renderer2) { }
+
+  constructor(private el: ElementRef) { }
 
   ngAfterViewInit() {
-    this.el.nativeElement.innerHTML =
-    this.el.nativeElement.innerHTML.replace(/(#[a-f0-9]{6}|rgba.*?\))/ig , "$&" + "<div class='color-swatch' style='background:"+ "$&" +"'></div>");
+    this.el.nativeElement.innerHTML = this.el.nativeElement.innerHTML
+      .replace(/(#[a-f0-9]{6}|rgba.*?\))/ig , '$&<div class="color-swatch" style="background: $&"></div>');
     this.el.nativeElement.innerHTML = this.el.nativeElement.innerHTML.replace(/,/g, ', ');
   }
 }
diff --git a/docs/app/docs/utils/ngd-fragment.directive.ts b/docs/app/docs/utils/ngd-fragment.directive.ts
@@ -12,9 +12,10 @@ import { DocsService } from '../docs.service';
     '[class.fragment]': '!remote && !table',
     '[attr.id]': '!remote ? fragment : null',
     '[class.table-fragment]': 'table',
-  }
+  },
 })
 export class NgdFragmentDirective {
+
   table: boolean = false;
   remote: boolean = false;
 

diff --git a/docs/app/homepage/homepage.component.ts b/docs/app/homepage/homepage.component.ts
@@ -187,7 +187,7 @@ export class NgdHomepageComponent implements AfterViewInit, OnInit {
 
   private loadImage(src): Promise<any> {
     return new Promise((resolve, reject) => {
-      let img = new Image();
+      const img = new Image();
       img.src = src;
       img.onload = function () {
         resolve(src);

diff --git a/docs/structure.ts b/docs/structure.ts
@@ -415,7 +415,7 @@ export const STRUCTURE = [
             blockData: 'cosmic',
           },
         ],
-      }
+      },
     ],
   },
   {
-Original file line number
+Diff line change
@@ Expand Up / @@ -415,7 +415,7 @@ export const STRUCTURE = [ @@
                 blockData: 'cosmic',
               },
             ],
-          }
+          },
         ],
       },
       {
@@ Expand Down @@