/* 
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */

jQuery.browser.android = /Android/.test( navigator.userAgent );
jQuery.browser.iphone = /Mobile.*Safari/.test(navigator.userAgent) || /iphone/i.test(navigator.userAgent);
jQuery.browser.iphoneWebkit = jQuery.browser.iphone && !/Version/i.test(navigator.userAgent);

jQuery.browser.msie = $.browser.msie && /MSIE/i.test(window.navigator.userAgent);
jQuery.browser.msie6 = $.browser.msie && /MSIE 6.0/i.test(window.navigator.userAgent) && !/MSIE 7.0/i.test(window.navigator.userAgent);
jQuery.browser.msie7 = $.browser.msie && /MSIE 7.0/i.test(window.navigator.userAgent);

//Iphone WebView: Mozilla/5.0 (IPhone: U; CPU iPhone OS 2_1 like Mac OS X; en-us) AppleWebKit/525.18.1 (KHTML, like Gecko) Mobile/5F136

var IMAGE_LOAD_TIMEOUT = 8000;
var IMAGE_CORNERING_TIMEOUT = 700;

checkIe6();
function checkIe6(){
    //IE6의 경우 경고 메시지를 띄워준다.
    if( jQuery.browser.msie6 ){
        window.location = "/errors/ie6.html";
    }
}

var cornersOnload = window.onload;
window.onload = setCorneredRound;

function setCorneredRound(){
    if(cornersOnload) cornersOnload();
    if(jQuery.browser.msie){
        addRoundedIECorners();
    }else {
        addRoundedCorners();
    }

    if($.browser.mozilla) {
        $("form").attr("autocomplete", "off");
    }

    $(".profilephotoImg").click(showProfileModal);
}

