var motherDiv;
var motherHeight;
var childHeight;
var totalPage;

var mode = 3; // 몇 줄로 보여줄까요?
var fontSize = 14; // 기본 폰트 사이즈
var lineHeight = 18; // 텍스트 한줄 높이
var wordBreak = true; // Word-Break 모드

var mode1LayerWidth = 663; // 한 줄일때 레이어 폭
var mode2LayerWidth = 321; // 두 줄일때 레이어 폭
var mode3LayerWidth = 208; // 세 줄일때 레이어 폭
var maxFontSize = 30; // 최대 폰트 사이즈
var minFontSize = 9; // 최소 폰트 사이즈
var pageNo = 0; // 페이지 넘버는 첫 페이지가 0입니다.

var prevOnSrc = "/images/common/include/boardTemplate/article_btn_prevPage_on.gif";
var prevOffSrc = "/images/common/include/boardTemplate/article_btn_prevPage_off.gif";
var nextOnSrc = "/images/common/include/boardTemplate/article_btn_nextPage_on.gif";
var nextOffSrc = "/images/common/include/boardTemplate/article_btn_nextPage_off.gif";

function getBrowserName() {
    var isBrowser = navigator.appName;
    if (isBrowser.indexOf("Microsoft") >= 0) isBrowser = "MSIE";
    else if (isBrowser.indexOf("Netscape") >= 0) isBrowser = "NETSCAPE";
    else isBrowser = "UNKNOWN";
    return isBrowser;
}

function getBrowserVersion() {
    var findIndex;
    var browserVersion = 0;
    var browser = getBrowserName();
    if (browser == "MSIE") {
        browserVersion = navigator.userAgent;
        findIndex = browserVersion.indexOf(browser) + 5;
        browserVersion = parseFloat(browserVersion.substring(findIndex, findIndex + 3));
    }
    return browserVersion;
}

function parseBool(stringObj) {
    var result;
    if (stringObj == "true") result = true;
    else result = false;
    return result;
}

function wordCutMode() {
    if (getBrowserVersion() >= 5.5) {
        if (wordBreak) wordBreak = false;
        else wordBreak = true;
        for (i = 0; i < 3; i++) {
            obj = document.getElementById("childDiv" + i);
            if (obj) {
                if (wordBreak) {
                    obj.style.wordBreak = "break-all";
                }
                else {
                    obj.style.wordBreak = "keep-all";
                    obj.style.wordWrap = "break-word";
                }
            }
        }
        pageNo = 0;
        moveArticle();
        makePaging();
        saveCookie();
    }
    else alert("Microsoft Internet Explorer 5.5 이상의\n브라우저에서만 사용할 수있는 기능입니다.");
}

function getHeight(objID) {
    obj = document.getElementById(objID);
    if (obj.offsetHeight) return obj.offsetHeight;
}

function getLayerWidth() {
    switch (mode) {
        case 1:
            return mode1LayerWidth;
            break;
        case 2:
            return mode2LayerWidth;
            break;
        case 3:
            return mode3LayerWidth;
            break;
    }
}

function setArticle() {
    motherHeight = getHeight("motherLayer");
    motherDiv = document.getElementById("motherLayer");
    for (i = 0; i < 3; i++) {
        obj = document.getElementById("articleText");

        innerContents = document.createElement("span");
        innerContents.setAttribute("id", "innerArt" + i);
        innerContents.setAttribute("className", "articleClass");
        innerContents.innerHTML = obj.innerHTML;

        copyLayer = document.createElement("div");
        copyLayer.setAttribute("id", "childDiv" + i);
        copyLayer.setAttribute("className", "articleClass");
        
        copyLayer.style.position = "absolute";
        
        copyLayer.style.width = getLayerWidth();
        copyLayer.style.left = getLayerWidth() * i + 20 * i + 20;
        copyLayer.style.top = (-1 * motherHeight) * i;
        if (wordBreak) {
            copyLayer.style.wordBreak = "break-all";
        }
        else {
            copyLayer.style.wordBreak = "keep-all";
            copyLayer.style.wordWrap = "break-word";
        }
        copyLayer.appendChild(innerContents);

        motherDiv.appendChild(copyLayer);
    }
    nowModeSetting();
}

function nowModeSetting() {
    for (i = 0; i < 3; i++) {
        obj = document.getElementById("childDiv" + i);
        if (obj) obj.style.display = "none";
    }
    for (i = 0; i < mode; i++) {
        obj = document.getElementById("childDiv" + i);
        obj.style.display = "";
        obj.style.width = getLayerWidth();
        obj.style.left = getLayerWidth() * i + 20 * i + 20;
    }
    if (mode == 1) {
        motherDiv.style.height = getHeight("childDiv0");
    }
}

function moveArticle() {
    for (i = 0; i < 3; i++) {
        obj = document.getElementById("childDiv" + i);
        if (obj) {
            obj.style.top = (-1 * motherHeight) * (i + (mode * pageNo));
        }
    }
    makePaging();
}

function moveNext() {
    if (pageNo < totalPage - 1) {
        pageNo += 1;
        moveArticle();
    }
}

function movePrev() {
    if (pageNo > 0) {
        pageNo -= 1;
        moveArticle();
    }
}

function fontSizeModify() {
    for (i = 0; i < 3; i++) {
        obj = document.getElementById("innerArt" + i);
        if (obj) {
            obj.style.fontSize = fontSize + "px";
            obj.style.lineHeight = lineHeight + "px";
        }
    }
    motherHeight = lineHeight * Math.round(motherHeight / lineHeight);
    if (mode != 1) motherDiv.style.height = motherHeight;
    else motherDiv.style.height = getHeight("childDiv0");
    pageNo = 0;
    moveArticle();
    makePaging();
}

