//
// popup help handler
//

$(document).ready(

    function () {

	if( $.browser.mozilla ) {
	  var fver = $.browser.version.split('.')
	  if( (fver[0] == 1 && fver[1]  < 8)
	  ||  (fver[0] == 1 && fver[1] == 8) && fver[2] < 1 ) {
	    podNotice()
	  }
	}
	if( $.browser.safari ) {
	  var sver = $.browser.version.split('.')
	  if( sver[0] < 500 ) {
	    podNotice()
	  }
	}
	if( $.browser.msie && $.browser.version.substr(0,1) < 7) {
	  podNotice()
	}

    }
);


var TEXT = Array(
        '<p><b>Browser compatibility</b></p>' +
        '<p>The PLUS website uses many feature rich elements that modern web ' +
        '   browsers support and although it can be used on earlier ' +
        '   versions of browsers such as IE6, you may experience some ' +
        '   performance issues.</p>' +
        '<p>For best operation and user experience, we recommend that you ' +
        '   use one of the following browsers:</p>' +
        '<ul>' +
        '  <li class="req">Firefox 2.0 upwards - <a href="http://www.mozilla.com/en-US/" target="_blank">download latest</a></li>' +
        '  <li class="req">IE 7.0 upwards - <a href="http://www.microsoft.com/windows/downloads/ie/getitnow.mspx" target="_blank">download latest</a></li>' +
        '  <li class="req">Safari 3.0 upwards - <a href="http://www.apple.com/safari/download/" target="_blank">download latest</a></li>' +
        '</ul><br />' +
	'<p>Please note you must have cookies and javascript enabled to use ' +
        '   some of the features of the PLUS website.</p>'
)

function podNotice() {

    $('body').append(
        "<div class='podNotice' id='podNoticeDiv'>" +
        "  <h1 class='podNotice' id='podNoticeMainTitle'>Browser out of date - Upgrade for best performance</h1>" +
        "  <span class='podNotice' id='podNoticeClose'><img src='/images/close_off.gif' border='0' alt='close button' /></span>" +
        "  <div class='podNotice' >" +
        "    <div class='podNotice' id='podNoticeText'>" +
        TEXT[0] +
        "    <div>" +
        "  </div>" +
        "</div>")

    //$('div#podNoticeDiv h1').css('background-color','#DDDDDD')
    //$('div#podNoticeDiv h1').css('color','#01ADEF')
    $('div#podNoticeDiv h1').css('background-color','#CC0000')
    $('div#podNoticeDiv h1').css('color','white')
    $('div#podNoticeDiv h1').css('font-weight','normal')
    $('div#podNoticeDiv h1').css('font-size', '20px')

    $('h1#podNoticeMainTitle').css('margin', '0px')
    $('h1#podNoticeMainTitle').css('padding', '10px')
    $('h1#podNoticeMainTitle').css('border-bottom', '1px solid #CCCCCC')
    $('h1#podNoticeMainTitle').css('margin-bottom', '12px')

    $('div#podNoticeDiv div').css('margin', '1pt 1pt 1pt 1pt')
    $('div#podNoticeDiv').css('background-color', '#EFEFEF')
    $('div#podNoticeDiv').css('border-bottom', '1px solid #808080')
    $('div#podNoticeDiv').css('border-right', '1px solid #808080')
    $('div#podNoticeDiv').css('border-top', '1px solid #DDDDDD')
    $('div#podNoticeDiv').css('border-left', '1px solid #DDDDDD')

    $('span#podNoticeClose').css('position','absolute')
    $('span#podNoticeClose').css('top','10px')
    $('span#podNoticeClose').css('right','10px')

    $('div#podNoticeDiv').css('min-width', '540px')
    $('div#podNoticeDiv').css('width', '540px')
    $('div#podNoticeDiv').css('min-height', '280px')
    $('div#podNoticeDiv').css('height', '280px')
    $('div#podNoticeDiv').css('z-index', '100')
    $('div#podNoticeDiv').css('position', 'absolute')
    $('div#podNoticeDiv').css('top', '60px')
    $('div#podNoticeDiv').css('left', '200px')
    $('div#podNoticeDiv').css('background-color', '#F7F7F7')

    $('div#podNoticeText').css('margin-top', '20px')
    $('div#podNoticeText').css('margin-left', '20px')
    $('div#podNoticeText').css('margin-right', '20px')
    $('div#podNoticeText').css('width', '470px')
    $('div#podNoticeText').css('min-width', '470px')
    $('div#podNoticeText').css('float', 'right')

    //$('li.podNotice').css('margin-bottom','10px')
    //$('li.podNotice').css('list-style-image', 'url("images/on.gif")')
    //$('li.req').css('list-style-image', 'url("images/on.gif")')

    $('span#podNoticeClose').mouseover( function() { $(this).css('text-decoration', 'underline') })
    $('span#podNoticeClose').mouseout( function() { $(this).css('text-decoration', 'none') })
    $('span#podNoticeClose').click( function() { $('div#podNoticeDiv').remove() })
}