$(document).ready(function() {
    setTimeout("setCorneredRound()", IMAGE_CORNERING_TIMEOUT);
    if (navigator.userAgent.indexOf('iPhone') == -1){
        replaceEmoji();
    }
    function replaceEmoji(){
        $(".text").each(function(){
            $(this).html($.emoji.replace($(this).html()));
        })
    }

    setWindows();
    function setWindows(){
        //mobile safari의 경우 주소창을 자동으로 slideout 해준다.
        if (navigator.userAgent.indexOf('iPhone') != -1){
            addEventListener("load", function()
            {
                setTimeout(hideURLbar, 0);
            }, false);
        }
        function hideURLbar(){
            window.scrollTo(0, 1);
        }
        if( jQuery.browser.android || jQuery.browser.iphone ){
            $("#body").css("max-width", "480px");
        }
    }

    //google chrome frame install prompting
    

    // 배열에서 엘러먼트 포함 여부를 알려준다.
    Array.prototype.contains = function (element) {
        for (var i = 0; i < this.length; i++) {
            if (this[i] == element) {
                return true;
            }
        }
        return false;
    }
    //    Array.prototype.remove = function(element) {
    //        var tempArray = this;
    //        for (var i = 0; i < this.length; i++) {
    //            if (this[i] == element) {
    //
    //            }
    //        }
    //        return false;
    //    };

    function queryString(key) {
        hu = window.location.search.substring(1);
        gy = hu.split("&");
        for (i=0;i<gy.length;i++) {
            ft = gy[i].split("=");
            if (ft[0] == key) {
                return ft[1];
            }
        }
        return null;
    }

    /*
     * queryString에 persistCookie=true이면 messageReceivers를 제거한다.
     */
    function checkCookieRefresh(){
        if( $.jqURL.get("persistCookie") == null || $.jqURL.get("persistCookie") == "false" ){
            $.cookie('messageReceivers', null, {
                path: '/'
            });
            
            $.cookie('messageReceiversNickname', null, {
                path: '/'
            });

            $.cookie('returnURI', null, {
                path: '/'
            });

            $.cookie('messageContent', null, {
                path: '/'
            });
            $.cookie('replyMessageContent', null, {
                path: '/'
            });
            $.cookie('sourceType', null, {
                path: '/'
            });
            $.cookie('sourceURL', null, {
                path: '/'
            });
            $.cookie('latitude', null, {
                path: '/'
            });
            $.cookie('longitude', null, {
                path: '/'
            });
            $.cookie('publicFlag', null, {
                path: '/'
            });
            $.cookie('draft', null, {
                path: '/'
            });
            $.cookie('imageSearchKeyword', null, {
                path: '/'
            });
            $.cookie('imageSearchPage', null, {
                path: '/'
            });
            $.cookie('selectedMessageReceivers', null, {
                path: '/contacts'
            });
            $.cookie('selectedMessageReceiversNickname', null, {
                path: '/contacts'
            });
        }
    }
    checkCookieRefresh();
    
    $(".source_open_button").click(function(){
        var sourceId = $(this).attr("id").replace("source_open_button_","");
        $("#"+sourceId+"_div").toggle();
        if( $("#"+sourceId+"_div").css("display") == "none"){
            $("#source_toggle_button_" + sourceId).find("img").attr("src", "/images/common/btn_toggle_open.png");
        }else{
            $("#source_toggle_button_" + sourceId).find("img").attr("src", "/images/common/btn_toggle_close.png");
        }
    })
    /*
     * deprecated.  close버튼 없어졌음.
     */
    $(".source_close_button").click(function(){
        var sourceId = $(this).attr("id").replace("source_close_button_","");
        $("#"+sourceId+"_div").hide();
        $(this).hide();
    })

    $(".profilephotoImg").click(showProfileModal);

    $(".btn_show_participant").click(showParticipant);
    $(".btn_show_only_participant").click(showOnlyParticipant);
    $("#btn_close_participant").click(function(){
        toggleParticipantArea(false);
        $("#participantList").html("");
        $("#threadInfo").text("");
        $("#btn_add_participant").attr("href","javascript:;");
    });
    //participant area toggle functions end

    $(window).scroll(function(){
        $("#grayboxbg").css("top", $(window).scrollTop());
    });

    $("#btn_go_top").click(function(){
        $('html, body').animate({
            scrollTop:0
        }, 'fast');
    });
})
function showParticipant(e){
    //mouse 좌표를 받아 participant 뷰의 top 좌표를 바꿔준다.
    var relativeY = $(window).scrollTop();
    $("#onlineMember").css("top", relativeY);
    $("#grayboxbg").css("top", window.pageYOffset);
    //$("body").css("overflow","hidden");

    var messageId = ($(this).attr("id")).replace("_participant", "");
    $.post("/messages/participants?messageId=" + messageId, {}, function(data, textStatus){
        var receiversList = data.participants;
        if(textStatus == "success"){
            var receiversCount = receiversList.length;
            
            //var receiverListTemplate = "<li><img alt='' class='profilephotoImg corners' src='[PROFILEIMAGEPATH]' onclick='goProfile(\"[EXTERNALID]\")'/><span> [NICKNAME]</span></li>";
            var receiverListTemplate = "<li><img alt='' id='[EXTERNALID]_profile_button' class='profilephotoImg corners' src='[PROFILEIMAGEPATH]'/><span> [NICKNAME]</span></li>";
            var receiverListResultDom = "";
            var receiversListArray = new Array();
            for( var i = 0 ; i < receiversCount ; i++){
                receiverListResultDom += receiverListTemplate.replace("[NICKNAME]", (receiversList[i]).nickname).replace(/\[EXTERNALID\]/g, (receiversList[i]).externalId).replace("[PROFILEIMAGEPATH]",receiversList[i].profileImagePath);
                receiversListArray.push((receiversList[i]).externalId);
            }
            $("#participantList").html(receiverListResultDom);
            //people in this thread
            var secretFlag = data.secret;
            var secretSentence;
            if( secretFlag ){
                secretSentence = "이 타래는 <span id='publicLabel'>비공개</span> 타래입니다.";
            }else{
                secretSentence = "이 타래는 <span id='publicLabel'>공개</span> 타래입니다.";
            }
            $("#threadInfo").html(secretSentence + "<br/>" + "현재 이 대화에 <span id='participantCount'>"+receiversCount+"</span>명이 참여중 입니다.");
            $("#btn_add_participant").attr("href","/contacts/invitation?returnURI=%2Fmessages%2Fthread%3ForiginMessageId%3D" + messageId + "%26messageId=" + messageId + "&originMessageId=" + messageId + "&persistCookie=true");

            $("#receiversList").val(receiversListArray.join(","));

            $(".profilephotoImg").bind("click", showProfileModal);
            
            //setCorneredRound();
            setTimeout("setCorneredRound()", IMAGE_CORNERING_TIMEOUT);
        }else{
            alert("참여자를 가져오는데 실패하였습니다");
        }
    }, "json");
    toggleParticipantArea(true);
}
function showOnlyParticipant(e){
    //TODO 중복 제거
    //showParticipant와 중복 START
    //
    //mouse 좌표를 받아 participant 뷰의 top 좌표를 바꿔준다.
    var relativeY = $(window).scrollTop();
    $("#onlineMember").css("top", relativeY);
    $("#grayboxbg").css("top", window.pageYOffset);

    var messageId = ($(this).attr("id")).replace("_participant", "");
    $.post("/messages/participants?messageId=" + messageId, {}, function(data, textStatus){
        var receiversList = data.participants;
        if(textStatus == "success"){
            var receiversCount = receiversList.length;

            if( receiversCount == 0 ){
                alert("참여자가 없습니다.");
                return false;
            }

            toggleParticipantArea(true);
            //showParticipant와 중복 START
            $("#btn_add_participant").hide();

            var receiverListTemplate = "<li><img alt='' class='profilephotoImg corners' src='[PROFILEIMAGEPATH]' onclick='goProfile(\"[EXTERNALID]\")'/><span> [NICKNAME]</span></li>";
            var receiverListResultDom = "";
            var receiversListArray = new Array();
            for( var i = 0 ; i < receiversCount ; i++){
                receiverListResultDom += receiverListTemplate.replace("[NICKNAME]", (receiversList[i]).nickname).replace(/\[EXTERNALID\]/g, (receiversList[i]).externalId).replace("[PROFILEIMAGEPATH]",receiversList[i].profileImagePath);
                receiversListArray.push((receiversList[i]).externalId);
            }
            $("#participantList").html(receiverListResultDom);
            //people in this thread
            var secretFlag = data.secret;
            var secretSentence;
            if( secretFlag ){
                secretSentence = "이 타래는 <span id='publicLabel'>비공개</span> 타래입니다.";
            }else{
                secretSentence = "이 타래는 <span id='publicLabel'>공개</span> 타래입니다.";
            }
            $("#threadInfo").html(secretSentence + "<br/>" + "현재 이 대화에 <span id='participantCount'>"+receiversCount+"</span>명이 참여중 입니다.");
            $("#btn_add_participant").attr("href","/contacts/invitation?returnURI=%2Fmessages%2Fthread%3ForiginMessageId%3D" + messageId + "%26messageId=" + messageId + "&originMessageId=" + messageId + "&persistCookie=true");

            $("#receiversList").val(receiversListArray.join(","));

            //setCorneredRound();
            setTimeout("setCorneredRound()", IMAGE_CORNERING_TIMEOUT);
        }else{
            alert("참여자를 가져오는데 실패하였습니다");
        }
    }, "json");
}
//participant area toggle functions start
function toggleParticipantArea(showFlag){
    if(showFlag){
        $("#grayboxbg").show();
        //$("body").css("overflow","hidden");
        $("#onlineMember").show();
    }else{
        $("#grayboxbg").hide();
        //$("body").css("overflow","auto");
        $("#onlineMember").hide();
    }
}

