<?php
include_once('./_common.php');
if (!defined('_GNUBOARD_')) exit; // 그누보드 관련 필수 파일 포함

$g5['title'] = '만능 계산기 | Calculator';
include_once(G5_PATH.'/head.php');
?>

<div class="calculator-container">
    <div class="calculator-type-selector">
        <select id="calcType" onchange="changeCalculator()">
            <option value="basic">기본형 계산기</option>
            <option value="scientific">공학용 계산기</option>
            <option value="graph">그래프 계산기</option>
            <option value="financial">금융 계산기</option>
            <option value="programmer">프로그래밍 계산기</option>
        </select>
    </div>

    <!-- 기본형 계산기 -->
    <div id="basicCalc" class="calc-type calculator">
        <div class="calc-header">
            <div class="solar-panel"></div>
        </div>
        <div class="display-container">
            <input type="text" id="basic-display" readonly>
        </div>
        <div class="keypad">
            <button class="btn-clear" onclick="clearDisplay()">C</button>
            <button class="btn-operator" onclick="addToDisplay('/')">÷</button>
            <button class="btn-operator" onclick="addToDisplay('*')">×</button>
            <button class="btn-operator" onclick="addToDisplay('-')">-</button>
            
            <button class="btn-number" onclick="addToDisplay('7')">7</button>
            <button class="btn-number" onclick="addToDisplay('8')">8</button>
            <button class="btn-number" onclick="addToDisplay('9')">9</button>
            <button class="btn-operator" onclick="addToDisplay('+')">+</button>
            
            <button class="btn-number" onclick="addToDisplay('4')">4</button>
            <button class="btn-number" onclick="addToDisplay('5')">5</button>
            <button class="btn-number" onclick="addToDisplay('6')">6</button>
            <button class="btn-function" onclick="percentage()">%</button>
            
            <button class="btn-number" onclick="addToDisplay('1')">1</button>
            <button class="btn-number" onclick="addToDisplay('2')">2</button>
            <button class="btn-number" onclick="addToDisplay('3')">3</button>
            <button class="btn-function" onclick="constant()">K</button>
            
            <button class="btn-number btn-zero" onclick="addToDisplay('0')">0</button>
            <button class="btn-number" onclick="addToDisplay('.')">.</button>
            <button class="btn-equals" onclick="calculate()">=</button>
            <button class="btn-function" onclick="setTaxRate()">TAX</button>
            
            <button class="btn-function" onclick="addTax()">TAX+</button>
            <button class="btn-function" onclick="subtractTax()">TAX-</button>
        </div>
    </div>

    <!-- 공학용 계산기 -->
    <div id="scientificCalc" class="calc-type calculator" style="display:none;">
        <div class="calc-header">
            <div class="solar-panel"></div>
            <div class="brand">SCIENTIFIC</div>
        </div>
        <div class="display-container">
            <input type="text" id="scientific-display" readonly>
        </div>
        <div class="keypad scientific-keypad">
            <button class="btn-clear" onclick="clearDisplay()">C</button>
            <button class="btn-function" onclick="sin()">sin</button>
            <button class="btn-function" onclick="cos()">cos</button>
            <button class="btn-function" onclick="tan()">tan</button>
            
            <button class="btn-function" onclick="log()">log</button>
            <button class="btn-function" onclick="ln()">ln</button>
            <button class="btn-function" onclick="sqrt()">√</button>
            <button class="btn-operator" onclick="addToDisplay('/')">÷</button>
            
            <button class="btn-number" onclick="addToDisplay('7')">7</button>
            <button class="btn-number" onclick="addToDisplay('8')">8</button>
            <button class="btn-number" onclick="addToDisplay('9')">9</button>
            <button class="btn-operator" onclick="addToDisplay('*')">×</button>
            
            <button class="btn-number" onclick="addToDisplay('4')">4</button>
            <button class="btn-number" onclick="addToDisplay('5')">5</button>
            <button class="btn-number" onclick="addToDisplay('6')">6</button>
            <button class="btn-operator" onclick="addToDisplay('-')">-</button>
            
            <button class="btn-number" onclick="addToDisplay('1')">1</button>
            <button class="btn-number" onclick="addToDisplay('2')">2</button>
            <button class="btn-number" onclick="addToDisplay('3')">3</button>
            <button class="btn-operator" onclick="addToDisplay('+')">+</button>
            
            <button class="btn-number btn-zero" onclick="addToDisplay('0')">0</button>
            <button class="btn-number" onclick="addToDisplay('.')">.</button>
            <button class="btn-equals" onclick="calculate()">=</button>
        </div>
    </div>

    <!-- 그래프 계산기 -->
    <div id="graphCalc" class="calc-type calculator" style="display:none;">        
        <div class="calc-header">
            <div class="solar-panel"></div>
            <div class="brand">GRAPH</div>
        </div>
        <canvas id="graphCanvas"></canvas>
        <div class="graph-controls">
            <input type="text" id="function-input" placeholder="함수 입력 (예: x^2)">
            <button class="btn-function" onclick="drawGraph()">그래프 그리기</button>
            <button class="btn-clear" onclick="clearDisplay()">C</button>
        </div>
    </div>

    <!-- 금융 계산기 -->
    <div id="financialCalc" class="calc-type calculator" style="display:none;">
        <div class="calc-header">
            <div class="solar-panel"></div>
            <div class="brand">FINANCIAL</div>
        </div>
        <div class="display-container">
            <textarea id="financial-display" readonly></textarea>
        </div>
        <div class="keypad financial-keypad">
            <button class="btn-clear" onclick="clearDisplay()">C</button>
            <button class="btn-function financial-btn" onclick="calculateInterest()">이자 계산</button>
            <button class="btn-function financial-btn" onclick="calculateLoan()">대출 계산</button>
            <button class="btn-function financial-btn" onclick="calculateROI()">수익률 계산</button>
        </div>
    </div>

    <!-- 프로그래밍 계산기 -->
    <div id="programmerCalc" class="calc-type calculator" style="display:none;">
        <div class="calc-header">
            <div class="solar-panel"></div>
            <div class="brand">PROGRAMMER</div>
        </div>
        <div class="display-container">
            <input type="text" id="programmer-display">
        </div>
        <div class="keypad programmer-keypad">
            <button class="btn-clear" onclick="clearDisplay()">C</button>
            <button class="btn-function" onclick="convertBinary()">2진수</button>
            <button class="btn-function" onclick="convertHex()">16진수</button>
            <button class="btn-function" onclick="convertOctal()">8진수</button>
            <button class="btn-function" onclick="AND()">AND</button>
            <button class="btn-function" onclick="OR()">OR</button>
            <button class="btn-function" onclick="NOT()">NOT</button>
        </div>
    </div>
