/*
 * Remove bottom margin from the last matches in each round
 */
$('.round .match:last-of-type').css('margin-bottom', '0');

/*
 * Hide hidden matches
 */
$('.match[data-hidden="true"]').each(function()
{
    var match = $(this);
    var participants = $('.participant', match);
    var inner = $('.inner', match);    
    
    @if (Auth::check() and Auth::user()->isOsaaUser())
        $(inner).css('border-color', '#cccccc');
        $(inner).css('color', '#cccccc');        
        $(participants).css('color', '#cccccc');        
    @else
        /*$(participants).html('');
        $(inner).html('');

        $(inner).css('border', 'none');
        var height = $(inner).height();      

        $(inner).height(height + 2);*/

        $(match).css('visibility', 'hidden');

    @endif    
});




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

    /*
     * Toggle inclement weather button
     */
    $('img.toggle_inclement')
        .hover(function ()
        {
            $(this).css({'cursor' : 'pointer'});
        },
        function ()
        {
            $(this).css({'cursor' : ''});
        })
        .tooltip({content:'Toggle inclement weather schedule.'})
        .click(function ()
        {
            var button = $(this);
            var new_value = button.attr('data-inclement');
            var value = 0;

            if (new_value == 'true')
            {
                value = 1;
            }

            $('<div></div>')
                .appendTo('body')
                .html('<br /><img src="{{ asset('images/icons/help_24px.png') }}" class="float_left" style="margin: 0.25em 1em 0.5em 0;" alt="" title="" />Are you sure you want to toggle the inclement weather schedule?<div style="font-size: 9pt; margin-top: 2.25em;">This will turn the inclement weather schedule on or off.</div>')
                .dialog(
                {
                    autoOpen: true,
                    draggable: false,
                    resizable: false,
                    height: 'auto',
                    width: 400,
                    title: 'Confirm',
                    modal: true,
                    buttons: [
                    {
                        text : "Yes",
                        'class' : "float_left",
                        icons : { primary : 'ui-icon-check'},
                        click : function()
                        {   
                            $('<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 />Toggling...<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 process and update the database.</div>');

                            var jqxhr = $.ajax(
                            {
                                type : 'POST',
                                url : '/brackets/toggle-inclement-weather',
                                data :
                                {
                                    'bracket' : {{ $information['bracket']->bracket->id }},
                                    'value' : value
                                },
                                dataType : 'html',                                
                                error : function ()
                                {
                                    alert ('There was an error toggle the inclement weather schedule.  This page will now reload.');
                                },
                                complete : function ()
                                {
                                    location.reload();
                                }
                            });

                            $(this).dialog("close");
                            $(this).remove();
                        }
                    },
                    {
                        text : "No",
                        'class' : "float_right",
                        icons : { primary : 'ui-icon-cancel'},
                        click : function()
                        {
                            $(this).dialog("close");
                            $(this).remove();
                        }
                    }],
                    open : function ()
                    {                   
                        $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
                        $('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');                    
                    }
                });

        });


    /*
     * Publish bracket button
     */
    $('.button.publish_this_bracket')
        .click(function ()
        {
            $('<div></div>')
                .appendTo('body')
                .html('<br /><img src="{{ asset('images/icons/help_24px.png') }}" class="float_left" style="margin: 0.25em 1em 0.5em 0;" alt="" title="" />Are you sure you want to publish this bracket?<div style="font-size: 9pt; margin-top: 2.25em;">This will allow the bracket to be viewed by the public.</div>')
                .dialog(
                {
                    autoOpen: true,
                    draggable: false,
                    resizable: false,
                    height: 240,
                    width: 400,
                    title: 'Confirm Publish',
                    modal: true,
                    buttons: [
                    {
                        text : "Yes",
                        'class' : "float_left",
                        icons : { primary : 'ui-icon-check'},
                        click : function()
                        {   
                            $('<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 />Publishing...<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 process and update the database.</div>');

                            var jqxhr = $.ajax(
                            {
                                type : 'POST',
                                url : '/brackets/publish-bracket',
                                data :
                                {
                                    'bracket' : {{ $information['bracket']->bracket->id }}                                
                                },
                                dataType : 'html',                                
                                error : function ()
                                {
                                    alert ('There was an error publishing this bracket.  This page will now reload.');
                                },
                                complete : function ()
                                {
                                    location.reload();
                                }
                            });

                            $(this).dialog("close");
                            $(this).remove();                                                                      
                        }
                    },
                    {
                        text : "No",
                        'class' : "float_right",
                        icons : { primary : 'ui-icon-cancel'},
                        click : function()
                        {
                            $(this).dialog("close");
                            $(this).remove();
                        }
                    }],
                    open : function ()
                    {                   
                        $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
                        $('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');                    
                    }
                });
        });





    /*
     * Reset bracket button
     */
    $('.reset_bracket_button')
        .button(
        {
            icons : 
            {
                primary : 'ui-icon-trash',
                secondary : 'ui-icon-alert'
            }
        })
        .css('font-size', '8pt')
        .css('margin-top', '0.25em')
        .addClass('float_right');
    $('.reset_bracket_button .ui-button-icon-primary').css('top', '9px');
    $('.reset_bracket_button .ui-button-icon-secondary').css('top', '10px');
    $('.reset_bracket_button')
        .click(function ()
        {
            $('<div></div>')
                .appendTo('body')
                .html('<br /><img src="{{ asset('images/icons/help_24px.png') }}" class="float_left" style="margin: 0.25em 1em 0.5em 0;" alt="" title="" />Are you sure you want to reset this bracket and clear all of the participants?<div style="font-size: 9pt; margin-top: 2.25em;">This will clear out all tennis participants from this bracket and reset it to the default, blank template.<br /><br /><b>Note:</b> This cannot be undone.</div>')
                .dialog(
                {
                    autoOpen: true,
                    draggable: false,
                    resizable: false,
                    height: 280,
                    width: 400,
                    title: 'Confirm Reset',
                    modal: true,
                    buttons: [
                    {
                        text : "Yes",
                        'class' : "float_left",
                        icons : { primary : 'ui-icon-check'},
                        click : function()
                        {   
                            $('<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 />Clearing...<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 process and update the database.</div>');

                            var jqxhr = $.ajax(
                            {
                                type : 'POST',
                                url : '/brackets/reset-bracket',
                                data :
                                {
                                    'bracket' : {{ $information['bracket']->bracket->id }}                                
                                },
                                dataType : 'html',                            
                                complete : function ()
                                {                                
                                    location.reload();   
                                }
                            });

                            $(this).dialog("close");
                            $(this).remove();                                                                      
                        }
                    },
                    {
                        text : "No",
                        'class' : "float_right",
                        icons : { primary : 'ui-icon-cancel'},
                        click : function()
                        {
                            $(this).dialog("close");
                            $(this).remove();
                        }
                    }],
                    open : function ()
                    {                   
                        $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
                        $('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
                        $('.ui-dialog-titlebar').addClass('ui-state-highlight');
                    }
                });  
        });

    /*
     * Remove the edit special match button
     */
    $('.edit_special_match').remove();    

    /*
     * Show/Hide the list of qualifiers
     */
    $('#seed_tools img.toggle')
        .click(function ()
      	{
        		var box = $('#seed_list');

        		if (box.css('right') == '-302px')
        		{
        		 	box.animate({right: '0px'}, 800);
        		}
        		else
        		{
        		 	box.animate({right: '-302px'}, 800);
        		}  	  
      	})
      	.hover(function ()
      	{
        		$(this).css('cursor', 'pointer');
        		$(this).attr('src', '{{ asset('/images/icons/gear_glow_48px.png') }}');
      	},
      	function ()
      	{
      		  $(this).attr('src', '{{ asset('/images/icons/gear_48px.png') }}');
      	});


    /*
     * Make the list of qualifiers draggable
     */
    $('#seed_list .draggable')
        .draggable(
        {
            handle : '.grabber',
            revert : true,
            stack : '#seed_list .participant',
            start : function (event, ui)
            {
                $('.round.zero .match .participant[data-participant=""]').droppable(
                {
                    activeClass : 'ui-state-highlight',                                                   
                    accept : '.participant',
                    tolerance : 'pointer',
                    over : function ()
                    {
                        $(this).removeClass('ui-state-highlight');
                        $(this).addClass('ui-state-hover');
                    },
                    out : function ()
                    {
                        $(this).removeClass('ui-state-hover');
                        $(this).addClass('ui-state-highlight');
                    },
                    drop: function (event, ui)
                    {                    

                        var participant = $(this);
                        var item = ui.draggable;

                        participant.removeClass('ui-state-hover');                      

                        var participant_id = item.attr('data-participant');
                        
                        var match_id = $(this).parents('.match').attr('data-match');

                        var position = $(this).attr('data-position');
                        
                        var jqxhr = $.ajax(
                        {
                            type : 'POST',
                            url : '/brackets/plop-participant',
                            data :
                            {
                                'match' : match_id,
                                'participant' : participant_id,
                                'position' : position,
                                'activity' : '{{ $information['bracket']->bracket->activity }}'
                            },
                            dataType : 'html',
                            error : function ()
                            {
                                alert('There was an error saving this participant on the bracket.');
                            },
                            success : function ()
                            {                           
                                participant.attr('data-participant', participant_id);
                                participant.html(item.attr('data-line'));
                                participant.droppable('destroy');
                                item.remove();
                            },
                            complete : function ()
                            {
                                item.removeClass('ui-state-active');                            
                            }
                        });

                        item.fadeOut();
                    }
                })
                .css('border-width', '0');

                $('.round.zero .match .participant[data-participant=""]')
                    .css('border', 'none');

                $(this).addClass('ui-state-active');            
            },
            stop : function (event, ui)
            {     
                $(this).removeClass('ui-state-active');    
            }
        });  

    $('#seed_list .participant .grabber')
        .hover(function ()
        {
            $(this)
                .css('background-image', 'url("{{ asset('/images/icons/grab_affordance_hover_16px.png') }}")');
            
            $(this).parents('.participant')
                .css('cursor', 'pointer')
                .addClass('ui-state-hover');            
        },
        function ()
        {
            $(this)
                .css('background-image', 'url("{{ asset('/images/icons/grab_affordance_16px.png') }}")');            
            
            $(this).parents('.participant')
                .css('cursor', 'auto')
                .removeClass('ui-state-hover'); 
        });


    var swapping = false;

    var first_person;
    var second_person;

    $('.round .match .participant')
        .hover(function ()
        {
            $(this).css('cursor', 'n-resize');
            if (swapping)
            {
                $(this).css('outline', '1px solid #005fa9');
            }
        },
        function ()
        {
            if (swapping)
            {
                $(this).css('outline', '');
            }
        })    
        .click(function (event)
        {
            if (!swapping)
            {
                swapping = true;

                $(this).addClass('participant_hover');            

                $('<div id="swap_helper"></div>')
                    .insertAfter(this)
                    .html('Click another spot to swap with, ESC to cancel.')
                    .addClass('ui-dialog ui-widget ui-widget-content ui-corner-all ui-front ui-dialog-buttons ui-state-active')
                    .css('padding', '0.5em 1em')
                    .css('width', '325px')
                    .css('font-size', '9pt')
                    .position(
                    {
                        my : 'left+8 center',
                        at : 'right center',
                        of : this
                    });

                $('.round .match .participant').css('cursor', 'n-resize');

                first_person = $(this);

            }
            else
            {
                /* Prevent swapping someone with themselves or switching blank lines */            
                if ($(this).attr('data-participant') == $(first_person).attr('data-participant'))
                {
                    return false;
                }

                /* Prevent swapping between different rounds */
                if ($(this).parents('.round').attr('class') != $(first_person).parents('.round').attr('class'))
                {
                    console.log($(this).parents('.round'));
                    console.log($(first_person).parents('.round'));

                    return false;
                }

                second_person = $(this);

                swap(first_person, second_person);            
            }
        });

    function swap(first_person, second_person)
    {
        var first = new Object();
        first.match = (first_person.parents('.match')).attr('data-match');
        first.participant = first_person.attr('data-participant');
        first.position = first_person.attr('data-position');
        first.line = first_person.html();
        first.db_swapped = false;

        var second = new Object();
        second.match = (second_person.parents('.match')).attr('data-match');
        second.participant = second_person.attr('data-participant');
        second.position = second_person.attr('data-position');
        second.line = second_person.html();
        second.db_swapped = false;

        $('#swap_helper').html('Swapping ...');

        var jqxhr = $.ajax(
        {
            type : 'POST',
            url : '/brackets/plop-participant',
            data :
            {
                'match' : second.match,
                'participant' : first.participant,
                'position' : second.position,
                'activity' : '{{ $information['bracket']->bracket->activity }}'
            },
            dataType : 'html',
            error : function ()
            {
                alert ('There was an error saving the first selected participant.  This page will reload.');
                location.reload();
            },
            success : function ()
            {                           
                first.db_swapped = true;
                $('.match[data-match="' + second.match + '"] .participant[data-position="' + second.position + '"]')
                    .fadeOut(
                    {
                        complete : function ()
                        {
                            $(this)
                                .attr('data-participant', first.participant)
                                .html(first.line)                            
                                .fadeIn();                        

                            if ($(this).is('.ui-droppable'))
                            {
                                $(this).droppable('destroy');
                            }
                        }
                    });
            },
            complete : function ()
            {            
                var jqxhr2 = $.ajax(
                {
                    type : 'POST',
                    url : '/brackets/plop-participant',
                    data :
                    {
                        'match' : first.match,
                        'participant' : second.participant,
                        'position' : first.position,
                        'activity' : '{{ $information['bracket']->bracket->activity }}'
                    },
                    dataType : 'html',
                    error : function ()
                    {
                        alert ('There was an error saving the second selected participant.  This page will reload.');
                        location.reload();
                    },
                    success : function ()
                    {                           
                        second.db_swapped = true;
                        $('.match[data-match="' + first.match + '"] .participant[data-position="' + first.position + '"]')
                            .fadeOut(
                            {
                                complete : function ()
                                {
                                    $(this)
                                        .attr('data-participant', second.participant)
                                        .html(second.line)                                    
                                        .fadeIn();

                                    if ($(this).is('.ui-droppable'))
                                    {
                                        $(this).droppable('destroy');
                                    }                                    
                                }
                            });
                    },
                    complete : function ()
                    {            
                        resetSwapping();
                    }
                });
            }
        });

        /*console.log(first);*/
        /*console.log(second);*/
    }



    function resetSwapping()
    {    
        swapping = false;
        first_person = null;
        second_person = null;

        $('.round .match .participant').css('cursor', '');

        $('.round .match .participant')
            .removeClass('participant_hover')
            .css('background-color', '')
            .css('outline', '');

        $('#swap_helper')
            .fadeOut(
            {
                complete : function ()
                {
                    $(this).remove();
                }
            });
        
    }


    /*
     * Escape key resets all swapping
     */
    $(document)
        .keyup(function(e)
        {
            if (e.keyCode == 27)
            {
                resetSwapping();
            }
        });


    $('.match .inner')
        .hover(function ()
        {
            $(this)
                .css('cursor', 'pointer')
                .addClass('match_hover');        

        },
        function ()
        {
            $(this)
                .removeClass('match_hover')
                .css('cursor', '');
        })
        .click(function ()
        {
            resetSwapping();

            var inner = $(this);
            var match = $(this).parents('.match');

            $('<div></div>')
                .appendTo('body')            
                .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>')
                .dialog(
                {
                    autoOpen: true,
                    draggable: true,
                    resizable: false,
                    height: 350,
                    width: 850,
                    title: '{{ Session::get('division') }} - {{ (Helpers::strEqual($information['bracket']->bracket->activity, 'BTN')) ? 'Boys' : 'Girls' }} - {{ (Helpers::strEqual($information['subdivision'], 'S')) ? 'Singles' : 'Doubles' }} - Match ' + $('.number', inner).html(),
                    modal: true,
                    buttons: [
                    {
                        text : "Save",
                        'class' : "float_left",
                        icons : { primary : 'ui-icon-disk'},
                        click : function()
                        {   
                            var form = $('form', this);
                            
                            
                            if ($('[name="advance"]', form).is(':checked') && (!$('[name="top_win"]').is(':checked') && !$('[name="bottom_win"]').is(':checked')))
                            {
                                alert ('You must pick at least one winner in order to advance the participants in this match.');
                            }
                            else
                            {
                                form.submit();

                                $(this).dialog("close");
                                $(this).remove();
                            }
                                                                                                                                                  
                        }
                    },
                    {
                        text : "Reset Match",
                        'class' : "float_left",
                        'style' : "margin-left: 250px;",
                        icons : { primary : 'ui-icon-refresh'},
                        click : function()
                        {
                            var result = confirm('Are you sure you want to reset this match and clear out the participants, results, and revert to default settings?');

                            if (result == true)
                            {
                                /* Reset this match */
                                var match_id = $(match).attr('data-match'); 

                                var jqxhr = $.ajax(
                                {
                                    type : 'POST',
                                    url : '/brackets/matches/' + match_id + '/reset',
                                    dataType : 'html',
                                    success : function (data)
                                    {
                                        location.reload();
                                    },
                                    error : function ()
                                    {
                                        alert('There was an error, unable to reset this match.');
                                    },
                                    complete : function ()
                                    {

                                    }
                                });

                            }
                            else
                            {
                                /* Do nothing, canceled reset */
                            }
                        }
                    },
                    {
                        text : "Cancel",
                        'class' : "float_right",
                        icons : { primary : 'ui-icon-close'},
                        click : function()
                        {
                            $(this).dialog("close");
                            $(this).remove();
                        }
                    }],
                    open : function ()
                    {   
                        var match_id = $(match).attr('data-match');                    
                        var dialog = $(this);

                        var jqxhr = $.ajax(
                        {
                            type : 'GET',
                            url : '/brackets/matches/' + match_id,
                            dataType : 'html',
                            success : function (data)
                            {
                                dialog.html(data);
                            },
                            error : function ()
                            {
                                dialog.html('There was an error.');
                            },
                            complete : function ()
                            {
                                /*
                                 * Edit match participant
                                 */
                                $('[data-match-participant-id]', dialog).click(function(event)
                                {
                                    event.preventDefault();

                                    var link = $(this);

                                    $('<div></div>')
                                        .appendTo('body')            
                                        .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>')
                                        .dialog(
                                        {
                                            autoOpen: true,
                                            draggable: true,
                                            resizable: false,
                                            height: 400,
                                            width: 650,
                                            title: 'Edit Match Participant',
                                            modal: true,
                                            buttons: [
                                            {
                                                text : "Save",
                                                'class' : "float_left",
                                                icons : { primary : 'ui-icon-disk'},
                                                click : function()
                                                {   
                                                    var form = $('form', this);                                                    
                                                    
                                                    form.submit();                                                    
                                                }
                                            },                                            
                                            {
                                                text : "Cancel",
                                                'class' : "float_right",
                                                icons : { primary : 'ui-icon-close'},
                                                click : function()
                                                {
                                                    $(this).dialog("close");                                              
                                                }
                                            }],
                                            open : function ()
                                            {   
                                                var match_participant_id = $(link).attr('data-match-participant-id');                    
                                                var dialog = $(this);

                                                var jqxhr = $.ajax(
                                                {
                                                    type : 'GET',
                                                    url : '/brackets/match-participants/' + match_participant_id,
                                                    dataType : 'html',
                                                    success : function (data)
                                                    {
                                                        dialog.html(data);
                                                    },
                                                    error : function ()
                                                    {
                                                        dialog.html('There was an error.');
                                                    },
                                                    complete : function ()
                                                    {
                                                        // TODO: code an update display name function for typing
                                                    }
                                                });

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

                                });



                            }
                        });

                        $('.ui-dialog-buttonpane').css('padding', '0 0.5em').css('font-size', '10pt');
                        $('.ui-dialog-buttonpane .ui-dialog-buttonset').css('width', '100%');
                    }
                });  

        });



@else

     $('.match .inner')
        .hover(function ()
        {
            $(this)
                .addClass('match_hover'); 



        },
        function ()
        {
            $(this)
                .removeClass('match_hover');                
        });        

@endif

    $('.match .inner').tooltip(
    {
        items : "[data-match-card]:visible",
        content : function ()
        {
            var match_card = $('.match_card', $(this).parent());
            
            return match_card.html();
        }
    });