function showProfileModal(e){
    var profileOwnerExternalId = ($(this).attr("id")).replace("_profile_button", "");
    var curUserId = $("#_curUserId_").val();
    if( curUserId == profileOwnerExternalId){
        return false;
    }

    if( $("#onlineMember").css("display") != "none" ){
        $("#onlineMember").hide();
    }

    var relativeY = $(window).scrollTop();
    var pageYOffset = window.pageYOffset;

    $.post("/profiles/"+profileOwnerExternalId+"?format=json", {}, function (data, textStatus) {
        if(textStatus == "success"){
            var profileOwner = data;
            $("#grayboxbg").show();
            $("#grayboxbg").css("top", relativeY);
            $("body").css("overflow","hidden");
            $("#userProfileArea").show();
            $("#userProfileArea").css("top", relativeY);
            var profilePopDom = "<div class='userprofileContentWrap'>"
            +"<div class='userprofileContents online'>"
            +"<div class='userprofile'>"
            +"<span class='userIcone' id='modalUserIcone'><img class='profilephotoImg corners' src='"+profileOwner.owner.profileImagePath+"'/></span>"
            +"<span class='userInfo'>"
            +"<strong>"+profileOwner.owner.nickname+"</span></strong><br/>"
            //+"<span class='lastLogin'>online now</span>"
            +"</span>"
            +"<span class='add_addressBook'><form method='post' action='/contacts/memberContacts/post' id='addAddressBookForm'><input type='hidden' name='memberExternalIdList' id='memberExternalIdList' value='"+profileOwner.owner.externalId+"'/><input type='image' src='/images/msg/btn_add_addressaBook.gif'/></form></span>"
            +"</div>"
            +"<div class='usergreetings'>"
            +"<p class='writerandtime'>"+profileOwner.todayMessage.date+"<span class='time'> "+profileOwner.todayMessage.time+"</span></p>"
            +"<p class='text'>"+$.emoji.replace(profileOwner.todayMessage.content)+"</p>"
            +"<b class='lt'></b><b class='rt'></b><b class='lb'></b><b class='rb'></b><b class='arrow'></b>"
            +"</div>"
//            +"<div class='usersPeople'>"
//            +"<p class='title'>"
//            +"<img alt='' src='/images/msg/ico_face.gif'/>"
//            +"<strong>"+profileOwner.owner.nickname+"</strong>의 사람들"
//            //                        +"<strong>"+profileOwner.owner.nickname+"</strong>'s friends"
//            +"</p>"
//            +"<p class='info'>"
//            +"<span>"+profileOwner.casterCount+"</span>명을 구독하고 있고 <br/>"
//            +"<span>"+profileOwner.listenerCount+"</span>명이 " + profileOwner.owner.nickname + "님을 구독하고 있습니다"
//            //            +"has<span> "+profileOwner.casterCount+"</span> writers and "
//            //            +"<span>"+profileOwner.listenerCount+"</span> readers."
//            +"</p>"
//            +"<b class='lt'></b><b class='rt'></b><b class='lb'></b><b class='rb'></b>"
//            +"</div>"
            +"<div class='utilBtn'>"
            //+"<a class='myhome' href='/profiles/"+profileOwner.owner.externalId+"'><img alt='' src='/images/en/msg/btn_goMyhome.gif'/></a><br/><a class='wmsg' id='" + profileOwner.owner.externalId + "_"+ profileOwner.owner.nickname +"' href='/messages/form?persistCookie=true'><img alt='' src='/images/en/msg/btn_writeMsg.gif'/></a><form action='/casters/post' method='post' id='addCasterForm'><input type='hidden' value='"+profileOwner.owner.externalId+"' name='casterExternalId' id='casterExternalId'/><input type='image' alt='' src='/images/en/msg/btn_fallow.gif'/></input></form>"
            //+"<a class='myhome' href='/profiles/"+profileOwner.owner.externalId+"'><img alt='' src='/images/msg/btn_goMyhome.gif'/></a><br/><a class='wmsg' id='" + profileOwner.owner.externalId + "___"+ profileOwner.owner.nickname +"' href='/messages/form?persistCookie=true'><img alt='' src='/images/msg/btn_writeMsg.gif'/></a><form action='/casters/post' method='post' id='addCasterForm'><input type='hidden' value='"+profileOwner.owner.externalId+"' name='casterExternalId' id='casterExternalId'/><input type='image' alt='' src='/images/msg/btn_fallow.gif'/></input></form>"
            +"<a class='myhome' id='" + profileOwner.owner.externalId + "___"+ profileOwner.owner.nickname +"' href='/messages/form?persistCookie=true'><img alt='' src='/images/msg/btn_writemessage.gif'/></a>"
            +"</div>"
            +"</div>"
            +"<p class='pop_close'><img src='/images/common/btn_pop_x.gif' onclick='closeModalProfile();' alt='닫기' /></p>"
            +"</div>"
            +"<script type='text/javascript'>"
            +"$('#addAddressBookForm').submit(addAddressBookFormSubmit);"
            +"$('#addCasterForm').submit(addCasterFormSubmit);"
            +"$('#"+profileOwner.owner.externalId + "___"+ profileOwner.owner.nickname+"').click(sendMessageToProfileOwner);"
            +"</script>";
            $("#userProfileArea").html(profilePopDom);

            setTimeout("setCorneredRound()", IMAGE_CORNERING_TIMEOUT);
        }else{
            alert("프로필 정보를 가져오는데 실패하였습니다.");
        }
    },"json");
    return false;
}

