CODEWITHSUNDEEP
typescriptalertifyjs
terle
terle

Reputation: 86

call alertifyjs from typescripts

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

  1. a discontinued project by fabien-d
  2. picked up and continued alertifyjs dot org
  3. 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**
    }
}
}

Upvotes: 1

Views: 1834

Answers (4)

SaschaM78
SaschaM78

Reputation: 4497

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" />

Upvotes: 0

Qwerty
Qwerty

Reputation: 31959

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(...)

Upvotes: 0

jgritten
jgritten

Reputation: 1003

*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

Upvotes: 0

Zolt&#225;n Tam&#225;si
Zolt&#225;n Tam&#225;si

Reputation: 12764

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).

Upvotes: 3

Related Questions