var carouselElements = [];
var carouselSpeed = 80;

trackView = function(Url) {
    //remove domain
    //Url = Url.replace($('base').attr('href'), '');
    if(pageTracker) {
        pageTracker._trackPageview(Url);
    }
};
trackEvent = function(Category, Action, Label) {
    if(pageTracker){
        pageTracker._trackEvent(Category, Action, Label);
    }
};
Array.prototype.in_array = function (value) {
    var i;
    for (i=0; i < this.length; i++) {
        if (this[i] == value) {
            return true;
        }
    }
    return false;
};


var SendForm = function() {
    return {
        char_limit : 500,
        loader: function(mode) {
            var LoaderElement = $('#send_loader');
            if('show' == mode) {
                LoaderElement.show();
            } else {
                LoaderElement.hide();
            }
        },
        charsLeft: function(textarea_element, update_span) {
            var current_value = $(textarea_element).val();
            if (current_value.length > this.char_limit) { // if too long...trim it!
                $(textarea_element).val(current_value.substring(0, this.char_limit));
                $('#'+update_span).html(0);
            }
            // otherwise, update 'characters left' counter
            else
                $('#'+update_span).html(this.char_limit - current_value.length);

        },
        updatePreview: function(textarea_element, preview_container) {
            var current_value = $(textarea_element).val()
            //current_value.replace("\r\n","<br />");
            current_value = current_value.replace(/(\r\n)|\n/g, "<br />")
            //todo = replace new lines with br
            $('#'+preview_container).html(current_value);
            Defaults.update();
        },
        updateName: function(name_field, preview_container) {
            //only if not logged in
            var current_value = $(name_field).val()
            $('#'+preview_container).html(current_value);
        },
        setCharacter: function(character, code) {
            //set value in form
            if (document.getElementById('character_holder')) {

                $('#character_holder').val(character);
                //set active image in preview
                $('#preview ul li').removeClass('active');
                $('#'+character).parent().addClass('active');
                //set default message
                $('#message_body').val(Defaults.getBody(character));
                $('.messageFooter').html(FOOTER_TEXT[character]);
                this.updatePreview($('#message_body'), 'preview_container');
                trackView('/characters/landing/view/' +character);

                // update the previewSignUp and previewLogo links tracking code part
                if(isNaN(code)){
                    code = 0;
                }
                var signUpUrl = $('#previewSignUp').attr('href');
                if(isNaN(signUpUrl.substr(-1))){
                    signUpUrl += code
                }
                else{
                    signUpUrl = signUpUrl.substr(0,signUpUrl.length-1) + code;
                }
                $('#previewSignUp').attr('href',signUpUrl);

                var logoUrl = $('#previewLogo').attr('href');
                if(isNaN(logoUrl.substr(-1))){
                    logoUrl += code
                }
                else{
                    logoUrl = logoUrl.substr(0,logoUrl.length-1) + code;
                }
                $('#previewLogo').attr('href',logoUrl);

                return false;
            }
            return true;
        },
        submit: function() {
            var Url = $('#frm_subscribe').attr('action') + '/p/ajax/1';
            var Data = $('#frm_subscribe').serialize();

            this.loader('show');
            $.ajax({
                  url: Url,
                  type: 'post',
                  timeout: '20000',
                  data: Data,
                  dataType: 'json',
                  error: this.onError,
                  success: this.onSuccess
              });
            return false;
        },
        onError: function() {
            Subscribe.loader('hide');
        },
        onSuccess: function(Response) {
            Subscribe.loader('hide');
            if(Response.Status && 'ok' == Response.Status ) {
                if(Response.Template) {
                    $('.main').html(Response.Template);
                    Defaults.init();
                }
            }
        }
        
    };
}();

