@section('page_title')
    OSAA - Committees
@stop

@section('page_sub_title')    
   OSAA Committees
@stop

@section('scripts')
    @parent

    <style type="text/css">

        h3 {
            color: #990000 !important;
        }

        table.committee {
            width: 100%;
            border-collapse: collapse;
            font-size: 10pt;
            border: 1px solid #dddddd;
        }

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

        table.committee thead tr {            
            background-color: #005FA9;
            color: #ffffff;
        }

        table.committee tbody td {
            padding: 0.5em 2px;
            border-bottom: 1px solid #dddddd;
        }
        
        .webinar {
            float: right;
            line-height: 40px;
            border: 1px solid #999999;
            background-color: #efefef;
            padding: 0.25em 0.5em;
            margin-top: 0.5em;
        }

        a.webinar:hover {
            text-decoration: none;
        }

        .webinar img {
            vertical-align: middle;
            margin-right: 4px;
        }

        .ui-tabs-vertical { width: 100%; }
        .ui-tabs-vertical .ui-tabs-nav { padding: .2em .1em .2em .2em; float: left; width: 14em;}
        .ui-tabs-vertical .ui-tabs-nav li {clear: left; width: 100%; border-bottom-width: 1px !important; border-right-width: 0 !important; margin: 0 -1px .2em 0;}
        .ui-tabs-vertical .ui-tabs-nav li a { display:block; width: 144px; white-space: pre-wrap;}
        .ui-tabs-vertical .ui-tabs-nav li.ui-tabs-active { padding-bottom: 0; padding-right: .1em; border-right-width: 1px; margin-bottom: 0.2em;}
        .ui-tabs-vertical .ui-tabs-panel { padding: 0 0.5em 1em 0.5em; float: right; width: 80%;}

        /* Help Dialog */
        .help_dialog {
            font-size: 10pt;
        }

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

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

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

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

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

    </style>

@stop

@section('jquery_init')

	$('.button').button();

	$('.tabs').tabs();    

    $('.vertical_tabs')
        .tabs({
            beforeActivate : function (event, ui)
            {
                if (ui.newTab.is('[data-escape]'))
                {
                    event.preventDefault();
                    window.location = ui.newTab.attr('data-escape');                
                }   
            }
        })
        .addClass("ui-tabs-vertical ui-helper-clearfix");
    
    $('.vertical_tabs li, .vertical_tabs li a')
        .removeClass("ui-corner-top")
        .removeClass("ui-corner-right")
        .addClass("ui-corner-left");  

    /*
     * Tab activation and element focus
     */
    function activateTab(target_tab_id, focus)
    {
        var target_tab = $('.vertical_tabs ul:first li a[href="#' + target_tab_id + '"]');
        var target_tab_index = target_tab.attr('data-tab-order');

        $('.vertical_tabs').tabs('option', 'active', target_tab_index);

        if (focus)
        {
            focusOnElement($(focus));
        }
    }    

    @if (!Helpers::strIsEmpty($info['tab']))
        var anchor = "{{ $info['tab'] }}";        
    @else
        var anchor = window.location.hash.substring(1);
    @endif

    var focus = false;
    
    if (anchor)
    {
        activateTab(anchor, false);
        focus = '#content';
    }    

    @if (!Helpers::strIsEmpty($info['focus']))
        focus = "#{{ Session::get('focus') }}";        
    @endif

    function focusOnElement(focus_element)
    {        
        var top = focus_element.offset().top - 45;
        setTimeout(function() {                                
            $('html, body').scrollTop(top);
        }, 100);        
    }   

    if (focus)
    {
        focusOnElement($(focus));  
    }

    @if (Auth::check() and Auth::user()->isOsaaUser())
        $('a.files_link')
            .button()
            .css({'position' : 'absolute',
                  'top' : '10px',
                  'right' : '10px',
                  'font-size' : '8pt'})
            .click(function(event)
            {
                event.preventDefault();

                var button = $(this);
                var link = button.attr('data-files-link');
                var committee = button.attr('data-committee');

                // Files link                
                $('<div></div>')
                .appendTo('body')
                .dialog(
                {                       
                    draggable : true,
                    resizable : false,
                    height : 250,                    
                    width : 600,
                    modal : true,
                    title : 'Files Link',
                    dialogClass : 'help_dialog',
                    open : function ()
                        {  
                            var dialog_object = $(this);

                            var html = '<h1>Link to Hidden Files for the ' + committee + '</h1>';
                            
                            html += 'Only share this link with committee members as these files are hidden from the public.<br /><br />';

                            html += '<a href="' + link + '" target="_blank">' + link + '</a>';
                            
                            dialog_object.html(html);                    
                        },
                    close : function ()
                        {
                            var dialog_object = $(this);

                            $(dialog_object).remove();
                        }                
                });               
            });
    @endif
            
        


@stop

@section('page_functions')
    
@stop


@section('main_content')    		

    <div class="vertical_tabs">
        
        {{-- Tab list of committees --}}
        <ul style="padding-left: 5px; font-size: 9pt; list-style-type: none !important; min-height: 700px;">            
            @foreach ($info['committees'] as $index => $committee)
                <li><a href="#{{ $committee->id }}" data-tab-order="{{ $index }}">{{ $committee->name }}</a></li>
            @endforeach
        </ul>

        {{-- List each tab --}}
        @foreach ($info['committees'] as $committee)
        
            <!-- {{ ucwords(str_replace('-', ' ', $committee->id)) }} -->
            <div id="{{ $committee->id }}">            
                
                @if ($committee->files and Auth::check() and (Auth::user()->isOsaaUser()))
                    <a href="#" class="files_link" data-files-link="{{ url('/governance/committees') }}?show-files={{ substr(md5($committee->id), 0, 8) }}#{{ $committee->id }}" data-committee="{{ $committee->name }}"><img src="{{ asset('/images/icons/shield_16px.png') }}" alt="" title="" style="width: 8pt; height: 8pt; position: relative; top: 2px;" /> Files Link</a>
                @endif

                @if (!file_exists(app_path() . '/views/governance/committees/' . str_replace('-', '_', str_replace('-committee', '', $committee->id)) . '_slice.blade.php'))
                  
                  <h2>Coming Soon...</h2>

                  @if (Auth::check() and Auth::user()->isOsaaUser())
                  
                      To show information on this tab, you will need to create a file named:<br />                      
                      <div style="display: inline-block; width: 40px;"></div><b>{{ str_replace('-', '_', str_replace('-committee', '', $committee->id)) . '_slice.blade.php' }}</b><br /><br />
                      Save this file to:<br />
                      <div style="display: inline-block; width: 40px;"></div>app/views/governance/committees
                  
                  @endif
                @else
                    @include ('governance.committees.' . str_replace('-', '_', str_replace('-committee', '', $committee->id)) . '_slice')
                @endif

            </div>
            <!-- End of {{ ucwords(str_replace('-', ' ', $committee->id)) }} -->

        @endforeach        
                       
    </div>	
@stop