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

@section('page_sub_title')    
    Student Eligibility
@stop

@section('scripts')
    @parent

    <style type="text/css">
    	h3 {
    		color: #1C43A6 !important;
    	}
    	
    	.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;
    	}    	

    	.page_functions {
    		width: auto !important;
    	}

    	.ui-autocomplete {
		    max-height: 100px;
		    overflow-y: auto;
		    /* prevent horizontal scrollbar */
		    overflow-x: hidden;
		    font-size: 8pt;
		  }
		  /* IE 6 doesn't support max-height
		   * we use height instead, but this forces the menu to always be this tall
		   */
		  * html .ui-autocomplete {
		    height: 100px;
		  }

		table {
    		width: 100%;
    		border-collapse: collapse;
    		font-size: 10pt;
    	}

    	table thead {
    		background-color: #005fa9;
    		color: #ffffff;
    	}

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

    	table tbody tr{
    		height: 2em;
    	}

    	table tbody tr.odd {
    		background-color: #eeeeee;
    	}

    	.pending_waivers {
			margin-top: 0.5em;
    	}

    	#results {
    		width: 510px;
    		/*height: 430px;*/
    		height: 555px;
    		overflow-y: auto;
    		padding-right: 8px;
    		margin-top: 0.5em;
    	}

		.item {
			border-bottom: 1px solid #dedede;
			position: relative;
			margin: 0 0 0.75em 0;
			line-height: 1.1em;
		}    	

		.item .id {
			font-size: 8pt;
			position: absolute;
			right: 0;
			top: 0;
		}

		.item .status {
			font-size: 8pt;
			position: absolute;
			right: 0;
			top: 1.25em;
		}

        .item .received {
            font-size: 8pt;
            position: absolute;
            right: 0;
            top: 2.5em;
        }

		.item .name {
			font-size: 10pt;
			font-weight: bold;
		}

		.item .school {
			font-size: 9pt;
			font-style: italic;
		}

		.item .type {
			font-size: 9pt;
			color: #7d7b7d;
		}

		.item .notify img {
			position: absolute;
			right: 60px;
			width: 24px;
		}

		.item.item_hover .type {			
			color: #fcb069;
		}

		.item.item_hover {
			color: #e17009 !important;
			cursor: pointer;
			border-bottom: 1px solid #dfeffc !important;

			background: #f5f8f9;
		}

		.ui-menu {
			position: absolute;
			/* SET WIDTH */			
		}

        ul.ui-menu {
            padding: 0 !important;
        }

        /* 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;
        }

        .help_dialog .example {
        	background-color: #efefef;
        	font-family: monospace;
        	padding: 0.25em 1em;
        	margin: 0.5em 0;
        }

    </style>

@stop

@section('jquery_init')
	
	// Table row highlighter
	function colorRows ()
	{		
		$('table').each(function ()
		{
			var i = 0;

			$('tbody tr:visible', $(this)).each(function ()
			{
				if (i % 2 == 0)
				{
					$(this).addClass('odd');
				}
				else
				{
					$(this).removeClass('odd');
				}
				i = i + 1;
			});		
		});
	}	
	colorRows();
	
	
	// 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);
		})
	});

	// Buttons
	$('.close_button')
		.button({'icons':{'primary':'ui-icon-circle-close'}})
		.css({'font-size':'9pt'});		

    /* 
     * Help button    
     */
    $('.help_button')
        .button({'icons':{'primary':'ui-icon-help'}})
        .css({'font-size':'9pt', 'margin-right':'10px'});


    /* 
     * Primer button    
     */
    $('.primer_button')
        .button({'icons':{'primary':'ui-icon-person'}})
        .css({'font-size':'9pt', 'margin-right':'10px'});


	// Search features
	function searchTerm(search)
	{
		$('#results').empty();

		$('<div><div>')
            .attr('data-searching', 1)
            .addClass('ui-widget-overlay ui-front')
            .appendTo('body');
          
        $('<div><div>').appendTo('body')
            .attr('data-searching', 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 />Searching...<br /><br /><img src="http://www.osaa.org/images/icons/ajax_loader3.gif" /><div style="font-size: 8pt; line-height: 105%; margin-top: 2em;">Getting results from the database...</div>');

        var data = { term : search };

        // Get search results
        var jqxhr = $.ajax(
            {
                type : 'POST',
                url : '{{ url('/forms/eligibility/search') }}',
                data : data,
                dataType : 'html'
            })
            .done(function (data)
            {                                                
                $('[data-searching]').remove();

                var results = $.parseJSON(data);
                var waivers = results.results;
                
                if (waivers.length == 0)
                {
                	$('#results').html('No waivers matched your search.');
                	return;
            	}

                $.each(waivers, function(index, waiver)
                {
                	var html = '<div class="name">' + waiver.student + '</div>';
                	html += '<div class="id">' + waiver.id + '</div>';
                	html += '<div class="status">' + waiver.status + '</div>';                    
                	html += '<div class="school">' + waiver.school + '</div>';
                	html += '<div class="type">' + waiver.year + ' ' + waiver.type + '</div>';

                	$('<div></div>')
                		.addClass('item')
                		.attr('data-id', waiver.id)
                		.appendTo('#results')
                		.html(html);
            	});
            	
				$('.item')
					.hover(function ()
					{
						$(this).addClass('item_hover');
					}, function ()
					{
						$(this).removeClass('item_hover');
					})
					.click(function()
					{
						window.open('{{ url('/forms/eligibility') }}/' + $(this).attr('data-id'), '_blank');						
					});
                
            })
            .fail(function (jqXHR, status, error)
            {                                                   
                var response = jqXHR.responseText;
                var errorData = $.parseJSON(response);
                //console.log(errorData);
                alert("There was an error while searching.\n\n" + errorData.error.message + "\n\nThis page will be reloaded.");
                location.reload();
            });
	}


	$('#search').keypress(function(e)
	{
		if ((e.which && e.which == 13) || (e.keyCode && e.keyCode == 12))
		{
			$('.search_button').click();
		}
	})	

	$('.search_button')
		.button({'icons':{'primary':'ui-icon-search'}})
		.css({'font-size':'8pt'})		
		.click(function(event)
		{
			event.preventDefault();

			var search = $('#search').val();

			if (search == '')
			{
				alert("You didn't type in any search criteria.");
				return;
			}

			searchTerm(search);
		});

	
	@if (Auth::check() and !Auth::User()->isOsaaUser() and count($info['users_schools']) > 0)

		$('#search').val('{{ str_replace('\'', '\\\'', $info['users_schools']->first()->name) }}');
		searchTerm('{{ str_replace('\'', '\\\'', $info['users_schools']->first()->name) }}');

	@endif

	$('.login_button')
		.button({'icons':{'primary':'ui-icon-person'}})
		.css({'font-size':'8pt'});

	$('.next_button')
		.button({'icons':{'secondary':'ui-icon-play'}})
		.css({'font-size':'8pt'})
		.click(function ()
		{
			var button = $(this);

			var school_id = $('#school').val();

			window.location = "{{ url('/forms/eligibility/new') }}?school=" + school_id; 
		});

	$('.item')
		.hover(function ()
		{
			$(this).addClass('item_hover');
		}, function ()
		{
			$(this).removeClass('item_hover');
		})
		.click(function()
		{
			window.open('{{ url('/forms/eligibility') }}/' + $(this).attr('data-id'), '_blank');			
		});
	
	

	// However over viewable record
	$('tbody tr')
		.hover(function ()
		{
			$(this).css({'background-color' : '#b0dcff',
						 'cursor' : 'pointer'});
		},
		function()
		{
			$(this).css({'background-color' : '',
						 'cursor' : 'auto'});
		})
		.click(function ()
		{
			

			var waiver_id = $(this).attr('data-waiver-id');

			window.open('{{ url('/forms/eligibility/') }}/' + waiver_id, '_blank');			
		});

	$('[data-action="search_help"]').on('click', function(event)
	{
		$('<div></div>')
        .appendTo('body')
        .css({'z-index':'2000 !important'})
        .dialog(
        {                       
            draggable : false,
            resizable : false,
            height : 725,            
            width : 650,                    
            modal : true,            
            title : 'Searching for Eligibilities',
            open : function ()
                {  
                    var dialog_object = $(this);                            

                    dialog_object.html("<div class='ajax_loader' style='width:16px; height:11px; margin:4em auto; background-image: url(http://www.osaa.org/images/icons/ajax_loader2.gif); background-repeat:no-repeat;'></div>");

                    var jqxhr = $.ajax(
                              {
                                  type : 'GET',
                                  url : '{{ url('/forms/eligibility/search-help') }}',
                                  dataType : 'html'
                              })
                              .done(function (returned_data)
                              {                               
                                  dialog_object.html(returned_data);
                              })
                              .fail(function (jqXHR, status, error)
                              {                                                   
                                  var response = jqXHR.responseText;
                                  var errorData = $.parseJSON(response);
                                  //console.log(errorData);
                                  alert ("There was an error looking up help information.\n\nThis page will be reloaded.");
                                  location.reload();
                              })
                              .complete(function ()
                              {
                                   
                              });                            
                    
                },
            close : function ()
                {
                    var dialog_object = $(this);

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


	@if (Auth::check() and Helpers::strEqual(Auth::User()->email, array('gibbyr@osaa.org', 'amerilynr@osaa.org', 'kristiep@osaa.org', 'peterw@osaa.org')))
		$('#report_menu')
	        .menu()
	        .css({'font-size' : '9pt'})
	        .hide()
	    
	    $(document).click(function(event)
	    {
	        $('#report_menu').hide();
	    });

	    $('.report_menu_button')
	        .button({'icons' : {'secondary' : 'ui-icon-triangle-1-s'}})
	        .css({'font-size' : '9pt', 'margin-right' : '10px'})
	        .click(function(event)
	        {
	            event.preventDefault();
	            event.stopPropagation();

	            var menu = $('#report_menu');

	            menu
	                .show()
	                .position({'my' : 'left top',
	                           'at' : 'left bottom',
	                           'of' : '.report_menu_button'});                    
	        });
    @endif

@stop

@section('page_functions')  

	@if (Auth::check() and Helpers::strEqual(Auth::User()->email, array('gibbyr@osaa.org', 'amerilynr@osaa.org', 'kristiep@osaa.org', 'peterw@osaa.org')))

		<a href="#" class="report_menu_button" target="_blank">Reports</a>		

	@endif

    <a href="{{ asset ('docs/forms/EligibilityPrimerForParents.pdf') }}" class="primer_button" target="_blank">For Parents</a>

	<a href="{{ asset ('docs/osaainfo/OnlineEligibilityInstructions.pdf') }}" class="help_button" target="_blank">Help</a>

	<a href="{{ url('/') }}" class="close_button">Close</a>
    
@stop


@section('main_content')    		

 	{{-- Success Bar --}}
 	@if (Session::has('success'))
		<div class="success_bar">
			<div class="message">				
				{{ Session::get('success') }}
			</div>			
		</div>
	@endif 

	@if (Auth::check() and Helpers::strEqual(Auth::User()->email, array('gibbyr@osaa.org', 'amerilynr@osaa.org', 'kristiep@osaa.org', 'peterw@osaa.org')))
		<ul id="report_menu">
            <li><a href="{{ url('/forms/eligibility/report?year=' . intval(Session::get('year'))) }}" target="_blank">Annual Report ({{ Session::get('year') }})</a></li>
			<li><a href="{{ url('/forms/eligibility/report?year=' . (intval(Session::get('year')) - 1)) }}" target="_blank">Annual Report ({{ intval(Session::get('year')) - 1 }})</a></li>
			<li><a href="{{ url('/forms/eligibility/dac-information') }}" target="_blank">DAC Information</a></li>            
        </ul>
    @endif

    {{-- Errors --}}
    @if (Session::has('errors'))        
        <div class="error ui-state-error" style="padding: 0.5em; font-size: 12pt;">
            <span class="ui-icon ui-icon-alert box_icon"></span>
            @foreach ($errors->all() as $error)
                {{ $error }}
            @endforeach
        </div>
    @endif

	<div class="columns">

		<div class="half" style="padding-right: 1%; width:51%;">

			@if (Auth::user()->isDACChair() or count($info['dac_waivers']) > 0)

				<h1>Pending DAC Waivers</h1>

				@if (count($info['dac_waivers']) > 0)
					@foreach ($info['dac_waivers'] as $waiver)				

						<div class="item pending_waiver" data-id="{{ $waiver->waiver->id }}">
							<div class="name">{{ $waiver->student->getDisplayName() }}</div>
		                	<div class="id">{{ $waiver->waiver->id }}</div>
		                	<div class="status">{{ $waiver->waiver_status->slug }}</div>	                	
	                        <div class="received">{{ $waiver->received_at }}</div>
	                        <div class="school">{{ $waiver->school->name }}</div>
		                	<div class="type">{{ $waiver->school_year->slug }} {{ $waiver->waiver_type->slug }}</div>
		                </div>
		                    	
					@endforeach

					<br class="clear" />
				@else

					No schools in your league have submitted an eligibility request to your DAC.
					<br />

					<br class="clear" />

				@endif

			@endif

			<h1>Search</h1>

			<br />

			<label for="search" style="font-weight: bold;">Find</label>
			<input type="text" name="search" id="search" style="width: 250px;" />

			<button class="search_button" style="margin-left: 50px;">Search</button>

			@if (Auth::user()->isOsaaUser())
				<img src="{{ asset('/images/icons/help_24px.png') }}" alt="" title="" style="vertical-align: middle; margin-left: 30px; cursor: pointer; width: 20px;" data-action="search_help" />
			@endif

			<br />

			<div class="small gray">Search by ID, status, type, year, student name, or school.</div>

			<div id="results">

			</div>
			
		</div>		

		<div class="half" style="border-left: 1px solid #d9e1e0; width: 44%; padding-left: 1%; {{-- height: 50em; --}}">

			<h1>New Eligibility Request for {{ intval(Helpers::getCurrentYear()) }}-{{ substr(intval(Helpers::getCurrentYear()) + 1, 2, 2) }}</h1>

			<br />			

			Administrators use this section to create a new Student Eligibility Request Form.  You will need to provide the following information:

			<ul class="small" style="line-height: 1.5em; margin-top: 0.5em;">
				<li><b>Student Information</b> - including name, date of birth, parent/guardian, address, etc.</li>
				<li><b>Waiver Type</b> - type of eligibility waiver (see <a href="{{ url('governance/handbooks/osaa#_Toc426096849') }}" target="_blank">OSAA Handbook, Rule 8</a>)</li> 
				<li><b>Enrollment Records</b> - student's academic history by semester/trimester</li>
				<li><b>Additional Correspondence*</b> - some eligibility waivers require additional information or correspondence that will need to be uploaded as a separate file and attached to the request (letters, transcripts, etc.)</li>
				<li><b>Affirmation Signatures</b> - in order for your request to be submitted, you must read and agree to an affirmation statement (school administrator and student's parent/guardian or host-family)
			</ul>

			<br />

			{{-- Future Eligibility Notice --}}
			@if ($info['limit_future'])
				<div class="ui-corner-all ui-state-highlight small" style="line-height: 1.15em; margin-bottom: 1em; padding: 0.5em 4px;">
					<span class="ui-icon ui-icon-alert" style="display: inline-block; vertical-align: middle; margin-right: 4px;"></span><b>Future Eligibility Notice for Waivers Prior to {{ $info['start_date'] }}</b><br />
					Hardship requests involving future eligibility will not be considered by the Executive Director, Executive Board, or District Athletic Committee.  The student must actually be in an ineligible status before any hardship request will be considered except for Age and/or Fifth Year waivers.
				</div>
			@endif

			<h3>Create a New Eligibility Request Form</h3>

			
			@if (!isset($info['member_schools']) or count($info['member_schools']) < 1)

				<div class="ui-state-error ui-corner-all">
					<b>You do not have access to this form.</b><br /><br />
					Your account is not linked to any school with administrative privileges.<br /><br />
					<span class="small">
						Please refer to <a href="{{ url('/help') }}" style="font-weight: bold; text-decoration: underline;">OSAA Website Help</a> for instructions on linking your account to a school.
					</span>
				</div>



			@else
				<b>School</b>
				<select name="school" id="school" style="max-width: 300px;">				

					@foreach ($info['member_schools'] as $value => $name)

						<option value="{{ $value }}">{{ $name }}</option>

					@endforeach
					
				</select>

				<button class="next_button" style="margin-left: 50px;" data-search-by="name">Next</button>						
			
				<br class="clear" /><br /><br />			

				<div class="small">
					<b>* Additional Correspondence</b><br />
					Types of additional correspondence include:

					<div class="columns">
						<div class="half">						

							<u>Transcripts</u><br />
							- Current high school<br />
							- Previous high school<br />

							<br />

							<u>School Records</u><br />
							- Attendance records<br />
							- Letter authorizing release of school records to OSAA<br />

							<br />

							<u>Letter of Explanation</u><br />
							- Student and parent or guardian<br />						
							- School representative<br />
							- Other letters as relevant<br />
						</div>

						<div class="half">						

							<u>Age &amp; Fifth Year Information/Documentation</u><br />
							- Gap in student's academic progress<br />
							- Credit deficiency<br />
							- Classes needed to graduate<br />
							- Individualized Educational Program (IEP)<br />
							- Student's disability per ADA<br />
						</div>

						<br class="clear" />
					</div>

				</div>

				<br class="clear" />
			@endif


		</div>

		<br class="clear" />

	</div>

	@if (Auth::check() and Helpers::strEqual(Auth::User()->email, array('gibbyr@osaa.org', 'amerilynr@osaa.org', 'kristiep@osaa.org', 'peterw@osaa.org')))

		<br class="clear" />

		<h1 style="border-top: 2px solid #1c43a6; padding-top: 1em;">Received &amp; Pending Requests</h1>

		<div class="columns">

			<div class="half">

				<h2>Awaiting Inspection</h2>
				<div class="small gray">
					These waivers have been submitted and need to be inspected by OSAA staff.<br />
                    A yellow flag, <img src="{{ asset('/images/icons/yellow_flag_32px.png') }}" alt="" title="" style="width: 16px; height: 16px; vertical-align: middle;" />, indicates the form needs Pete's attention.
				</div>

				@if (count($info['waiver_objects']['received']) < 1)

					There are no waivers needing inspection.

				@else

					<div class="pending_waivers">

						@foreach ($info['waiver_objects']['received'] as $waiver)				

							<div class="item pending_waiver" data-id="{{ $waiver->waiver->id }}">
								<div class="name">{{ $waiver->student->getDisplayName() }}</div>
			                	<div class="id">{{ $waiver->waiver->id }}</div>
			                	<div class="status">{{ $waiver->waiver_status->slug }}</div>
			                	@if (!Helpers::strIsEmpty($waiver->data->flagged_for_pete))
                                    <div class="notify">
                                        <img src="{{ asset('/images/icons/yellow_flag_32px.png') }}" alt="" title="" />
                                    </div>
                                @endif
                                <div class="received">{{ $waiver->received_at }}</div>
                                <div class="school">{{ $waiver->school->name }}</div>
			                	<div class="type">{{ $waiver->school_year->slug }} {{ $waiver->waiver_type->slug }}</div>
			                </div>
			                    	
						@endforeach

					</div>

				@endif
			</div>

			<div class="half">
				<h2>Pending</h2>
				<div class="small gray">
					These waivers are awaiting an internal decision or waiting for a notification to be sent.<br />
                    A green flag, <img src="{{ asset('/images/icons/green_flag_32px.png') }}" alt="" title="" style="width: 16px; height: 16px; vertical-align: middle;" />, indicates that Pete has made an internal decision.
				</div>

				@if (count($info['waiver_objects']['pending']) < 1)

					There are no pending waivers needing a decision.

				@else

					<div class="pending_waivers">

						@foreach ($info['waiver_objects']['pending'] as $waiver)				

							<div class="item pending_waiver" data-id="{{ $waiver->waiver->id }}">
								<div class="name">{{ $waiver->student->getDisplayName() }}</div>
			                	<div class="id">{{ $waiver->waiver->id }}</div>
			                	<div class="status">{{ $waiver->waiver_status->slug }}</div>
			                	@if (!Helpers::strIsEmpty($waiver->data->internal_notes))
			                		<div class="notify">
			                			<img src="{{ asset('/images/icons/green_flag_32px.png') }}" alt="" title="" />
			                		</div>
			                	@endif
                                <div class="received">{{ $waiver->received_at }}</div>
			                	<div class="school">{{ $waiver->school->name }}</div>
			                	<div class="type">{{ $waiver->school_year->slug }} {{ $waiver->waiver_type->slug }}</div>
			                </div>
			                    	
						@endforeach

					</div>

				@endif
			</div>
		</div>

		<br class="clear" /><br />


	@endif

	<img src="http://www.osaa.org/images/icons/ajax_loader3.gif" style="display: none;" />
	

@stop