import { Component, Injector } from '@angular/core';
import { ComponentContextService } from '../../app-context/component-context.service';
import { ComponentBase } from '../../classes/base/component-base';
import { DomService } from '../../services/dom.service';
import { ModuleConfigService } from '../../services/module-config.service';
import { HelperCurrentPageComponent } from './helper-current-page/helper-current-page.component';
import { PathNameService } from './services/path-name.service';
export class TnAppHelpComponent extends ComponentBase {
    constructor(_pathNameService, _domService, _injector, _moduleConfigService) {
        var _a, _b, _c;
        super(_injector);
        this._pathNameService = _pathNameService;
        this._domService = _domService;
        this._injector = _injector;
        this._moduleConfigService = _moduleConfigService;
        this.display = false;
        this.showHelperCurrentPageState = true;
        this.helps = [];
        this.showHelpVideo = true;
        this.environment = _moduleConfigService.getConfig().environment;
        this.showHelpVideo = (_c = (_b = (_a = this.environment) === null || _a === void 0 ? void 0 : _a.helpConfig) === null || _b === void 0 ? void 0 : _b.showHelpVideo) !== null && _c !== void 0 ? _c : true;
        if (this.environment.helpConfig) {
            this.phoneNumber = this.environment.helpConfig.expertPhoneNummber;
            if (this.phoneNumber) {
                this.hrefTelephone = `tel:${this.phoneNumber}`;
            }
            else {
                this.hrefTelephone = `javascript:void(0)`;
            }
            this.mail = this.environment.helpConfig.expertEmail;
            if (this.mail) {
                this.hrefMail = `mailto:${this.mail}`;
            }
            else {
                this.hrefMail = `javascript:void(0)`;
            }
            if (this.environment.helpConfig.documents) {
                this.helps = this.environment.helpConfig.documents;
            }
        }
    }
    ngOnInit() {
    }
    showHelper() {
        this.display = !this.display;
    }
    showHelperCurrentPage(control) {
        this.display = false;
        setTimeout(() => {
            this._domService.appendComponentToBody(HelperCurrentPageComponent);
        }, 500);
    }
}
TnAppHelpComponent.decorators = [
    { type: Component, args: [{
                selector: 'li[tn-app-help]',
                template: "<a href=\"javascript:;\" tabindex=\"9\" (click)=\"showHelper()\" style=\"height: 30px;\" pTooltip=\"Tr\u1EE3 gi\u00FAp\"\n    tooltipPosition=\"bottom\">\n    <span class=\"topbar-icon-left\">\n        <!-- <svg focusable=\"false\" role=\"img\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 512 512\"\n            class=\"topbar-icon animated swing svgmodule\">\n            <path fill=\"currentColor\"\n                d=\"M256 8C119.043 8 8 119.083 8 256c0 136.997 111.043 248 248 248s248-111.003 248-248C504 119.083 392.957 8 256 8zm0 448c-110.532 0-200-89.431-200-200 0-110.495 89.472-200 200-200 110.491 0 200 89.471 200 200 0 110.53-89.431 200-200 200zm107.244-255.2c0 67.052-72.421 68.084-72.421 92.863V300c0 6.627-5.373 12-12 12h-45.647c-6.627 0-12-5.373-12-12v-8.659c0-35.745 27.1-50.034 47.579-61.516 17.561-9.845 28.324-16.541 28.324-29.579 0-17.246-21.999-28.693-39.784-28.693-23.189 0-33.894 10.977-48.942 29.969-4.057 5.12-11.46 6.071-16.666 2.124l-27.824-21.098c-5.107-3.872-6.251-11.066-2.644-16.363C184.846 131.491 214.94 112 261.794 112c49.071 0 101.45 38.304 101.45 88.8zM298 368c0 23.159-18.841 42-42 42s-42-18.841-42-42 18.841-42 42-42 42 18.841 42 42z\"\n                class=\"\"></path>\n        </svg> -->\n        <i class=\"topbar-icon animated swing pi pi-question-circle\"></i>\n    </span>\n    <span class=\"topbar-item-name\">{{ \"Tr\u1EE3 gi\u00FAp\" | translate }}</span>\n</a>\n\n<p-sidebar [styleClass]=\"'HelperSlideBar tn-l-sidebar-wrapper'\" [(visible)]=\"display\" position=\"right\"\n    [appendTo]=\"'body'\" [style]=\"{ width: '30em', border: 0, 'max-width': '100vw' }\">\n    <div style=\"background-color: #fff; box-shadow: 0 1px 5px 0 rgba(0, 0, 0, 0.35);\">\n        <h1 style=\"font-size: 16px; color: #212529;\">Trung t\u00E2m tr\u1EE3 gi\u00FAp</h1>\n    </div>\n\n    <div class=\"tn-l-help-wrapper\">\n        <tn-custom-scrollbar #scrollbar [style]=\"{'max-height':'calc(100vh - 50px)'}\">\n            <div class=\"HelpCenter\">\n                <div class=\"p-grid\" style=\"margin-top:10px; margin-bottom: 25px;\">\n                    <div class=\"p-col-8\">\n                        <p style=\"font-weight:bold;font-size: 16px;margin-bottom: 8px; margin-top:20px\">\n                            {{environment.helpConfig?.expertName}}\n                        </p>\n                        <p style=\"margin: 0px;\">\n                            <a [href]=\"hrefTelephone\"><i class=\"fas fa-phone\"\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{phoneNumber}}</a>\n                        </p>\n                        <p style=\"margin-top: 8px;\">\n                            <a [href]=\"hrefMail\"><i class=\"fas fa-envelope\"\n                                    style=\"margin-right: 8px; width: 15px\"></i>{{mail}}</a>\n                        </p>\n                    </div>\n                    <div class=\"p-col-4\">\n                        <img [src]=\"environment.helpConfig?.logoCompany\"\n                            style=\"width: 100%; float: right; opacity: 0.7;\" />\n                    </div>\n                </div>\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\n                    <div class=\"p-col-12 help-title\">\n                        <span class=\"tit-name\">T\u00E0i li\u1EC7u - H\u01B0\u1EDBng d\u1EABn s\u1EED d\u1EE5ng c\u00E1c ph\u00E2n h\u1EC7 </span>\n                    </div>\n                    <div class=\"tn-l-pmti p-grid\"\n                        style=\"border: 1px solid #ccc; width: 100%;margin:0;margin-bottom:20px;\">\n                        <div *ngFor=\"let item of helps\" class=\"p-col-4 help-content\">\n                            <p style=\"margin-top: 18px; text-align: center;\">\n                                <a target=\"_blank\" [href]=\"item.href\"\n                                    style=\"display: inline-block; text-align: center;\">\n                                    <i class=\"{{item.icon}} app-switcher-item-icon\"\n                                        style=\"color: rgb(44 126 210);font-size: 3.5em;padding-bottom: 10px;\"></i>\n                                    <br />{{item.label}}\n                                </a>\n                            </p>\n                        </div>\n                    </div>\n                </div>\n                <div *ngIf=\"showHelpVideo\" class=\"p-grid p-m-0 HelpCenter-video\" style=\"margin-top: 0px\">\n                    <div class=\"p-col-12 help-title\">\n                        <span class=\"tit-name\">Xem h\u01B0\u1EDBng d\u1EABn</span>\n                    </div>\n                    <div class=\"p-col-12 help-content\">\n                        <h2 *ngIf=\"showHelperCurrentPageState\" style=\"margin-top: 0px\">\n                            <a href=\"javascript:;\" (click)=\"showHelperCurrentPage(null)\"\n                                style=\"display:inline-block; position: relative; border-top: 1px solid #52abf5;\">\n                                <img src=\"/assets/images/bgvideo.png\" alt=\"screen shot\"\n                                    style=\"width:100%; filter: brightness(0.88);\" />\n                                <i class=\"fab fa-youtube fa-2x\"></i>\n                            </a>\n                        </h2>\n                    </div>\n                </div>\n\n                <div class=\"p-grid p-m-0 HelpCenter-download\" style=\"margin-top: 0px; margin-bottom: 40px;\">\n                    <div class=\"p-col-12 help-title\">\n                        <span class=\"tit-name\">Ph\u1EA7n m\u1EC1m ti\u1EC7n \u00EDch</span>\n                    </div>\n                    <div class=\"tn-l-pmti\" style=\"border: 1px solid #ccc; width: 100%\">\n                        <div class=\"p-col-4 help-content\">\n                            <p style=\"margin-top: 18px; text-align: center;\">\n                                <a target=\"_blank\" href=\"{{environment.signalr.linkDownloadClientApp}}\"\n                                    style=\"display: inline-block; text-align: center;\">\n                                    <img src=\"/assets/images/icon-appTN64x64.png\" />\n                                    <br />TN Client\n                                </a>\n                            </p>\n                        </div>\n                        <div class=\"p-col-4 help-content\">\n                            <p style=\"margin-top: 18px; text-align: center;\">\n                                <a target=\"_blank\" href=\"https://ultraviewer.net/vi/UltraViewer_setup_6.2_vi.exe\"\n                                    style=\"display: inline-block; text-align: center;\">\n                                    <img src=\"/assets/images/ultraviewer.ico\" />\n                                    <br />Ultraviewer\n                                </a>\n                            </p>\n                        </div>\n                        <div class=\"p-col-4 help-content\">\n                            <p style=\"margin-top: 18px; text-align: center;\">\n                                <a target=\"_blank\" href=\"https://www.teamviewer.com/vi/tai-xuong-tu-dong-teamviewer/\"\n                                    style=\"display: inline-block; text-align: center;\">\n                                    <img src=\"/assets/images/icon-teamviewer.png\" />\n                                    <br />Teamviewer\n                                </a>\n                            </p>\n                        </div>\n                    </div>\n                </div>\n            </div>\n        </tn-custom-scrollbar>\n    </div>\n</p-sidebar>",
                providers: [ComponentContextService],
                styles: [".HelpCenter{color:#555;padding:0 20px}::ng-deep .tn-l-sidebar-wrapper{padding:0}.tn-l-pmti{display:flex}.HelpCenter p:first-child img{margin-bottom:10px}::ng-deep .HelperSlideBar .p-sidebar-content>button{margin-top:10px;margin-right:14px;font-size:20px;color:#212529;cursor:pointer}::ng-deep .ui-sidebar{padding:0}::ng-deep .HelperSlideBar h1{margin:0;height:50px;line-height:50px;text-transform:uppercase;padding-left:20px}.HelpCenter-video{position:relative}.HelpCenter-video i{color:#454545;position:absolute;top:calc(50% - 10px);left:50%;transform:translateX(-50%) translateY(-50%);cursor:pointer;transition:.5s;opacity:.5}.HelpCenter-video video{opacity:1}.HelpCenter-video:hover video{opacity:.5;cursor:pointer}.HelpCenter-video:hover i{opacity:1}.HelpCenter-download img{width:45px;height:45px}.HelpCenter .help-title{background-color:rgba(49,146,225,.8784313725490196);color:#fff}.HelpCenter .help-title .tit-name{font-size:14px;font-weight:700}.HelpCenter .help-content{padding:0}.HelpCenter .HelpCenter-comment .help-content{padding:0;text-align:center}.HelpCenter-comment,.HelpCenter-download,.HelpCenter-video{margin-bottom:15px}.tn-l-help-wrapper{display:flex;overflow:auto;max-height:calc(100vh - 60px)}"]
            },] }
];
TnAppHelpComponent.ctorParameters = () => [
    { type: PathNameService },
    { type: DomService },
    { type: Injector },
    { type: ModuleConfigService }
];
//# sourceMappingURL=data:application/json;base64, 