var Picker = function() {
    return {
        _tries: 0,
        _contacts: [],
        _contactsLoaded: false,
        _selected_contacts: [],
        _select_contacts_index: -1,
        init: function() {
            if('1' == $('#init_picker').val()) {
                //fill selected contacts
                var emails = $('#id_emails').val().split(';');
                for(var i = 0; i < emails.length; i++) {
                    if('' != emails[i]) {
                        email_entry = emails[i];
                        if('"' == email_entry.substring(0,1)) {
                            email_entry = email_entry.substring(1);
                            email_name = email_entry.split('"');
                            if(2 == email_name.length) {
                                email_entry = {'name':email_name[0], 'email': email_name[1].replace(/[<>]/g, '')}
                            } else {
                                email_entry = {'name':'', 'email': email_entry.replace(/[<>]/g, '')}
                            }
                        } else {
                            email_entry = {'name':'', 'email': email_entry.replace(/[<>]/g, '')}
                        }
                        Picker._selected_contacts.push(email_entry);
                    }
                }
                Picker.drawSelected();
                $('#email_search').show();
                $('#id_emails').hide();
                $.ajax({
                    url: '/characters/contacts/',
                    type: 'get',
                    timeout: '20000',
                    dataType: 'json',
                    error: this.onContactsError,
                    success: this.onContactsSuccess
                });

                $('#email_search').keydown(function (k) {
                    if($('#suggestions li a').size() > 0){
                        if(k.keyCode == 38 || k.keyCode == 40) {
                            if(Picker._select_contacts_index > -1){
                                // up
                                if(k.keyCode == 38 && Picker._select_contacts_index > 0){
                                    Picker._select_contacts_index--;
                                }
                                // down
                                else if(k.keyCode == 40 && Picker._select_contacts_index < ($('#suggestions li a').size()-1) ){
                                    Picker._select_contacts_index++;
                                }
                            }
                            else{
                                Picker._select_contacts_index = 0;
                            }
//                            $('#suggestions li a').removeClass('select');
//                            $(['#suggestions li a:eq(',index,')'].join('')).addClass('select');

                            return false;
                        }
                        else if(k.keyCode == 13) {
                            $('#suggestions a.select').click();
                            return false;
                        }
                    }
                });
            }
        },
        onContactsError: function() {
        },
        onContactsSuccess: function(Response) {
            if(Response.Status && 'ok' == Response.Status) {
                // if contacts is empty try again
                if(0 == Response.contacts.length & 3 > Picker._tries) {
                    Picker.init();
                    Picker._tries++;
                } else {
                    Picker._contacts = Response.contacts
                    Picker._contactsLoaded = true;
                }
            }
        },
        search: function(InputField) {
            if (false === Picker._contactsLoaded) {
                Picker.init();
            }
            if('' != $(InputField).val()) {
                var Start = $(InputField).val();
                return_contacts = [];
                for (var i = 0; i < Picker._contacts.length; i++) {
                    var match = [];

                    name_parts = Picker._contacts[i].name.split(' ');
                    for (var n =0; n < name_parts.length; n++) {
                        if('' != name_parts[n] && false == match.in_array(name_parts[n].toUpperCase())) {
                            match.push(name_parts[n].toUpperCase());
                        }
                    }
                    var email_id = Picker._contacts[i].email.substring(0, Picker._contacts[i].email.indexOf('@'));
                    email_parts = email_id.split('_');
                    for (var e =0; e < email_parts.length; e++) {
                        if('' != email_parts[e] && false == match.in_array(email_parts[e].toUpperCase())) {
                            match.push(email_parts[e].toUpperCase());
                        }
                    }
                    email_parts = email_id.split('.');
                    for (e=0; e < email_parts.length; e++) {
                        if('' != email_parts[e] && false == match.in_array(email_parts[e].toUpperCase())) {
                            match.push(email_parts[e].toUpperCase());
                        }
                    }

                    //add full email and full name
                    match.push(Picker._contacts[i].email.toUpperCase());
                    match.push(Picker._contacts[i].name.toUpperCase());
                    //check if any match
                    for (var m = 0; m < match.length; m++) {
                        if(Start.toUpperCase() == match[m].substring(0, Start.length)) {
                            return_contacts.push(Picker._contacts[i]);
                            break;
                        }
                    }
                }
                return_contacts.push({'name': '', 'email': Start})
                var to_draw = return_contacts;
            } else {
                var Start = '';
                var to_draw = [];
            }
            Picker.draw(Start, to_draw);
        },
        draw: function(Start, Contacts) {

            var Container = document.createElement('ul');
            Container = $(Container);
            for(var i=0; i < Contacts.length; i++) {
                var ContactContainer = document.createElement('li');
                ContactContainer = $(ContactContainer);

                /*var Indent = document.createElement('div');
                Indent = $(Indent);
                Indent.addClass('indent');
                ContactContainer.append(Indent);*/

                var SelectLink = document.createElement('a');
                SelectLink = $(SelectLink);
                SelectLink.href = '#';
                SelectLink.click(Picker.generateSelect(Start, Contacts[i]));
                if(i == Picker._select_contacts_index){
                    SelectLink.addClass('select');
                }
                var LinkText = '';
                if ('' != Contacts[i].name) {
                    LinkText += '"'+Contacts[i].name +'" ';
                }
                LinkText += '&lt;'+Contacts[i].email+'&gt;';
                pattern = new RegExp(Start, "ig");
                var ReplaceString = '<strong>'+Start+'</strong>';
                LinkText = LinkText.replace(pattern, ReplaceString);
                SelectLink.html(LinkText);
                ContactContainer.append(SelectLink);

                Container.append(ContactContainer);
            }

            if(Contacts.length < Picker._select_contacts_index){
                Picker._select_contacts_index = -1;
            }

            $('#suggestions').empty();
            $('#suggestions').append($(Container));
            $('#suggestions').show();
        },
        generateSelect: function(Start, ContactEntry) {
            var func = function() {
                Picker.select(Start, ContactEntry);
                return false;
            }

            return func;
        },
        generateUnselect: function(Index) {
            var func = function() {
                Picker.unselect(Index);
                return false;
            }
            return func;
        },
        select: function(Start, ContactEntry) {
            //remove start and replace with contactEntry
            if(5 <= Picker._selected_contacts.length) {
                alert('You have already selected 5 contacts');
                $('#suggestions').empty();
                $('#suggestions').hide();
                $('#email_search').val('');
                return false;
            }
            //check that isn't already added
            for(var i = 0; i < Picker._selected_contacts.length; i++) {
                if (ContactEntry.email == Picker._selected_contacts[i].email) {
                    Picker.drawSelected();
                    return false;
                }
            }
            Picker._selected_contacts.push(ContactEntry);
            Picker.drawSelected();

            return false;

        },
        unselect: function(Index) {
            //redraw from selected contacts
            var new_selected = [];
            for (var i =0; i < Picker._selected_contacts.length; i++) {
                if(i != Index) {
                    new_selected.push(Picker._selected_contacts[i]);
                }
            }
            Picker._selected_contacts = new_selected;
            Picker.drawSelected();
            return false;
        },
        drawSelected: function() {
            $('#suggestions').empty();
            $('#suggestions').hide();
            $('#email_search').val('');
            $('#id_emails').val('');
            $('#selected_contacts').empty();
            for (var i = 0; i < Picker._selected_contacts.length; i++) {
                var SelectedContactContainer = document.createElement('li');
                SelectedContactContainer = $(SelectedContactContainer);

                var SelectedContact = document.createElement('a');
                SelectedContact = $(SelectedContact);
                SelectedContact.attr('id', i);
                SelectedContact.click(Picker.generateUnselect(i));
                SelectedContact.attr('href', '#');
                SelectedContact.html(Picker._selected_contacts[i].email);
                SelectedContactContainer.append(SelectedContact);

                $('#selected_contacts').append(SelectedContactContainer);
                var AppendValue = ';';
                if('' != Picker._selected_contacts[i].name) {
                    AppendValue += '"'+Picker._selected_contacts[i].name+'"';
                }
                AppendValue += '<'+Picker._selected_contacts[i].email+'>';
                $('#id_emails').val($('#id_emails').val() + AppendValue);
            }
        }
    }
}();

