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

@section('tool_box')
	
@stop

@section('page_sub_title')    
	{{ $information['form_name'] }}
@stop

@section('scripts')
    @parent

	<script src="http://jwpsrv.com/library/d3LbCBzkEeSiiSIACtqXBA.js"></script>

    <style type="text/css">
    	table {border-collapse: collapse; width: 100%;}
    	th {text-align: left;}
    	tr {height: 2em;}    	
    	h3 { color: #990000 !important;}

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

    	/* Activity Icon */
    	.activity_icon {
    		float: left;
    		width: 64px;
    		height: 64px;
    		position: relative;
    		top: -1em;
    	}

    	/* Form Status */
    	.form_status {
    		font-size: 9pt;
    		float: right;
    		width: 250px;
    		height: 4em;
    		position: relative;
    		top: -1.5em;
    		text-align: right;
    		color: #999999;
    		line-height: 1.1em;
    	}

    	.form_status .state {
    		font-weight: bold;
    		color: #000000;
    	}

    	.form_status dl {
    		clear: both;
    		width: 100%;
    		padding-top: 5px;
    	}

    	.form_status dl dt {
    		width: 100px !important;
    		padding-right: 15px;
    	}

    	.form_status dl dd {
    		text-align: left;
    	}

    	/* Status Table */
        .odd {
            background-color: #dddddd;
        }

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

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

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

        .status_table tbody tr {
            line-height: 3em;
        }

        .status_table img {
        	vertical-align: middle;
        }

        /* Coach Table */
        .odd {
            background-color: #efefef;
        }

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

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

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

        .coach_table tbody tr {
            line-height: 3em;
        }

        /* Certification */
        .record {
    		height: 24px;
    		width: 130px;
    		font-size: 8.5pt;
    		line-height: 24px;
    		float: left;
    		margin-right: 16px;    		
    	}

    	.record img {
    		margin: 4px 4px 4px 0;
    		float: left;
    		cursor: help;
    	}

    	.record .completed {
    		font-size: 7pt;
    		color: #666666;
    		float: right;
    		margin-right: 0px;
    		cursor: help;
    	}

    </style>
	
@stop

@section('jquery_init')
	$('.button').button();
	$('.button.notext').button({text:false});
	$('.button.close').button({ icons : { primary : 'ui-icon-circle-close'}});
	$('.button.switch').button({ icons : { primary : 'ui-icon-transferthick-e-w'}});
	$('.button.back').button({ icons : { primary : 'ui-icon-arrowthick-1-w'}});
	$('.button.delete').button({ icons : { primary : 'ui-icon-closethick'}});
	$('.button.add').button({ icons : { primary : 'ui-icon-plusthick'}});
	$('.button.edit').button({ icons : { primary : 'ui-icon-pencil'}});	
	
	$('.button_set').buttonset();
	$('.button_set label').addClass('ui-corner-all');
	
	$('.tooltip').tooltip();	 

	
	$('.date_picker').datepicker({'dateFormat' : 'mm/dd/yy',
								  'minDate' : '11/01/13',
								  'maxDate' : '1/24/14'});

	
	$('[required]').after('<span class="required_marker">*</span>');
	

	/* Limit input to numbers only */	
	$('.numbers_only').bind('input', function()
	{
  	    $(this).val($(this).val().replace(/[^0-9]/gi, ''));
	});	

	/* Limit input to letters only */	
	$('.alphas_only').bind('input', function()
	{
  	    $(this).val($(this).val().replace(/[^A-Za-z]/gi, ''));
	});
	
	// 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);
		})
	});

	// Color table rows
	function colorRows ()
	{		
		$('table').each(function ()
		{
			var i = 0;

			$('tbody tr:visible', $(this)).each(function ()
			{
				if (i % 2 == 1)
				{
					$(this).addClass('odd');
				}
				else
				{
					$(this).removeClass('odd');
				}
				i = i + 1;
			});		


		});
	}
	colorRows();

	// Placeholder
	$('[data-placeholder]').focus(function()
    {
        var input = $(this);
        if (input.val() == input.attr('data-placeholder'))
        {
            input.val('');
            input.removeClass('placeholder');
        }
    }).blur(function()
    {
        var input = $(this);
        if (input.val() == '' || input.val() == input.attr('data-placeholder'))
        {
            input.addClass('placeholder');
            input.val(input.attr('data-placeholder'));
        }
    }).blur();

    $('[data-placeholder]').parents('form').submit(function()
    {
        $(this).find('[data-placeholder]').each(function()
        {
            var input = $(this);
            if (input.val() == input.attr('data-placeholder'))
            {
                input.val('');
            }
        });
    });

    // Shake action items
    function shakeActionImages (object)
    {
        var direction;
        if ($(object).has('[data-direction]'))
        {
            var direction = $(object).attr('data-direction');
        }
        
        if (typeof direction == 'undefined')        
        {
            var direction = 'left';
        }        

        $(object).effect("shake", {direction : direction, distance : 5, times : 1}, 600, function ()
        {
            $(this).delay(Math.floor(Math.random() * 4000) + 2000);
            shakeActionImages($(this));
        });        
    }

    $('img.action_item').each(function()
    {
        var img = $(this);
        shakeActionImages(img);
    });
	

	@if (!is_null($information['submission']))

		/* saveFormData
		 *
		 * Given a form field and a value, this function will do a
		 * JSON POST request to save the form's information.  The optional
		 * third parameter will determine if the page will be reloaded or not.
		 */
		function saveFormData(field, value, type, reload)
		{
			// Ensure the field and value parameters are provided
			if (typeof field == 'undefined' || typeof value == 'undefined' || typeof type == 'undefined')
			{
				alert('Scripting error.  Unable to save form data.');
			}

			// Get the optional reload parameter
			reload = typeof reload !== 'undefined' ? reload : false;

			// Get the form ID (same across all pages for this form)
			var form_id = {{ $information['submission']->id }};

			$('*').css({'cursor':'wait'});

			var jqxhr = $.ajax(
			{
				type : 'POST',
				url : '{{ url('/forms/activity-program-forms') }}/' + form_id + '/update',
				data : { 'field' : field,
						 'value' : value,
						 'type'  : type },
				dataType : 'html'
			})
			.done(function(returned_data)
			{                               
				// Success
				console.log("Successfully saved {'" + form_id + "|" + field + "' : '" + value + "'}");
				
				var info = $.parseJSON(returned_data);

				$('#updated_at').html(info.updated_at);
				$('#updated_by').html(info.updated_by);

				if (info.force_reload)
				{
					reload = true;
				}

			})
			.fail(function(jqXHR, status, error)
			{                                                   
				// Error
				var response = jqXHR.responseText;
				var errorData = $.parseJSON(response);
				console.log(errorData);
				alert("There was an error saving this form's data.\n\n" + errorData.error.message + "\n\nPlease try again.  Please note, that if you try to reload this page, your unsaved data to be lost.");
			})
			.complete(function ()
			{
				// Reload if necessary
				if (reload)
				{
					location.reload();
				}

				$('*').css({'cursor':''});
			});
		}	

		
		// Sub-Division option
		$('input[name="sub_division"]').click(function ()
		{	
			var item = $('input[name="sub_division"]:checked');
			var value = item.val();

			saveFormData('sub_division', value, 'string', false);
		});	
		
		// Reserve seating option
		$('select[name="reserve_seating"]').change(function()
		{
			var item = $(this);
			var value = item.val();

			saveFormData('reserve_seating', value, 'int', false);
		});

		// Estimated participants
		$('input[name="estimated_participants"]').blur(function (event)
		{
			var item = $(this);
			var value = item.val();

			saveFormData('estimated_participants', value, 'integer', false);
		});

		// Final number of participants
		$('input[name="final_number_participants"]').blur(function (event)
		{
			var item = $(this);
			var value = item.val();

			saveFormData('final_number_participants', value, 'integer', false);
		});

		// Final number of participants
		$('input[name="final_grand_finale_participants"]').blur(function (event)
		{
			var item = $(this);
			var value = item.val();

			saveFormData('final_grand_finale_participants', value, 'integer', false);
		});

		// Music agreement option
		$('input[name="legal_music_agreement"]').change(function()
		{
			var item = $(this);
			var value = item.is(':checked');

			saveFormData('music_agreement', value, 'bool', false);
		});

		// Sanctioned competitions option
		$('select[name="competition"]').change(function(event)
		{
			var item = $(this);			
			var selected = $(':selected', item);
			var value = selected.val();			

			saveFormData('competition', value, 'int', false);
		});

		// Reserve room option
		$('input[name="reserve_room"]').change(function()
		{
			var item = $(this);
			var value = item.is(':checked');

			saveFormData('reserve_room', value, 'bool', false);
		});

		// Share room with option
		$('input[name="share_room_with"]').blur(function ()
		{	
			var item = $(this);
			var value = item.val();

			saveFormData('share_room_with', value, 'string', false);
		});

		// Musical selections
		$('input[name^="music_"]').blur(function(event)
		{
			var item = $(this);
			var id = item.attr('data-id');			
			var value = item.val();

			if (value == item.attr('data-placeholder'))
			{
				value = '';
			}
			
			saveFormData('music[' + id + ']', value, 'string', false);
		});

		// Team Name
		$('input[name="team_name"]').blur(function()
		{
			var item = $(this);
			var value = item.val();
			
			saveFormData('team_name', value, 'string', false);
		});

		// Routine Theme
		$('input[name="routine_theme"]').blur(function()
		{
			var item = $(this);				
			var value = item.val();				
			
			saveFormData('routine_theme', value, 'string', false);
		});

		// Team Managers
		$('input[name^="manager"]')
			.blur(function(event)
			{
				var item = $(this);
				var id = item.attr('data-id');
				var value = item.val();				

				saveFormData('managers[' + id + ']', value, 'string', false);
			})		
			.on('input', function()
			{
		  	    $(this).val($(this).val().replace(/[^A-Za-z \-'\.]/gi, ''));
			});

		// Choreographers
		$('input[name^="choreographer"]')
			.blur(function(event)
			{
				var item = $(this);
				var id = item.attr('data-id');
				var value = item.val();				

				saveFormData('choreographers[' + id + ']', value, 'string', false);
			})		
			.on('input', function()
			{
		  	    $(this).val($(this).val().replace(/[^A-Za-z \-'\.]/gi, ''));
			});

		// Team Intro / Cue Sheet
		$('textarea[name="team_intro"]').blur(function()
		{
			var item = $(this);				
			var value = item.val();				
			
			saveFormData('team_intro', value, 'string', false);
		});		

		// Participants
		$('[name^="participant"]')
			.blur(function(event)
			{
				var item = $(this);
				var field_name = item.attr('name');

				var matches = field_name.match(/participant\[([0-9]+)\]\[(.*)\]/);

				var id = matches[1];
				var part = matches[2];				

				if (part == 'name')
				{
					var name_item = item;
				}
				else
				{
					var name_item = $('input[name="participant[' + id + '][name]"]');
				}
				
				if (part == 'grade')
				{
					var grade_item = item;
				}
				else
				{
					var grade_item = $('select[name="participant[' + id + '][grade]"]');
				}

				if (part == 'is_captain')
				{
					var captain_item = item;
				}
				else
				{
					var captain_item = $('input[name="participant[' + id + '][is_captain]"]');
				}

				var name = name_item.val();
				var grade = $(':selected', grade_item).val();
				var is_captain = captain_item.is(':checked');

				if (grade == '' || grade == ' ')
				{
					grade = 'null';
				}
				if (name == '')
				{
					name = 'null';
				}
				else
				{
					name = '"' + name + '"';
				}
				if (is_captain)
				{
					is_captain = 'true';
				}
				else
				{
					is_captain = 'false';
				}

				var data = '{"name":' + name + ',"grade":' + grade + ',"is_captain":' + is_captain + '}';
				console.log(data);

				saveFormData('participants[' + id + ']', data, 'object', false);
			});
		
		// Do not allow special characters in participant names
		$('input[name^="participant"]').bind('input', function()
			{
		  	    $(this).val($(this).val().replace(/[^A-Za-z \-'\.]/gi, ''));
			});

		// Delete team photo button
		$('.delete_photo')
			.button({'icons':{'primary':'ui-icon-trash'}})
			.css({'font-size':'8pt'})
			.click(function ()
			{
				$('<div></div>')
	                .appendTo('body')
	                .dialog({                       
	                    modal : true,
	                    draggable : false,
	                    resizable : false,
	                    height : 275,	                    
	                    width : 400,	                    
	                    title : 'Confirm Team Photo Removal',
	                    buttons: [
	                    {
					        text : "Yes",
                            'class' : "float_left",
                            icons : { primary : 'ui-icon-check'},
                            click : function()
                            {					          
								
								var team = {{ $information['team']->id }};

								$.ajax({
									type : "POST",
									url  : '{{ url('/teams/remove-photo') }}',
									data : { 'team' : team },
									success : function()
									{
										location.reload();										
									}
								});

								$(this).dialog("close");																
					    	}
					    },
					   	{
							text : "No",                            
	                        'class' : "float_right",                            
	                        icons : { primary : 'ui-icon-cancel'},
	                        click : function()
	                        {
					        	$(this).dialog( "close" );					            
					        }
					    }],
	                    open : function ()
	                        {  
	                            var dialog_object = $(this);

	                            dialog_object.html('<br />Are you sure you want to delete this team photo?<br /><br /><div class="ui-state-error" style="padding:5px;"><div class="ui-icon ui-icon-alert float_left margin-right:1em;"></div>Once you delete this photo, it will no longer exist on our server.</div>');

	                            $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
	                        },
	                    close : function ()
	                        {
	                            var dialog_object = $(this);

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

	    @if (is_null($information['team_photo']))
	    	$('.delete_photo').button('disable');
	    @endif

	    // Delete music file button
		$('.delete_music_file')
			.button({'icons':{'primary':'ui-icon-trash'}})
			.css({'font-size':'8pt'})
			.click(function ()
			{
				$('<div></div>')
	                .appendTo('body')
	                .dialog({                       
	                    modal : true,
	                    draggable : false,
	                    resizable : false,
	                    height : 275,	                    
	                    width : 400,	                    
	                    title : 'Confirm Music File Removal',
	                    buttons: [
	                    {
					        text : "Yes",
                            'class' : "float_left",
                            icons : { primary : 'ui-icon-check'},
                            click : function()
                            {					          
								
								var team = {{ $information['team']->id }};

								$.ajax({
									type : "POST",
									url  : '{{ url('/teams/remove-music-file') }}',
									data : { 'team' : team },
									success : function()
									{
										location.reload();										
									}
								});

								$(this).dialog("close");																
					    	}
					    },
					   	{
							text : "No",                            
	                        'class' : "float_right",                            
	                        icons : { primary : 'ui-icon-cancel'},
	                        click : function()
	                        {
					        	$(this).dialog( "close" );					            
					        }
					    }],
	                    open : function ()
	                        {  
	                            var dialog_object = $(this);

	                            dialog_object.html('<br />Are you sure you want to delete this team\'s music file?<br /><br /><div class="ui-state-error" style="padding:5px;"><div class="ui-icon ui-icon-alert float_left margin-right:1em;"></div>Once you delete this music file, it will no longer exist on our server.</div>');

	                            $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
	                        },
	                    close : function ()
	                        {
	                            var dialog_object = $(this);

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

	    @if (is_null($information['music_file_found']))
	    	$('.delete_music_file').button('disable');
	    @endif

	    // Upload team photo button
		$('.upload_photo')
			.button({'icons':{'primary':'ui-icon-plusthick'}})
			.css({'font-size':'8pt',
				  'margin-bottom':'2em'})
			.click(function ()
			{
				$('<div></div>')
	                .appendTo('body')
	                .dialog({                       
	                    modal : true,
	                    draggable : false,
	                    resizable : false,
	                    height : 500,	                    
	                    width : 335,	                    
	                    title : 'Upload Team Photo',
	                    buttons: [
	                    {
					        text : "Upload",
                            'class' : "float_left",
                            icons : { primary : 'ui-icon-disk'},
                            click : function()
                            {					          
								var dialog_object = $(this);
								
								var form = $('form', dialog_object);

								$('<div><div>')
									.addClass('ui-widget-overlay ui-front')
                                    .appendTo('body');
                                      
                                $('<div><div>').appendTo('body')
                                               .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-dialog-buttons')
                                               .html('<br />Working...<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, this may take a while to upload and process.</div>');

								form.submit();
					    	}
					    },
					   	{
							text : "Cancel",                            
	                        'class' : "float_right",                            
	                        icons : { primary : 'ui-icon-cancel'},
	                        click : function()
	                        {
					        	var dialog_object = $(this);
					        	dialog_object.dialog("close");
					        }
					    }],
	                    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('teams/' . $information['team']->id . '/upload-photo-form') }}?return_url=forms/registration/dnc?activity_program={{ $information['activity_program']->id }}',
	                                          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 accessing the team photo upload form.\n\nThis page will be reloaded.");
	                                          location.reload();
	                                      })
	                                      .complete(function ()
	                                      {
	                                          function readURL(input)
											  {
                                                  if (input.files && input.files[0])
                                                  {
                                                      var reader = new FileReader();
                                                      
                                                      reader.onload = function (e)
                                                      {
                                                          $('#preview').attr('src', e.target.result);                
                                                      }
                                                      
                                                      reader.readAsDataURL(input.files[0]);
                                                  }
                                              }

                                              $('#photo')                                                  
                                                  .css({'font-size':'9pt',
                                              			'margin-top':'0.5em'})
                                                  .change(function()
		                                              {
		                                                  readURL(this);
		                                              });
	                                      });     

	                            $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
	                        },
	                    close : function ()
	                        {
	                            var dialog_object = $(this);

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

	    // Upload music file button
		$('.upload_music_file')
			.button({'icons':{'primary':'ui-icon-plusthick'}})
			.css({'font-size':'8pt',
				  'margin-bottom':'2em'})
			.click(function ()
			{
				$('<div></div>')
	                .appendTo('body')
	                .dialog({                       
	                    modal : true,
	                    draggable : false,
	                    resizable : false,
	                    height : 225,	                    
	                    width : 350,	                    
	                    title : 'Upload Music File',
	                    buttons: [
	                    {
					        text : "Upload",
                            'class' : "float_left",
                            icons : { primary : 'ui-icon-disk'},
                            click : function()
                            {					          
								var dialog_object = $(this);
								
								var form = $('form', dialog_object);

								$('<div><div>')
									.addClass('ui-widget-overlay ui-front')
                                    .appendTo('body');
                                      
                                $('<div><div>').appendTo('body')
                                               .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-dialog-buttons')
                                               .html('<br />Working...<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, this may take a while to upload and process.</div>');

								form.submit();
					    	}
					    },
					   	{
							text : "Cancel",                            
	                        'class' : "float_right",                            
	                        icons : { primary : 'ui-icon-cancel'},
	                        click : function()
	                        {
					        	var dialog_object = $(this);
					        	dialog_object.dialog("close");
					        }
					    }],
	                    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('teams/' . $information['team']->id . '/upload-music-file-form') }}?return_url=forms/registration/dnc?activity_program={{ $information['activity_program']->id }}',
	                                          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 accessing the team music file upload form.\n\nThis page will be reloaded.");
	                                          location.reload();
	                                      })
	                                      .complete(function ()
	                                      {
	                                          
	                                      });     

	                            $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
	                        },
	                    close : function ()
	                        {
	                            var dialog_object = $(this);

	                            $(dialog_object).remove();
	                        }                
	                });
	        });
      	
      	@if (!is_null($information['music_file_found']))
	    	$('.upload_music_file').button('disable');

	    	jwplayer("jwVideoPlayer")
		    .setup(
		    {
		        file: "{{ asset('/music/' . $information['music_file_found']) }}",		        
		        width: 400,
		        height: 10
		    })
		    .onReady(function ()
		    {
		    	$('#jwVideoPlayer_logo').css('display', 'none');
			});
	    @endif

		// Training Course Information
		$('.cert_info')
			.css({'vertical-align' : 'middle',
				  'position' : 'absolute',
				  'left' : '100px'})
			.hover(function ()
			{
				$(this).css({'cursor' : 'pointer'});
			},
			function ()
			{
				$(this).css({'cursor' : ''});
			})
			.click(function(event)
	        {
	            event.preventDefault();

	            $('<div></div>')
	                .appendTo('body')
	                .dialog(
	                {                       
	                    draggable : true,
	                    resizable : false,
	                    height : 600,	                    
	                    width : 700,	                    
	                    modal : false,
	                    title : 'Training Course Information',
	                    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('help/training-courses?ajax=true') }}',
	                                          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();
	                        }                
	                });


	        });

	@endif

    @if (Auth::check() and Auth::user()->isOsaaUser()) 

    	// Download drop-down menu
	    $('#grabber_list')
	        .menu()
	        .css({'display' : 'none',
	              'z-index' : '200',
	              'position' : 'absolute',
	              'right' : '0',
	              'top' : '23px',
	              'margin' : '0',
	              'padding' : '0',
	              'width' : '150px'});   

	    $('#grabber_list li ul')
	        .css({'margin' : '0',
	              'padding' : '0',
	              'width' : '160px'});

	    $('#grabber_list img')
	        .css({'position' : 'relative',
	              'top' : '2px',
	              'margin-right' : '6px'});

	    $('.grabber_button')
	        .button({ icons : { secondary : 'ui-icon-triangle-1-s'}})
	        .css({'float':'right',
	              'font-size':'8pt'})
	        .click(function (event)
	        {
	            if ($('#grabber_list').is(':visible'))
	            {
	                $('#grabber_list').slideUp(400);
	                $(this).button({icons : { secondary : 'ui-icon-triangle-1-s'}});
	            }
	            else
	            {
	                $('#grabber_list').slideDown(400);
	                $(this).button({icons : { secondary : 'ui-icon-triangle-1-n'}});
	            }   
	        });   	

    	$('.edit_form_button')
   			.button({'icons' : {'primary' : 'ui-icon-pencil'},
   		             'text' : false})
   			.css({'font-size' : '8pt',
   			      'position' : 'absolute',
   			      'right' : '36px',
   			      'top' : '12px',
   			      'width' : '16px',
   			      'height' : '16px'})
   			.click(function ()
   			{
   				var ap_id = $(this).attr('data-ap-id');   				

   				window.location.href = '{{ url('/forms/registration/dnc') }}?activity_program=' + ap_id;
   			});

   		$('.drop_form_button')
   			.button({'icons' : {'primary' : 'ui-icon-trash'},
   		             'text' : false})
   			.css({'font-size' : '8pt',
   			      'position' : 'absolute',
   			      'right' : '10px',
   			      'top' : '12px',
   			      'width' : '16px',
   			      'height' : '16px'})
   			.click(function ()
   			{
				var ap_id = $(this).attr('data-ap-id'); 
				var ap_name = $(this).attr('data-ap-name'); 

   				$('<div></div>')
	                .appendTo('body')
	                .dialog({                       
	                    modal : true,
	                    draggable : false,
	                    resizable : false,
	                    height : 275,	                    
	                    width : 400,	                    
	                    title : 'Confirm Team Drop',
	                    buttons: [
	                    {
							text : "Cancel",                            
	                        'class' : "float_right",                            
	                        icons : { primary : 'ui-icon-cancel'},
	                        click : function()
	                        {
					        	$(this).dialog( "close" );					            
					        }
					    },
	                    {
					        text : "Drop Team",
                            'class' : "float_left",
                            icons : { primary : 'ui-icon-check'},
                            click : function()
                            {	
								$(this).dialog("close");

								$('<div></div>')
					                .appendTo('body')
					                .dialog({                       
					                    modal : true,
					                    draggable : false,
					                    resizable : false,
					                    height : 280,	                    
					                    width : 425,	                    
					                    title : 'Are You Sure?',
					                    buttons: [
					                    {
											text : "No",                            
					                        'class' : "float_right",                            
					                        icons : { primary : 'ui-icon-cancel'},
					                        click : function()
					                        {
									        	$(this).dialog( "close" );					            
									        }
									    },
					                    {
									        text : "Yes",
				                            'class' : "float_left",
				                            icons : { primary : 'ui-icon-check'},
				                            click : function()
				                            {	
												$.ajax({
													type : "POST",
													url  : '{{ url('/forms/drop-ap-team') }}',
													data : { 'activity_program' :  ap_id,											 
															 'activity_form' : {{ $information['activity_form']->id }}},
													success : function()
													{
														location.reload();
													}
												});

												$(this).dialog("close");																
									    	}
									    }],					                    
					                    open : function ()
					                        {  
					                            var dialog_object = $(this);

					                            dialog_object.html('<br />Are you really sure?<br /><br /><div class="ui-state-error" style="padding:5px;"><div class="ui-icon ui-icon-alert float_left margin-right:1em;"></div>Last chance.  Are you really, really sure you want to drop ' + ap_name + '.</div>');

					                            $('.ui-widget-header').css('background', '#f6a828 url(http://download.jqueryui.com/themeroller/images/ui-bg_gloss-wave_35_f6a828_500x100.png) 50% 50% repeat-x').css('border-color', '#f6a828');                                     
                                      			$('.ui-widget-content').css('border-color', '#dddddd');
                                      			
                                      			$('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
				  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
					                        },
					                    show : { effect : "shake",
					                             duration : 200},
					                    close : function ()
					                        {
					                            var dialog_object = $(this);

					                            $(dialog_object).remove();
					                        }                
					                });								
					    	}
					    }],
	                    open : function ()
	                        {  
	                            var dialog_object = $(this);

	                            dialog_object.html('<br />Are you sure you want to drop ' + ap_name + ' from the schedule?<br /><br /><div class="ui-state-error" style="padding:5px;"><div class="ui-icon ui-icon-alert float_left margin-right:1em;"></div>Once you drop this team, it will no longer exist in the database.  This procedure cannot be undone.</div>');

	                            $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
  								$('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
	                        },
	                    close : function ()
	                        {
	                            var dialog_object = $(this);

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

   				
   			});

    @endif
@stop

@section('page_functions') 	

	@if (!is_null($information['activity_program']))
		<a href="{{ url('/forms/registration/dnc') }}" class="button back tooltip" style="font-size:9pt; margin-right: 8px;" title="Discard any unsaved changes and go back to the team selection page.">Back</a>				
		
	@else
		<a href="{{ $information['return_url'] }}" class="button close tooltip" style="font-size:9pt; margin-right: 8px;" title="Discard any unsaved changes and close this form.">Close</a>		
	@endif

@stop


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


	{{-- Past Due Notice --}}
	@if ($information['is_past_due'])
		<div class="online_form_late ui-state-error ui-corner-all">
			<span class="ui-icon ui-icon-alert" style="display:inline-block; position:relative; top:2px;"></span>
			This form was due by {{ date('g:i A l, F j, Y', strtotime($information['activity_form']->due_at)) }} and is now past the deadline.  Please submit your entries now before the form closes and becomes unavailable.
		</div>
	@endif

	<br />


	{{-- Activity Program Form Info --}}
	@if (!is_null($information['activity_program']))
		<img src="{{ asset('images/icons/dance_64px.png') }}" alt="" title="" class="activity_icon" />
		
		<!-- Timestamps/Submitter/Status Info -->		
		<div class="form_status">
			<div style="float: left;">
				Form #{{ $information['submission']->id }}
			</div>
			<div style="float: right;">
				@if ($information['submission']->data->complete)
					<img src="{{ asset('images/icons/check_mark_16px.png') }}" alt="" title="" style="width: 16px; vertical-align: middle;" /><span class="state"> Complete</span>
				@else
					<img src="{{ asset('images/icons/incomplete_16px.png') }}" alt="" title="" style="width: 16px; vertical-align: middle;" /><span class="state"> Incomplete</span>
				@endif
			</div>
			<dl>
				<dt>Created</dt>
				<dd>{{ date('g:i a m/d/Y', strtotime($information['submission']->created_at)) }}</dd>

				@if (!is_null($information['submission']->submitted_at))
					<dt>Submitted</dt>
					<dd>{{ date('g:i a m/d/Y', strtotime($information['submission']->submitted_at)) }}</dd>
				@endif

				<dt>Modified</dt>
				<dd id="updated_at">{{ date('g:i a m/d/Y', strtotime($information['submission']->updated_at)) }}</dd>

				<dt>User</dt>
				<dd id="updated_by">{{ $information['submitter']->getDisplayFullName() }}</dd>
			</dl>
		</div>
	@endif

	{{-- Title --}}
	<h1>			
		@if (is_null($information['current_stage']))
			Dance Registration
		@else
			@if (!is_null($information['activity_program']))
				{{ $information['activity_program']->name }}
			@endif
			{{ $information['stages'][$information['current_stage']]->title }}
		@endif
	</h1>

	<br />

	{{-- Instructions --}}	
	<div class="online_form_instructions ui-corner-all">
		<span class="ui-icon ui-icon-info" style="display:inline-block; position:relative; top:2px;"></span>
		
		@if (is_null($information['current_stage']))
			<b>This Form Is Closed</b>
			<br />
			<p>
				Entires are no longer being accepted.
			</p>
		@else
			<b>Instructions</b>
			<br />
			<ol>
				@if (is_null($information['activity_program']))
					<li>{{ implode('</li><li>', $information['stages'][$information['current_stage']]->instructions['preselect']) }}</li>
				@else
					<li>{{ implode('</li><li>', $information['stages'][$information['current_stage']]->instructions['form']) }}</li>
				@endif
			</ol>
		@endif

		<br />

		For questions, contact {{ $information['staff']->first_name }} {{ $information['staff']->last_name }} at (503) 682-6722 x239 or by e-mail to {{ Helpers::obfuscateEmailLink ($information['staff']->email) }}.  For technical assistance, you can email {{ Helpers::obfuscateEmailLink ("support@osaa.org") }}.
	</div>		

	<br />
	
	{{-- Error Information --}}
	@if (Session::has('errors'))                
        <div class="ui-state-error" style="padding: 2px 4px;">
			<span class="ui-icon ui-icon-alert" style="display:inline-block; position:relative; top:2px;"></span>
        	@foreach ($errors->all() as $error){{ $error }} @endforeach
        </div>
        <br />
    @endif

    {{-- Stages --}}
    @if (is_null($information['activity_program']))

    	<div class="columns">			
			
			@foreach ($information['stages'] as $stage)

				<div class="ui-corner-all"
					 style="float: left;
					 		width: 29%;
					 		border: 1px solid {{ $stage->colors[$stage->status]['border'] }};
					 	    background-color: {{ $stage->colors[$stage->status]['background'] }};
					 	    height: 150px;
					 	    text-align: center;
					 	    padding: 1em 0.5em;
					 	    position: relative;
					 	    margin-right: 2.5%;">
					<div style="font-size: 26pt; position: absolute; top: 0.4em; left: 0.15em; color: #d5d7d7;">
						{{ $stage->step }}
					</div>
					<div style="font-size: 14pt; padding-bottom: 1em; border-bottom: 2px solid #d9e1e0; margin-bottom: 1em;">
						{{ $stage->title }}
					</div>
					<b>
						@if ($stage->status < 0)
							Starts {{ date('n/j/Y', strtotime($stage->open_at)) }}
						@elseif ($stage->status > 0)
							Closed {{ date('n/j/Y', strtotime($stage->due_at)) }}
						@else
							Open now through {{ date('n/j/Y', strtotime($stage->due_at)) }}
						@endif
					</b>
					<br /><br />
					{{ $stage->body }}
				</div>

			@endforeach

		</div>

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

    @endif

    
    {{-- Form --}}
    @if (is_null($information['activity_program']))
    	
    	{{-- Need to select an activity program --}}		
		<h2>Available Schools</h2>		
		
		{{ Form::open(array('url'    => url('/forms/registration/' . strtolower($information['activity']->slug)),
						    'method' => 'GET',
						    'style'  => 'position: relative;')) }}		
			
			<select style="font-size: 12pt; min-width: 315px;" name="activity_program">
				@foreach ($information['aps_list'] as $value => $name)
				
					@if (in_array($value, $information['disabled_aps_list']))
						<option value="{{ $value }}" disabled="disabled">{{ $name }}</option>
					@else
						<option value="{{ $value }}">{{ $name }}</option>
					@endif

				@endforeach
			</select>

			{{ Form::submit('Next', array('class' => 'button',
										  'style' => 'font-size: 9pt; margin-left: 30px;')) }}

			<img src="{{ asset('/images/icons/waiver_action_icon_48px.png') }}" class="action_item" alt="" title="" style="position: absolute; top: -12px; left: 425px;" data-direction="left" />			
			

		{{ Form::close() }}    				

    @else
	
		{{-- An activity program is selected --}}
		{{ Form::open(array('url'    => url('/forms/submit'),
						    'method' => 'post',
						    'class'  => 'registration_form')) }}

			{{ Form::hidden('form', 'REGISTRATION') }}			
			{{ Form::hidden('activity', $information['activity']->slug) }}
			{{ Form::hidden('activity_program', $information['activity_program']->id) }}
			{{ Form::hidden('current_stage', $information['current_stage']) }}	

			<!-- Sub-Division Select -->
			<h2>Division <span class="required_marker" style="margin-left: 0;">*</span></h2>	
			<p class="gray note">Please select the applicable division your team will compete in.</p>
			
			<div class="columns button_set">

				@foreach ($information['sub_divisions'] as $number => $sd)

					<div class="sixth">							
						<input type="radio"
			                   id="radio_{{ $number }}"
			                   name="sub_division"
			                   value="{{ $sd->title }}"
			                   data-max-roster="{{ $sd->max }}"
			                   @if (!is_null($information['submission']) and Helpers::strEqual($information['submission']->data->sub_division, $sd->title))
			                   	checked="checked"
			                   @endif
			                   />
			            <label for="radio_{{ $number }}" style="height: 4em; width: 100%;">
			            	{{ $sd->title }}<br />
			            	<span style="font-weight: normal; font-size: smaller;">{{ $sd->size }}</span>
			           	</label>
					</div>				

				@endforeach

			</div>

			<br class="clear" /><br />			
			<div class="horizontal_divider" style="width: 100%;"></div>
			<br />

			<!-- Coach Information -->
			<h2>Coaches &amp; Certifications</h2>	
			<p class="gray note">
				The following information is provided by your school's Athletic Director or AD Secretary.  A Head Coach with an e-mail address and a phone number is required for this form to be submitted.  Only one (1) Head Coach will appear in the program with up to four (4) optional Assistant Coaches.  <b>To add, modify, or remove information in this table, contact your AD or AD Secretary.</b>
			</p>

			<table class="coach_table">
				<thead>
					<tr>
						<th>Position</th>						
						<th>Name</th>
						<th>E-Mail</th>
						<th>Phone</th>
						<th style="position: relative; width: 440px;">
							Certifications
							<img src="{{ asset('/images/icons/information_16px.png') }}" alt="" title="" class="cert_info" />
						</th>
					</tr>
				</thead>

				<tbody>
					@if (!is_null($information['ap_staff']->coach))
						<tr>
							<td>Head Coach</td>							
							<td>
								@if (Helpers::strEqual($information['ap_staff']->coach->certification_status, 'OK'))
									<img src="{{ asset('/images/icons/certification_ok_16px.png') }}" alt="" style="vertical-align: middle; margin-right: 4px;" title="This staff is wholly certified." />
								@elseif (Helpers::strEqual($information['ap_staff']->coach->certification_status, 'WARNING'))
									<img src="{{ asset('/images/icons/certification_warning_16px.png') }}" alt="" style="vertical-align: middle; margin-right: 4px;" title="This staff is certified, but a training course is about to expire within the next three months." />
								@else
									<img src="{{ asset('/images/icons/certification_alert_16px.png') }}" alt="" style="vertical-align: middle; margin-right: 4px;" title="This staff is missing a required certification." />
								@endif
								{{ $information['ap_staff']->coach->school_staff->getDisplayName() }}
							</td>
							<td>{{ $information['ap_staff']->coach->school_staff->email }}</td>
							<td style="line-height: 1.1em;">
								@if (!is_null($information['ap_staff']->coach->school_staff->work_phone))
									W: {{ $information['ap_staff']->coach->school_staff->getDisplayPhone('WORK') }}							
									@if (!is_null($information['ap_staff']->coach->school_staff->mobile_phone))
										<br />
									@endif
								@endif
								@if (!is_null($information['ap_staff']->coach->school_staff->mobile_phone))
									M: {{ $information['ap_staff']->coach->school_staff->getDisplayPhone('MOBILE') }}
								@endif
							</td>
							<td>
								@foreach ($information['ap_staff']->coach->certs as $cert)

									<br />
<b>Fatal error</b>:  Cannot break/continue 1 level in <b>/home/osaa/web_app/dev/app/views/forms/dnc_registration.blade.php</b> on line <b>1513</b><br />