Merge branch 'master' into skeleton

Increased version number
Fixed: Sidenav helper causes issues on mobile media steps
2025-12-25 06:07:09 +00:00 · 2017-11-27 17:21:38 +03:00 · 2017-11-27 17:20:34 +03:00 · 2017-11-27 14:42:23 +03:00 · 2017-11-27 14:35:37 +03:00 · 2017-11-27 14:31:57 +03:00
39 changed files with 918 additions and 1242 deletions
--- a/.angular-cli.json
+++ b/.angular-cli.json
@@ -38,15 +38,27 @@
    "lint": [
        {
            "project": "src/tsconfig.app.json",
-            "exclude": "**/node_modules/**"
+            "exclude": [
+                "**/node_modules/**",
+                "**/src/app/fuse-fake-db/**/*",
+                "**/src/assets/angular-material-examples/**/*"
+            ]
        },
        {
            "project": "src/tsconfig.spec.json",
-            "exclude": "**/node_modules/**"
+            "exclude": [
+                "**/node_modules/**",
+                "**/src/app/fuse-fake-db/**/*",
+                "**/src/assets/angular-material-examples/**/*"
+            ]
        },
        {
            "project": "e2e/tsconfig.e2e.json",
-            "exclude": "**/node_modules/**"
+            "exclude": [
+                "**/node_modules/**",
+                "**/src/app/fuse-fake-db/**/*",
+                "**/src/assets/angular-material-examples/**/*"
+            ]
        }
    ],
    "test": {
--- a/e2e/app.e2e-spec.ts
+++ b/e2e/app.e2e-spec.ts
@@ -1,10 +1,10 @@
-import { AppPage } from './app.po';
+import { Fuse2Page } from './app.po';

-describe('angular5 App', () => {
-    let page: AppPage;
+describe('Fuse2 App', () => {
+    let page: Fuse2Page;

    beforeEach(() => {
-        page = new AppPage();
+        page = new Fuse2Page();
    });

    it('should display welcome message', () => {
--- a/e2e/app.po.ts
+++ b/e2e/app.po.ts
@@ -1,14 +1,11 @@
-import { AppPage } from './app.po';
+import { browser, by, element } from 'protractor';

-describe('Fuse App', () => {
-    let page: AppPage;
+export class Fuse2Page {
+    navigateTo() {
+        return browser.get('/');
+    }

-    beforeEach(() => {
-        page = new AppPage();
-    });
-
-    it('should display welcome message', () => {
-        page.navigateTo();
-        expect(page.getParagraphText()).toEqual('Welcome to app!');
-    });
-});
+    getParagraphText() {
+        return element(by.css('app-root h1')).getText();
+    }
+}
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
  "name": "fuse2",
-  "version": "1.2.0",
+  "version": "1.2.3",
  "license": "",
  "scripts": {
    "ng": "ng",
@@ -16,46 +16,47 @@
  "private": true,
  "dependencies": {
    "@agm/core": "1.0.0-beta.2",
-    "@angular/animations": "5.0.0",
-    "@angular/cdk": "2.0.0-beta.12",
-    "@angular/common": "5.0.0",
-    "@angular/compiler": "5.0.0",
-    "@angular/core": "5.0.0",
-    "@angular/flex-layout": "2.0.0-beta.10",
-    "@angular/forms": "5.0.0",
-    "@angular/http": "5.0.0",
-    "@angular/material": "2.0.0-beta.12",
-    "@angular/platform-browser": "5.0.0",
-    "@angular/platform-browser-dynamic": "5.0.0",
-    "@angular/router": "5.0.0",
+    "@angular/animations": "5.0.3",
+    "@angular/cdk": "5.0.0-rc.1",
+    "@angular/common": "5.0.3",
+    "@angular/compiler": "5.0.3",
+    "@angular/core": "5.0.3",
+    "@angular/flex-layout": "2.0.0-beta.10-4905443",
+    "@angular/forms": "5.0.3",
+    "@angular/http": "5.0.3",
+    "@angular/material": "5.0.0-rc.1",
+    "@angular/material-moment-adapter": "5.0.0-rc.1",
+    "@angular/platform-browser": "5.0.3",
+    "@angular/platform-browser-dynamic": "5.0.3",
+    "@angular/router": "5.0.3",
    "@ngx-translate/core": "8.0.0",
-    "@swimlane/ngx-charts": "6.1.0",
-    "@swimlane/ngx-datatable": "10.4.0",
+    "@swimlane/ngx-charts": "7.0.1",
+    "@swimlane/ngx-datatable": "11.1.4",
    "@withinpixels/ngx-dnd": "3.1.0",
-    "angular-calendar": "0.21.3",
+    "angular-calendar": "0.22.1",
    "classlist.js": "1.1.20150312",
    "core-js": "2.5.1",
-    "d3": "4.11.0",
+    "d3": "4.12.0",
    "hammerjs": "2.0.8",
    "highlight.js": "9.12.0",
    "intl": "1.2.5",
-    "moment": "2.19.1",
-    "ngx-color-picker": "4.4.0",
+    "moment": "2.19.2",
+    "ngx-color-picker": "5.0.4",
    "ngx-cookie-service": "1.0.9",
-    "perfect-scrollbar": "1.0.3",
+    "perfect-scrollbar": "1.2.0",
    "rxjs": "5.5.2",
    "web-animations-js": "2.3.1",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
-    "@angular/cli": "1.5.0",
-    "@angular/compiler-cli": "5.0.0",
-    "@angular/language-service": "5.0.0",
+    "@angular/cli": "1.5.4",
+    "@angular/compiler-cli": "5.0.3",
+    "@angular/language-service": "5.0.3",
    "@angularclass/hmr": "2.1.3",
    "@types/jasmine": "2.5.54",
    "@types/jasminewd2": "2.0.3",
-    "@types/node": "6.0.90",
-    "codelyzer": "3.2.2",
+    "@types/node": "6.0.92",
+    "codelyzer": "4.0.1",
    "jasmine-core": "2.6.4",
    "jasmine-spec-reporter": "4.1.1",
    "karma": "1.7.1",
--- a/src/app/core/components/material-color-picker/material-color-picker.component.html
+++ b/src/app/core/components/material-color-picker/material-color-picker.component.html
@@ -2,7 +2,7 @@
        type="button"
        class="mat-elevation-z1"
        [matMenuTriggerFor]="colorMenu"
-        (onMenuOpen)="onMenuOpen()"
+        (menuOpened)="onMenuOpen()"
        [ngClass]="'mat-'+selectedPalette+'-'+selectedHue+'-bg'">
    <mat-icon>palette</mat-icon>
 </button>
--- a/src/app/core/components/shortcuts/shortcuts.component.html
+++ b/src/app/core/components/shortcuts/shortcuts.component.html
@@ -26,7 +26,7 @@
                </div>

                <button mat-icon-button [matMenuTriggerFor]="addMenu" matTooltip="Click to add/remove shortcut"
-                        (onMenuOpen)="onMenuOpen()">
+                        (menuOpened)="onMenuOpen()">
                    <mat-icon class="amber-600-fg">star</mat-icon>
                </button>

--- a/src/app/core/components/shortcuts/shortcuts.component.ts
+++ b/src/app/core/components/shortcuts/shortcuts.component.ts
@@ -149,7 +149,9 @@ export class FuseShortcutsComponent implements OnInit, OnDestroy

    onMenuOpen()
    {
-        this.searchInputField.nativeElement.focus();
+        setTimeout(() => {
+            this.searchInputField.nativeElement.focus();
+        });
    }

    showMobileShortcutsPanel()
--- a/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts
+++ b/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive.ts
@@ -1,9 +1,9 @@
 import { Directive, Input, OnInit, HostListener, OnDestroy, HostBinding } from '@angular/core';
 import { MatSidenav } from '@angular/material';
-import { FuseMatSidenavHelperService } from 'app/core/directives/mat-sidenav-helper/mat-sidenav-helper.service';
-import { FuseMatchMedia } from '../../services/match-media.service';
 import { ObservableMedia } from '@angular/flex-layout';
 import { Subscription } from 'rxjs/Subscription';
+import { FuseMatchMedia } from '../../services/match-media.service';
+import { FuseMatSidenavHelperService } from './fuse-mat-sidenav-helper.service';

@Directive({
    selector: '[fuseMatSidenavHelper]'
@@ -13,7 +13,6 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy
    matchMediaSubscription: Subscription;

    @HostBinding('class.mat-is-locked-open') isLockedOpen = true;
-    @HostBinding('class.mat-stop-transition') stopTransition = true;

    @Input('fuseMatSidenavHelper') id: string;
    @Input('mat-is-locked-open') matIsLockedOpenBreakpoint: string;
@@ -33,45 +32,31 @@ export class FuseMatSidenavHelperDirective implements OnInit, OnDestroy

        if ( this.observableMedia.isActive(this.matIsLockedOpenBreakpoint) )
        {
-            setTimeout(() => {
-                this.isLockedOpen = true;
-                this.matSidenav.mode = 'side';
-                this.matSidenav.open();
-            });
-            this.stopTransition = false;
+            this.isLockedOpen = true;
+            this.matSidenav.mode = 'side';
+            this.matSidenav.toggle(true);
        }
        else
        {
-            setTimeout(() => {
-                this.isLockedOpen = false;
-                this.matSidenav.mode = 'over';
-                this.matSidenav.close();
-            });
-
-            setTimeout(() => {
-                this.stopTransition = false;
-            }, 3000);
+            this.isLockedOpen = false;
+            this.matSidenav.mode = 'over';
+            this.matSidenav.toggle(false);
        }

        this.matchMediaSubscription = this.fuseMatchMedia.onMediaChange.subscribe(() => {
            if ( this.observableMedia.isActive(this.matIsLockedOpenBreakpoint) )
            {
-                setTimeout(() => {
-                    this.isLockedOpen = true;
-                    this.matSidenav.mode = 'side';
-                    this.matSidenav.open();
-                });
+                this.isLockedOpen = true;
+                this.matSidenav.mode = 'side';
+                this.matSidenav.toggle(true);
            }
            else
            {
-                setTimeout(() => {
-                    this.isLockedOpen = false;
-                    this.matSidenav.mode = 'over';
-                    this.matSidenav.close();
-                });
+                this.isLockedOpen = false;
+                this.matSidenav.mode = 'over';
+                this.matSidenav.toggle(false);
            }
        });
-
    }

    ngOnDestroy()
--- a/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.service.ts
+++ b/src/app/core/directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.service.ts
--- a/src/app/core/matColors.ts
+++ b/src/app/core/matColors.ts
@@ -681,6 +681,7 @@ const matColors = {
    }
 };

+// tslint:disable-next-line
 const matPresetColors = [
    '#ffebee', '#ffcdd2', '#ef9a9a', '#e57373', '#ef5350', '#f44336', '#e53935', '#d32f2f', '#c62828', '#b71c1c', '#ff8a80', '#ff5252', '#ff1744', '#d50000', '#fce4ec', '#f8bbd0', '#f48fb1', '#f06292', '#ec407a', '#e91e63', '#d81b60', '#c2185b', '#ad1457', '#880e4f', '#ff80ab', '#ff4081', '#f50057', '#c51162', '#f3e5f5', '#e1bee7', '#ce93d8', '#ba68c8', '#ab47bc', '#9c27b0', '#8e24aa', '#7b1fa2', '#6a1b9a', '#4a148c', '#ea80fc', '#e040fb', '#d500f9', '#aa00ff', '#ede7f6', '#d1c4e9', '#b39ddb', '#9575cd', '#7e57c2', '#673ab7', '#5e35b1', '#512da8', '#4527a0', '#311b92', '#b388ff', '#7c4dff', '#651fff', '#6200ea', '#e8eaf6', '#c5cae9', '#9fa8da', '#7986cb', '#5c6bc0', '#3f51b5', '#3949ab', '#303f9f', '#283593', '#1a237e', '#8c9eff', '#536dfe', '#3d5afe', '#304ffe', '#e3f2fd', '#bbdefb', '#90caf9', '#64b5f6', '#42a5f5', '#2196f3', '#1e88e5', '#1976d2', '#1565c0', '#0d47a1', '#82b1ff', '#448aff', '#2979ff', '#2962ff', '#e1f5fe', '#b3e5fc', '#81d4fa', '#4fc3f7', '#29b6f6', '#03a9f4', '#039be5', '#0288d1', '#0277bd', '#01579b', '#80d8ff', '#40c4ff', '#00b0ff', '#0091ea', '#e0f7fa', '#b2ebf2', '#80deea', '#4dd0e1', '#26c6da', '#00bcd4', '#00acc1', '#0097a7', '#00838f', '#006064', '#84ffff', '#18ffff', '#00e5ff', '#00b8d4', '#e0f2f1', '#b2dfdb', '#80cbc4', '#4db6ac', '#26a69a', '#009688', '#00897b', '#00796b', '#00695c', '#004d40', '#a7ffeb', '#64ffda', '#1de9b6', '#00bfa5', '#e8f5e9', '#c8e6c9', '#a5d6a7', '#81c784', '#66bb6a', '#4caf50', '#43a047', '#388e3c', '#2e7d32', '#1b5e20', '#b9f6ca', '#69f0ae', '#00e676', '#00c853', '#f1f8e9', '#dcedc8', '#c5e1a5', '#aed581', '#9ccc65', '#8bc34a', '#7cb342', '#689f38', '#558b2f', '#33691e', '#ccff90', '#b2ff59', '#76ff03', '#64dd17', '#f9fbe7', '#f0f4c3', '#e6ee9c', '#dce775', '#d4e157', '#cddc39', '#c0ca33', '#afb42b', '#9e9d24', '#827717', '#f4ff81', '#eeff41', '#c6ff00', '#aeea00', '#fffde7', '#fff9c4', '#fff59d', '#fff176', '#ffee58', '#ffeb3b', '#fdd835', '#fbc02d', '#f9a825', '#f57f17', '#ffff8d', '#ffff00', '#ffea00', '#ffd600', '#fff8e1', '#ffecb3', '#ffe082', '#ffd54f', '#ffca28', '#ffc107', '#ffb300', '#ffa000', '#ff8f00', '#ff6f00', '#ffe57f', '#ffd740', '#ffc400', '#ffab00', '#fff3e0', '#ffe0b2', '#ffcc80', '#ffb74d', '#ffa726', '#ff9800', '#fb8c00', '#f57c00', '#ef6c00', '#e65100', '#ffd180', '#ffab40', '#ff9100', '#ff6d00', '#fbe9e7', '#ffccbc', '#ffab91', '#ff8a65', '#ff7043', '#ff5722', '#f4511e', '#e64a19', '#d84315', '#bf360c', '#ff9e80', '#ff6e40', '#ff3d00', '#dd2c00', '#efebe9', '#d7ccc8', '#bcaaa4', '#a1887f', '#8d6e63', '#795548', '#6d4c41', '#5d4037', '#4e342e', '#3e2723', '#d7ccc8', '#bcaaa4', '#8d6e63', '#5d4037', '#fafafa', '#f5f5f5', '#eeeeee', '#e0e0e0', '#bdbdbd', '#9e9e9e', '#757575', '#616161', '#424242', '#212121', '#ffffff', '#eeeeee', '#bdbdbd', '#616161', '#eceff1', '#cfd8dc', '#b0bec5', '#90a4ae', '#78909c', '#607d8b', '#546e7a', '#455a64', '#37474f', '#263238', '#cfd8dc', '#b0bec5', '#78909c', '#455a64'
 ];
--- a/src/app/core/modules/shared.module.ts
+++ b/src/app/core/modules/shared.module.ts
@@ -8,13 +8,13 @@ import { ColorPickerModule } from 'ngx-color-picker';
 import { NgxDnDModule } from '@withinpixels/ngx-dnd';
 import { NgxDatatableModule } from '@swimlane/ngx-datatable';

-import { FuseMatSidenavHelperDirective, FuseMatSidenavTogglerDirective } from '../directives/mat-sidenav-helper/mat-sidenav-helper.directive';
+import { FuseMatSidenavHelperDirective, FuseMatSidenavTogglerDirective } from '../directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.directive';
+import { FuseMatSidenavHelperService } from '../directives/fuse-mat-sidenav-helper/fuse-mat-sidenav-helper.service';
 import { FusePipesModule } from '../pipes/pipes.module';
 import { FuseConfirmDialogComponent } from '../components/confirm-dialog/confirm-dialog.component';
 import { FuseCountdownComponent } from '../components/countdown/countdown.component';
 import { FuseMatchMedia } from '../services/match-media.service';
 import { FuseNavbarVerticalService } from '../../main/navbar/vertical/navbar-vertical.service';
-import { FuseMatSidenavHelperService } from '../directives/mat-sidenav-helper/mat-sidenav-helper.service';
 import { FuseHljsComponent } from '../components/hljs/hljs.component';
 import { FusePerfectScrollbarDirective } from '../directives/fuse-perfect-scrollbar/fuse-perfect-scrollbar.directive';
 import { FuseIfOnDomDirective } from '../directives/fuse-if-on-dom/fuse-if-on-dom.directive';
--- a/src/app/core/scss/partials/_angular-material-fix.scss
+++ b/src/app/core/scss/partials/_angular-material-fix.scss
@@ -6,42 +6,6 @@
    }
 }

-// Fix: "Sidenav opening with animations for the first time"
-mat-sidenav-container {
-
-    mat-sidenav {
-
-        &[mat-is-locked-open].mat-stop-transition {
-            transition: none !important;
-            transform: translate3d(0, 0, 0) !important;
-            opacity: 0;
-
-            ~ .mat-sidenav-content,
-            ~ .mat-drawer-content {
-                transition: none !important;
-            }
-        }
-
-        &.mat-sidenav-opened {
-
-            &.mat-drawer-side {
-
-                ~ .mat-sidenav-content,
-                ~ .mat-drawer-content {
-                    transition: none !important;
-                    transform: translate3d(0, 0, 0) !important;
-                }
-            }
-        }
-
-        &.mat-drawer-end {
-        }
-    }
-
-    .mat-drawer-content {
-    }
-}
-
 // Fix: "Inconsistent font sizes across elements"
 .mat-input-wrapper {
    font-size: 16px;
@@ -59,3 +23,8 @@ mat-sidenav-container {
    width: 14px;
    height: 7px;
 }
+
+// Fix: "Input underlines has wrong color opacity value"
+.mat-form-field-underline {
+    background-color: rgba(0, 0, 0, 0.12);
+}
--- a/src/app/main/navbar/horizontal/navbar-horizontal.component.ts
+++ b/src/app/main/navbar/horizontal/navbar-horizontal.component.ts
@@ -1,4 +1,5 @@
-import { Component, OnInit, ViewEncapsulation } from '@angular/core';
+import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
+import { FuseMainComponent } from '../../main.component';

@Component({
    selector     : 'fuse-navbar-horizontal',
@@ -6,14 +7,19 @@ import { Component, OnInit, ViewEncapsulation } from '@angular/core';
    styleUrls    : ['./navbar-horizontal.component.scss'],
    encapsulation: ViewEncapsulation.None
 })
-export class FuseNavbarHorizontalComponent implements OnInit
+export class FuseNavbarHorizontalComponent implements OnInit, OnDestroy
 {
-    constructor()
+    constructor(private fuseMainComponent: FuseMainComponent)
    {
    }

    ngOnInit()
    {
+        this.fuseMainComponent.addClass('fuse-nav-bar-horizontal');
+    }

+    ngOnDestroy()
+    {
+        this.fuseMainComponent.removeClass('fuse-nav-bar-horizontal');
    }
 }
--- a/src/app/main/navbar/vertical/navbar-vertical.component.scss
+++ b/src/app/main/navbar/vertical/navbar-vertical.component.scss
@@ -2,7 +2,7 @@

 fuse-main {

-    &.fuse-nav-bar-folded {
+    &.fuse-nav-bar-folded:not(.fuse-nav-bar-horizontal) {

        .content-wrapper {

--- a/src/app/main/quick-panel/quick-panel.component.ts
+++ b/src/app/main/quick-panel/quick-panel.component.ts
@@ -10,6 +10,8 @@ export class FuseQuickPanelComponent implements OnInit
 {
    date: Date;
    settings: any;
+    notes = [];
+    events = [];

    constructor()
    {
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css
+++ b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.css
@@ -1,21 +0,0 @@
-div {
-    display: flex;
-}
-
-input {
-    border: none;
-    background: none;
-    padding: 0;
-    outline: none;
-    font: inherit;
-    text-align: center;
-}
-
-span {
-    opacity: 0;
-    transition: opacity 200ms;
-}
-
-:host.floating span {
-    opacity: 1;
-}
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html
+++ b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.html
@@ -1,7 +0,0 @@
-<div [formGroup]="parts">
-    <input class="area" formControlName="area" size="3" [disabled]="disabled">
-    <span>&ndash;</span>
-    <input class="exchange" formControlName="exchange" size="3" [disabled]="disabled">
-    <span>&ndash;</span>
-    <input class="subscriber" formControlName="subscriber" size="4" [disabled]="disabled">
-</div>
--- a/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts
+++ b/src/assets/angular-material-examples/form-field-custom-control/form-field-custom-control-example.ts
@@ -1,177 +0,0 @@
-import { FocusMonitor } from '@angular/cdk/a11y';
-import { coerceBooleanProperty } from '@angular/cdk/coercion';
-import { Component, ElementRef, Input, OnDestroy, Renderer2 } from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
-import { MatFormFieldControl } from '@angular/material/form-field';
-import { Subject } from 'rxjs/Subject';
-
-/** Data structure for holding telephone number. */
-export class MyTel
-{
-    constructor(public area: string, public exchange: string, public subscriber: string)
-    {
-    }
-}
-
-/** Custom `MatFormFieldControl` for telephone number input. */
-@Component({
-    selector   : 'my-tel-input',
-    templateUrl: 'form-field-custom-control-example.html',
-    styleUrls  : ['form-field-custom-control-example.css'],
-    providers  : [
-        {
-            provide    : MatFormFieldControl,
-            useExisting: MyTelInput
-        }
-    ],
-    host       : {
-        '[class.floating]'       : 'shouldPlaceholderFloat',
-        '[id]'                   : 'id',
-        '[attr.aria-describedby]': 'describedBy'
-    }
-})
-export class MyTelInput implements MatFormFieldControl<MyTel>, OnDestroy
-{
-    static nextId = 0;
-
-    parts: FormGroup;
-
-    stateChanges = new Subject<void>();
-
-    focused = false;
-
-    ngControl = null;
-
-    errorState = false;
-
-    controlType = 'my-tel-input';
-
-    get empty()
-    {
-        let n = this.parts.value;
-        return !n.area && !n.exchange && !n.subscriber;
-    }
-
-    get shouldPlaceholderFloat()
-    {
-        return this.focused || !this.empty;
-    }
-
-    id = `my-tel-input-${MyTelInput.nextId++}`;
-
-    describedBy = '';
-
-    @Input()
-    get placeholder()
-    {
-        return this._placeholder;
-    }
-
-    set placeholder(plh)
-    {
-        this._placeholder = plh;
-        this.stateChanges.next();
-    }
-
-    private _placeholder: string;
-
-    @Input()
-    get required()
-    {
-        return this._required;
-    }
-
-    set required(req)
-    {
-        this._required = coerceBooleanProperty(req);
-        this.stateChanges.next();
-    }
-
-    private _required = false;
-
-    @Input()
-    get disabled()
-    {
-        return this._disabled;
-    }
-
-    set disabled(dis)
-    {
-        this._disabled = coerceBooleanProperty(dis);
-        this.stateChanges.next();
-    }
-
-    private _disabled = false;
-
-    @Input()
-    get value(): MyTel | null
-    {
-        let n = this.parts.value;
-        if ( n.area.length == 3 && n.exchange.length == 3 && n.subscriber.length == 4 )
-        {
-            return new MyTel(n.area, n.exchange, n.subscriber);
-        }
-        return null;
-    }
-
-    set value(tel: MyTel | null)
-    {
-        tel = tel || new MyTel('', '', '');
-        this.parts.setValue({
-            area      : tel.area,
-            exchange  : tel.exchange,
-            subscriber: tel.subscriber
-        });
-        this.stateChanges.next();
-    }
-
-    constructor(fb: FormBuilder, private fm: FocusMonitor, private elRef: ElementRef,
-                renderer: Renderer2
-    )
-    {
-        this.parts = fb.group({
-            'area'      : '',
-            'exchange'  : '',
-            'subscriber': ''
-        });
-
-        fm.monitor(elRef.nativeElement, renderer, true).subscribe((origin) => {
-            this.focused = !!origin;
-            this.stateChanges.next();
-        });
-    }
-
-    ngOnDestroy()
-    {
-        this.stateChanges.complete();
-        this.fm.stopMonitoring(this.elRef.nativeElement);
-    }
-
-    setDescribedByIds(ids: string[])
-    {
-        this.describedBy = ids.join(' ');
-    }
-
-    onContainerClick(event: MouseEvent)
-    {
-        if ( (event.target as Element).tagName.toLowerCase() != 'input' )
-        {
-            this.elRef.nativeElement.querySelector('input').focus();
-        }
-    }
-}
-
-/** @title Form field with custom telephone number input control. */
-@Component({
-    selector: 'form-field-custom-control-example',
-    template: `
-    <mat-form-field>
-      <my-tel-input placeholder="Phone number" required></my-tel-input>
-      <mat-icon matSuffix>phone</mat-icon>
-      <mat-hint>Include area code</mat-hint>
-    </mat-form-field>
-  `
-})
-export class FormFieldCustomControlExample
-{
-}
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.css
+++ b/src/assets/angular-material-examples/form-field-error/form-field-error-example.css
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.html
+++ b/src/assets/angular-material-examples/form-field-error/form-field-error-example.html
@@ -1,6 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Enter your email" [formControl]="email" required>
-        <mat-error *ngIf="email.invalid">{{getErrorMessage()}}</mat-error>
-    </mat-form-field>
-</div>
--- a/src/assets/angular-material-examples/form-field-error/form-field-error-example.ts
+++ b/src/assets/angular-material-examples/form-field-error/form-field-error-example.ts
@@ -1,20 +0,0 @@
-import { Component } from '@angular/core';
-import { FormControl, Validators } from '@angular/forms';
-
-/** @title Form field with error messages */
-@Component({
-    selector   : 'form-field-error-example',
-    templateUrl: 'form-field-error-example.html',
-    styleUrls  : ['form-field-error-example.css']
-})
-export class FormFieldErrorExample
-{
-    email = new FormControl('', [Validators.required, Validators.email]);
-
-    getErrorMessage()
-    {
-        return this.email.hasError('required') ? 'You must enter a value' :
-            this.email.hasError('email') ? 'Not a valid email' :
-                '';
-    }
-}
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css
+++ b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.css
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html
+++ b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.html
@@ -1,13 +0,0 @@
-<div class="example-container">
-    <mat-form-field hintLabel="Max 10 characters">
-        <input matInput #input maxlength="10" placeholder="Enter some input">
-        <mat-hint align="end">{{input.value?.length || 0}}/10</mat-hint>
-    </mat-form-field>
-
-    <mat-form-field>
-        <mat-select placeholder="Select me">
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-        <mat-hint align="end">Here's the dropdown arrow ^</mat-hint>
-    </mat-form-field>
-</div>
--- a/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts
+++ b/src/assets/angular-material-examples/form-field-hint/form-field-hint-example.ts
@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Form field with hints */
-@Component({
-    selector   : 'form-field-hint-example',
-    templateUrl: 'form-field-hint-example.html',
-    styleUrls  : ['form-field-hint-example.css']
-})
-export class FormFieldHintExample
-{
-}
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css
+++ b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.css
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html
+++ b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.html
@@ -1,15 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Input">
-    </mat-form-field>
-
-    <mat-form-field>
-        <textarea matInput placeholder="Textarea"></textarea>
-    </mat-form-field>
-
-    <mat-form-field>
-        <mat-select placeholder="Select">
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-    </mat-form-field>
-</div>
--- a/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts
+++ b/src/assets/angular-material-examples/form-field-overview/form-field-overview-example.ts
@@ -1,11 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Simple form field */
-@Component({
-    selector   : 'form-field-overview-example',
-    templateUrl: 'form-field-overview-example.html',
-    styleUrls  : ['form-field-overview-example.css']
-})
-export class FormFieldOverviewExample
-{
-}
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css
+++ b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.css
@@ -1,20 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
-
-.example-container form {
-    margin-bottom: 20px;
-}
-
-.example-container form > * {
-    margin: 5px 0;
-}
-
-.example-container .mat-radio-button {
-    margin: 0 5px;
-}
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html
+++ b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.html
@@ -1,31 +0,0 @@
-<div class="example-container">
-    <form class="example-container" [formGroup]="options">
-        <mat-checkbox formControlName="hideRequired">Hide required marker</mat-checkbox>
-        <div>
-            <label>Float placeholder: </label>
-            <mat-radio-group formControlName="floatPlaceholder">
-                <mat-radio-button value="auto">Auto</mat-radio-button>
-                <mat-radio-button value="always">Always</mat-radio-button>
-                <mat-radio-button value="never">Never</mat-radio-button>
-            </mat-radio-group>
-        </div>
-    </form>
-
-    <mat-form-field
-        [hideRequiredMarker]="options.value.hideRequired"
-        [floatPlaceholder]="options.value.floatPlaceholder">
-        <input matInput placeholder="Simple placeholder" required>
-    </mat-form-field>
-
-    <mat-form-field
-        [hideRequiredMarker]="options.value.hideRequired"
-        [floatPlaceholder]="options.value.floatPlaceholder">
-        <mat-select required>
-            <mat-option>-- None --</mat-option>
-            <mat-option value="option">Option</mat-option>
-        </mat-select>
-        <mat-placeholder>
-            <mat-icon>favorite</mat-icon>
-            <b> Fancy</b> <i> placeholder</i></mat-placeholder>
-    </mat-form-field>
-</div>
--- a/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts
+++ b/src/assets/angular-material-examples/form-field-placeholder/form-field-placeholder-example.ts
@@ -1,21 +0,0 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormGroup } from '@angular/forms';
-
-/** @title Form field with placeholder */
-@Component({
-    selector   : 'form-field-placeholder-example',
-    templateUrl: 'form-field-placeholder-example.html',
-    styleUrls  : ['form-field-placeholder-example.css']
-})
-export class FormFieldPlaceholderExample
-{
-    options: FormGroup;
-
-    constructor(fb: FormBuilder)
-    {
-        this.options = fb.group({
-            hideRequired    : false,
-            floatPlaceholder: 'auto'
-        });
-    }
-}
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css
+++ b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.css
@@ -1,17 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
-
-.example-right-align {
-    text-align: right;
-}
-
-input.example-right-align::-webkit-outer-spin-button,
-input.example-right-align::-webkit-inner-spin-button {
-    display: none;
-}
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html
+++ b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.html
@@ -1,12 +0,0 @@
-<div class="example-container">
-    <mat-form-field>
-        <input matInput placeholder="Enter your password" [type]="hide ? 'password' : 'text'">
-        <mat-icon matSuffix (click)="hide = !hide">{{hide ? 'visibility' : 'visibility_off'}}</mat-icon>
-    </mat-form-field>
-
-    <mat-form-field>
-        <input matInput placeholder="Amount" type="number" class="example-right-align">
-        <span matPrefix>$&nbsp;</span>
-        <span matSuffix>.00</span>
-    </mat-form-field>
-</div>
--- a/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts
+++ b/src/assets/angular-material-examples/form-field-prefix-suffix/form-field-prefix-suffix-example.ts
@@ -1,12 +0,0 @@
-import { Component } from '@angular/core';
-
-/** @title Form field with prefix & suffix */
-@Component({
-    selector   : 'form-field-prefix-suffix-example',
-    templateUrl: 'form-field-prefix-suffix-example.html',
-    styleUrls  : ['form-field-prefix-suffix-example.css']
-})
-export class FormFieldPrefixSuffixExample
-{
-    hide = true;
-}
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css
+++ b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.css
@@ -1,8 +0,0 @@
-.example-container {
-    display: flex;
-    flex-direction: column;
-}
-
-.example-container > * {
-    width: 100%;
-}
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html
+++ b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.html
@@ -1,14 +0,0 @@
-<form class="example-container" [formGroup]="options" [style.fontSize.px]="getFontSize()">
-    <mat-form-field [color]="options.value.color">
-        <mat-select placeholder="Color" formControlName="color">
-            <mat-option value="primary">Primary</mat-option>
-            <mat-option value="accent">Accent</mat-option>
-            <mat-option value="warn">Warn</mat-option>
-        </mat-select>
-    </mat-form-field>
-
-    <mat-form-field [color]="options.value.color">
-        <input matInput type="number" placeholder="Font size (px)" formControlName="fontSize" min="10">
-        <mat-error *ngIf="options.get('fontSize').invalid">Min size: 10px</mat-error>
-    </mat-form-field>
-</form>
--- a/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts
+++ b/src/assets/angular-material-examples/form-field-theming/form-field-theming-example.ts
@@ -1,26 +0,0 @@
-import { Component } from '@angular/core';
-import { FormBuilder, FormGroup, Validators } from '@angular/forms';
-
-/** @title Form field theming */
-@Component({
-    selector   : 'form-field-theming-example',
-    templateUrl: 'form-field-theming-example.html',
-    styleUrls  : ['form-field-theming-example.css']
-})
-export class FormFieldThemingExample
-{
-    options: FormGroup;
-
-    constructor(fb: FormBuilder)
-    {
-        this.options = fb.group({
-            'color'   : 'primary',
-            'fontSize': [16, Validators.min(10)]
-        });
-    }
-
-    getFontSize()
-    {
-        return Math.max(10, this.options.value.fontSize);
-    }
-}
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -15,5 +15,11 @@
      "es2017",
      "dom"
    ]
+  },
+  "angularCompilerOptions": {
+    "genDir": "release/",
+    "strictMetadataEmit": true,
+    "skipTemplateCodegen": true,
+    "annotationsAs": "decorators"
  }
 }
--- a/tslint.json
+++ b/tslint.json
@@ -15,7 +15,8 @@
        "forin": true,
        "import-blacklist": [
            true,
-            "rxjs"
+            "rxjs",
+            "rxjs/Rx"
        ],
        "import-spacing": true,
        "indent": [
@@ -31,8 +32,14 @@
        "member-access": false,
        "member-ordering": [
            true,
-            "static-before-instance",
-            "variables-before-functions"
+            {
+                "order": [
+                    "static-field",
+                    "instance-field",
+                    "static-method",
+                    "instance-method"
+                ]
+            }
        ],
        "no-arg": true,
        "no-bitwise": true,
@@ -63,7 +70,7 @@
        "no-trailing-whitespace": false,
        "no-unnecessary-initializer": true,
        "no-unused-expression": true,
-        "no-use-before-declare": true,
+        "no-use-before-declare": false,
        "no-var-keyword": true,
        "object-literal-sort-keys": false,
        "one-line": false,
Author	SHA1	Message	Date
Sercan Yemen	20ac3abb25	Merge branch 'master' into skeleton	2017-11-27 17:21:38 +03:00
Sercan Yemen	19fdbbdbcb	Increased version number Fixed: Sidenav helper causes issues on mobile media steps	2017-11-27 17:20:34 +03:00
Sercan Yemen	f634cb06a7	Merge branch 'master' into skeleton	2017-11-27 14:42:23 +03:00
Sercan Yemen	7d67a481ff	Merge branch 'master' into skeleton	2017-11-27 14:35:37 +03:00
Sercan Yemen	8bbabd7437	Corrected the version number	2017-11-27 14:31:57 +03:00
Sercan Yemen	5a9cd36282	Increased the Fuse version number + Updated Angular, Angular Material and Flex Layout + Updated various components for better Angular5 support + Fixed: Contacts app various issues + Fixed: Duplicate content in Profile page tabs + Fixed: Folded status of the Navbar shouldn't brake the layout if Horizontal Navbar is active	2017-11-27 14:28:08 +03:00
mustafahlvc	297bb95a2e	Temporary aot build fix for @swimlane/ngx-charts	2017-11-18 01:43:08 +03:00
Sercan Yemen	2511a03b66	Increased the Fuse version number + Updated ngx-charts and ngx-datatables + added rxjs imports for the various search	2017-11-18 00:45:42 +03:00
mustafahlvc	76358f996e	Angular material docs updated, + @angular/material-moment-adapter added to package.json	2017-11-17 18:35:44 +03:00
mustafahlvc	142fc982ca	Angular updated to 5.0.2, angular-cli updated to 1.5.2, + angular-material-elements and fakeDb folder excluded from linting, + some lint errors solved.	2017-11-17 16:57:42 +03:00
Sercan Yemen	22d9279e3b	Fix: Authentication (v2) pages not scrollable when custom scrollbars disabled	2017-11-14 09:35:03 +03:00
Sercan Yemen	4659da7390	Added missing variables that prevents skeleton from building as it is	2017-11-13 12:30:11 +03:00
Sercan Yemen	2a5d15694c	Merge branch 'master' into skeleton	2017-11-13 11:09:27 +03:00
Sercan Yemen	a1bec98d44	Todo adjustments	2017-11-13 11:04:57 +03:00
Sercan Yemen	e8449e340d	Contact list checkbox rendering broken due to ripple	2017-11-13 10:45:16 +03:00
Sercan Yemen	4cb8009c69	Scrumboard label selector not working correctly + style refinements	2017-11-13 10:36:32 +03:00
Sercan Yemen	7f357306eb	Angular 5.0.1 & Angular Material 5.0.0-rc0 compatibility (wip)	2017-11-12 22:36:14 +03:00
Sercan Yemen	8e6024c3ee	Fixes #44 : Removed angular material elements assets	2017-11-08 15:11:20 +03:00
Sercan Yemen	f4c47daadc	Merge branch 'master' into skeleton	2017-11-08 15:10:51 +03:00
Sercan Yemen	06679343a4	Fixes #44 : Example e2e test file content is wrong + Renamed 'mat-sidenav-helper' files/folders to 'fuse-mat-sidenav-helper' & fixed its import issues	2017-11-08 15:08:40 +03:00