diff --git a/jquery.pnotify/jquery.pnotify-tests.ts b/jquery.pnotify/jquery.pnotify-tests.ts index a14f847d5a..e32dc99ae7 100644 --- a/jquery.pnotify/jquery.pnotify-tests.ts +++ b/jquery.pnotify/jquery.pnotify-tests.ts @@ -1,212 +1,218 @@ /// -/// +/// function test_pnotify() { - $.pnotify({ + new PNotify({ title: 'Regular Notice', text: 'Check me out! I\'m a notice.' }); - $.pnotify({ + new PNotify({ title: 'Sticky Notice', text: 'Check me out! I\'m a sticky notice. You\'ll have to close me yourself.', hide: false }); - $.pnotify({ + new PNotify({ title: 'See Through Notice', text: 'No one ever pays attention to me. Why should they? I\'m practically invisible.', opacity: .8 }); - $.pnotify({ + new PNotify({ title: 'No Shadow Notice', text: 'I don\'t have a shadow. (It\'s cause I\'m a vampire or something. Or is that reflections...)', shadow: false }); - $.pnotify('Check me out! I\'m a notice.'); + new PNotify('Check me out! I\'m a notice.'); - $.pnotify(Math.round(Math.random() * 9999)); + new PNotify(Math.round(Math.random() * 9999)); - $.pnotify({ + new PNotify({ title: 'PIcon Notice', text: 'I have an icon that uses the PIcon styles.', icon: 'picon picon-mail-unread-new' }); - $.pnotify({ + new PNotify({ title: 'jQuery UI Icon Notice', text: 'I have an icon that uses the jQuery UI icon styles.', icon: 'ui-icon ui-icon-mail-closed' }); - $.pnotify({ + new PNotify({ title: 'Bootstrap Icon Notice', text: 'I have an icon that uses the Bootstrap icon styles.', icon: 'glyphicon glyphicon-envelope' }); - $.pnotify({ + new PNotify({ title: 'No Icon Notice', text: 'I have no icon.', icon: false }); - $.pnotify({ + new PNotify({ title: 'Bootstrap Notice', text: 'Look at my beautiful styling! ^_^', styling: 'bootstrap3' }); - $.pnotify({ + new PNotify({ title: 'Bootstrap Info', text: 'Look at my beautiful styling! ^_^', type: 'info', styling: 'bootstrap3' }); - $.pnotify({ + new PNotify({ title: 'Bootstrap Success', text: 'Look at my beautiful styling! ^_^', type: 'success', styling: 'bootstrap3' }); - $.pnotify({ + new PNotify({ title: 'Bootstrap Error', text: 'Look at my beautiful styling! ^_^', type: 'error', styling: 'bootstrap3' }); - $.pnotify({ + new PNotify({ title: 'jQuery UI Notice', text: 'Look at my beautiful styling! ^_^', styling: 'jqueryui' }); - $.pnotify({ + new PNotify({ title: 'jQuery UI Info', text: 'Look at my beautiful styling! ^_^', type: 'info', styling: 'jqueryui' }); - $.pnotify({ + new PNotify({ title: 'jQuery UI Success', text: 'Look at my beautiful styling! ^_^', type: 'success', styling: 'jqueryui' }); - $.pnotify({ + new PNotify({ title: 'jQuery UI Error', text: 'Look at my beautiful styling! ^_^', type: 'error', styling: 'jqueryui' }); - $.pnotify({ + new PNotify({ title: 'Font Awesome Notice', text: 'Look at my beautiful styling! ^_^', styling: 'fontawesome' }); - $.pnotify({ + new PNotify({ title: 'Font Awesome Info', text: 'Look at my beautiful styling! ^_^', type: 'info', styling: 'fontawesome' }); - $.pnotify({ + new PNotify({ title: 'Font Awesome Success', text: 'Look at my beautiful styling! ^_^', type: 'success', styling: 'fontawesome' }); - $.pnotify({ + new PNotify({ title: 'Font Awesome Error', text: 'Look at my beautiful styling! ^_^', type: 'error', styling: 'fontawesome' }); - $.pnotify({ + new PNotify({ title: 'New Thing', text: 'Just to let you know, something happened.', type: 'info' }); - $.pnotify({ + new PNotify({ title: 'Sticky Info', text: 'Sticky info, you know, like a newspaper covered in honey.', type: 'info', hide: false }); - $.pnotify({ + new PNotify({ title: 'See Through Info', text: 'Not only does it not matter, but I don\'t even care if you see this info.', type: 'info', opacity: .8 }); - $.pnotify({ + new PNotify({ title: 'No Shadow Success', text: 'I don\'t have a shadow. (It\'s cause I\'m a vampire or something. Or is that reflections...)', type: 'success', shadow: false }); - $.pnotify({ + new PNotify({ title: 'PIcon Success', text: 'We reached the moon first! See, we planted a flag.', type: 'success', icon: 'picon picon-flag-green' }); - $.pnotify({ + new PNotify({ title: 'Oh No!', text: 'Something terrible happened.', type: 'error' }); - $.pnotify({ + new PNotify({ title: 'No Icon Error', text: 'I have no icon.', type: 'error', icon: false }); - $.pnotify({ + new PNotify({ title: 'No Sticky Button Notice', text: 'Check me out! I\'m a sticky notice with no unsticky button. You\'ll have to close me yourself.', hide: false, - sticker: false + buttons: { + sticker: false + } }); - $.pnotify({ + new PNotify({ title: 'No Mouse Reset Notice', text: 'I don\'t care if you move your mouse over me, I\'ll disappear when I want.', mouse_reset: false }); - $.pnotify({ + new PNotify({ title: 'Escaped Notice', title_escape: true, text: $('#evil_html').html(), text_escape: true }); - $.pnotify({ + new PNotify({ title: 'Non-Blocking Notice', text: 'I\'m a special kind of notice called "non-blocking". When you hover over me I\'ll fade to show the elements underneath. Feel free to click any of them just like I wasn\'t even here.\n\nNote: HTML links don\'t trigger in some browsers, due to security settings.', - nonblock: true, - nonblock_opacity: .2 + nonblock: { + nonblock: true, + nonblock_opacity: .2 + } }); - $.pnotify({ + new PNotify({ title: 'Custom Styling', text: 'I have an additional class that\'s used to give me special styling. I always wanted to be pretty.', addclass: 'custom', icon: 'picon picon-32 picon-fill-color', opacity: .8, - nonblock: true, - nonblock_opacity: .2 + nonblock: { + nonblock: true, + nonblock_opacity: .2 + } }); - $.pnotify({ + new PNotify({ title: "PNotify Stacks", text: "Stacks are used to position notices and determine where new notices will go when they're created. Each notice that's placed into a stack will be positioned related to the other notices in that stack. There is no limit to the number of stacks, and no limit to the number of notices in each stack.", type: "info", @@ -229,14 +235,13 @@ function test_pnotify() { type: "error" }; - $.pnotify(opts); + new PNotify(opts); - $.pnotify({ + new PNotify({ title: 'Show Effect', text: 'I use a different effect.', animation: 'show' }); - $.pnotify_remove_all(); - + PNotify.removeAll(); } diff --git a/jquery.pnotify/jquery.pnotify.d.ts b/jquery.pnotify/jquery.pnotify.d.ts index 167afcf236..13fd82d7ab 100644 --- a/jquery.pnotify/jquery.pnotify.d.ts +++ b/jquery.pnotify/jquery.pnotify.d.ts @@ -1,177 +1,181 @@ // Type definitions for jquery.pnotify 2.x // Project: https://github.com/sciactive/pnotify +// Definitions by: David Sichau // Definitions by: Louis Grignon // Definitions: https://github.com/borisyankov/DefinitelyTyped /// interface PNotifyStack { - dir1?: string; - dir2?: string; - push?: string; - spacing1?: number; - spacing2?: number; - context?: JQuery + dir1?: string; + dir2?: string; + push?: string; + spacing1?: number; + spacing2?: number; + context?: JQuery } interface PNotifyLabel { - redisplay?: string; - all?: string; - last?: string; - close?: string; - stick?: string; + redisplay?: string; + all?: string; + last?: string; + close?: string; + stick?: string; } interface PNotifyOptions { - /** - * The notice's title. Either boolean false or string - */ - title?: any; - /** - * Whether to escape the content of the title. (Not allow HTML.) - */ - title_escape?: boolean; - /** - * The notice's text. Either boolean false or string - */ - text?: any; - /** - * Whether to escape the content of the text. (Not allow HTML.) - */ - text_escape?: boolean; - /** - * What styling classes to use. (Can be either jqueryui or bootstrap.) - */ - styling?: string; - /** - * Additional classes to be added to the notice. (For custom styling.) - */ - addclass?: string; - /** - * Class to be added to the notice for corner styling. - */ - cornerclass?: string; + /** + * The notice's title. Either boolean false or string + */ + title?: any; + /** + * Whether to escape the content of the title. (Not allow HTML.) + */ + title_escape?: boolean; + /** + * The notice's text. Either boolean false or string + */ + text?: any; + /** + * Whether to escape the content of the text. (Not allow HTML.) + */ + text_escape?: boolean; + /** + * What styling classes to use. (Can be either jqueryui or bootstrap.) + */ + styling?: string; + /** + * Additional classes to be added to the notice. (For custom styling.) + */ + addclass?: string; + /** + * Class to be added to the notice for corner styling. + */ + cornerclass?: string; - nonblock?: { - /** - * Create a non-blocking notice. It lets the user click elements underneath it. - */ - nonblock: boolean; + nonblock?: { + /** + * Create a non-blocking notice. It lets the user click elements underneath it. + */ + nonblock: boolean; - /** - * The opacity of the notice (if it's non-blocking) when the mouse is over it. - */ - nonblock_opacity?: number - }; + /** + * The opacity of the notice (if it's non-blocking) when the mouse is over it. + */ + nonblock_opacity?: number + }; - /** - * Display a pull down menu to redisplay previous notices, and place the notice in the history. - */ - history?: boolean; - /** - * Maximum number of notifications to have onscreen. - */ - maxonscreen?: number; - /** - * Display the notice when it is created. Turn this off to add notifications to the history without displaying them. - */ - auto_display?: boolean; - /** - * Width of the notice. - */ - width?: string; - /** - * Minimum height of the notice. It will expand to fit content. - */ - min_height?: string; - /** - * Type of the notice. "notice", "info", "success", or "error". - */ - type?: string; - /** - * Set icon to true to use the default icon for the selected style/type, false for no icon, or a string for your own icon class. - */ - icon?: any; - /** - * The animation to use when displaying and hiding the notice. "none", "show", "fade", and "slide" are built in to jQuery. Others require jQuery UI. Use an object with effect_in and effect_out to use different effects. - */ - animation?: any; - /** - * Speed at which the notice animates in and out. "slow", "def" or "normal", "fast" or number of milliseconds. - */ - animate_speed?: string; - /** - * Specify a specific duration of position animation - */ - position_animate_speed?: number; - /** - * Opacity of the notice. - */ - opacity?: number; - /** - * Display a drop shadow. - */ - shadow?: boolean; + /** + * Display a pull down menu to redisplay previous notices, and place the notice in the history. + */ + history?: boolean; + /** + * Maximum number of notifications to have onscreen. + */ + maxonscreen?: number; + /** + * Display the notice when it is created. Turn this off to add notifications to the history without displaying them. + */ + auto_display?: boolean; + /** + * Width of the notice. + */ + width?: string; + /** + * Minimum height of the notice. It will expand to fit content. + */ + min_height?: string; + /** + * Type of the notice. "notice", "info", "success", or "error". + */ + type?: string; + /** + * Set icon to true to use the default icon for the selected style/type, false for no icon, or a string for your own icon class. + */ + icon?: any; + /** + * The animation to use when displaying and hiding the notice. "none", "show", "fade", and "slide" are built in to jQuery. Others require jQuery UI. Use an object with effect_in and effect_out to use different effects. + */ + animation?: any; + /** + * Speed at which the notice animates in and out. "slow", "def" or "normal", "fast" or number of milliseconds. + */ + animate_speed?: string; + /** + * Specify a specific duration of position animation + */ + position_animate_speed?: number; + /** + * Opacity of the notice. + */ + opacity?: number; + /** + * Display a drop shadow. + */ + shadow?: boolean; - buttons?: { - /** - * Provide a button for the user to manually close the notice. - */ - closer?: boolean; - /** - * Only show the closer button on hover. - */ - closer_hover?: boolean; + buttons?: { + /** + * Provide a button for the user to manually close the notice. + */ + closer?: boolean; + /** + * Only show the closer button on hover. + */ + closer_hover?: boolean; - /** - * Provide a button for the user to manually stick the notice. - */ - sticker?: boolean; - /** - * Only show the sticker button on hover. - */ - sticker_hover?: boolean; - } + /** + * Provide a button for the user to manually stick the notice. + */ + sticker?: boolean; + /** + * Only show the sticker button on hover. + */ + sticker_hover?: boolean; + } - /** - * After a delay, remove the notice. - */ - hide?: boolean; - /** - * Delay in milliseconds before the notice is removed. - */ - delay?: number; - /** - * Reset the hide timer if the mouse moves over the notice. - */ - mouse_reset?: boolean; - /** - * Remove the notice's elements from the DOM after it is removed. - */ - remove?: boolean; - /** - * Change new lines to br tags. - */ - insert_brs?: boolean; - /** - * The stack on which the notices will be placed. Also controls the direction the notices stack. - */ - stack?: PNotifyStack; - /** - * The various displayed text, helps facilitating internationalization. - */ - labels?: PNotifyLabel; + /** + * After a delay, remove the notice. + */ + hide?: boolean; + /** + * Delay in milliseconds before the notice is removed. + */ + delay?: number; + /** + * Reset the hide timer if the mouse moves over the notice. + */ + mouse_reset?: boolean; + /** + * Remove the notice's elements from the DOM after it is removed. + */ + remove?: boolean; + /** + * Change new lines to br tags. + */ + insert_brs?: boolean; + /** + * The stack on which the notices will be placed. Also controls the direction the notices stack. + */ + stack?: PNotifyStack; + /** + * The various displayed text, helps facilitating internationalization. + */ + labels?: PNotifyLabel; } interface PNotify { - elem: JQuery; - - update(options?: PNotifyOptions): void; - remove(): void; + elem: JQuery; + + update(options?: PNotifyOptions): void; + remove(): void; } interface PNotifyConstructor { - new (options?: PNotifyOptions): PNotify; + new (options?: PNotifyOptions): PNotify; + + removeAll(): void; } declare var PNotify: PNotifyConstructor; +