Activities of "TimMackey"

Angular/Core release 8.0.0

Everything in the code below works as expected, EXCEPT the notify.info fonts are default fonts.

invite-modal.component.css:

.modal {
    text-align: center;
    padding: 0!important;
}
  
.modal:before {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -4px;
}
  
.modal-dialog {
    display: inline-block;
    text-align: left;
    vertical-align: middle;
}

.notify-content-class {
    font-size: large !important;
    font-weight: 900 !important;
}

.swal2-popup.swal2-toast .swal2-content {
    font-size: large !important;
}

invite-modal-component.ts:

import { Component, ElementRef, Injector, ViewChild, OnInit } from '@angular/core';
import { AppComponentBase } from '@shared/common/app-component-base';
import { ProfileServiceProxy, InvitationInput, ServiceStatusDto } from '@shared/service-proxies/service-proxies';
import { ModalDirective } from 'ngx-bootstrap';
import { finalize } from 'rxjs/operators';
import { setTimeout } from 'timers';

@Component({
    selector: 'inviteModal',
    templateUrl: './invite-modal.component.html',
    styleUrls: ['./invite-modal.component.css']
})
export class InviteModalComponent extends AppComponentBase implements OnInit {

    @ViewChild('inviteModal', {static: true}) modal: ModalDirective;

    inviteeName: string;
    emailAddress: string;
    saving = false;
    active = false;

    constructor(
        injector: Injector,
        private _profileService: ProfileServiceProxy
    ) {
        super(injector);
    }

    ngOnInit() {
    }

    show(): void {
        this.active = true;
        this.modal.show();
    }

    onShown(): void {
    }

    close(): void {
        this.active = false;
        this.modal.hide();
    }

    save(): void {
        let input = new InvitationInput();
        input.inviteeEmail = this.emailAddress;
        input.inviteeName = this.inviteeName;

        this.saving = true;
        this._profileService.invite(input)
            .pipe(finalize(() => setTimeout(() => { this.saving = false; }, 10000)))
            .subscribe((result: ServiceStatusDto) => {
                if (result.success) {
                    this.notify.info(this.l('InvitationSent'), '', {timer: 3000, position: 'center', customClass: {content: 'notify-content-class', container: 'notify-content-class', header: 'notify-content-class', title: 'notify-content-class'} });
                    setTimeout(() => this.close(), 3000);
                } else {
                    this.notify.error(result.failureReason, '', {timer: 5000, position: 'center'});
                    let savingTimeout = 5000;
                    if (result.failureRecourse) {
                        setTimeout(() => this.notify.info(result.failureRecourse, '', {timer: 5000, position: 'center'}), 5000);
                        savingTimeout = 10000;
                    }
                    setTimeout(() => { this.saving = false; }, savingTimeout);
                }
            });
    }
}

invite-modal.component.html:

<div bsModal #inviteModal="bs-modal" (onShown)="onShown()" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true" [config]="{backdrop: 'static'}">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <form *ngIf="active" #inviteModalForm="ngForm" (ngSubmit)="save()" autocomplete="off">
                <div class="modal-header">
                    <h5 class="modal-title">
                        <span>{{"Invite" | localize}}</span>
                    </h5>
                    <button type="button" class="close" [attr.aria-label]="l('Close')" (click)="close()">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <label>{{"InvitationPrompt" | localize}}</label>
                    <div class="form-group">
                        <label for="Email">{{"EmailAddress" | localize}} *</label>
                        <input id="EmailAddress" #EmailAddress="ngModel" type="email" name="EmailAddress" class="form-control" [(ngModel)]="emailAddress" required maxlength="256" email
                                placeholder="{{'EmailAddress' | localize}} *" 
                                pattern="^\w+([-+.']\w+)*@\w+([-.]\w+)*.edu$"/>
                        <validation-messages [formCtrl]="EmailAddress"></validation-messages>

                        <!-- <div [hidden]="inviteModalForm.form.valid || inviteModalForm.form.pristine">
                            <ul class="help-block text-danger" *ngIf="EmailAddress.errors">
                                <li [hidden]="!EmailAddress">{{"InvalidEmailAddress" | localize}}</li>
                            </ul>
                        </div> -->
                    </div>
                    <div class="form-group">
                        <label for="InviteeName">{{"Name" | localize}}</label>
                        <input required id="InviteeName" type="text" name="InviteeName" class="form-control" [(ngModel)]="inviteeName" #InviteeName="ngModel">
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button"
                            class="btn btn-secondary"
                            (click)="close()"
                            [disabled]="saving"
                    >
                        {{"Cancel" | localize}}
                    </button>

                    &nbsp;
                    <button type="submit"
                            class="btn btn-primary"
                            [buttonBusy]="saving"
                            [disabled]="!inviteModalForm.form.valid || saving"
                    >
                        <i class="fa fa-check"></i>
                        <span>{{"SendInvitation" | localize}}</span>
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>

that doesn't work. Font is still the same (small) size.

The 'timer' and 'position' options work ok. Other options do not work. For example ... this.notify.info(this.l('InvitationSent'), '', {timer: 5000, position: 'center', customClass: {content: 'notify-content-class', container: 'notify-content-class', header: 'notify-content-class', title: 'notify-content-class'} });

.notify-content-class {
    font-size: large;
    font-weight: 900;
}

... has no effect on the font. And 'html' option is not available because 'message' parameter is required, and overrides 'html' settings (per documentation, and verified).

How can I increase the font size of the message.

Thank you!

Extending the time works beautifully.

Is there documenation somewhere that specifies all the options and their formats?

@maliming - Thank you for pointing out AppSessionService.

The boolean I wanted on the client was a custom property in User. The simple solution was to add the property (named the same) in UserLoginInfoDto (defined on the server). On the client I added argument private _appSessionService: AppSessionService in the constructor, then picked up this._appSessionService.user.MyCustomBoolean in ngOnInit().

I tried injecting the LoginService into 'topbar.component.ts' in the constructor thusly: private _loginService: LoginService,, (and imported it) import { LoginService } from '@account/login/login.service';

However, after logging in, I get a continuous stream of errors on the console:

null: ERROR
null: NullInjectorError: StaticInjectorError(RootModule)[TopBarComponent -> LoginService]:
no debug adapter:
null: ERROR CONTEXT
null: DebugContext_ {view: Object, nodeIndex: 31, nodeDef: Object, elDef: Object, elView: Object}
...

I am returning a custom boolean in the 'authenticationResult' that I want to use in topbar.

I don't have direct access to the image bits. All I can do is notify the dwt driver of where to send the bits. How did ANZ configure ng2-file-upload to send bits to TempFileCacheManager.SetFile (and not some other name, like 'SetMyFile')? The problem might become clearer if you installed 'dwt'.

My mistake. I mean the notification messages on the client that appear in the lower right corner as...

from the service:

export declare class NotifyService {
    info(message: string, title?: string, options?: any): void;
    success(message: string, title?: string, options?: any): void;
    warn(message: string, title?: string, options?: any): void;
    error(message: string, title?: string, options?: any): void;
}

How can I set the the Notification persistence - the time the notification remains visible to the user? Notification System