SS's Diary

<div class="summary">
	<p><span>공백 포함</span><strong class="letter" id="current_msglen">13</strong><span>자</span><strong class="byte" id="current_msg_byte">13</strong><span>byte</span></p>
	<p><span>공백 제외</span><strong class="letter" id="current_msglen_except_blank">13</strong><span>자</span><strong class="byte" id="current_msg_byte_except_blank">13</strong><span>byte</span></p>
</div>

<textarea name="content" id="character_counter_content" cols="70" rows="22" class="checker_input" placeholder="내용을 입력해주세요."></textarea>

(function (window, $, undefined) {
var $character_counter_content = $('#character_counter_content'), $checker_preview = $('#checker_preview'), $spell_check = $("#spell_check"), $spell_completion = $('#spell_completion'),
    $checker_spell = $('.checker_spell'), $result_pre = $('#result_pre'), $title_sub =  $('#title_sub'), $spell_count = $('#spell_count'), $checker_result = $('#checker_result'),
    $layer_suggetion = $('#layer_suggetion'), $spell_form = $('#spell_form'), $st_len = $('#current_msglen'), $st_byte = $('#current_msg_byte'), $steb_len = $('#current_msglen_except_blank'),
    $steb_byte = $('#current_msg_byte_except_blank');

//맞춤법 검사 버튼
$spell_check.on('click', function() {
    spellCheck();
});

//검사완료
$spell_completion.on('click', function() {
    spellCheckDone();
});

//일괄수정
$("#spell_done_all").on('click', function() {
    spellDoneAll();
});
//복사 하기 
$("#copy_all").on('click', function() {
    copyAll();
});
//초기화
$("#spell_reset").on('click', function() {
    SpellReset();
});
//실시간 글자수 세기
$character_counter_content.keyup(function() {
    chkMsgLength(this);
});

//레이어 팝업 
$(document).on('click','.spell_done' ,function(){
    spellDone(this);
});





function copyAll() {
    if($character_counter_content.val() === ''){
        alert('내용을 입력 해주세요.');
        return;
    }

    if($checker_preview.text() === '') { // 맞춤법 검사 여부 확인
        $character_counter_content.select();
        document.execCommand('copy');
    }else{
        var originalText =  $character_counter_content.val();
        var changeText = $checker_preview.text();
        $checker_preview.hide();
        $character_counter_content.val(changeText);
        $character_counter_content.show();
        $character_counter_content.select();
        document.execCommand('copy');
        $character_counter_content.hide();
        $character_counter_content.val(originalText);
        $checker_preview.show();
    }

    alert("입력하신  내용이 복사되었습니다.\n\nCtrl + v 키를 사용하여, 붙여 넣기를 사용하실 수 있습니다.");

    setTimeout(function() {
        try {
            if (document.selection) {
                document.selection.empty();
            } else {
                window.getSelection().removeAllRanges();
            }
        } catch (e) {}
    }, 1);
}


//맞춤법 검사
function spellCheck() {
    if($character_counter_content.val() === ''){
        alert('내용을 입력 해주세요.');
        return;
    }
    $result_pre.addClass('loading');
    $spell_check.prop('disabled', true);
    var $params = $checker_spell.find('textarea').serializeArray();
    $.ajax({
        url: '/zf_user/tools/spell-check',
        data: $params,
        type: 'post',
        dataType: 'json'
    }).success(function (result) {
            $character_counter_content.hide();
            $checker_preview.show();
            $spell_check.prop('disabled', false).hide();
            $spell_completion.show();
            $result_pre.removeClass('loading').hide(); //맞춤법 검사 시작 텍스트 숨김
            $title_sub.show(); //맞춤법 오류 리스트 노출
            $checker_preview.append(result.result_text);
            $spell_count.html('' + result.result_cnt +'개');
            if(result.result_cnt === 0){
                $checker_result.show().append('

');
            }else{
                $checker_result.show().append(result.speller_list);
            }
            $layer_suggetion.append(result.popup_speller_list);


    }).error(function() {

    });
}

//검사 완료
function  spellCheckDone(){
    var changeText = $checker_preview.text();
    $character_counter_content.val(changeText);
    $checker_preview.html('');
    $checker_preview.css('display','none');
    $character_counter_content.css('display','block');
    $title_sub.hide(); // 맞춤법 오류 리스트 영역 숨김
    $result_pre.show(); // 검사 버튼 눌러주세요 텍스트 노출
    $layer_suggetion.find('dl').remove();//레이어 팝업 초기화
    $checker_result.empty().hide(); //맞춤법 검사 초기화
    $spell_count.html(0 + '개'); //맞춤법 오류 갯수 초기화
    $layer_suggetion.css('display','none');
    $layer_suggetion.find('div').remove();
    $spell_completion.hide();
    $spell_check.show();
}

//초기화
/**
 * @return {boolean}
 */
function SpellReset(){

    if ( $character_counter_content.val() && !confirm('작성한 내용을 모두 삭제하시겠습니까?') ) {
        return false;
    }

    $spell_form[0].reset();
    $checker_preview.html('');
    $checker_preview.css('display','none');
    $character_counter_content.css('display','block');
    $spell_completion.hide();
    $spell_check.show();
    $title_sub.hide(); // 맞춤법 오류 리스트 영역 숨김
    $result_pre.show(); // 검사 버튼 눌러주세요 텍스트 노출
    $layer_suggetion.find('dl').remove();//레이어 팝업 초기화
    $layer_suggetion.css('display','none');
    $layer_suggetion.find('div').remove();
    $checker_result.empty().hide(); //맞춤법 검사 초기화
    $spell_count.html(0 + '개'); //맞춤법 오류 갯수 초기화
    $st_len.html(0);
    $st_byte.html(0);
    $steb_len.html(0);
    $steb_byte.html(0);
    return false;
}
//맞춤법 수정 갯수 확인 후 바꿔 준다.
function spellCheckConut(){
    var eorr_cnt;
    eorr_cnt = $spell_form.find('.wrong').length - $spell_form.find('.wrong.solved').length; //맞춤법 수정 전 - 수정후
    if(eorr_cnt > 0) {
        $spell_count.html('' + eorr_cnt + '개');
    } else {
        $spell_count.html(eorr_cnt + '개');
    }

}

//텍스트 교체
function spellDone(obj) {
    var index = $(obj).attr('value');//바꿀 단어
    var data_index = $(obj).attr('data-value');//단어 index
    $checker_preview.find('span.wrong').eq(data_index).addClass('solved').text(index); //바꿀단어로 텍스트 교체
    $checker_preview.find('span.wrong').eq(data_index).attr('original-text',index); //바꿀단어로 텍스트 교체
    $layer_suggetion.css('display','none');//교체  후 팝업 숨김
    chkMsgLength($checker_preview,'after'); //텍스트 길이 계산
    spellCheckConut();//맞춤법 갯수 확인
}

//일괄 수정
function spellDoneAll() {
    var error_word = $spell_form.find('.wrong');
    var button_first = $checker_result.find('button:first-child');
    error_word.each(function(i){
        $(this).addClass('solved').text(button_first.eq(i).html());
        $(this).attr('original-text',button_first.eq(i).html());
    });
    chkMsgLength($checker_preview,'after'); //텍스트 길이 계산
    spellCheckConut();//맞춤법 갯수 확인
    $layer_suggetion.css('display','none');
}



//텍스트 길이 계산
function chkMsgLength(objMsg,textType) {
    //공백 포함
    var vacuum_pattern = /\r\n/gm;
    var vacuum_text;
    var vacuum_length;
    //공백 미포함
    var vacuum_remove_pattern = /\s/gm;
    var vacuum_remove_text;
    var vacuum_remove_length;

    if(textType === 'after') {
        vacuum_text = $(objMsg).text();
        vacuum_length = lengthMsg(objMsg.text());
        vacuum_remove_length = lengthMsg($.trim(objMsg.text().replace(/ /g, '')));
    }else{
        vacuum_text = $(objMsg).val();
        vacuum_length = lengthMsg($(objMsg).val());
        vacuum_remove_length = lengthMsg(vacuum_text.replace(vacuum_remove_pattern,''));
    }
    vacuum_text = vacuum_text.replace(vacuum_pattern,'\n');
    vacuum_remove_text = vacuum_text.replace(vacuum_remove_pattern,'');

    $st_len.html(vacuum_text.length);//현재 글자수를 넣는다
    $st_byte.html(vacuum_length);//현재 byte수를 넣는다
    $steb_len.html(vacuum_remove_text.length);//현재 글자수를 넣는다
    $steb_byte.html(vacuum_remove_length);//현재 byte수를 넣는다
}

//텍스트 바이트단위 계산
function lengthMsg(obj_msg) {
    var nbytes = 0;
    var i;
    for (i = 0; i < obj_msg.length; i++) {
        var ch = obj_msg.charAt(i);
        if (encodeURIComponent(ch).length > 4) { // 한글일경우
            nbytes += 2;
        } else if (ch === '\n') { // 줄바꿈일경우
            if (obj_msg.charAt(i - 1) !== '\r') { // 하지만 밀려서 줄이 바뀐경우가 아닐때
                nbytes += 1;
            }
        } else { //나머지는 모두 1byte
            nbytes += 1;
        }
    }//END FOR
    return nbytes;
}
})(window, jQuery, undefined);