Defaults = function() {
    return {
        getBody: function(character) {
            //look in global
            if(MESSAGE_BODIES && MESSAGE_BODIES[character]) {
                return MESSAGE_BODIES[character].replace(/<br\s\/>/g,'\r\n');
            }
            return '';
        },
        update: function() {
            //set value in global
            if(MESSAGE_BODIES)
                MESSAGE_BODIES[$('#character_holder').val()] = $('#message_body').val().replace(/\r\n/g,'<br />')
        }

    }
}();
$(document).ready(function() {
    if(document.getElementById('message_body')) {
        SendForm.charsLeft($('#message_body'), 'char_count');
        $('.remainingChars').show();
        Picker.init();
    }
    initCarousel();
});

function initCarousel()
{
    $.each($('.carousel img'), function(i, val)
    {
        carouselElements[i] = $(val);
    });

    $('.carousel').css({height: 180, paddingTop: 0});
    $('.carousel img').css({width: 146, marginTop: 30});
    
    $('.carousel img').hover(function(e){
        var index = $('.carousel img').index(this);
        switch(index)
        {
            case 0:
                $.each(carouselElements, function(i, val)
                {
                        switch(i)
                        {
                            case 0:
                                carouselElements[i].stop().animate({width: 190, marginTop: 15}, carouselSpeed);
                                break;
                            case 1:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 2:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                            case 3:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                            case 4:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                        }
                });
                break;
            case 1:
                $.each(carouselElements, function(i, val)
                {
                        switch(i)
                        {
                            case 0:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 1:
                                carouselElements[i].stop().animate({width: 190, marginTop: 15}, carouselSpeed);
                                break;
                            case 2:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 3:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                            case 4:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                        }
                });
                break;
            case 2:
                $.each(carouselElements, function(i, val)
                {
                        switch(i)
                        {
                            case 0:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                            case 1:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 2:
                                carouselElements[i].stop().animate({width: 190, marginTop: 15}, carouselSpeed);
                                break;
                            case 3:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 4:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                        }
                });
                break;
            case 3:
                $.each(carouselElements, function(i, val)
                {
                        switch(i)
                        {
                            case 0:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                            case 1:
                                carouselElements[i].stop().animate({width: 120, marginTop: 40}, carouselSpeed);
                                break;
                            case 2:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 3:
                                carouselElements[i].stop().animate({width: 190, marginTop: 15}, carouselSpeed);
                                break;
                            case 4:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                        }
                });
                break;
            case 4:
                $.each(carouselElements, function(i, val)
                {
                        switch(i)
                        {
                            case 0:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                            case 1:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                            case 2:
                                carouselElements[i].stop().animate({width: 130, marginTop: 40}, carouselSpeed);
                                break;
                            case 3:
                                carouselElements[i].stop().animate({width: 150, marginTop: 30}, carouselSpeed);
                                break;
                            case 4:
                                carouselElements[i].stop().animate({width: 190, marginTop: 15}, carouselSpeed);
                                break;
                        }
                });
                break;
        }
    },
    function(e)
    {
        $.each(carouselElements, function(i, val)
        {
            carouselElements[i].stop().animate({width: 146, marginTop: 30}, carouselSpeed);
        });
    })
}

$(function() {
    $("#message_body").keyup(function(event) {

        if(event.keyCode == 8)
            return;

        var jq_previewContainerElem = $("#preview_container");
        var height = jq_previewContainerElem.height();

        var currentValue, newValue;
        while(height > 196) {

            currentValue = $(this).val();
            newValue = currentValue.substring(0, currentValue.length-1);

            $(this).val(newValue);
            height = jq_previewContainerElem
                .html(newValue.replace(/(\r\n)|\n/g, "<br />"))
                .height();
        }
    });
});