</div>

<script>
// 계산기 타입 변경
function changeCalculator() {
    var type = document.getElementById('calcType').value;
    document.querySelectorAll('.calc-type').forEach(calc => {
        calc.style.display = 'none';
    });
    document.getElementById(type + 'Calc').style.display = 'block';
}

// 기본 계산기 함수들
let display = '';
let TAX_RATE = localStorage.getItem('TAX_RATE') ? parseFloat(localStorage.getItem('TAX_RATE')) : 0.1;
const K_CONSTANT = 3.14159; // 상수 값

// Add new function to set tax rate
function setTaxRate() {
    let newRate = parseFloat(prompt("세율을 입력하세요 (예: 10% -> 10):")) / 100;
    if (!isNaN(newRate) && newRate >= 0) {
        TAX_RATE = newRate;
        localStorage.setItem('TAX_RATE', newRate);
        alert(`세율이 ${(newRate * 100).toFixed(1)}%로 설정되었습니다.`);
    } else {
        alert("올바른 세율을 입력해주세요.");
    }
}

function formatNumber(num) {
    // 숫자를 문자열로 변환하고 소수점을 기준으로 분리
    let parts = num.toString().split('.');
    // 정수 부분에 천단위 구분자 추가
    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ',');
    // 소수점이 있으면 다시 합치고, 없으면 정수 부분만 반환
    return parts.join('.');
}

