Jalalhejazi/index.html

## index.html
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"/>
		<title>msgNotify examples</title>
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet"/>
		<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet"/>
		<link href="msgNotify.css" rel="stylesheet" type="text/css" />
		<style>
			.row {
				margin-left: 0;
			}
		</style>
	</head>

	<body style="padding: 30px" class="container">
		<section class="row">
			<h1>msgNotify</h1>
			<a href="https://github.com/Jalalhejazi/msgNotify">//github.com/Jalalhejazi/msgNotify</a>

			<div class="well row">
				<div class="row span11">
					<div class="span4">
						<div class="control-group">
							<div class="controls">
								<label class="control-label" for="title">Title</label>
								<input id="title" type="text" class="input-large" placeholder="Enter a title ..."/>
								<label class="control-label" for="message">Message</label>
								<textarea class="input-large" id="message" rows="3" placeholder="Enter a message ..."></textarea>
							</div>
						</div>
					</div>

					<div class="span2">
						<div class="control-group" id="msgNotifyTypeGroup">
							<div class="controls">
								<label >msgNotify Type</label>

								<label class="radio">
									<input type="radio" name="msgNotifys" value="success" checked/>Success
								</label>

								<label class="radio">
									<input type="radio" name="msgNotifys" value="info"/>
									Info
								</label>

								<label class="radio">
									<input type="radio" name="msgNotifys" value="warning"/>
									Warning
								</label>

								<label class="radio">
									<input type="radio" name="msgNotifys" value="error"/>
									Error
								</label>

								<label class="radio">
									<input type="radio" name="msgNotifys" value="bookmark"/>
									bookmark
								</label>
							</div>
						</div>
						<div class="control-group" id="positionGroup">
							<div class="controls">
								<label>Position</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-top-right" />Top Right</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-right"/>Bottom Right</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-left"/>Bottom Left</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-top-left"/>Top Left</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-top-full-width"/>Top Full Width</label>
								<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-full-width" checked/>Bottom Full Width</label>
							</div>
						</div>
					</div>

					<div class="span2" >
						<div class="control-group">
							<div class="controls">
							    <label class="control-label" for="">Fade in</label>
								<input id="fadeIn" type="text" placeholder="ms" class="input-mini" value="300"/>

								<label class="control-label" for="fadeOut">Fade out</label>
								<input id="fadeOut" type="text" placeholder="ms" class="input-mini" value="1000"/>

								<label class="control-label" for="timeOut">Time out</label>
								<input id="timeOut" type="text" placeholder="ms" class="input-mini" value="5000"/>

								<label class="control-label" for="timeOut">Extended time out</label>
								<input id="extendedTimeOut" type="text" placeholder="ms" class="input-mini" value="1000"/>
							</div>
						</div>
					</div>

					<div class="span2">
						<div class="control-group">
							<div class="controls">
								<label class="checkbox" for="debugInfo">
									<input id="debugInfo" type="checkbox" value="checked" class="input-mini"/>Debug
								</label>
							</div>
							<div class="controls">
								<label class="checkbox" for="addBehaviorOnmsgNotifyClick">
									<input id="addBehaviorOnmsgNotifyClick" type="checkbox" value="checked" class="input-mini"/>Add behavior on msgNotify click
								</label>
							</div>

						</div>
					</div>
				</div>

				<div class="row span11">
					<button type="button" class="btn btn-primary" id="showmsgNotify">Show msgNotify</button>
                    <button type="button" class="btn btn-danger" id="clearmsgNotifys">Clear msgNotifys</button>
                    <button type="button" class="btn btn-danger" id="clearlastmsgNotify">Clear Last msgNotify</button>
				</div>
			</div>
		</section>

		<footer class="row">

		</footer>

		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
		<script src="msgNotify.js"></script>

		<script type="text/javascript">
		    $(function () {
		        var
					i = -1,
					msgNotifyCount = 0,
		            $msgNotifylast,
					getMessage = function() {
						var msgs = ['Please Develop HTML5 WebApps rather than native mobile apps',
							'<div><input class="input-small" value="textbox"/>&nbsp;<a href="http://SuperMobile.dk" target="_blank">This is a hyperlink</a></div><div><button type="button" id="okBtn" class="btn btn-primary">Close me</button><button type="button" id="surpriseBtn" class="btn" style="margin: 0 8px 0 8px">Dynamic behavior</button></div>',
							'HTML5 is the future of next generation WebApps !',
							'Welcome back to the web :-)',
							'DO not under estimate the power of CSS.3',
							'Everything you see is FREE !'
					    ];
					    i++;
					    if (i === msgs.length) {
							i = 0;
					    }

						return msgs[i];
					};
		        $('#showmsgNotify').click(function() {
					var shortCutFunction = $("#msgNotifyTypeGroup input:radio:checked").val(),
						msg = $('#message').val(),
						title = $('#title').val() || '',
						$fadeIn = $('#fadeIn'),
						$fadeOut = $('#fadeOut'),
						$timeOut = $('#timeOut'),
					    $extendedTimeOut = $('#extendedTimeOut'),
						msgNotifyIndex = msgNotifyCount++;
		            msgNotify.options = {
					    debug: ($('#debugInfo').attr('checked') === 'checked'),
					    positionClass: $('#positionGroup input:radio:checked').val() || 'msgNotify-top-right',
                        onclick: null
					};
		            if (($('#addBehaviorOnmsgNotifyClick').attr('checked') === 'checked')) {
					    msgNotify.options.onclick = function () {
					        alert('You can perform some custom action after a msgNotify goes away');
					    };
		            }

					if ($fadeIn.val().length) {
						msgNotify.options.fadeIn = + $fadeIn.val();
					}

					if ($fadeOut.val().length) {
						msgNotify.options.fadeOut = + $fadeOut.val();
					}

					if ($timeOut.val().length) {
						msgNotify.options.timeOut = + $timeOut.val();
					}

					if ($extendedTimeOut.val().length) {
					    msgNotify.options.extendedTimeOut = + $extendedTimeOut.val();
					}

					if (!msg) {
						msg = getMessage();
					}

					var $msgNotify = msgNotify[shortCutFunction](msg, title);
					// Wire up an event handler to a button in the msgNotify, if it exists
		            $msgNotifylast = $msgNotify;
					if ($msgNotify.find('#okBtn').length) {
					    $msgNotify.delegate('#okBtn', 'click', function () {
					        alert('you clicked me. I was msgNotify #' + msgNotifyIndex + '. goodbye!');
					        $msgNotify.remove();
					    });
					}
					if ($msgNotify.find('#surpriseBtn').length) {
					    $msgNotify.delegate('#surpriseBtn', 'click', function () {
					        alert('Surprise! you clicked me. I was msgNotify #' + msgNotifyIndex + '. You could perform an action here.');
					    });
					}

		            $('#clearlastmsgNotify').click(function() {
		                msgNotify.clear($msgNotifylast);
		            });
		        });
		        $('#clearmsgNotifys').click(function () {
		            msgNotify.clear();
		        });
		    })
		</script>


		<script type="text/javascript">
			  // to use the library, just call the global msgNotify:

			  msgNotify.success(' https://github.com/Jalalhejazi/msgNotify ', 'download sourceCode');

			  var Add_to_homescreen_msg = '<p>Bookmark your WebApp and restart from home screen </p> <img src="images/touch-icon-iphone.png" />' ;

			  msgNotify.bookmark(Add_to_homescreen_msg);

		</script>


	</body>
