/* Expandable Drop Down Ticker
* Author: Dynamic Drive at http://www.dynamicdrive.com/
* Visit http://www.dynamicdrive.com/ for full source code
* Last Edited: Jan 25th, 2010
*/

var expandticker = {
    buttonhtml: '<img src="/_images/expand.jpg" style="width:70px; height:17px; cursor:pointer" />', //HTML of "expand" button
    buttonoffset: [5, -10], //offset of button from lower left edge of ticker
    //No need to edit beyond here

    dsetting: { snippetlength: 30, manual: false, timers: { rotatepause: 3000, fxduration: 300} },
    effectfuncts: ['fadeIn', 'slideDown'],

    fetchajaxcontent: function($, s) {
        window.status += 'x'
        clearTimeout(s.playtimer) //clear timers and remove $button, $menu if fetchajaxcontent() is being called more than once
        clearTimeout(s.pausetimer)
        clearTimeout(s.refreshtimer)
        if (s.$button) {
            s.$button.remove()
            s.$menu.remove()
        }
        s.$ticker.html("(Re)Fetching Ticker Contents...")
        $.ajax({
            url: s.remotecontent[0],
            error: function(ajaxrequest) {
                s.$ticker.html('Error fetching content.<br />Server Response: ' + ajaxrequest.responseText)
            },
            success: function(content) {
                s.$ticker.html(content)
                expandticker.setup($, s)
                if (s.remotecontent[1] > 5000) //5 secs minimum time allowed between updates
                    s.refreshtimer = setTimeout(function() { expandticker.fetchajaxcontent($, s) }, s.remotecontent[1])
                else if (s.remotecontent[1] > 0) //if value is NOT 0 (0=never refetch)
                    alert("Please Enter a value larger than 5 (sec) for the time between Ajax updates")
            }
        })
    },

    getmsgtitles: function(s) {
        var titlearray = []
        for (var i = 0; i < s.msglength; i++) {
            var title = s.$contents.eq(i).attr('title') || s.$contents.eq(i).text().substring(0, s.snippetlength) + ' ...' //extract snippet of message
            titlearray.push(title)
        }
        return titlearray
    },

    adddropmenu: function($, s) {
        var titles = this.getmsgtitles(s)
        var $lis = $([])
        var $menu = $('<ul class="dropdownlist"></ul>')
        for (var i = 0; i < s.msglength; i++) { //construct a new LI element for each ticker message title
            $lis = $lis.add($('<li/>').html((i + 1) + ". " + titles[i]).wrapInner('<a href="#message' + (i + 1) + '" data-pos="' + i + '"></a>'))
        }
        $menu.append($lis).hide().unbind('click').click(function(e) { //go to particular message when menu title is clicked on
            if (e.target.tagName == "A") {
                clearTimeout(s.playtimer)
                s.curmsg = parseInt(e.target.getAttribute('data-pos'))
                expandticker.selectmsg($, s, s.curmsg)
                if (!s.manual)
                    s.playtimer = setTimeout(function() { expandticker.rotatemsg($, s) }, s.timers.rotatepause)
                e.preventDefault()
            }
        })
        $menu.appendTo(document.body)
        $menu.data('state', 'closed') //indicate menu is currently closed
        s.$menu = $menu //remember $menu
        s.$menulis = $lis //remember $menu LIs
    },

    positionbutton: function($, s) {
        var toffset = s.$ticker.offset()
        var buttonpos = [toffset.left + this.buttonoffset[0], toffset.top + s.$ticker.outerHeight() + this.buttonoffset[1]]
        s.$button.css({ left: buttonpos[0], top: buttonpos[1] })
    },

    addexpandbutton: function($, s) {
        s.$button = $(this.buttonhtml).css({ position: 'absolute' }).appendTo(document.body) //create expand button, add it to page, and remember it
        this.positionbutton($, s)
        this.adddropmenu($, s)
        s.$button.unbind('click').bind('click', function(e) { //show menu when expand button is clicked
            s.$menu.css({ left: s.$button.css('left'), top: parseInt(s.$button.css('top')) - expandticker.buttonoffset[1] }).show()
            s.$menulis.removeClass('selected').eq(s.curmsg).addClass('selected') //highlight current message within menu
            s.$menu.data('state', 'open') //indicate menu is open
            e.stopPropagation()
        })
    },


    selectmsg: function($, s, selected) {
        s.$contents.stop(true, true).hide().eq(selected)[s.effectfunct](s.timers.fxduration, function() {  //animate message into view
            if (this.style && this.style.removeAttribute)
                this.style.removeAttribute('filter') //fix IE clearType problem when animation is fade-in
        })
        s.curmsg = selected
        if (s.$menu.data('state') == "open")
            s.$menulis.removeClass('selected').eq(selected).addClass('selected') //highlight current message within menu
    },

    rotatemsg: function($, s) {
        if (s.$ticker.data('state') == "over") { //pause ticker onMouseover
            clearTimeout(s.pausetimer)
            s.pausetimer = setTimeout(function() { expandticker.rotatemsg($, s) }, 100)
            return
        }
        s.nextmsg = (s.curmsg < s.msglength - 1) ? s.curmsg + 1 : 0 //go to next message
        this.selectmsg($, s, s.nextmsg)
        s.playtimer = setTimeout(function() { expandticker.rotatemsg($, s) }, s.timers.rotatepause)
    },

    setup: function($, s) {
        s.$contents = s.$ticker.find('.expandcontent').hide()
        s.msglength = s.$contents.length
        s.curmsg = 0
        expandticker.addexpandbutton($, s)
        expandticker.selectmsg($, s, s.curmsg)
        if (!s.manual) {
            s.$ticker.unbind('mouseenter').bind('mouseenter', function() { $(this).data('state', 'over') })
            s.$ticker.unbind('mouseleave').bind('mouseleave', function() { $(this).data('state', 'out') })
            s.playtimer = setTimeout(function() { expandticker.rotatemsg($, s) }, s.timers.rotatepause)
        }
    },


    init: function(setting) {
        jQuery(document).ready(function($) { //fire on DOM ready
            var s = setting
            s = jQuery.extend({}, expandticker.dsetting, s)
            s.timers.rotatepause += s.timers.fxduration //add slide duration to rotate timer
            s.$ticker = $('#' + s.id)
            if (s.$ticker.length == 0)
                return
            s.effectfunct = s.fx == "fade" ? expandticker.effectfuncts[0] : expandticker.effectfuncts[1]
            if (s.remotecontent && s.remotecontent[0].length > 0) {
                s.remotecontent[1] = s.remotecontent[1] * 1000 //convert units into seconds
                expandticker.fetchajaxcontent($, s)
            }
            else
                expandticker.setup($, s)
            $(window).bind('load resize', function(e) { //reposition enlarge images when window has loaded or is resized
                if (s.$button)
                    setTimeout(function() { expandticker.positionbutton($, s) }, (e.type == "load") ? 200 : 0)
            })
            $(document).click(function() {
                if (s.$menu) { //hide menu when user clicks anywhere on page
                    s.$menu.hide()
                    s.$menu.data('state', 'closed')
                }
            })

        })
    }
}