function addToDisplay(value) {
    display += value;
    // 숫자와 연산자를 구분하여 표시
    let displayValue = display;
    try {
        // 마지막 문자가 연산자인 경우 포맷팅하지 않음
        if (!'+-*/.'.includes(display[display.length - 1])) {
            let parts = display.split(/([+\-*\/])/g);
            displayValue = parts.map(part => {
                if (!'+-*/'.includes(part)) {
                    return isNaN(part) ? part : formatNumber(part);
                }
                return part;
            }).join('');
        }
    } catch(e) {
        displayValue = display;
    }
    document.getElementById('basic-display').value = displayValue;
    document.getElementById('scientific-display').value = displayValue;
    document.getElementById('programmer-display').value = display;
}

function calculate() {
    try {
        let result = eval(display);
        display = result.toString();
        let formattedResult = formatNumber(result);
        document.getElementById('basic-display').value = formattedResult;
        document.getElementById('scientific-display').value = formattedResult;
    } catch(e) {
        document.getElementById('basic-display').value = 'Error';
        document.getElementById('scientific-display').value = 'Error';
    }
}

function clearDisplay() {
    display = '';
    // Clear all calculator displays
    document.getElementById('basic-display').value = '';
    document.getElementById('scientific-display').value = '';
    document.getElementById('financial-display').value = '';
    document.getElementById('programmer-display').value = '';
    document.getElementById('function-input').value = '';
    
    // 그래프 캔버스 초기화
    const canvas = document.getElementById('graphCanvas');
    if(canvas) {
        const ctx = canvas.getContext('2d');
        ctx.clearRect(0, 0, canvas.width, canvas.height);
    }
}

function addTax() {
    try {
        let value = eval(display);
        let result = value * (1 + TAX_RATE);
        display = result.toString();
        document.getElementById('basic-display').value = formatNumber(result);
    } catch(e) {
        document.getElementById('basic-display').value = 'Error';
    }
}

function subtractTax() {
    try {
        let value = eval(display);
        let result = value / (1 + TAX_RATE);
        display = result.toString();
        document.getElementById('basic-display').value = formatNumber(result);
    } catch(e) {
        document.getElementById('basic-display').value = 'Error';
    }
}

function percentage() {
    try {
        let result = eval(display) / 100;
        display = result.toString();
        document.getElementById('basic-display').value = formatNumber(result);
    } catch(e) {
        document.getElementById('basic-display').value = 'Error';
    }
}

function constant() {
    display = K_CONSTANT.toString();
    document.getElementById('basic-display').value = formatNumber(K_CONSTANT);
}

