dynamic-display-shared/esm2020/lib/shared/components/user-account/user-account.component.mjs

A library for dynamic view

import { Component } from '@angular/core';
import { OAuthService } from 'angular-oauth2-oidc';
import * as i0 from "@angular/core";
import * as i1 from "angular-oauth2-oidc";
import * as i2 from "@angular/material/button";
import * as i3 from "@angular/material/icon";
import * as i4 from "@angular/material/menu";
export class UserAccountComponent {
    constructor(oauthService) {
        this.oauthService = oauthService;
    }
    ngOnInit() { }
    login() {
        this.oauthService.initImplicitFlow();
    }
    logout() {
        this.oauthService.logOut();
    }
    get givenName() {
        const claims = this.oauthService.getIdentityClaims();
        if (!claims) {
            return null;
        }
        return claims['given_name'];
    }
}
UserAccountComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.4", ngImport: i0, type: UserAccountComponent, deps: [{ token: i1.OAuthService }], target: i0.ɵɵFactoryTarget.Component });
UserAccountComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.4", type: UserAccountComponent, selector: "app-user-account", ngImport: i0, template: "<!-- <div *ngIf=\"givenName\">\r\n    <div class=\"menu-icon\">\r\n        <mat-icon>smile</mat-icon>\r\n    </div>\r\n    <p>hi, {{givenName}}</p>\r\n    <!-- <button (click)=\"logout()\">Logout</button> \r\n</div>\r\n\r\n<div *ngIf=\"!givenName\">\r\n    <button (click)=\"login()\">Login</button>\r\n</div> -->\r\n<div class=\"user-menu\">\r\n    <div class=\"try\">\r\n        <button class=\"user-icon\" mat-icon-button [matMenuTriggerFor]=\"accountMenu\">\r\n            <span class=\"container\">\r\n                <div class=\"icon-wrapper\">\r\n                    <mat-icon svgIcon=\"user-account\"></mat-icon>\r\n                </div>\r\n                <div class=\"user-name\">\r\n                    <span class=\"user-name-realy\">{{givenName}}</span>\r\n                    <span>\r\n                        <mat-icon>expand_more</mat-icon>\r\n                    </span>\r\n                </div>\r\n            </span>\r\n        </button>\r\n        <a class=\"link\" (click)=\"logout()\">\r\n            <span>\u05D4\u05EA\u05E0\u05EA\u05E7</span>\r\n        </a>\r\n    </div>\r\n    <mat-menu #accountMenu=\"matMenu\">\r\n        <button mat-menu-item (click)=\"logout()\">\r\n            <span>\u05D4\u05EA\u05E0\u05EA\u05E7</span>\r\n        </button>\r\n\r\n    </mat-menu>\r\n</div>\r\n", styles: [".user-name{color:#fff;font-size:10px;margin-top:-25px;margin-left:auto;margin-right:auto}.user-name mat-icon{font-size:10px!important}.user-menu{width:100%}.user-icon{color:#fff;width:75px;margin-top:10px}@media screen and (max-width: 700px),(orientation: landscape) and (max-height: 550px){.user-name{margin:0!important}.user-name span{color:#1c425e;font-size:14px!important}.user-name mat-icon{display:none}.user-menu{border-top:1px solid rgb(28,66,94)}.container{display:flex;flex-direction:row}.user-icon{width:100%}.link{text-align:center;color:#468693!important}.try{display:flex;flex-direction:column}}@media screen and (min-width: 700px) and (min-height: 500px){.link{display:none}}\n"], dependencies: [{ kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button],             button[mat-fab], button[mat-mini-fab], button[mat-stroked-button],             button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i3.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.4", ngImport: i0, type: UserAccountComponent, decorators: [{
            type: Component,
            args: [{ selector: 'app-user-account', template: "<!-- <div *ngIf=\"givenName\">\r\n    <div class=\"menu-icon\">\r\n        <mat-icon>smile</mat-icon>\r\n    </div>\r\n    <p>hi, {{givenName}}</p>\r\n    <!-- <button (click)=\"logout()\">Logout</button> \r\n</div>\r\n\r\n<div *ngIf=\"!givenName\">\r\n    <button (click)=\"login()\">Login</button>\r\n</div> -->\r\n<div class=\"user-menu\">\r\n    <div class=\"try\">\r\n        <button class=\"user-icon\" mat-icon-button [matMenuTriggerFor]=\"accountMenu\">\r\n            <span class=\"container\">\r\n                <div class=\"icon-wrapper\">\r\n                    <mat-icon svgIcon=\"user-account\"></mat-icon>\r\n                </div>\r\n                <div class=\"user-name\">\r\n                    <span class=\"user-name-realy\">{{givenName}}</span>\r\n                    <span>\r\n                        <mat-icon>expand_more</mat-icon>\r\n                    </span>\r\n                </div>\r\n            </span>\r\n        </button>\r\n        <a class=\"link\" (click)=\"logout()\">\r\n            <span>\u05D4\u05EA\u05E0\u05EA\u05E7</span>\r\n        </a>\r\n    </div>\r\n    <mat-menu #accountMenu=\"matMenu\">\r\n        <button mat-menu-item (click)=\"logout()\">\r\n            <span>\u05D4\u05EA\u05E0\u05EA\u05E7</span>\r\n        </button>\r\n\r\n    </mat-menu>\r\n</div>\r\n", styles: [".user-name{color:#fff;font-size:10px;margin-top:-25px;margin-left:auto;margin-right:auto}.user-name mat-icon{font-size:10px!important}.user-menu{width:100%}.user-icon{color:#fff;width:75px;margin-top:10px}@media screen and (max-width: 700px),(orientation: landscape) and (max-height: 550px){.user-name{margin:0!important}.user-name span{color:#1c425e;font-size:14px!important}.user-name mat-icon{display:none}.user-menu{border-top:1px solid rgb(28,66,94)}.container{display:flex;flex-direction:row}.user-icon{width:100%}.link{text-align:center;color:#468693!important}.try{display:flex;flex-direction:column}}@media screen and (min-width: 700px) and (min-height: 500px){.link{display:none}}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.OAuthService }]; } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidXNlci1hY2NvdW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2R5bmFtaWMtZGlzcGxheS1zaGFyZWQvc3JjL2xpYi9zaGFyZWQvY29tcG9uZW50cy91c2VyLWFjY291bnQvdXNlci1hY2NvdW50LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2R5bmFtaWMtZGlzcGxheS1zaGFyZWQvc3JjL2xpYi9zaGFyZWQvY29tcG9uZW50cy91c2VyLWFjY291bnQvdXNlci1hY2NvdW50LmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQVUsTUFBTSxlQUFlLENBQUM7QUFDbEQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLHFCQUFxQixDQUFDOzs7Ozs7QUFPbkQsTUFBTSxPQUFPLG9CQUFvQjtJQUUvQixZQUFvQixZQUEwQjtRQUExQixpQkFBWSxHQUFaLFlBQVksQ0FBYztJQUM5QyxDQUFDO0lBQ0QsUUFBUSxLQUFLLENBQUM7SUFHZCxLQUFLO1FBQ0gsSUFBSSxDQUFDLFlBQVksQ0FBQyxnQkFBZ0IsRUFBRSxDQUFDO0lBQ3ZDLENBQUM7SUFFRCxNQUFNO1FBQ0osSUFBSSxDQUFDLFlBQVksQ0FBQyxNQUFNLEVBQUUsQ0FBQztJQUM3QixDQUFDO0lBRUQsSUFBSSxTQUFTO1FBQ1gsTUFBTSxNQUFNLEdBQUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxpQkFBaUIsRUFBeUIsQ0FBQztRQUM1RSxJQUFJLENBQUMsTUFBTSxFQUFFO1lBQ1gsT0FBTyxJQUFJLENBQUM7U0FDYjtRQUNELE9BQU8sTUFBTSxDQUFDLFlBQVksQ0FBQyxDQUFDO0lBQzlCLENBQUM7O2lIQXJCVSxvQkFBb0I7cUdBQXBCLG9CQUFvQix3RENSakMsb3lDQXFDQTsyRkQ3QmEsb0JBQW9CO2tCQUxoQyxTQUFTOytCQUNFLGtCQUFrQiIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgT25Jbml0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE9BdXRoU2VydmljZSB9IGZyb20gJ2FuZ3VsYXItb2F1dGgyLW9pZGMnO1xyXG5cclxuQENvbXBvbmVudCh7XHJcbiAgc2VsZWN0b3I6ICdhcHAtdXNlci1hY2NvdW50JyxcclxuICB0ZW1wbGF0ZVVybDogJy4vdXNlci1hY2NvdW50LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi91c2VyLWFjY291bnQuY29tcG9uZW50LmNzcyddXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBVc2VyQWNjb3VudENvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgb2F1dGhTZXJ2aWNlOiBPQXV0aFNlcnZpY2UpIHtcclxuICB9XHJcbiAgbmdPbkluaXQoKSB7IH1cclxuXHJcblxyXG4gIGxvZ2luKCkge1xyXG4gICAgdGhpcy5vYXV0aFNlcnZpY2UuaW5pdEltcGxpY2l0RmxvdygpO1xyXG4gIH1cclxuXHJcbiAgbG9nb3V0KCkge1xyXG4gICAgdGhpcy5vYXV0aFNlcnZpY2UubG9nT3V0KCk7XHJcbiAgfVxyXG5cclxuICBnZXQgZ2l2ZW5OYW1lKCkge1xyXG4gICAgY29uc3QgY2xhaW1zID0gdGhpcy5vYXV0aFNlcnZpY2UuZ2V0SWRlbnRpdHlDbGFpbXMoKSBhcyB7IGdpdmVuX25hbWU6IGFueSB9O1xyXG4gICAgaWYgKCFjbGFpbXMpIHtcclxuICAgICAgcmV0dXJuIG51bGw7XHJcbiAgICB9XHJcbiAgICByZXR1cm4gY2xhaW1zWydnaXZlbl9uYW1lJ107XHJcbiAgfVxyXG5cclxufVxyXG5cclxuXHJcbiIsIjwhLS0gPGRpdiAqbmdJZj1cImdpdmVuTmFtZVwiPlxyXG4gICAgPGRpdiBjbGFzcz1cIm1lbnUtaWNvblwiPlxyXG4gICAgICAgIDxtYXQtaWNvbj5zbWlsZTwvbWF0LWljb24+XHJcbiAgICA8L2Rpdj5cclxuICAgIDxwPmhpLCB7e2dpdmVuTmFtZX19PC9wPlxyXG4gICAgPCEtLSA8YnV0dG9uIChjbGljayk9XCJsb2dvdXQoKVwiPkxvZ291dDwvYnV0dG9uPiBcclxuPC9kaXY+XHJcblxyXG48ZGl2ICpuZ0lmPVwiIWdpdmVuTmFtZVwiPlxyXG4gICAgPGJ1dHRvbiAoY2xpY2spPVwibG9naW4oKVwiPkxvZ2luPC9idXR0b24+XHJcbjwvZGl2PiAtLT5cclxuPGRpdiBjbGFzcz1cInVzZXItbWVudVwiPlxyXG4gICAgPGRpdiBjbGFzcz1cInRyeVwiPlxyXG4gICAgICAgIDxidXR0b24gY2xhc3M9XCJ1c2VyLWljb25cIiBtYXQtaWNvbi1idXR0b24gW21hdE1lbnVUcmlnZ2VyRm9yXT1cImFjY291bnRNZW51XCI+XHJcbiAgICAgICAgICAgIDxzcGFuIGNsYXNzPVwiY29udGFpbmVyXCI+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwiaWNvbi13cmFwcGVyXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgPG1hdC1pY29uIHN2Z0ljb249XCJ1c2VyLWFjY291bnRcIj48L21hdC1pY29uPlxyXG4gICAgICAgICAgICAgICAgPC9kaXY+XHJcbiAgICAgICAgICAgICAgICA8ZGl2IGNsYXNzPVwidXNlci1uYW1lXCI+XHJcbiAgICAgICAgICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJ1c2VyLW5hbWUtcmVhbHlcIj57e2dpdmVuTmFtZX19PC9zcGFuPlxyXG4gICAgICAgICAgICAgICAgICAgIDxzcGFuPlxyXG4gICAgICAgICAgICAgICAgICAgICAgICA8bWF0LWljb24+ZXhwYW5kX21vcmU8L21hdC1pY29uPlxyXG4gICAgICAgICAgICAgICAgICAgIDwvc3Bhbj5cclxuICAgICAgICAgICAgICAgIDwvZGl2PlxyXG4gICAgICAgICAgICA8L3NwYW4+XHJcbiAgICAgICAgPC9idXR0b24+XHJcbiAgICAgICAgPGEgY2xhc3M9XCJsaW5rXCIgKGNsaWNrKT1cImxvZ291dCgpXCI+XHJcbiAgICAgICAgICAgIDxzcGFuPteU16rXoNeq16c8L3NwYW4+XHJcbiAgICAgICAgPC9hPlxyXG4gICAgPC9kaXY+XHJcbiAgICA8bWF0LW1lbnUgI2FjY291bnRNZW51PVwibWF0TWVudVwiPlxyXG4gICAgICAgIDxidXR0b24gbWF0LW1lbnUtaXRlbSAoY2xpY2spPVwibG9nb3V0KClcIj5cclxuICAgICAgICAgICAgPHNwYW4+15TXqteg16rXpzwvc3Bhbj5cclxuICAgICAgICA8L2J1dHRvbj5cclxuXHJcbiAgICA8L21hdC1tZW51PlxyXG48L2Rpdj5cclxuIl19