function closeModalProfile(){
    $("#grayboxbg").hide();
    $("body").css("overflow","auto");
    $("#userProfileArea").hide();
    $("#userProfileArea").html("");
}

function addAddressBookFormSubmit(){
    var memberExternalId = $("#memberExternalIdList").val();
    $.post("/contacts/memberContacts/post", {
        "memberExternalIdList":memberExternalId
    }, function(data, textStatus){
        if(textStatus == "success"){
            if( data.status == 401 ){ //로그인 유도
                alert("로그인 후 다시 시도해주세요.");
                document.location = "/signin";
            }else{
                alert(data.message);
            }
        }else{
            alert("주소록에 추가를 실패하였습니다.");
        }
    }, "json");
    return false;
}

function addCasterFormSubmit(){
    var memberExternalId = $("#casterExternalId").val();
    $.post("/casters/post", {
        "casterExternalId":memberExternalId
    }, function(data, textStatus){
        if(textStatus == "success"){
            if( data.status == 401 ){ //로그인 유도
                alert("로그인 후 다시 시도해주세요.");
                document.location = "/signin";
            }else{
                alert(data.message);
            }
        }else{
            alert("구독 설정에 실패하였습니다.");
        }
    }, "json");
    return false;
}

function sendMessageToProfileOwner(){
    var ownerInfo = $(this).attr("id");
    var ownerInfoAry = ownerInfo.split('___');
    $.cookie("messageReceivers", ownerInfoAry[0], {
        path:'/'
    });
    $.cookie("messageReceiversNickname", ownerInfoAry[1], {
        path:'/'
    });
}



