call alertifyjs from typescripts

Question

I'm trying to migrate some js code to typescript. Specifically I'm having trouble with AlertifyJs. Now Alertify seems to be many things.

a discontinued project by fabien-d
picked up and continued alertifyjs dot org
picked up by MohammadYounes alertifyjs dot com

Now I can find the d.ts for (1) on DefinitelyTyped, but none for the others. I want to use (3)!

I would like to somehow wrap or call directly alertify.confirm("you go", "girl"); from ts.

How can I achieve this?

Thanks

PS: Coding in vs2015

EDIT: Thought I'd provide you beutiful nerds with a code snippet of what I got somefar

///<reference path="../typings/jquery/jquery.d.ts"/>
///<reference path="../typings/toastr/toastr.d.ts"/>

module mymodule.Web {
export class CommonTools {

    constructor() {
        toastr.options.closeButton = false;
    }

    showInfo(title: string, message: string) {
        toastr.info(message, title);
    }
    showConfirm(title: string, message: string) {
     //**code goes here**
    }
}
}

score 3 · Accepted Answer · answered Jul 26 '16 at 06:59

The simplest (and least safe or elegant) solution could be to add this somewhere in the global scope in your typescript.

declare var alertify: any;

Like this, typescript will know about the alertify variable.

If you are more precise, you can introduce your own (for example) AlertifyJSStatic interface with those methods you want to use, and give that as type of alertify variable.

interface AlertifyJSStatic {
  confirm(a: string, b:string);
}

declare var alertify: AlertifyJSStatic;

Sometimes it's easier to add your own needs quickly than get lost in d.ts libraries (and versions).

That worked beautifully, thank you so much. Clear, concise and simple answer. I wanna buy a beer now! — terle, Jul 26 '16 at 07:12

score 0 · Answer 2 · answered Nov 10 '17 at 17:48

*I see there is an accepted answer, but this was my solution.

For my angular project, after installing with npm, in your import section of your TS file, copy the following...

import * as alertifyJs from 'alertifyjs';

From there, the usage is just as you desired.

alertifyJs.confirm('alertify is working');

hope this helps. cheers

score 0 · Answer 3 · answered Feb 21 '19 at 10:07

If you have a global installation of the library, declare it like this

declare global {
  interface Window {
    alertify: {
      success: Function;
      [key: string]: Function; // for all others
    };
  }
}

Now safely use

window.alertify.success(...)

score 0 · Answer 4 · answered Oct 25 '21 at 12:36

Based on Zoltán Tamási's answer I created an interface which helped me solve my compilation errors in TypeScript:

// globals/alertify.type.js

interface AlertifyJsStatic {
    alert (title: any, message: any, onok?: string);
    confirm (title: any, message: any, onok?: any, oncancel?: any);
    prompt (title: any, message: any, value?: string, onok?: any, oncancel?: any);
    notify (message: string, type?: string, wait?: number, callback?: any);
}

declare var alertify: AlertifyJsStatic;

And I reference it wherever used via Triple-Slash directive

/// <reference path="globals/alertify.type.ts" />

call alertifyjs from typescripts

4 Answers4