</html>

## msgNotify.css
/*
    GitHub:  https://raw.github.com/Jalalhejazi/msgNotify/master/msgNotify.css

    Use the Twitter Bootstrap
    Responsive Design


*/


.msgNotify-title {
    font-weight: bold;
}

.msgNotify-message {
    -ms-word-wrap: break-word;
    word-wrap: break-word;
}

    .msgNotify-message a,
    .msgNotify-message label {
        color: #FFF;
    }

        .msgNotify-message a:hover {
            color: #CCC;
            text-decoration: none;
        }


.msgNotify-top-full-width {
    top: 0;
    right: 0;
    width: 100%;
}

.msgNotify-bottom-full-width {
    bottom: 0;
    right: 0;
    width: 100%;
}

.msgNotify-top-left {
    top: 12px;
    left: 12px;
}

.msgNotify-top-right {
    top: 12px;
    right: 12px;
}

.msgNotify-bottom-right {
    right: 12px;
    bottom: 12px;
}

.msgNotify-bottom-left {
    bottom: 12px;
    left: 12px;
}

#msgNotify-container {
    position: fixed;
    z-index: 999999;
}

    #msgNotify-container > div {
        margin: 0 0 6px;
        padding: 15px 15px 15px 50px;
        width: 300px;
        -moz-border-radius: 3px 3px 3px 3px;
        -webkit-border-radius: 3px 3px 3px 3px;
        border-radius: 3px 3px 3px 3px;
        background-position: 15px center;
        background-repeat: no-repeat;
        -moz-box-shadow: 0 0 12px #999999;
        -webkit-box-shadow: 0 0 12px #999999;
        box-shadow: 0 0 12px #999999;
        color: #FFFFFF;
        opacity: 0.8;
        -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
        filter: alpha(opacity=80);
    }

.msgNotify {
    background-color: #030303;
}

.msgNotify-success {
    background-color: #51A351;
}

.msgNotify-error {
    background-color: #BD362F;
}

.msgNotify-info {
    background-color: #2F96B4;
}

.msgNotify-warning {
    background-color: #F89406;
}

#msgNotify-container > :hover {
    -moz-box-shadow: 0 0 12px #000000;
    -webkit-box-shadow: 0 0 12px #000000;
    box-shadow: 0 0 12px #000000;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    cursor: pointer;
}

#msgNotify-container > .msgNotify-info {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;
}

#msgNotify-container > .msgNotify-error {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;
}

#msgNotify-container > .msgNotify-success {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;
}

#msgNotify-container > .msgNotify-warning {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;
}

#msgNotify-container > .msgNotify-bookmark {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;

}

/*Responsive Design*/

