toastR - main example

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://knockedup.github.com/toastR/toastr.js"></script>
<link rel="stylesheet" href="http://knockedup.github.com/toastR/toastr.css">
    <div style="padding: 30px" class="container">

        <section class="row">

            <h1>toastR</h1>



            <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" 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="toastTypeGroup">

                            <div class="controls">

                                <label >Toast Type</label>

                                <label class="radio">

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

                                <label class="radio">   

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

                                <label class="radio">   

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

                                <label class="radio">   

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

                           ...

JavaScript

$(function() {
    var
    i = -1,
        getMessage = function() {
            var msgs = ['My name is Inigo Montoya. You killed my father. Prepare to die!',
                        'Are you the six fingered man?',
                        'Inconceivable!',
                        'I do not think that means what you think it means.',
                        'Have fun storming the castle!']
            i++
            if (i === msgs.length) {
                i = 0
            }

            return msgs[i]
        }

        $('#showtoast').click(function() {
            var shortCutFunction = $("#toastTypeGroup input:radio:checked").val(),
                msg = $('#message').val(),
                title = $('#title').val() || '',
                $fadeIn = $('#fadeIn'),
                $fadeOut = $('#fadeOut'),
                $timeOut = $('#timeOut')

                toastR.options = {
                    debug: true,
                    positionClass: $('#positionGroup input:radio:checked').val() || 'toast-top-right',
                    stacked: $('#stacked').prop('checked')
                }

                if ($fadeIn.val().length) {
                    toastR.options.fadeIn = +$fadeIn.val()
                }
                if ($fadeOut.val().length) {
                    toastR.options.fadeOut = +$fadeOut.val()
                }
                if ($timeOut.val().length) {
                    toastR.options.timeOut = +$timeOut.val()
                }

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

                toastR[shortCutFunction](msg, title)
        })
})