// progress indicator with canvas start
/*
    function getLoading(context, bars, center, innerRadius, size, color) {
        var animating = true,
        currentOffset = 0;

        function makeRGBA(){
            return "rgba(" + [].slice.call(arguments, 0).join(",") + ")";
        }
        function drawBlock(ctx, barNo){
            ctx.fillStyle = makeRGBA(color.red, color.green, color.blue, (bars+1-barNo)/(bars+1));
            ctx.fillRect(-size.width/2, 0, size.width, size.height);
        }
        function calculateAngle(barNo){
            return 2 * barNo * Math.PI / bars;
        }
        function calculatePosition(barNo){
            angle = calculateAngle(barNo);
            return {
                y: (innerRadius * Math.cos(-angle)),
                x: (innerRadius * Math.sin(-angle)),
                angle: angle
            };
        }
        function draw(ctx, offset) {
            clearFrame(ctx);
            ctx.save();
            ctx.translate(center.x, center.y);
            for(var i = 0; i<bars; i++){
                var curbar = (offset+i) % bars,
                pos = calculatePosition(curbar);
                ctx.save();
                ctx.translate(pos.x, pos.y);
                ctx.rotate(pos.angle);
                drawBlock(context, i);
                ctx.restore();
            }
            ctx.restore();
        }
        function clearFrame(ctx) {
            ctx.clearRect(0, 0, ctx.canvas.clientWidth, ctx.canvas.clientHeight);
        }
        function nextAnimation(){
            if (!animating) {
                return;
            };
            currentOffset = (currentOffset + 1) % bars;
            draw(context, currentOffset);
            setTimeout(nextAnimation, 50);
        }
        nextAnimation(0);
        return {
            stop: function (){
                animating = false;
                clearFrame(context);
            },
            start: function (){
                animating = true;
                nextAnimation(0);
            }
        };
    }

    var canvas = document.createElement("canvas");
    canvas.width= 200;
    canvas.height = 200;
    canvas.style.cssText="position:absolute; top:100px; left:100px; background:#transparent; border: 3px solid red";
    document.body.appendChild(canvas);
    //context, bars, center, innerRadius, size, color
    var controller = getLoading(canvas.getContext("2d"), 30, {x:100, y:100}, 12, {width: 3, height:20}, {red: 0, green: 17, blue: 58});

    var button1 = document.createElement("input");
    button1.value="stop";
    button1.type="button";
    button1.onclick = function (){
        controller.stop();
    };
    document.body.appendChild(button1);

    var button2 = document.createElement("input");
    button2.value="start";
    button2.type = "button";
    button2.onclick = function (){
        controller.start();
    };
    document.body.appendChild(button2);
    */
// progress indicator with canvas end