@media all and (max-width: 240px) {
    #msgNotify-container > div {
        padding: 8px 8px 8px 50px;
        width: 108px;
    }
}

@media all and (min-width: 241px) and (max-width: 320px) {
    #msgNotify-container > div {
        padding: 8px 8px 8px 50px;
        width: 128px;
    }
}

@media all and (min-width: 321px) and (max-width: 480px) {
    #msgNotify-container > div {
        padding: 8px 8px 8px 50px;
        width: 192px;
    }
}

@media all and (min-width: 481px) and (max-width: 768px) {
    #msgNotify-container > div {
        padding: 15px 15px 15px 50px;
        width: 300px;
    }
}

/* overrides */
#msgNotify-container.msgNotify-top-full-width > div,
#msgNotify-container.msgNotify-bottom-full-width > div {
    width: 100%;
    margin: 1px 0 1px 0;
}

## msgNotify.js
/*
        GitHub:         https://raw.github.com/Jalalhejazi/msgNotify/master/msgNotify.js
        jQuery plugin:  msgNotify.js

        Usage:
                msgNotify.info    ('Display info message with no title' );

                msgNotify.warning ('Display warning message with no title');

                msgNotify.success ('Display success message' , 'with a title')

                msgNotify.error   ('Display error message', 'with a title');

                msgNotify.bookmark('Bookmark your WebApp and restart from home screen');
                msgNotify.bookmark();

                msgNotify.clear() ;

 */

