JnMessages

© jaimeneto.com

JnMessageBox

Options
wrapper element id to wrap the messages
type 'default' | 'floating' | 'corner'
closable true | false
counter true | false
timeout seconds to hide
max limit of messages
Functions
setType(type) Sets the message box type ('default' | 'floating' | 'corner').
show(text, type) Shows a message of a defined type (default: 'alert').
alert(text) Shows an alert message.
success(text) Shows a success message.
error(text) Shows an error message.
info(text) Shows an info message.
setClosable(boolean) Adds a 'X' button to messages, allowing them to be closed.
setCounter(boolean) Adds a counter to messages that increments when the same messages of the same type are added again.
setTimeout(seconds) Defines after how long the messages should be hidden
setMax(number) Defines the limit of messages to be shown. If the max number it's reached and a new message is added, the first one will be hidden.
hideAll() Hides all messages

Examples

Default Messages

const defaultMsgs = new JnMessageBox({
    wrapper: '#defaultMsgs', 
    closable: true, 
    max: 5
});
defaultMsgs.alert('This is an alert message!');
defaultMsgs.success('This is a success message!');
defaultMsgs.error('This is an error message!');
defaultMsgs.info('This is an info message!');
defaultMsgs.hideAll();
        

Floating Messages

const floatingMsgs = new JnMessageBox({
    wrapper: '#floatingMsgs', 
    type: 'floating', 
    closable: false, 
    timeout: 5
});
floatingMsgs.alert('This is an alert floating message!');
floatingMsgs.success('This is a success floating message!');
floatingMsgs.error('This is an error floating message!');
floatingMsgs.info('This is an info floating message!');
        

Corner Messages

const cornerMsgs = new JnMessageBox({
    wrapper: '#cornerMsgs', 
    type: 'corner', 
    closable: true,
    counter: true, 
    max: 3
});
cornerMsgs.alert('This is an alert corner message!');
cornerMsgs.success('This is a success corner message!');
cornerMsgs.error('This is an error corner message!');
cornerMsgs.info('This is an info corner message!');
        

JnFixedMessages

Options
Inherits all JnMessageBox options
fixedMessages JSON containing a list of messages like {code1: text1, code2: text2}
Functions
Inherits all JnMessageBox options
exists(code) [static] Verifies if a code exists.
getFixedMessage(code) [static] Retrieves a fixed message with a predefined code.
show(code, type) Changes the JnMessageBox behaviour. Now the first parameter is the message code. If the code does not exists shows a "debug" message.
custom(text, type = 'alert') Shows a custom message, without using the predefined codes, once the show() function is changed.

Examples

const fixedMsgsJson = {
    "MSA-001": "This is a fixed alert message!",
    "MSS-001": "This is a fixed success message!",
    "MSE-001": "This is a fixed error message!",
    "MSI-001": "This is a fixed info message!"
};
const fixedMsgs = new JnFixedMessages({
    wrapper: '#fixedMsgs', 
    closable: false, 
    fixedMessages: fixedMsgsJson
});

fixedMsgs.alert("MSA-001");
fixedMsgs.success("MSS-001");
fixedMsgs.error("MSE-001");
fixedMsgs.info("MSI-001");
fixedMsgs.custom("This is a custom message!", 'alert');
fixedMsgs.info("INVALID");