function getMessageInvitationPackMarkup(invitationMessage, showSource, curUserExternalId){
    var message = invitationMessage.originMessage;
    var mediaListTemplate = "<div class='invite rbox_darkgray_corner'>"
    + "<p class='suvject'><strong>[INVITATIONSENDERNICKNAME]</strong>님이 타래에 초대하셨습니다.</p>"
    //    + "<p class='suvject'><strong>[INVITATIONSENDERNICKNAME]</strong> invites you to this thread.</p>"
    + "<div class='textarea'>"
    + "<p class='writerandtime'><strong>[SENDERNICKNAME]</strong><span class='time'>[CREATEDAT]<input type='hidden' id='[MESSAGEID]_createdAt' value='[CREATEDATORIGIN]' /></span></p>"
    + "<a class='msglink' href='[MESSAGELINK]'><p class='text'>[MESSAGECONTENT]</p></a>"
    + "</div>"
    + "<div class='join'>[MEMBERCOUNT]</div>"
    + "[ORIGINMESSAGEAREA]"
    + "<b class='lt'></b><b class='rt'></b><b class='lb'></b><b class='rb'></b>"
    + "</div>";


    //    <%if( _latestSiblingMessage.getOriginMessage() == null ){%>
    //    <%=_latestSiblingMessage.getReceiversCountForView()+1%>
    //    <%}else{%>
    //    <%=_latestSiblingMessage.getOriginMessage().getReceiversCountForView()+1%>
    //    <%}%>
    //    <%if( _latestSiblingMessage.getOriginMessage() != null ){%>
    //    <%}%>
    var mediaListResultDom = mediaListTemplate.replace("[MESSAGEID]",invitationMessage.id)
    .replace("[CREATEDATORIGIN]",invitationMessage.createdAtOrigin)
    .replace("[MESSAGECONTENT]",$.emoji.replace(message.content))
    .replace("[INVITATIONSENDERNICKNAME]", invitationMessage.sender.nickname)
    .replace("[SENDERNICKNAME]", message.sender.nickname)
    .replace("[CREATEDAT]", message.createdAt);
    if( message.originMessage != null && message.originMessage != "" && message.originMessage != undefined){
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.originMessage.id+ "&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[ORIGINMESSAGEAREA]","<div class='chatSubject'><p><strong>" + message.originMessage.sender.nickname + "</strong> <a class='text' href='/messages/thread?originMessageId=" + message.originMessage.id + "&messageId=" +  message.originMessage.id  + "#msg_"+ message.originMessage.id +"'>" + $.emoji.replace(message.originMessage.content) + "</a></p></div>");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.id+"&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[ORIGINMESSAGEAREA]","");
    }
    mediaListResultDom = mediaListResultDom.replace("[MEMBERCOUNT]", message.receiversCount+1);

    return mediaListResultDom;
}
function getMessagePackMarkup(message, showSource, curUserExternalId){
    var mediaListTemplate = "<div class='chatbox [CHATFEATURE] msgbox' id='msg_[MESSAGEID]'>"
    + "<div class='profilephoto'><a href='/profiles/[SENDEREXTERNALID]'><img id='[SENDEREXTERNALID]_profile_button' class='profilephotoImg corners' src='[SENDERPROFILEIMAGEURL]' /></a>"
    + "[RECEIVERCOUNTAREA]"
    + "</div>"
    + "<div class='textarea'>"
    + "<p class='writerandtime nomg'>"
    + "<strong class='writer'>[SENDERNICKNAME]</strong>"
    + "<span class='time'>[CREATEDAT]<input type='hidden' id='[MESSAGEID]_createdAt' value='[CREATEDATORIGIN]' /></span>"
    + "</p>"
    + "[SOURCEAREA]"
    + "<a class='msglink' href='[MESSAGELINK]'><p class='text'>[MESSAGECONTENT]</p></a>"
    + "[ORIGINMESSAGEAREA]"
    + "[SECURITYAREA]"
    + "<b class='lt'></b><b class='rt'/></b><b class='lb'></b><b class='rb'></b><b class='arrow'></b>"
    + "</div>"
    + "</div>";
    var mediaListResultDom = mediaListTemplate.replace(/\[MESSAGEID\]/g,message.id)
    .replace(/\[CREATEDATORIGIN\]/g, message.createdAtOrigin)
    .replace(/\[SENDEREXTERNALID\]/g, message.sender.externalId)
    .replace("[SENDERPROFILEIMAGEURL]", message.sender.profileImagePath)
    .replace("[SENDERNICKNAME]", message.sender.nickname)
    .replace("[CREATEDAT]", message.createdAt)
    .replace("[MESSAGECONTENT]", $.emoji.replace(message.content));

    if( message.receiversCount > 0 ){
        mediaListResultDom = mediaListResultDom.replace("[RECEIVERCOUNTAREA]","<a href='javascript:;' class='btn_show_participant' id='" + message.id + "_participant'><span class='friend' >" + (message.receiversCount + 1)+ "</span></a>");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[RECEIVERCOUNTAREA]","");
    }

    if( !showSource || (message.source == "" && message.sourceMessage == "")){
        mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]","");
    }else{
        if( message.source != null && message.source != ""){
            var source = message.source;
            var sourceType = source.type;
            var sourceElement = "";
            if( sourceType == "URL" ){
                var sourceTitle =  (source.title!=null&&source.title!=""&&source.title!=undefined)?source.title:"source";
                sourceElement = "<span class='news'><img altus='링크'' src='/images/common/ico_link.gif'/> <a target='_blank' href='"+source.content+"'>" +source.title+ "</a> <a class='btn_source' href='/messages/form?sourceId="+ source.id +"&persistCookie=true'><img src='/images/common/btn_go_url_gal.png'/></a></span>";
            }else if(sourceType == "IMAGE" || sourceType == "WEB_IMAGE"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='photo' src='/images/common/ico_photo.png'/> source image <span id='source_toggle_button_"+source.id+"' class='toggle'><img alt='close' src='/images/common/btn_toggle_close.png'/></span></span>"
                + "<div class='object' id='"+source.id+"_div'>"
                + "<a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'><img src='"+source.filePath+"' alt='' /></a>"
                + "</div>";
            }else if(sourceType == "AUDIO"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='Audio' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a></strong></span>"
            ;//+"<div class='object' id='"+source.id+"_div'>"
            //+"<audio src='"+source.filePath+"'><a href='"+source.filePath+"'>"+source.fileName+"</a></audio>"
            //+"</div>";
            }else if(sourceType == "VIDEO"){
                if(source.content != null && source.content != "" && source.content.indexOf("http://www.youtube.com/watch") == 0 && source.youtubeId != null && source.youtubeId != ""){
                    sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='You Tube' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.title+"</a></strong><span id='source_toggle_button_"+source.id+"' class='toggle'><img alt='close' src='/images/common/btn_toggle_close.png'/></span></span>"
                    +"<div class='object youtube' id='"+source.id+"_div'>"
                    +"<object width='396' height='311'>"
                    +"<param name='movie' value='http://www.youtube.com/v/"+source.youtubeId+"&hl=ko&fs=1&'></param>"
                    +"<param name='allowFullScreen' value='true'></param>"
                    +"<param name='allowscriptaccess' value='always'></param>"
                    +"<embed src='http://www.youtube.com/v/"+source.youtubeId+"&hl=ko&fs=1&' type='application/x-shockwave-flash' wmode='transparent' allowscriptaccess='always' allowfullscreen='true' width='100%' ></embed>"
                    +"</object>"
                    +"</div>";
                }else{
                    sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='You Tube' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a></strong></span>"
                ;//+"<div class='object' id='"+source.id+"_div'>"
                //+"<video src='"+source.filePath+"' width='244px'><a href='"+source.filePath+"'>"+source.fileName+"</a></video>"
                //+"</div>";
                }
            }else if(sourceType == "FILE"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'>"
                +"<img alt='photo' src='/images/common/ico_link.gif'/> <a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a>"
                +"</span>";
            }else if(sourceType == "MAP"){
                sourceElement = "<span id='source_open_button_"+source.id+"' class='file source_open_button'>"
                +"<img src='/images/common/ico_map.jpg' alt='photo'/> 지도 "
                +"<span class='toggle' id='source_toggle_button_"+source.id+"'><img src='/images/common/btn_toggle_close.png' alt='close'/></span>"
                +"</span>"
                +"<div id='"+source.id+"_div' class='media_map'>"
                +"<a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"
                +"<img id='mapStaticImage' alt='' src='"+source.mapUrl+"'/></a></div>";
            }else{
                sourceElement = "소스를 찾을 수 없습니다";
            }
            mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]", "<div class='media'>" + sourceElement + "</div>");
        }else if(message.sourceMessage != null && message.sourceMessage != ""){
            var messageSourceElement = "<p class='msg'><img src='/images/common/ico_msg.gif' alt='메세지소스'/><a href='/messages/form?messageId="+ message.sourceMessage.id +"&persistCookie=true'>"+ message.sourceMessage.content +"</a></p>";
            mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]", messageSourceElement);
        }
    }
    if( message.originMessage != null && message.originMessage != "" && message.originMessage != undefined){
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.originMessage.id+ "&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[ORIGINMESSAGEAREA]","<div class='chatSubject'><p><strong>"+message.originMessage.sender.nickname+"</strong> <a href='/messages/thread?originMessageId="+message.originMessage.id+ "&messageId=" + message.originMessage.id + "#msg_"+message.originMessage.id+"'>"+ $.emoji.replace(message.originMessage.content) +"</a></p></div>");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.id+"&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[ORIGINMESSAGEAREA]","");
    }
    if( message.secret ){
        mediaListResultDom = mediaListResultDom.replace("[SECURITYAREA]","<span class='security'><img src='/images/common/btn_lock.gif' title='비공개 메세지' alt='비공개'/></span>");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[SECURITYAREA]","");
    }

    if( curUserExternalId != "" && curUserExternalId != null && curUserExternalId != undefined && curUserExternalId == message.sender.externalId){
        mediaListResultDom = mediaListResultDom.replace("[CHATFEATURE]", "userchat");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[CHATFEATURE]", "otherchat");
    }
    return mediaListResultDom;
}

