@section('page_title')
    OSAA - Heat Index
@stop


@section('page_sub_title')
   OSAA Heat Index Calculator, Policies, & Practice Model
@stop

@section('scripts')
    @parent

    <script src="{{ asset('/scripts/jquery.maskedinput.min.js') }}" type="text/javascript"></script>

    <style type="text/css">
        
        .success_bar {
            position: fixed;
            top: 600px;
            left: 0;
            width: 100%;
            padding: 0.25em 0;
            line-height: 1.5em;
            background-color: rgba(176, 255, 190, 0.0);
            border-bottom: 2px solid rgba(13, 88, 27, 0.50);
            border-top: 2px solid rgba(13, 88, 27, 0.50);
            z-index: 500;
        }

        .success_bar .message {
            width: 1200px;
            margin: 0 auto;
            font-size: 14pt;
            color: #151515;
        }  

        label, .label {
            font-weight: bold;
            width: 125px;
            display: inline-block;
        }        

        #heat_index_form {
            margin-bottom: 2em;
        }

        #heat_index_results {
            padding: 1em 0.5em;
            height: 475px;
        }

        #heat_index_results.normal {
            background-color: #fafafa;
            border: 1px solid #d9e1e0;            
            color: #000000;
        }

        #heat_index_results.errors {
            background-color: #fff8f8;
            border: 1px solid #cd0a0a;    
            color: #cd0a0a;
        }

        .policy_category {
            /*border-left: 4px solid #ffffff;*/
            padding-left: 0px;
            margin-left: 65px;
            position: relative;
            margin-bottom: 1em;            
        }

        .policy_category_title {
            float: left;
            position: absolute;
            left: 300px;
        }

        ol.paren {
          counter-reset: list;
          margin-left: 1em;
        }
        ol.paren > li {
          margin-top: 0.75em;
          list-style: none;
          position: relative;
        }
        ol.paren.lower_alpha > li:before {
          content: counter(list, lower-alpha) ") ";
          counter-increment: list;
          position: absolute;
          left: -1.4em;
        }
        ol.paren.decimal > li:before {
          content: counter(list, decimal) ") ";
          counter-increment: list;
          position: absolute;
          left: -1.4em;
        }
        ol.faq {
            margin-left: 1em;
        }
        ol.faq > li {
            margin-top: 0.75em;
        }


        .weather_title {
            font-weight: bold;
            color: #0d2458;
        }
        
        .weather_icon {
            text-align: center;            
            width: 100px;  
            height: 50px;          
            float: left;
        }

        .weather_icon img {
            display: block;
            margin: 0 auto;
        }

        .weather_condition {
            float: left;
            text-align: left;
            width: 200px;
            font-size: 8pt;
            color: #666666;
            line-height: 1.1em;
            height: 25px;
        }       

        .weather_temp {
            float: left;
            font-size: 18pt; 
            width: 100px;
            padding-top: 15px;
            height: 35px;
        }

        .weather_snapshot {
            float: left;
            margin-right: 15px;
        }

        .forecast_snapshot {
            font-size: 9pt;
            padding-top: 5px;
            height: 70px;
            float: left;
            width: 140px;
            margin-right: 15px;
        }

        .hi_lo_label {
            display: inline-block;
            width: 40px;
        }

        .heat_index_snapshot {
            padding-top: 5px;
            float: left;
            width: 175px;
            height: 70px;
            font-size: 9pt;
            margin-right: 15px;
        }

        .humidity_label {
            display: inline-block;
            width: 105px;
        }

        .weather_time {
            padding-top: 5px;
            float: left;
            width: 400px;
            height: 70px;
            font-size: 9pt;
        }

        #heat_index_results ul {
            font-size: 10pt;
            line-height: 1.1em;
        }

        /* AJAX Dialog */
        .ajax_dialog {
            font-size: 10pt;
        }

        .ajax_dialog h1 {
            font-size: 14pt;
            color: #005fa9 !important;
            margin: 1em 0 1em 0;
        }

        .ajax_dialog h2 {
            font-size: 12pt;
            color: #1C43A6 !important;
            margin: 1em 0 0.5em 0;
        }

        .ajax_dialog h3 {
            font-size: 10pt;
            color: #000000 !important;
            margin: 0.75em 0 0em 0;
        }

        .ajax_dialog ul, ol {
            margin-left: 28px;
        }

        .ajax_dialog dl dt {
            float: left;
            width: 200px;
            text-align: right;
            margin-right: 20px;
            font-weight: bold;
            clear: both;
        }

        table.alerts_table {
            border-collapse: collapse;
        }

        .alerts_table {            
            width: 100%;
            font-size: 10pt;
        }

        .alerts_table thead {
            background-color: #005FA9;
            color: #ffffff;
        }

        .alerts_table thead th {            
            padding: 4px 2px;
            text-align: left;
        }

        .alerts_table tbody tr {
            line-height: 2em;
        }

        .odd {
            background-color: #dddddd;
        }
        
    </style>

