The simple logger for a web application. Uses default console to output simple messages and [toastr](https://github.com/CodeSeven/toastr) to show notification.

Utils.ts

/**
 * Module with common classes, functions and etc. as utils for the whole web application.
 */
module Utils {
    "use strict";

    /**
     * Common interface for Logger classes on client side (JavaScript).
     */
    export interface ILogger {
        /**
         * Info message.
         * @param {string} message
         * @param {string} title
         */
        info(message: string, title?: string): void;
        /**
         * Error message.
         * @param {string} message
         * @param {string} title
         */
        error(message: string, title?: string): void;
        /**
         * Warning message.
         * @param {string} message
         * @param {string} title 
         */
        warning(message: string, title?: string): void;
        /**
         * Debug message.
         * @param {string} message - Message as text.
         */
        debug(message): void;
    }

    /**
     * Base logger class.
     */
    export class LoggerBase {
        /**
         * Logger name.
         */
        name: string;

        constructor(name: string) {
            this.name = name;
        }
    }

    /**
     * Simple class to log custom events in the web app.
     * Uses toastr to show small notifications.
     */
    export class Logger extends LoggerBase implements ILogger {
        showToastr: boolean;

        constructor(name: string, showToastr?: boolean) {
            super(name);
            
            if (showToastr === undefined) {
                this.showToastr = true;
                this.configureToastr();
            } else {
                this.showToastr = showToastr;
            }

            console.log(`Using Logger for ${name}.`);
        }

        configureToastr() {
            toastr.options = {
                "closeButton": true,
                "preventDuplicates": true
            };
        }

        error(message: string, title?: string) {
            console.log(this.createMessage(message));
            if (this.showToastr) {
                toastr.error(message, title);
            }
        }

        info(message: string, title?: string) {
            console.log(this.createMessage(message));
            if (this.showToastr) {
                toastr.info(message, title);
            }
        }

        warning(message: string, title?: string) {
            console.log(this.createMessage(message));
            if (this.showToastr) {
                toastr.warning(message, title);
            }
        }

        debug(message: string) {
            if (Application.appSettings.debugMode) {
                console.log(`Debug: ${this.createMessage(message)}`);
            }
        }

        /**
         * Create a message.
         * @param {string} message - Message text from source.
         */
        createMessage(message: string): string {
            return `${this.name} - ${message}`;
        }
    }
}

/**
 * Global module with some logic for the web application like settings and etc.
 */
module Application {
    "use strict";

    /**
     * Simple application setting for client side logic.
     */
    export var appSettings = {
        "debugMode": true
    };
}

Utils_Logger.ts

module Utils {
    export class Logger {
        name: string;
        showToastr: boolean;

        constructor(name: string, showToastr?: boolean) {
            this.name = name;
            if (showToastr === undefined) {
                this.showToastr = true;
            } else {
                this.showToastr = showToastr;
            }

            console.log("Use Logger for " + name);

            this.configureToastr();
        }

        configureToastr() {
            toastr.options = {
                "closeButton": true,
                "preventDuplicates": true
            };
        }

        error(message: string, title?: string) {
            console.log(message);
            if (this.showToastr) {
                toastr.error(message, title);
            }
        }

        info(message: string, title?: string) {
            console.log(message);
            if (this.showToastr) {
                toastr.info(message, title);
            }
        }

        warning(message: string, title?: string) {
            console.log(message);
            if (this.showToastr) {
                toastr.warning(message, title);
            }
        }
    }
} 

Logger use toastr lobrary for show notifications + default JavaScript console.log() function to output in console.