﻿"use strict";
var LiveChat = function() {

    var scope, config = {}, state = { errorcount: 0, currentpublishsequence: 0 }, timer;

    var handleResponse = function(m, i) {

        var message = scope.MessageCenter.parseMessage(m[i]);
        var delay = scope.config.animationDuration + scope.config.animationDelay;

        if (i < m.length - 1) {

            scope.MessageCenter.add(message, m[i]);
            setTimeout(function() {

                handleResponse(m, i += 1);

            }, 1200);

        } else if (i === m.length - 1) {

            scope.MessageCenter.add(message, m[i], startTimer);

        }
    };
    var stopTimer = function() {

        clearTimeout(timer);

    };

    var startTimer = function() {

        timer = setTimeout(LiveChat.update, scope.config.updatedelay);
        $(scope.config.feedbackContainer).removeClass(scope.config.loadingClass);

    };

    var _public = {
        init: function(settings) {

            this.config = $.extend({
                messageHolder: 'div#messagetray',
                messageSpacing: '20',
                feedbackContainer: 'div#ajaj-controls',
                loadingClass: 'loading',
                updatedelay: 5000
            }, settings || {});

            scope = this;

            if ($('div#swt-archive').exists()) {
                // Archive page
            } else if ($('div#swt-live-feed').exists()) {
                // Live feed page - feed
                if (!$(scope.config.feedbackContainer + ' a').length) { return false };
                state.currentpublishsequence = $(scope.config.feedbackContainer + ' a').hide().attr('class').replace(/sequence-/, '');
                scope.MessageCenter.init(scope);
                startTimer();
            } else if ($('div#swt-question').exists()) {
                // Question page - init counter
                scope.QuestionSubmission.init();
            }

        },
        update: function() {

            $(scope.config.feedbackContainer).addClass(scope.config.loadingClass);

            $.ajax({
                type: "POST",
                url: "/ws/Messages.asmx/GetLatest",
                data: '{PublishSequence:"' + state.currentpublishsequence + '"}',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {

                    if (!msg.d.Error) {

                        scope.config.updatedelay = parseInt(msg.d.NextCheck) * 1000;

                        if (msg.d.Messages.length > 0) {

                            var $noquestions = $(scope.config.noquestionscontainer);

                            if ($noquestions.exists()) {
                                $noquestions.hide();
                            }

                            state.currentpublishsequence = msg.d.Messages[msg.d.Messages.length - 1].PublishSequence;

                            handleResponse(msg.d.Messages, 0);

                        } else {

                            startTimer();

                        }

                    } else {

                        state.errorcount += 1;

                        if (state.errorcount < scope.config.errorthreshold) {
                            startTimer();
                        } else {

                            scope.revert();

                        }

                    }

                },
                error: function() {

                    scope.revert()

                }
            });

        },
        revert: function() {

            // show refresh button & any other feedback
            $(scope.config.feedbackContainer + ' a').show();

        }
    };

    return _public;
} ();

LiveChat.QuestionSubmission = function() {

    var curChar = 0, config = {
        textarea : 'textarea#Submit1_txtMessage',
        feedbackarea : 'span#char_cnt',
        maxChar : 1000
    }
    
    var _public = {
        init : function() {
            
            updateTotal();
            $(config.textarea).keypress(updateTotal).keyup(updateTotal);
            
        }
    };
    
    var updateTotal = function() {
    
        var val = $(config.textarea).val();
        
        curChar = config.maxChar - val.length;
        
        var status = curChar <= 0 ? 'negative' : 'positive';
        var style = curChar <= 0 ? 'color:red;' : '';
        
        $(config.feedbackarea).text(curChar).attr('class', status).attr('style', style);
        
    };
    
    return _public;
} ();

LiveChat.MessageCenter = function() {

    /*var scope, mc, template = '<div class="question_box">\
            <div class="arrow">\
                <a onclick="show_hide(this,\'id_answer_@Id@\'); return false;" href="javascript:;"><img width="15" height="15" alt="" src="images/off_arrow.gif"></a>\
            </div>\
            <div class="question">\
                <p class="q_no">Question: @PublishSequence@</p>\
                <p class="q_text">@Question@</p>\
                <p class="q_posted_by">Posted @Name@ @Created@</p>\
            </div>\
            <div style="display: none;" id="id_answer_@Id@" class="answer">\
                <p class="ans_caption">Answer:</p>\
                <div class="ans_text">@Answer@</div>\
                <div class="bottom clearfix"><p><a href="#">Back to top</a></p></div>\
            </div>\
        </div>';
*/


   var scope, mc, template = '\
              <div class="faqquestion closed">\
                <a href="#" class="question">\
                  <p class="q_no">Question: @PublishSequence@</p>\
                  <p class="q_text">@Question@</p>\
                  <p class="q_posted_by">Posted  @Name@ @Created@</p>\
                </a>\
                <div class="response"  id="id_answer_@Id@">\
                  <div class="answer">\
                    <p class="ans_caption">Answer:</p>\
                    <div class="ans_text">@Answer@</div>\
                  </div>\
                  <div class="feedback clearfix">\
                    <div class="totop">\
                      <a href="#">Back to top</a>\
                    </div>\
                  </div>\
                </div>\
              </div>';
  

    var _public = {
        init: function(s) {

            scope = s;
            mc = this;

        },
        parseMessage: function(m) {

            var name = m.Name == '' ? '' : 'by ' + m.Name;

            var message = template.replace(/@Id@/g, m.Id).replace(/@PublishSequence@/g, m.PublishSequence).replace(/@Name@/, name).replace(/@Created@/, m.Created).replace(/@Answer@/, m.Answer).replace(/@Question@/, m.Question);

            return message;
        },
        add: function(message, m, callback) {

            callback = typeof (callback) === undefined ? function() { } : callback;

            var $message = $(message).css({
                position: 'absolute',
                top: '-1000px',
                left: '-1000px',
                width: '470px'
            });

            $container = $(scope.config.messageHolder);
            $container.prepend($message);

            $message.find('a.question').click(function() { $(this).parent().toggleClass('closed'); return false; })

            var height = $message.height();

            $container.css({
                marginTop: -height - scope.config.messageSpacing
            });

            $message.attr('style', '');

            $container.animate({ marginTop: 0 }, scope.config.animationDuration, callback);

        }
    };

    return _public;
} ();

$(function() {

    $("div#messagetray .faqquestion").toggleClass('closed');
    $("div#messagetray .faqquestion a.question").click(function() { $(this).parent().toggleClass('closed'); return false; })

    // This is where any setting should be changed.
    var settings = {
        messageHolder: 'div#messagetray',
        messageSpacing: '10',
        feedbackContainer: 'div#ajaj-controls',
        loadingClass: 'loading',
        updatedelay: 1000,
        errorthreshold: 2,
        noquestionscontainer: 'div.live-no-messages',
        animationDuration: 1000, // duration of message the slidedown
        animationDelay: 300 // time between adding queued messages
    };
    LiveChat.init(settings);
});

// jQuery Helpers
$.fn.outerHTML = function() {
    return $('<div>').append(this.eq(0).clone()).html();
};
$.fn.exists = function() {
    return $(this).length > 0;
};