; (function (define) {
    define(['jquery'], function ($) {
        return (function () {
            var $container,

                defaults = {
                    tapToDismiss: true,
                    msgNotifyClass: 'msgNotify',
                    containerId: 'msgNotify-container',
                    debug: false,
                    fadeIn: 300,
                    fadeOut: 1000,
                    extendedTimeOut: 1000,
                    iconClasses: {
                        error: 'msgNotify-error',
                        info: 'msgNotify-info',
                        success: 'msgNotify-success',
                        warning: 'msgNotify-warning',
                        bookmark: 'msgNotify-bookmark'
                    },
                    iconClass: 'msgNotify-info',
                    positionClass: 'msgNotify-top-right',
                    timeOut: 5000, // Set timeOut to 0 to make it sticky
                    titleClass: 'msgNotify-title',
                    messageClass: 'msgNotify-message',
                    target: 'body'
                },

                error = function (message, title, optionsOverride) {
                    return notify({
                        iconClass: getOptions().iconClasses.error,
                        message: message,
                        optionsOverride: optionsOverride,
                        title: title
                    });
                },

                info = function (message, title, optionsOverride) {
                    return notify({
                        iconClass: getOptions().iconClasses.info,
                        message: message,
                        optionsOverride: optionsOverride,
                        title: title
                    });
                },

                notify = function (map) {
                    var
                        options = getOptions(),
                        iconClass = map.iconClass || options.iconClass;

                    if (typeof (map.optionsOverride) !== 'undefined') {
                        options = $.extend(options, map.optionsOverride);
                        iconClass = map.optionsOverride.iconClass || iconClass;
                    }

                    var
                        intervalId = null,
                        $container = getContainer(options),
                        $msgNotifyElement = $('<div/>'),
                        $titleElement = $('<div/>'),
                        $messageElement = $('<div/>'),
                        response = { options: options, map: map };

                    if (map.iconClass) {
                        $msgNotifyElement.addClass(options.msgNotifyClass).addClass(iconClass);
                    }

                    if (map.title) {
                        $titleElement.append(map.title).addClass(options.titleClass);
                        $msgNotifyElement.append($titleElement);
                    }

                    if (map.message) {
                        $messageElement.append(map.message).addClass(options.messageClass);
                        $msgNotifyElement.append($messageElement);
                    }

                    $msgNotifyElement.hide();
                    $container.prepend($msgNotifyElement);
                    $msgNotifyElement.fadeIn(options.fadeIn);
                    if (options.timeOut > 0) {
                        intervalId = setTimeout(fadeAway, options.timeOut);
                    }

                    $msgNotifyElement.hover(stickAround, delayedFadeAway);
                    if (!options.onclick && options.tapToDismiss) {
                        $msgNotifyElement.click(fadeAway);
                    }

                    if (options.onclick) {
                        $msgNotifyElement.click(function () {
                            options.onclick() && fadeAway();
                        });
                    }

                    if (options.debug && console) {
                        console.log(response);
                    }

                    return $msgNotifyElement;

                    function fadeAway() {
                        if ($(':focus', $msgNotifyElement).length > 0) {
                            return;
                        }
                        return $msgNotifyElement.fadeOut(options.fadeOut, function () {
                            removemsgNotify($msgNotifyElement);
                        });
                    }

                    function delayedFadeAway() {
                        if (options.timeOut > 0 || options.extendedTimeOut > 0) {
                            intervalId = setTimeout(fadeAway, options.extendedTimeOut);
                        }
                    }

                    function stickAround() {
                        clearTimeout(intervalId);
                        $msgNotifyElement.stop(true, true).fadeIn(options.fadeIn);
                    }
                },

                success = function (message, title, optionsOverride) {
                    return notify({
                        iconClass: getOptions().iconClasses.success,
                        message: message,
                        optionsOverride: optionsOverride,
                        title: title
                    });
                },

                warning = function (message, title, optionsOverride) {
                    return notify({
                        iconClass: getOptions().iconClasses.warning,
                        message: message,
                        optionsOverride: optionsOverride,
                        title: title
                    });
                },

                 bookmark = function (message, title, optionsOverride) {
                    return notify({
                        iconClass: getOptions().iconClasses.info,
                        message: (message  ? message  : "Bookmark your WebApp and restart from home screen")  ,
                        optionsOverride: optionsOverride,
                        title:  (title ? title : "Add to home screen")
                    });
                },

                clear = function ($msgNotifyElement) {
                    var options = getOptions();
                    if (!$container)
                        {
                            getContainer(options)
                        }
                    if ($msgNotifyElement && $(':focus', $msgNotifyElement).length === 0) {
                        $msgNotifyElement.fadeOut(options.fadeOut, function () {
                            removemsgNotify($msgNotifyElement);
                        });
                        return;
                    }
                    if ($container.children().length) {
                        $container.fadeOut(options.fadeOut, function () {
                            $container.remove();
                        });
                    }
                };

            var msgNotify = {
                getContainer:   getContainer,
                clear:          clear,
                info:           info,
                options:        {},
                error:          error,
                success:        success,
                warning:        warning,
                bookmark:       bookmark,
                version:        '1.2.3'
            };

            return msgNotify;

            //#region Internal Methods

            function getContainer(options) {
                if (!options) { options = getOptions(); }
                container = $('#' + options.containerId);
                if (container.children().length) {
                    return container;
                }
                container = $('<div/>')
                    .attr('id', options.containerId)
                    .addClass(options.positionClass);
                container.appendTo($(options.target));
                $container = container;
                return container;
            }

            function getOptions() {
                return $.extend({}, defaults, msgNotify.options);
            }

            function removemsgNotify($msgNotifyElement) {
                if (!$container) { $container = getContainer(); }
                if ($msgNotifyElement.is(':visible')) {
                    return;
                }
                $msgNotifyElement.remove();
                $msgNotifyElement = null;
                if ($container.children().length === 0) {
                    $container.remove();
                }
            }
            //#endregion

        })();
    });
}(typeof define === 'function' && define.amd ? define : function (deps, factory) {
    if (typeof module !== 'undefined' && module.exports) { //Node
        module.exports = factory(require(deps[0]));
    } else {
        window['msgNotify'] = factory(window['jQuery']);
    }
}));
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8"/>
	<title>msgNotify examples</title>
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css" rel="stylesheet"/>
	<link href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet"/>
	<link href="msgNotify.css" rel="stylesheet" type="text/css" />
	<style>
	.row {
	margin-left: 0;
	}
	</style>
	</head>

	<body style="padding: 30px" class="container">
	<section class="row">
	<h1>msgNotify</h1>
	<a href="https://github.com/Jalalhejazi/msgNotify">//github.com/Jalalhejazi/msgNotify</a>

	<div class="well row">
	<div class="row span11">
	<div class="span4">
	<div class="control-group">
	<div class="controls">
	<label class="control-label" for="title">Title</label>
	<input id="title" type="text" class="input-large" placeholder="Enter a title ..."/>
	<label class="control-label" for="message">Message</label>
	<textarea class="input-large" id="message" rows="3" placeholder="Enter a message ..."></textarea>
	</div>
	</div>
	</div>

	<div class="span2">
	<div class="control-group" id="msgNotifyTypeGroup">
	<div class="controls">
	<label >msgNotify Type</label>

	<label class="radio">
	<input type="radio" name="msgNotifys" value="success" checked/>Success
	</label>

	<label class="radio">
	<input type="radio" name="msgNotifys" value="info"/>
	Info
	</label>

	<label class="radio">
	<input type="radio" name="msgNotifys" value="warning"/>
	Warning
	</label>

	<label class="radio">
	<input type="radio" name="msgNotifys" value="error"/>
	Error
	</label>

	<label class="radio">
	<input type="radio" name="msgNotifys" value="bookmark"/>
	bookmark
	</label>
	</div>
	</div>
	<div class="control-group" id="positionGroup">
	<div class="controls">
	<label>Position</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-top-right" />Top Right</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-right"/>Bottom Right</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-left"/>Bottom Left</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-top-left"/>Top Left</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-top-full-width"/>Top Full Width</label>
	<label class="radio"><input type="radio" name="positions" value="msgNotify-bottom-full-width" checked/>Bottom Full Width</label>
	</div>
	</div>
	</div>

	<div class="span2" >
	<div class="control-group">
	<div class="controls">
	<label class="control-label" for="">Fade in</label>
	<input id="fadeIn" type="text" placeholder="ms" class="input-mini" value="300"/>

	<label class="control-label" for="fadeOut">Fade out</label>
	<input id="fadeOut" type="text" placeholder="ms" class="input-mini" value="1000"/>

	<label class="control-label" for="timeOut">Time out</label>
	<input id="timeOut" type="text" placeholder="ms" class="input-mini" value="5000"/>

	<label class="control-label" for="timeOut">Extended time out</label>
	<input id="extendedTimeOut" type="text" placeholder="ms" class="input-mini" value="1000"/>
	</div>
	</div>
	</div>

	<div class="span2">
	<div class="control-group">
	<div class="controls">
	<label class="checkbox" for="debugInfo">
	<input id="debugInfo" type="checkbox" value="checked" class="input-mini"/>Debug
	</label>
	</div>
	<div class="controls">
	<label class="checkbox" for="addBehaviorOnmsgNotifyClick">
	<input id="addBehaviorOnmsgNotifyClick" type="checkbox" value="checked" class="input-mini"/>Add behavior on msgNotify click
	</label>
	</div>

	</div>
	</div>
	</div>

	<div class="row span11">
	<button type="button" class="btn btn-primary" id="showmsgNotify">Show msgNotify</button>
	<button type="button" class="btn btn-danger" id="clearmsgNotifys">Clear msgNotifys</button>
	<button type="button" class="btn btn-danger" id="clearlastmsgNotify">Clear Last msgNotify</button>
	</div>
	</div>
	</section>

	<footer class="row">

	</footer>

	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.3/jquery.min.js"></script>
	<script src="msgNotify.js"></script>

	<script type="text/javascript">
	$(function () {
	var
	i = -1,
	msgNotifyCount = 0,
	$msgNotifylast,
	getMessage = function() {
	var msgs = ['Please Develop HTML5 WebApps rather than native mobile apps',
	'<div><input class="input-small" value="textbox"/> <a href="http://SuperMobile.dk" target="_blank">This is a hyperlink</a></div><div><button type="button" id="okBtn" class="btn btn-primary">Close me</button><button type="button" id="surpriseBtn" class="btn" style="margin: 0 8px 0 8px">Dynamic behavior</button></div>',
	'HTML5 is the future of next generation WebApps !',
	'Welcome back to the web :-)',
	'DO not under estimate the power of CSS.3',
	'Everything you see is FREE !'
	];
	i++;
	if (i === msgs.length) {
	i = 0;
	}

	return msgs[i];
	};
	$('#showmsgNotify').click(function() {
	var shortCutFunction = $("#msgNotifyTypeGroup input:radio:checked").val(),
	msg = $('#message').val(),
	title = $('#title').val() \|\| '',
	$fadeIn = $('#fadeIn'),
	$fadeOut = $('#fadeOut'),
	$timeOut = $('#timeOut'),
	$extendedTimeOut = $('#extendedTimeOut'),
	msgNotifyIndex = msgNotifyCount++;
	msgNotify.options = {
	debug: ($('#debugInfo').attr('checked') === 'checked'),
	positionClass: $('#positionGroup input:radio:checked').val() \|\| 'msgNotify-top-right',
	onclick: null
	};
	if (($('#addBehaviorOnmsgNotifyClick').attr('checked') === 'checked')) {
	msgNotify.options.onclick = function () {
	alert('You can perform some custom action after a msgNotify goes away');
	};
	}

	if ($fadeIn.val().length) {
	msgNotify.options.fadeIn = + $fadeIn.val();
	}

	if ($fadeOut.val().length) {
	msgNotify.options.fadeOut = + $fadeOut.val();
	}

	if ($timeOut.val().length) {
	msgNotify.options.timeOut = + $timeOut.val();
	}

	if ($extendedTimeOut.val().length) {
	msgNotify.options.extendedTimeOut = + $extendedTimeOut.val();
	}

	if (!msg) {
	msg = getMessage();
	}

	var $msgNotify = msgNotify[shortCutFunction](msg, title);
	// Wire up an event handler to a button in the msgNotify, if it exists
	$msgNotifylast = $msgNotify;
	if ($msgNotify.find('#okBtn').length) {
	$msgNotify.delegate('#okBtn', 'click', function () {
	alert('you clicked me. I was msgNotify #' + msgNotifyIndex + '. goodbye!');
	$msgNotify.remove();
	});
	}
	if ($msgNotify.find('#surpriseBtn').length) {
	$msgNotify.delegate('#surpriseBtn', 'click', function () {
	alert('Surprise! you clicked me. I was msgNotify #' + msgNotifyIndex + '. You could perform an action here.');
	});
	}

	$('#clearlastmsgNotify').click(function() {
	msgNotify.clear($msgNotifylast);
	});
	});
	$('#clearmsgNotifys').click(function () {
	msgNotify.clear();
	});
	})
	</script>


	<script type="text/javascript">
	// to use the library, just call the global msgNotify:

	msgNotify.success(' https://github.com/Jalalhejazi/msgNotify ', 'download sourceCode');

	var Add_to_homescreen_msg = '<p>Bookmark your WebApp and restart from home screen </p> <img src="images/touch-icon-iphone.png" />' ;

	msgNotify.bookmark(Add_to_homescreen_msg);

	</script>



	</body>
	</html>
	/*
	GitHub: https://raw.github.com/Jalalhejazi/msgNotify/master/msgNotify.css

	Use the Twitter Bootstrap
	Responsive Design


	*/


	.msgNotify-title {
	font-weight: bold;
	}

	.msgNotify-message {
	-ms-word-wrap: break-word;
	word-wrap: break-word;
	}

	.msgNotify-message a,
	.msgNotify-message label {
	color: #FFF;
	}

	.msgNotify-message a:hover {
	color: #CCC;
	text-decoration: none;
	}


	.msgNotify-top-full-width {
	top: 0;
	right: 0;
	width: 100%;
	}

	.msgNotify-bottom-full-width {
	bottom: 0;
	right: 0;
	width: 100%;
	}

	.msgNotify-top-left {
	top: 12px;
	left: 12px;
	}

	.msgNotify-top-right {
	top: 12px;
	right: 12px;
	}

	.msgNotify-bottom-right {
	right: 12px;
	bottom: 12px;
	}

	.msgNotify-bottom-left {
	bottom: 12px;
	left: 12px;
	}

	#msgNotify-container {
	position: fixed;
	z-index: 999999;
	}

	#msgNotify-container > div {
	margin: 0 0 6px;
	padding: 15px 15px 15px 50px;
	width: 300px;
	-moz-border-radius: 3px 3px 3px 3px;
	-webkit-border-radius: 3px 3px 3px 3px;
	border-radius: 3px 3px 3px 3px;
	background-position: 15px center;
	background-repeat: no-repeat;
	-moz-box-shadow: 0 0 12px #999999;
	-webkit-box-shadow: 0 0 12px #999999;
	box-shadow: 0 0 12px #999999;
	color: #FFFFFF;
	opacity: 0.8;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	filter: alpha(opacity=80);
	}

	.msgNotify {
	background-color: #030303;
	}

	.msgNotify-success {
	background-color: #51A351;
	}

	.msgNotify-error {
	background-color: #BD362F;
	}

	.msgNotify-info {
	background-color: #2F96B4;
	}

	.msgNotify-warning {
	background-color: #F89406;
	}

	#msgNotify-container > :hover {
	-moz-box-shadow: 0 0 12px #000000;
	-webkit-box-shadow: 0 0 12px #000000;
	box-shadow: 0 0 12px #000000;
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	cursor: pointer;
	}

	#msgNotify-container > .msgNotify-info {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGwSURBVEhLtZa9SgNBEMc9sUxxRcoUKSzSWIhXpFMhhYWFhaBg4yPYiWCXZxBLERsLRS3EQkEfwCKdjWJAwSKCgoKCcudv4O5YLrt7EzgXhiU3/4+b2ckmwVjJSpKkQ6wAi4gwhT+z3wRBcEz0yjSseUTrcRyfsHsXmD0AmbHOC9Ii8VImnuXBPglHpQ5wwSVM7sNnTG7Za4JwDdCjxyAiH3nyA2mtaTJufiDZ5dCaqlItILh1NHatfN5skvjx9Z38m69CgzuXmZgVrPIGE763Jx9qKsRozWYw6xOHdER+nn2KkO+Bb+UV5CBN6WC6QtBgbRVozrahAbmm6HtUsgtPC19tFdxXZYBOfkbmFJ1VaHA1VAHjd0pp70oTZzvR+EVrx2Ygfdsq6eu55BHYR8hlcki+n+kERUFG8BrA0BwjeAv2M8WLQBtcy+SD6fNsmnB3AlBLrgTtVW1c2QN4bVWLATaIS60J2Du5y1TiJgjSBvFVZgTmwCU+dAZFoPxGEEs8nyHC9Bwe2GvEJv2WXZb0vjdyFT4Cxk3e/kIqlOGoVLwwPevpYHT+00T+hWwXDf4AJAOUqWcDhbwAAAAASUVORK5CYII=") !important;
	}

	#msgNotify-container > .msgNotify-error {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAHOSURBVEhLrZa/SgNBEMZzh0WKCClSCKaIYOED+AAKeQQLG8HWztLCImBrYadgIdY+gIKNYkBFSwu7CAoqCgkkoGBI/E28PdbLZmeDLgzZzcx83/zZ2SSXC1j9fr+I1Hq93g2yxH4iwM1vkoBWAdxCmpzTxfkN2RcyZNaHFIkSo10+8kgxkXIURV5HGxTmFuc75B2RfQkpxHG8aAgaAFa0tAHqYFfQ7Iwe2yhODk8+J4C7yAoRTWI3w/4klGRgR4lO7Rpn9+gvMyWp+uxFh8+H+ARlgN1nJuJuQAYvNkEnwGFck18Er4q3egEc/oO+mhLdKgRyhdNFiacC0rlOCbhNVz4H9FnAYgDBvU3QIioZlJFLJtsoHYRDfiZoUyIxqCtRpVlANq0EU4dApjrtgezPFad5S19Wgjkc0hNVnuF4HjVA6C7QrSIbylB+oZe3aHgBsqlNqKYH48jXyJKMuAbiyVJ8KzaB3eRc0pg9VwQ4niFryI68qiOi3AbjwdsfnAtk0bCjTLJKr6mrD9g8iq/S/B81hguOMlQTnVyG40wAcjnmgsCNESDrjme7wfftP4P7SP4N3CJZdvzoNyGq2c/HWOXJGsvVg+RA/k2MC/wN6I2YA2Pt8GkAAAAASUVORK5CYII=") !important;
	}

	#msgNotify-container > .msgNotify-success {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;
	}

	#msgNotify-container > .msgNotify-warning {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAGYSURBVEhL5ZSvTsNQFMbXZGICMYGYmJhAQIJAICYQPAACiSDB8AiICQQJT4CqQEwgJvYASAQCiZiYmJhAIBATCARJy+9rTsldd8sKu1M0+dLb057v6/lbq/2rK0mS/TRNj9cWNAKPYIJII7gIxCcQ51cvqID+GIEX8ASG4B1bK5gIZFeQfoJdEXOfgX4QAQg7kH2A65yQ87lyxb27sggkAzAuFhbbg1K2kgCkB1bVwyIR9m2L7PRPIhDUIXgGtyKw575yz3lTNs6X4JXnjV+LKM/m3MydnTbtOKIjtz6VhCBq4vSm3ncdrD2lk0VgUXSVKjVDJXJzijW1RQdsU7F77He8u68koNZTz8Oz5yGa6J3H3lZ0xYgXBK2QymlWWA+RWnYhskLBv2vmE+hBMCtbA7KX5drWyRT/2JsqZ2IvfB9Y4bWDNMFbJRFmC9E74SoS0CqulwjkC0+5bpcV1CZ8NMej4pjy0U+doDQsGyo1hzVJttIjhQ7GnBtRFN1UarUlH8F3xict+HY07rEzoUGPlWcjRFRr4/gChZgc3ZL2d8oAAAAASUVORK5CYII=") !important;
	}

	#msgNotify-container > .msgNotify-bookmark {
	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAADsSURBVEhLY2AYBfQMgf///3P8+/evAIgvA/FsIF+BavYDDWMBGroaSMMBiE8VC7AZDrIFaMFnii3AZTjUgsUUWUDA8OdAH6iQbQEhw4HyGsPEcKBXBIC4ARhex4G4BsjmweU1soIFaGg/WtoFZRIZdEvIMhxkCCjXIVsATV6gFGACs4Rsw0EGgIIH3QJYJgHSARQZDrWAB+jawzgs+Q2UO49D7jnRSRGoEFRILcdmEMWGI0cm0JJ2QpYA1RDvcmzJEWhABhD/pqrL0S0CWuABKgnRki9lLseS7g2AlqwHWQSKH4oKLrILpRGhEQCw2LiRUIa4lwAAAABJRU5ErkJggg==") !important;

	}

	/Responsive Design/

	@media all and (max-width: 240px) {
	#msgNotify-container > div {
	padding: 8px 8px 8px 50px;
	width: 108px;
	}
	}

	@media all and (min-width: 241px) and (max-width: 320px) {
	#msgNotify-container > div {
	padding: 8px 8px 8px 50px;
	width: 128px;
	}
	}

	@media all and (min-width: 321px) and (max-width: 480px) {
	#msgNotify-container > div {
	padding: 8px 8px 8px 50px;
	width: 192px;
	}
	}

	@media all and (min-width: 481px) and (max-width: 768px) {
	#msgNotify-container > div {
	padding: 15px 15px 15px 50px;
	width: 300px;
	}
	}

	/* overrides */
	#msgNotify-container.msgNotify-top-full-width > div,
	#msgNotify-container.msgNotify-bottom-full-width > div {
	width: 100%;
	margin: 1px 0 1px 0;
	}
	/*
	GitHub: https://raw.github.com/Jalalhejazi/msgNotify/master/msgNotify.js
	jQuery plugin: msgNotify.js

	Usage:
	msgNotify.info ('Display info message with no title' );

	msgNotify.warning ('Display warning message with no title');

	msgNotify.success ('Display success message' , 'with a title')

	msgNotify.error ('Display error message', 'with a title');

	msgNotify.bookmark('Bookmark your WebApp and restart from home screen');
	msgNotify.bookmark();

	msgNotify.clear() ;

	*/

	; (function (define) {
	define(['jquery'], function ($) {
	return (function () {
	var $container,

	defaults = {
	tapToDismiss: true,
	msgNotifyClass: 'msgNotify',
	containerId: 'msgNotify-container',
	debug: false,
	fadeIn: 300,
	fadeOut: 1000,
	extendedTimeOut: 1000,
	iconClasses: {
	error: 'msgNotify-error',
	info: 'msgNotify-info',
	success: 'msgNotify-success',
	warning: 'msgNotify-warning',
	bookmark: 'msgNotify-bookmark'
	},
	iconClass: 'msgNotify-info',
	positionClass: 'msgNotify-top-right',
	timeOut: 5000, // Set timeOut to 0 to make it sticky
	titleClass: 'msgNotify-title',
	messageClass: 'msgNotify-message',
	target: 'body'
	},

	error = function (message, title, optionsOverride) {
	return notify({
	iconClass: getOptions().iconClasses.error,
	message: message,
	optionsOverride: optionsOverride,
	title: title
	});
	},

	info = function (message, title, optionsOverride) {
	return notify({
	iconClass: getOptions().iconClasses.info,
	message: message,
	optionsOverride: optionsOverride,
	title: title
	});
	},

	notify = function (map) {
	var
	options = getOptions(),
	iconClass = map.iconClass \|\| options.iconClass;

	if (typeof (map.optionsOverride) !== 'undefined') {
	options = $.extend(options, map.optionsOverride);
	iconClass = map.optionsOverride.iconClass \|\| iconClass;
	}

	var
	intervalId = null,
	$container = getContainer(options),
	$msgNotifyElement = $('<div/>'),
	$titleElement = $('<div/>'),
	$messageElement = $('<div/>'),
	response = { options: options, map: map };

	if (map.iconClass) {
	$msgNotifyElement.addClass(options.msgNotifyClass).addClass(iconClass);
	}

	if (map.title) {
	$titleElement.append(map.title).addClass(options.titleClass);
	$msgNotifyElement.append($titleElement);
	}

	if (map.message) {
	$messageElement.append(map.message).addClass(options.messageClass);
	$msgNotifyElement.append($messageElement);
	}

	$msgNotifyElement.hide();
	$container.prepend($msgNotifyElement);
	$msgNotifyElement.fadeIn(options.fadeIn);
	if (options.timeOut > 0) {
	intervalId = setTimeout(fadeAway, options.timeOut);
	}

	$msgNotifyElement.hover(stickAround, delayedFadeAway);
	if (!options.onclick && options.tapToDismiss) {
	$msgNotifyElement.click(fadeAway);
	}

	if (options.onclick) {
	$msgNotifyElement.click(function () {
	options.onclick() && fadeAway();
	});
	}

	if (options.debug && console) {
	console.log(response);
	}

	return $msgNotifyElement;

	function fadeAway() {
	if ($(':focus', $msgNotifyElement).length > 0) {
	return;
	}
	return $msgNotifyElement.fadeOut(options.fadeOut, function () {
	removemsgNotify($msgNotifyElement);
	});
	}

	function delayedFadeAway() {
	if (options.timeOut > 0 \|\| options.extendedTimeOut > 0) {
	intervalId = setTimeout(fadeAway, options.extendedTimeOut);
	}
	}

	function stickAround() {
	clearTimeout(intervalId);
	$msgNotifyElement.stop(true, true).fadeIn(options.fadeIn);
	}
	},

	success = function (message, title, optionsOverride) {
	return notify({
	iconClass: getOptions().iconClasses.success,
	message: message,
	optionsOverride: optionsOverride,
	title: title
	});
	},

	warning = function (message, title, optionsOverride) {
	return notify({
	iconClass: getOptions().iconClasses.warning,
	message: message,
	optionsOverride: optionsOverride,
	title: title
	});
	},

	bookmark = function (message, title, optionsOverride) {
	return notify({
	iconClass: getOptions().iconClasses.info,
	message: (message ? message : "Bookmark your WebApp and restart from home screen") ,
	optionsOverride: optionsOverride,
	title: (title ? title : "Add to home screen")
	});
	},

	clear = function ($msgNotifyElement) {
	var options = getOptions();
	if (!$container)
	{
	getContainer(options)
	}
	if ($msgNotifyElement && $(':focus', $msgNotifyElement).length === 0) {
	$msgNotifyElement.fadeOut(options.fadeOut, function () {
	removemsgNotify($msgNotifyElement);
	});
	return;
	}
	if ($container.children().length) {
	$container.fadeOut(options.fadeOut, function () {
	$container.remove();
	});
	}
	};

	var msgNotify = {
	getContainer: getContainer,
	clear: clear,
	info: info,
	options: {},
	error: error,
	success: success,
	warning: warning,
	bookmark: bookmark,
	version: '1.2.3'
	};

	return msgNotify;

	//#region Internal Methods

	function getContainer(options) {
	if (!options) { options = getOptions(); }
	container = $('#' + options.containerId);
	if (container.children().length) {
	return container;
	}
	container = $('<div/>')
	.attr('id', options.containerId)
	.addClass(options.positionClass);
	container.appendTo($(options.target));
	$container = container;
	return container;
	}

	function getOptions() {
	return $.extend({}, defaults, msgNotify.options);
	}

	function removemsgNotify($msgNotifyElement) {
	if (!$container) { $container = getContainer(); }
	if ($msgNotifyElement.is(':visible')) {
	return;
	}
	$msgNotifyElement.remove();
	$msgNotifyElement = null;
	if ($container.children().length === 0) {
	$container.remove();
	}
	}
	//#endregion

	})();
	});
	}(typeof define === 'function' && define.amd ? define : function (deps, factory) {
	if (typeof module !== 'undefined' && module.exports) { //Node
	module.exports = factory(require(deps[0]));
	} else {
	window['msgNotify'] = factory(window['jQuery']);
	}
	}));