from utils.css import load_css

def cost_averaging(old_avg_price, old_quantity, new_price, new_quantity):
    # 입력값을 숫자로 변환
    old_avg_price = float(old_avg_price) if old_avg_price else 0.0
    old_quantity = float(old_quantity) if old_quantity else 0.0
    new_price = float(new_price) if new_price else 0.0
    new_quantity = float(new_quantity) if new_quantity else 0.0

    # 현재 투자 금액 계산
    current_investment = old_avg_price * old_quantity
    # 추가 투자 금액 계산
    additional_investment = new_price * new_quantity
    # 총 투자 금액
    total_investment = current_investment + additional_investment
    # 총 주식 수
    total_quantity = old_quantity + new_quantity
    # 새 평균 가격 계산
    new_avg_price = total_investment / total_quantity if total_quantity != 0 else 0.0
    
    # 현재 수익률 계산
    current_return = (new_price - old_avg_price) / old_avg_price * 100 if old_avg_price != 0 else 0.0
    # 새로운 수익률 계산
    new_return = (new_price / new_avg_price - 1 ) * 100 if new_avg_price != 0 else 0.0
    
    return new_avg_price, total_quantity, total_investment, current_return, new_return, additional_investment

def gradio_cost_averaging(old_avg_price, old_quantity, new_price, new_quantity):
    css = load_css()

    # 입력값을 숫자로 변환
    old_avg_price = float(old_avg_price) if old_avg_price else 0.0
    old_quantity = float(old_quantity) if old_quantity else 0.0
    new_price = float(new_price) if new_price else 0.0
    new_quantity = float(new_quantity) if new_quantity else 0.0
    new_price = float(new_price) if new_price else 0.0

    new_avg_price, total_quantity, total_investment, current_return, new_return, additional_investment = cost_averaging(old_avg_price, old_quantity, new_price, new_quantity)
    
    current_return_class = ""
    if current_return > 0:
        current_return_class = f"<span style='color: #4caf50; font-weight: bold;'>{current_return:+,.2f}%</span>"
    elif current_return < 0:
        current_return_class = f"<span style='color: #f44336; font-weight: bold;'>{current_return:,.2f}%</span>"
    else:
        current_return_class = f"<span><strong>0</strong></span>"

    new_return_class = ""
    if new_return > 0:
        new_return_class = f"<span style='color: #4caf50; font-weight: bold;'>{new_return:+,.2f}%</span>"
    elif new_return < 0:
        new_return_class = f"<span style='color: #f44336; font-weight: bold;'>{new_return:,.2f}%</span>"
    else:
        new_return_class = f"<span><strong>0</strong></span>"

    result_html = css+ f"""

<div class="wrap-text" style="box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.1); border-radius: 0.5rem; padding: 3rem; position: relative; width: 100%; padding: 1.5rem;">
    <div>
        <div style="margin-bottom: 1.5rem;">
            <div style="font-size: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem;">Return</div>
            <div style="font-size: 1.5rem;">
                <span></span>
                <span style='color: #1678fb; font-weight: bold;'>{new_return_class}</span>
            </div>
            <hr style="margin: 1.5rem 0;">
        </div>
    </div>
    <div>
        <div style="margin-bottom: 1.5rem;">
            <div style="font-size: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem;">Average Price</div>
            <div style="font-size: 1.5rem; font-weight: bold; color: #1c75bc;">
                <span></span>
                <span style='color: #1678fb'>{new_avg_price:,.0f}</span>
            </div>
            <hr style="margin: 1.5rem 0;">
        </div>
    </div>
    <div>
        <div style="margin-bottom: 1.5rem;">
            <div style="font-size: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem;">Total Quantity</div>
            <div style="font-size: 1.5rem; font-weight: bold; color: #1c75bc;">
                <span></span>
                <span style='color: #1678fb'>{total_quantity:,.0f}</span>
            </div>
            <hr style="margin: 1.5rem 0;">
        </div>
    </div>
    <div>
        <div style="margin-bottom: 1.5rem;">
            <div style="font-size: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem;">Additional Investment</div>
            <div style="font-size: 1.5rem; font-weight: bold; color: #1c75bc;">
                <span></span>
                <span style='color: #1678fb'>{additional_investment:,.0f}</span>
            </div>
            <hr style="margin: 1.5rem 0;">
        </div>
    </div>
    <div>
        <div style="margin-bottom: 1.5rem;">
            <div style="font-size: 1.5rem; margin-top: 1.5rem; margin-bottom: 1.5rem;">Total Investment</div>
            <div style="font-size: 1.5rem; font-weight: bold; color: #1c75bc;">
                <span></span>
                <span style='color: #1678fb'>{total_investment:,.0f}</span>
            </div>
            <hr style="margin: 1.5rem 0;">
        </div>
    </div>
</div>

"""

    return result_html