// 여기에 다른 계산기 타입들의 함수들을 구현
// 공학용 계산기 함수들
function sin() {
    try {
        display = Math.sin(parseFloat(display) * Math.PI / 180).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

function cos() {
    try {
        display = Math.cos(parseFloat(display) * Math.PI / 180).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

function tan() {
    try {
        display = Math.tan(parseFloat(display) * Math.PI / 180).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

function log() {
    try {
        display = Math.log10(parseFloat(display)).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

function ln() {
    try {
        display = Math.log(parseFloat(display)).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

function sqrt() {
    try {
        display = Math.sqrt(parseFloat(display)).toString();
        document.getElementById('scientific-display').value = display;
    } catch(e) {
        document.getElementById('scientific-display').value = 'Error';
    }
}

// 그래프 계산기 함수
function drawGraph() {
    const canvas = document.getElementById('graphCanvas');
    const ctx = canvas.getContext('2d');
    let func = document.getElementById('function-input').value;
    
    // 수식 전처리
    func = func.replace(/\^/g, '**');  // ^ 를 ** 로 변환
    
    // 캔버스 크기 설정
    canvas.width = canvas.offsetWidth;
    canvas.height = canvas.offsetHeight;
    
    // 캔버스 초기화
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    
    // 격자 그리기
    drawGrid(ctx, canvas.width, canvas.height);
    
    // 좌표축 그리기
    ctx.beginPath();
    ctx.strokeStyle = '#000';
    ctx.lineWidth = 2;
    ctx.moveTo(0, canvas.height/2);
    ctx.lineTo(canvas.width, canvas.height/2);
    ctx.moveTo(canvas.width/2, 0);
    ctx.lineTo(canvas.width/2, canvas.height);
    ctx.stroke();
    
    // 그래프 그리기
    try {
        ctx.beginPath();
        ctx.strokeStyle = '#2196F3';
        ctx.lineWidth = 2;
        let isFirst = true;
        
        for(let px = 0; px < canvas.width; px++) {
            let x = (px - canvas.width/2) * (20/canvas.width);
            let y;
            try {
                y = -eval(func.replace(/x/g, `(${x})`));
            } catch(e) {
                continue;
            }
            
            let py = (y * canvas.height/20) + canvas.height/2;
            
            if(isFirst) {
                ctx.moveTo(px, py);
                isFirst = false;
            } else {
                ctx.lineTo(px, py);
            }
        }
        ctx.stroke();
    } catch(e) {
        alert('함수 형식이 올바르지 않습니다. 다시 확인해주세요.');
    }
}

// 격자 그리기 함수
function drawGrid(ctx, width, height) {
    ctx.beginPath();
    ctx.strokeStyle = '#ddd';
    ctx.lineWidth = 0.5;
    
    // 세로선
    for(let x = 0; x <= width; x += width/20) {
        ctx.moveTo(x, 0);
        ctx.lineTo(x, height);
    }
    
    // 가로선
    for(let y = 0; y <= height; y += height/20) {
        ctx.moveTo(0, y);
        ctx.lineTo(width, y);
    }
    
    ctx.stroke();
}

// 금융 계산기 함수들
function calculateInterest() {
    try {
        let principal = parseFloat(prompt("원금을 입력하세요:"));
        let rate = parseFloat(prompt("연이율을 입력하세요 (%):")) / 100;
        let years = parseFloat(prompt("기간(년)을 입력하세요:"));
        let interest = principal * rate * years;
        document.getElementById('financial-display').value = 
            `원금: ${principal}\n이자: ${interest.toFixed(2)}\n총액: ${(principal + interest).toFixed(2)}`;
    } catch(e) {
        document.getElementById('financial-display').value = 'Error';
    }
}

function calculateLoan() {
    try {
        let principal = parseFloat(prompt("대출 금액을 입력하세요:"));
        let rate = parseFloat(prompt("연이율을 입력하세요 (%):")) / 100;
        let years = parseFloat(prompt("대출 기간(년)을 입력하세요:"));
        let monthlyRate = rate / 12;
        let months = years * 12;
        
        // 월 납입금 계산 (원리금균등상환방식)
        let monthlyPayment = principal * monthlyRate * Math.pow(1 + monthlyRate, months) 
                            / (Math.pow(1 + monthlyRate, months) - 1);
        
        // 총 상환금액
        let totalPayment = monthlyPayment * months;
        // 총 이자
        let totalInterest = totalPayment - principal;
        
        document.getElementById('financial-display').value = 
            `대출 금액: ${principal.toLocaleString()}원\n` +
            `월 납입금: ${monthlyPayment.toLocaleString()}원\n` +
            `총 상환금액: ${totalPayment.toLocaleString()}원\n` +
            `총 이자: ${totalInterest.toLocaleString()}원`;
    } catch(e) {
        document.getElementById('financial-display').value = 'Error';
    }
}

function calculateROI() {
    try {
        let investment = parseFloat(prompt("투자 금액을 입력하세요:"));
        let returns = parseFloat(prompt("수익 금액을 입력하세요:"));
        let years = parseFloat(prompt("투자 기간(년)을 입력하세요:"));
        
        // 총 수익률
        let totalROI = ((returns - investment) / investment) * 100;
        
        // 연평균 수익률 (CAGR)
        let cagr = (Math.pow(returns / investment, 1/years) - 1) * 100;
        
        document.getElementById('financial-display').value = 
            `투자 금액: ${investment.toLocaleString()}원\n` +
            `수익 금액: ${returns.toLocaleString()}원\n` +
            `총 수익률: ${totalROI.toFixed(2)}%\n` +
            `연평균 수익률(CAGR): ${cagr.toFixed(2)}%`;
    } catch(e) {
        document.getElementById('financial-display').value = 'Error';
    }
}


// 프로그래밍 계산기 함수들
function convertBinary() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        document.getElementById('programmer-display').value = num.toString(2);
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

function convertHex() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        document.getElementById('programmer-display').value = num.toString(16).toUpperCase();
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

function convertOctal() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        document.getElementById('programmer-display').value = num.toString(8);
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

function AND() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        let num2 = parseInt(prompt("두 번째 숫자를 입력하세요:"));
        let result = num & num2;
        document.getElementById('programmer-display').value = 
            `${num} AND ${num2} = ${result}\n` +
            `이진수: ${num.toString(2)} AND ${num2.toString(2)} = ${result.toString(2)}`;
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

function OR() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        let num2 = parseInt(prompt("두 번째 숫자를 입력하세요:"));
        let result = num | num2;
        document.getElementById('programmer-display').value = 
            `${num} OR ${num2} = ${result}\n` +
            `이진수: ${num.toString(2)} OR ${num2.toString(2)} = ${result.toString(2)}`;
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

function NOT() {
    try {
        let num = parseInt(document.getElementById('programmer-display').value);
        let result = ~num;
        document.getElementById('programmer-display').value = 
            `NOT ${num} = ${result}\n` +
            `이진수: NOT ${num.toString(2)} = ${result.toString(2)}`;
    } catch(e) {
        document.getElementById('programmer-display').value = 'Error';
    }
}

// 스타일 추가
document.head.insertAdjacentHTML('beforeend', `
<style>
.calculator-container {
    max-width: 350px;
    margin: 20px auto;
    font-family: Arial, sans-serif;
}

.calculator-type-selector {
    margin-bottom: 15px;
}

.calculator-type-selector select {
    width: 100%;
    padding: 8px;
    border-radius: 5px;
    border: 1px solid #ccc;
    background-color: #f8f9fa;
}

.calculator {
    background-color: #e0e0e0;
    border-radius: 15px;
    padding: 15px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
    border: 2px solid #999;
}

.calc-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.solar-panel {
    height: 20px;
    background: linear-gradient(to right, #333, #666, #333);
    border-radius: 5px;
    width: 120px;
    margin-right: auto;
    border: 1px solid #555;
}

.brand {
    font-size: 12px;
    color: #333;
    font-weight: bold;
}

.display-container {
    background-color: #c4e17f;
    border-radius: 5px;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px inset #999;
    box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
}

.calc-type input, .calc-type textarea {
    width: 100%;
    padding: 10px;
    font-size: 24px;
    text-align: right;
    border: none;
    background-color: transparent;
    color: #333;
    font-family: 'Digital', monospace;
}

.calc-type textarea {
    height: 80px;
    resize: none;
}

.keypad {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
}

.scientific-keypad {
    grid-template-columns: repeat(4, 1fr);
}

.financial-keypad {
    grid-template-columns: 1fr;
}

.programmer-keypad {
    grid-template-columns: repeat(2, 1fr);
}

.keypad button {
    padding: 15px 0;
    font-size: 18px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    box-shadow: 0 3px 5px rgba(0,0,0,0.2);
    transition: all 0.2s;
    font-weight: bold;
}

.keypad button:active {
    box-shadow: 0 1px 2px rgba(0,0,0,0.2);
    transform: translateY(2px);
}

.btn-number {
    background-color: #f8f9fa;
    color: #333;
}

.btn-zero {
    grid-column: span 2;
}

.btn-operator {
    background-color: #ffc107;
    color: #333;
}

.btn-equals {
    background-color: #28a745;
    color: white;
}

.btn-clear {
    background-color: #dc3545;
    color: white;
}

.btn-function {
    background-color: #17a2b8;
    color: white;
}

.financial-btn {
    padding: 15px;
    margin-bottom: 5px;
}

#graphCanvas {
    width: 100%;
    height: 200px;
    background-color: white;
    border-radius: 5px;
    margin-bottom: 10px;
    border: 1px solid #999;
}

.graph-controls {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr;
    gap: 8px;
}

.graph-controls input {
    padding: 8px;
    border-radius: 5px;
    border: 1px solid #ccc;
    font-size: 13px;
}

.graph-controls button {
    padding: 12px;
    border-radius: 5px;
    border: none;
    cursor: pointer;
    font-weight: bold;
    margin-bottom: 5px;
}    
</style>
`);
</script>
<?php
include_once(G5_PATH.'/tail.php');
?>