function fontSizeUp() {
    if (fontSize < maxFontSize) {
        fontSize += 1;
        lineHeight += 1;
        fontSizeModify();
        saveCookie();
    }
}

function fontSizeDown() {
    if (fontSize > minFontSize) {
        fontSize -= 1;
        lineHeight -= 1;
        fontSizeModify();
        saveCookie();
    }
}

function modeChage(modeNo) {
    mode = modeNo;
    if (mode != 1) motherDiv.style.height = motherHeight;
    nowModeSetting();
    pageNo = 0;
    moveArticle();
    makePaging();
    makeDivAction();
    saveCookie();
}

function movePage(num) {
    pageNo = num;
    moveArticle();
    makePaging();
}

function makePaging() {
    if (mode == 1) totalPage = 1;
    else totalPage = Math.ceil(getHeight("childDiv0") / (motherHeight * mode));
    innerHtml = "";
    for (i = 0; i < totalPage; i++) {
        innerHtml += "<a href='javascript:movePage(" + i + ")'><span id='pagingNo" + i + "'>" + (i + 1) + "</span></a> &nbsp;|&nbsp; ";
    }
    if (document.getElementById("pagingArea")) document.getElementById("pagingArea").innerHTML = innerHtml;
    if (document.getElementById("pagingNo" + (pageNo))) document.getElementById("pagingNo" + (pageNo)).className = document.getElementById("selectedPagingClassName").innerText;
    viewRelatedBtn();
    viewPagingArea();
}

function prevFocusOn() {
    if (pageNo != 0) {
        if (document.getElementById("prevLink1")) document.getElementById("prevLink1").src = prevOnSrc;
        if (document.getElementById("prevLink2")) document.getElementById("prevLink2").src = prevOnSrc;
    }
}

function nextFocusOn() {
    if (pageNo != totalPage - 1) {
        if (document.getElementById("nextLink1")) document.getElementById("nextLink1").src = nextOnSrc;
        if (document.getElementById("nextLink2")) document.getElementById("nextLink2").src = nextOnSrc;
    }
}

function focusOff() {
    if (document.getElementById("prevLink1")) document.getElementById("prevLink1").src = prevOffSrc;
    if (document.getElementById("prevLink2")) document.getElementById("prevLink2").src = prevOffSrc;
    if (document.getElementById("nextLink1")) document.getElementById("nextLink1").src = nextOffSrc;
    if (document.getElementById("nextLink2")) document.getElementById("nextLink2").src = nextOffSrc;
}

function clearDivAction() {
    for (i = 0; i < mode; i++) {
        obj = document.getElementById("childDiv" + i);
        obj.style.cursor = "";
        obj.onmousemove = "";
        obj.onmouseout = "";
        obj.onmousedown = "";
        obj.onmouseup = "";
    }
}

function makeDivAction() {
    clearDivAction();
    if (mode != 1) {
        
        prevDiv = document.getElementById("childDiv0");
        prevDiv.style.cursor = "hand";
        prevDiv.onmousemove = prevFocusOn;
        prevDiv.onmouseout = focusOff;
        prevDiv.onmousedown = movePrev;
        prevDiv.onmouseup = focusOff;
        nextDiv = document.getElementById("childDiv" + (mode -1));
        nextDiv.style.cursor = "hand";
        nextDiv.onmousemove = nextFocusOn;
        nextDiv.onmouseout = focusOff;
        nextDiv.onmousedown = moveNext;
        nextDiv.onmouseup = focusOff;
        
    }
}

function saveCookie() {
    var expire = new Date();
    expire.setDate(expire.getDate() + 7); // 7일동안 셋팅 유지
    expire = expire.toGMTString();
    document.cookie = "fontSize=" + fontSize + "; path=/; expires=" + expire;
    document.cookie = "lineHeight=" + lineHeight + "; path=/; expires=" + expire;
    document.cookie = "mode=" + mode + "; path=/; expires=" + expire;
    document.cookie = "wordBreak=" + wordBreak + "; path=/; expires=" + expire;
}

function getCookie() {
    allData = document.cookie.split(";");
    for (i = 0; i < allData.length; i++) {
        if (allData[i].indexOf('fontSize') > -1) fontSize = parseInt(allData[i].split("=")[1]);
        else if (allData[i].indexOf('lineHeight') > -1) lineHeight = parseInt(allData[i].split("=")[1]);
        else if (allData[i].indexOf('mode') > -1) mode = parseInt(allData[i].split("=")[1]);
        else if (allData[i].indexOf('wordBreak') > -1) wordBreak = parseBool(allData[i].split("=")[1]);
    }
}

function viewRelatedBtn() {
    obj = document.getElementById("relatedBtnArea");
    if (document.body.scrollHeight > document.body.clientHeight + 230) obj.style.display = "";
    else obj.style.display = "none";
}

function viewPagingArea() {
    var nowDisplay = "";
    if (mode == 1) nowDisplay = "none";
    var i = 1;
    while (document.getElementById("pagingArea" + i)) {
        document.getElementById("pagingArea" + i).style.display = nowDisplay;
        i += 1;
    }
}

function defaultSetting() {
    getCookie();
    setArticle();
    makePaging();
    fontSizeModify();
    makeDivAction();
}