function getMessageMarkup(message, showSource, curUserExternalId){
    var mediaListTemplate = "<div class='chatbox [CHATFEATURE] msgbox' id='msg_[MESSAGEID]'>"
    + "<div class='profilephoto'><a href='/profiles/[SENDEREXTERNALID]'><img id='[SENDEREXTERNALID]_profile_button' class='profilephotoImg corners' src='[SENDERPROFILEIMAGEURL]' /></a></div>"
    + "<div class='textarea'>"
    + "<p class='writerandtime nomg'>"
    + "<strong class='writer'>[SENDERNICKNAME]</strong>"
    + "<span class='time'>[CREATEDAT]<input type='hidden' id='[MESSAGEID]_createdAt' value='[CREATEDATORIGIN]' /></span>"
    + "</p>"
    + "[SOURCEAREA]"
    + "<a class='msglink' href='[MESSAGELINK]'><p class='text'>[MESSAGECONTENT]</p></a>"
    + "<span class='zoom'><a href='/messages/form?messageId=[MESSAGEID]&persistCookie=true'><img src='/images/common/btn_zoom01.gif' title='자세히 보기' alt='자세히'/></a></span>"
    + "<b class='lt'></b><b class='rt'/></b><b class='lb'></b><b class='rb'></b><b class='arrow'></b>"
    + "</div>"
    + "</div>";
    var mediaListResultDom = mediaListTemplate.replace(/\[MESSAGEID\]/g,message.id)
    .replace(/\[CREATEDATORIGIN\]/g, message.createdAtOrigin)
    .replace(/\[SENDEREXTERNALID\]/g, message.sender.externalId)
    .replace("[SENDERPROFILEIMAGEURL]", message.sender.profileImagePath)
    .replace("[SENDERNICKNAME]", message.sender.nickname)
    .replace("[CREATEDAT]", message.createdAt)
    .replace("[MESSAGECONTENT]", $.emoji.replace(message.content));

    if( !showSource || (message.source == "" && message.sourceMessage == "")){
        mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]","");
    }else{
        if( message.source != null && message.source != ""){
            var source = message.source;
            var sourceType = source.type;
            var sourceElement = "";
            if( sourceType == "URL" ){
                var sourceTitle =  (source.title!=null&&source.title!=""&&source.title!=undefined)?source.title:"source";
                sourceElement = "<span class='news'><img altus='링크'' src='/images/common/ico_link.gif'/> <a target='_blank' href='"+source.content+"'>" +source.title+ "</a> <a class='btn_source' href='/messages/form?sourceId="+ source.id +"&persistCookie=true'><img src='/images/common/btn_go_url_gal.png'/></a></span>";
            }else if(sourceType == "IMAGE" || sourceType == "WEB_IMAGE"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='photo' src='/images/common/ico_photo.png'/> source image <span id='source_toggle_button_"+source.id+"' class='toggle'><img alt='close' src='/images/common/btn_toggle_close.png'/></span></span>"
                + "<div class='object' id='"+source.id+"_div'>"
                + "<a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'><img src='"+source.filePath+"' alt='' /></a>"
                + "</div>";
            }else if(sourceType == "AUDIO"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='Audio' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a></strong></span>"
            ;//+"<div class='object' id='"+source.id+"_div'>"
            //+"<audio src='"+source.filePath+"'><a href='"+source.filePath+"'>"+source.fileName+"</a></audio>"
            //+"</div>";
            }else if(sourceType == "VIDEO"){
                if(source.content != null && source.content != "" && source.content.indexOf("http://www.youtube.com/watch") == 0 && source.youtubeId != null && source.youtubeId != ""){
                    sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='You Tube' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.title+"</a></strong><span id='source_toggle_button_"+source.id+"' class='toggle'><img alt='close' src='/images/common/btn_toggle_close.png'/></span></span>"
                    +"<div class='object youtube' id='"+source.id+"_div'>"
                    +"<object width='396' height='311'>"
                    +"<param name='movie' value='http://www.youtube.com/v/"+source.youtubeId+"&hl=ko&fs=1&'></param>"
                    +"<param name='allowFullScreen' value='true'></param>"
                    +"<param name='allowscriptaccess' value='always'></param>"
                    +"<embed src='http://www.youtube.com/v/"+source.youtubeId+"&hl=ko&fs=1&' type='application/x-shockwave-flash' wmode='transparent' allowscriptaccess='always' allowfullscreen='true' width='100%' ></embed>"
                    +"</object>"
                    +"</div>";
                }else{
                    sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'><img alt='You Tube' src='/images/common/ico_youtobu.gif'/> <strong><a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a></strong></span>"
                ;//+"<div class='object' id='"+source.id+"_div'>"
                //+"<video src='"+source.filePath+"' width='244px'><a href='"+source.filePath+"'>"+source.fileName+"</a></video>"
                //+"</div>";
                }
            }else if(sourceType == "FILE"){
                sourceElement = "<span class='file source_open_button' id='source_open_button_"+source.id+"'>"
                +"<img alt='photo' src='/images/common/ico_link.gif'/> <a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"+source.fileName+"</a>"
                +"</span>";
            }else if(sourceType == "MAP"){
                sourceElement = "<span id='source_open_button_"+source.id+"' class='file source_open_button'>"
                +"<img src='/images/common/ico_map.jpg' alt='photo'/> 지도 "
                +"<span class='toggle' id='source_toggle_button_"+source.id+"'><img src='/images/common/btn_toggle_close.png' alt='close'/></span>"
                +"</span>"
                +"<div id='"+source.id+"_div' class='media_map'>"
                +"<a href='/messages/form?sourceId="+ source.id +"&persistCookie=true'>"
                +"<img id='mapStaticImage' alt='' src='"+source.mapUrl+"'/></a></div>";
            }else{
                sourceElement = "소스를 찾을 수 없습니다";
            }
            mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]", "<div class='media'>" + sourceElement + "</div>");
        }else if(message.sourceMessage != null && message.sourceMessage != ""){
            var messageSourceElement = "<p class='msg'><img src='/images/common/ico_msg.gif' alt='메세지소스'/><a href='/messages/form?messageId="+ message.sourceMessage.id +"&persistCookie=true'>"+ message.sourceMessage.content +"</a></p>";
            mediaListResultDom = mediaListResultDom.replace("[SOURCEAREA]", messageSourceElement);
        }
    }
    if( message.originMessage != null && message.originMessage != "" && message.originMessage != undefined){
        //mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.originMessage.id+ "&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","#msg_"+ message.id);
    }else{
        //mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","/messages/thread?originMessageId="+message.id+"&messageId=" + message.id + "#msg_"+message.id);
        mediaListResultDom = mediaListResultDom.replace("[MESSAGELINK]","#msg_"+message.id);
    }

    if( curUserExternalId != "" && curUserExternalId != null && curUserExternalId != undefined && curUserExternalId == message.sender.externalId){
        mediaListResultDom = mediaListResultDom.replace("[CHATFEATURE]", "userchat");
    }else{
        mediaListResultDom = mediaListResultDom.replace("[CHATFEATURE]", "otherchat");
    }
    return mediaListResultDom;
}

function fixBrokenImages( url , imgElemens){
    if( url == null || url == undefined || url == "" ){
        url = "/images/common/none.gif";
    }
    imgElemens.each(function(){
        if($(this).attr("naturalWidth") === 0){
            $(this).attr("src", url);
        }

    });
}

function goProfile(externalId){
    document.location = "/profiles/" + externalId;
}


/* jquery polling plugin */
(function($) {
    $.fn.poll = function(options){
        var $this = $(this);
        // extend our default options with those provided
        var opts = $.extend({}, $.fn.poll.defaults, options);
        setInterval(update, opts.interval);

        // method used to update element html
        function update(){
            $.ajax({
                type: opts.type,
                url: opts.url,
                success: opts.success
            });
        };
    };

    // default options
    $.fn.poll.defaults = {
        type: "POST",
        url: ".",
        success: '',
        interval: 2000
    };
})(jQuery);

//사용법
//$("#chat").poll({
//    url: "/chat/ajax/1/messages/",
//    interval: 3000,
//    type: "GET",
//    success: function(data){
//        $("#chat").append(data);
//    }
//});

/* -- jquery polling plugin */