@stop

@section('jquery_init')
    
    // Console fix
    if(!window.console)
    {
        window.console = { log: $.noop, group: $.noop, groupEnd: $.noop };            
    }

    // Success bar
    $('.success_bar').animate({ 'top' : 32, 'background-color' : 'rgba(176, 255, 190, 1.0)'}, 1600, 'easeOutQuad', function ()
    {       
        $(this).delay(6000).fadeOut(4000);  

        $(this).hover(function ()
        {
            $(this).stop(true).css('opacity', '1.0');
        },
        function ()
        {
            $(this).fadeOut(4000);
        })
    });

    $('.tabs').tabs({
        beforeActivate : function (event, ui)
        {
            if (ui.newTab.is('[data-escape]'))
            {
                event.preventDefault();
                
                $('<div><div>')
                    .attr('data-redirecting', 1)
                    .addClass('ui-widget-overlay ui-front')
                    .appendTo('body');
                  
                $('<div><div>').appendTo('body')
                    .attr('data-redirecting', 1)
                    .css('width', '225px')
                    .css('height', '170px')
                    .css('text-align', 'center')
                    .css('padding', '0.5em')
                    .position({my : "center center", at : "center center", of : window})
                    .addClass('ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-di    buttons')
                    .html('<br />Loading...<br /><br /><img src="http://www.osaa.org/images/icons/ajax_loader3.gif" /><div style="font-size: 8pt; line-height: 105%; margin-top: 2em;">Please wait while your subscriptions are loaded from the database...</div>');

                window.location = ui.newTab.attr('data-escape');                
            }   
        }
    });

    /* 
     * Custom tooltip items
     */
    $('[data-tooltip]').each(function ()
    {
        var item = $(this);

        var help = item.attr('data-tooltip');
        
        item.tooltip({'content' : help, 'items' : item});
    });
   
    $('a[href="#"][data-tab]').click(function (e)
    {
        e.preventDefault();

        var link = $(this);
        var tab_id = link.attr('data-tab');

        var tab_link = $('.tabs ul li a[href="#' + tab_id + '"]');
        var tab_index = tab_link.attr('data-tab-index');

        $('.tabs.heat_index').tabs({active:tab_index});
    });

    // Phone field
    $('[data-phone-field]').mask("(999) 999-9999");


    $('#heat_index_form input[type="submit"]')
        .css({'font-size' : '10pt'})
        .button();

    function presetLocation(value)
    {
        $('#heat_index_form input[name="query"]')
            .val(value)
            .focus();

        $('#heat_index_form input[type="submit"]')
            .focus();
    }

    $('#heat_index_form input[name="query"]')
        .keyup(function(e)
        {
            if (e.keyCode == 13)
            {
                $('#heat_index_form input[type="submit"]').focus().click();
            }
        })
        .focus();

    function checkPresetLinks()
    {
        $('a[href="#"][data-query]').click(function(e)
        {
            e.preventDefault();

            var link = $(this);
            var value = link.attr('data-query');

            presetLocation(value);

            if (link.attr('execute') != "")
            {
                processForm();
            }
        });
    }

    @if (Input::has('query') and !Helpers::strIsEmpty(Input::get('query', null)))
        presetLocation("{{ urldecode(Input::get('query', null)) }}");
    @endif

    @if (Session::has('errors'))
        showErrors("<br />
<b>Fatal error</b>:  Class 'Session' not found in <b>/home/osaa/web_app/dev/app/views/heat_index/heat_index.blade.php</b> on line <b>381</b><br />