{% extends "base.html" %}
{% block title %}信号监控 - Augur{% endblock %}
{% block extra_head %}
<style>
/* page-header in layout.css handles signals header chrome */
.signals-add-row {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.signals-add-row input[type="text"],
.signals-add-row input[type="number"] {
    background: var(--bg-primary);
    border: 1px solid var(--border-color);
    color: var(--text-primary);
    padding: 6px 12px;
    border-radius: var(--radius-sm);
    font-family: var(--font-data);
    font-size: 0.85rem;
}
.signals-add-row input[type="text"] {
    width: 140px;
    text-transform: uppercase;
}
.signals-table-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}
@media (max-width: 768px) {
    .signal-stats-grid { grid-template-columns: repeat(2, 1fr) !important; }
    .signals-add-row input[type="text"],
    .signals-add-row input[type="number"] { width: 100%; max-width: 160px; }
}
</style>
{% endblock %}
{% block content %}

<header class="page-header signals-header">
    <div class="page-header__text">
        <h1 class="page-title" data-i18n="signals-title">信号监控</h1>
        <p class="page-lead" data-i18n="signals-desc">自选股实时信号追踪，多Agent共识预警</p>
    </div>
    <div class="page-actions">
        <span id="refresh-indicator" class="text-muted" style="font-size:0.75rem;" aria-live="polite">
            <span class="status-dot" style="background:var(--signal-buy); display:inline-block; width:6px; height:6px; border-radius:50%; margin-right:4px;" aria-hidden="true"></span>
            <span data-i18n="signals-refresh-label">列表刷新: 60s</span>
        </span>
        <button type="button" class="btn btn-sm" onclick="exportSignalsCSV()" data-i18n="signals-export-csv">导出 CSV</button>
        <button type="button" class="btn btn-primary" onclick="runAllAnalysis()" id="run-all-btn">
            &#x25B6; <span data-i18n="signals-run-all">运行全部分析</span>
        </button>
    </div>
</header>

<!-- Signal Statistics Panel -->
<div class="signal-stats-panel" id="signal-stats" style="display:none;" aria-live="polite">
    <div class="signal-stats-grid">
        <div class="signal-stat-item">
            <div class="signal-stat-value" id="stat-total">0</div>
            <div class="signal-stat-label" data-i18n="signals-stat-total">总信号</div>
        </div>
        <div class="signal-stat-item">
            <div class="signal-stat-value" style="color:var(--signal-buy);" id="stat-buy">0</div>
            <div class="signal-stat-label">BUY</div>
            <div class="signal-stat-bar"><div class="signal-stat-bar-fill buy" id="bar-buy" style="width:0%;"></div></div>
        </div>
        <div class="signal-stat-item">
            <div class="signal-stat-value" style="color:var(--signal-sell);" id="stat-sell">0</div>
            <div class="signal-stat-label">SELL</div>
            <div class="signal-stat-bar"><div class="signal-stat-bar-fill sell" id="bar-sell" style="width:0%;"></div></div>
        </div>
        <div class="signal-stat-item">
            <div class="signal-stat-value" style="color:var(--signal-neutral);" id="stat-hold">0</div>
            <div class="signal-stat-label">HOLD</div>
            <div class="signal-stat-bar"><div class="signal-stat-bar-fill hold" id="bar-hold" style="width:0%;"></div></div>
        </div>
        <div class="signal-stat-item">
            <div class="signal-stat-value" style="color:var(--accent-orange);" id="stat-avg-score">--</div>
            <div class="signal-stat-label" data-i18n="signals-stat-avg-score">平均评分</div>
        </div>
    </div>
</div>

<!-- Add Ticker Form (before filters — natural read order: add → filter → table) -->
<div class="card" style="margin-bottom:16px; padding:16px;">
    <div class="signals-add-row">
        <label for="add-ticker-input" class="data-label" style="margin:0; white-space:nowrap;" data-i18n="signals-add-label">添加自选股</label>
        <div style="display:flex; flex-direction:column; gap:2px;">
            <input type="text" id="add-ticker-input" data-i18n="signals-add-placeholder" placeholder="股票代码 (如 AAPL)"
                   aria-describedby="add-ticker-hint add-ticker-error"
                   oninput="clearTickerHint()"
                   onkeydown="if(event.key==='Enter')addTicker()">
            <small id="add-ticker-error" role="alert" style="display:none; font-size:0.7rem; color:var(--signal-sell);"></small>
        </div>
        <span id="add-ticker-hint" class="sr-only" data-i18n="signals-add-placeholder">股票代码 (如 AAPL)</span>
        <input type="number" id="add-pe-input" placeholder="PE" step="0.1" data-i18n-aria="signals-add-pe-aria">
        <input type="number" id="add-roe-input" placeholder="ROE%" step="0.1" min="0" max="200" data-i18n-aria="signals-add-roe-aria">
        <input type="number" id="add-gm-input" placeholder="毛利率%" step="0.1" min="0" max="100" aria-label="Gross margin percent">
        <button type="button" class="btn btn-primary" onclick="addTicker()" style="padding:6px 16px;" data-i18n="signals-add-btn">+ 添加</button>
    </div>
</div>

<!-- Signal Filter Row -->
<div class="signal-filter-row">
    <div style="display:flex; align-items:center; gap:10px; flex-wrap:wrap;">
        <label for="filter-signal-type" class="text-muted" style="font-size:0.75rem; white-space:nowrap;" data-i18n="signals-filter-type">信号类型:</label>
        <select id="filter-signal-type" class="signal-filter-select" onchange="applySignalFilters()" data-i18n-aria="signals-filter-type-aria">
            <option value="ALL" data-i18n="signals-filter-all">全部</option>
            <option value="BUY">BUY</option>
            <option value="SELL">SELL</option>
            <option value="HOLD">HOLD</option>
        </select>
        <label for="filter-sort" class="text-muted" style="font-size:0.75rem; white-space:nowrap;" data-i18n="signals-filter-sort">排序:</label>
        <select id="filter-sort" class="signal-filter-select" onchange="applySignalFilters()" data-i18n-aria="signals-filter-sort-aria">
            <option value="score-desc" data-i18n="signals-sort-score-desc">评分 高→低</option>
            <option value="score-asc" data-i18n="signals-sort-score-asc">评分 低→高</option>
            <option value="ticker-asc" data-i18n="signals-sort-ticker-asc">代码 A→Z</option>
        </select>
    </div>
</div>

<!-- Alert Threshold Settings -->
<div class="card" style="margin-bottom:16px; padding:16px; border-left:3px solid var(--accent-orange);">
    <div class="data-label" style="margin-bottom:12px; font-size:0.9rem; color:var(--accent-orange);" data-i18n="alert_threshold_title">监控告警设置</div>
    <div style="display:flex; align-items:center; gap:16px; flex-wrap:wrap;">
        <div style="flex:1; min-width:200px;">
            <label for="alert-threshold" class="text-muted" style="font-size:0.75rem; display:block; margin-bottom:4px;" data-i18n="alert_threshold_label">评分阈值</label>
            <div style="display:flex; align-items:center; gap:8px;">
                <input type="range" id="alert-threshold" min="1" max="10" step="1" value="8"
                       style="flex:1; accent-color:var(--accent-orange);"
                       oninput="document.getElementById('threshold-value').textContent=this.value"
                       aria-valuemin="1" aria-valuemax="10" aria-valuenow="8">
                <span id="threshold-value" style="font-family:var(--font-data); font-size:1rem; color:var(--accent-orange); font-weight:600; min-width:20px; text-align:center;" aria-hidden="true">8</span>
                <span class="text-muted" style="font-size:0.72rem;">/10</span>
            </div>
            <div class="text-muted" style="font-size:0.68rem; margin-top:2px;" data-i18n="signals-alert-hint">评分超过此阈值时触发告警通知</div>
            <div class="text-muted" style="font-size:0.65rem; margin-top:4px;" data-i18n="signals-alert-setup-hint">Telegram/Slack 凭据请在「设置」→「C. 通知渠道」中配置</div>
        </div>
        <div style="min-width:150px;">
            <label for="alert-channel" class="text-muted" style="font-size:0.75rem; display:block; margin-bottom:4px;" data-i18n="alert_channel_label">通知渠道</label>
            <select id="alert-channel" class="signal-filter-select" style="width:100%; padding:6px 10px;">
                <option value="telegram">Telegram</option>
                <option value="slack">Slack</option>
                <option value="lark">飞书 (Lark)</option>
                <option value="wechat">微信 (WeChat)</option>
            </select>
        </div>
        <div style="align-self:flex-end;">
            <button type="button" class="btn btn-primary" onclick="saveAlertSettings()" style="padding:8px 16px;" data-i18n="alert_save">保存告警设置</button>
        </div>
    </div>
    <div id="alert-saved-info" style="display:none; margin-top:8px; font-size:0.72rem; color:var(--signal-buy);" aria-live="polite">
        &#x2714; <span id="alert-saved-text"></span>
    </div>
</div>

<!-- Watchlist Table -->
<div class="card" style="padding:0; overflow:hidden;">
    <div class="signals-table-wrap">
        <table style="width:100%; border-collapse:collapse; font-size:0.85rem; min-width:640px;">
            <caption class="sr-only" data-i18n="signals-watchlist-caption">自选股信号列表</caption>
            <thead>
                <tr style="background:var(--bg-primary); border-bottom:1px solid var(--border-color);">
                    <th scope="col" style="padding:12px 16px; text-align:left; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-ticker">代码</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-pe">PE</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-roe">ROE</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-margin">毛利率</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-signal">信号</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-score">评分</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-votes">多/空/持</th>
                    <th scope="col" style="padding:12px 16px; text-align:center; color:var(--text-secondary); font-weight:500; font-size:0.75rem; text-transform:uppercase; letter-spacing:0.5px;" data-i18n="signals-col-actions">操作</th>
                </tr>
            </thead>
            <tbody id="watchlist-body"
                   aria-live="polite"
                   aria-busy="true"
                   aria-label="自选股信号列表"
                   data-state="loading">
                <tr>
                    <td colspan="8" style="padding:48px 16px; text-align:center; color:var(--text-muted);">
                        <div class="spinner" aria-hidden="true" style="display:inline-block; vertical-align:middle; margin-right:8px;"></div>
                        <span data-i18n="signals-loading">加载中...</span>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

<!-- Watchlist error state -->
<div id="watchlist-error" class="error-panel" style="display:none;" role="alert" aria-live="assertive">
    <div class="error-panel-title" data-i18n="signals-error-title">加载自选股失败</div>
    <div class="error-panel-msg" id="watchlist-error-msg" data-i18n="signals-error-msg">网络异常，请稍后重试</div>
    <div class="error-panel-retry">
        <button type="button" class="btn btn-sm" onclick="loadWatchlist()" data-i18n="signals-error-retry">重试</button>
    </div>
</div>

<!-- Analysis Results -->
<div id="analysis-results" style="margin-top:16px; display:none;">
    <div class="card" style="padding:16px; border-left:3px solid var(--accent-orange);">
        <div class="data-label" style="margin-bottom:8px;" data-i18n="signals-recent-results">最近分析结果</div>
        <div id="results-content"></div>
    </div>
</div>

{% endblock %}

{% block extra_scripts %}
<script>
var watchlistData = [];
var analysisResults = {};
var autoRefreshTimer = null;
function _t(key, fb) { return (typeof window.t === 'function') ? window.t(key, fb) : (fb || key); }

document.addEventListener('DOMContentLoaded', function() {
    try { var saved = sessionStorage.getItem('augur-analysis-results'); if(saved) { analysisResults = JSON.parse(saved); updateStatsPanel(); renderWatchlist(); } } catch(e){}

    loadWatchlist();
    startAutoRefresh();

    document.getElementById('watchlist-body').addEventListener('click', function(e) {
        var btn = e.target.closest('.remove-ticker-btn');
        if (btn) {
            var ticker = btn.getAttribute('data-ticker');
            if (ticker) removeTicker(ticker);
        }
        var row = e.target.closest('.signal-row-main');
        if (row) {
            var detailRow = row.nextElementSibling;
            if (detailRow && detailRow.classList.contains('signal-detail-row')) {
                detailRow.classList.toggle('expanded');
            }
        }
    });
});

document.addEventListener('visibilitychange', function() {
    if (document.hidden) {
        if (autoRefreshTimer) { clearInterval(autoRefreshTimer); autoRefreshTimer = null; }
    } else {
        startAutoRefresh();
    }
});

function startAutoRefresh() {
    if (autoRefreshTimer) clearInterval(autoRefreshTimer);
    autoRefreshTimer = setInterval(loadWatchlist, 60000);
}

function loadWatchlist() {
    var tbody = document.getElementById('watchlist-body');
    var errEl = document.getElementById('watchlist-error');
    var errMsg = document.getElementById('watchlist-error-msg');
    if (tbody) tbody.setAttribute('data-state', 'loading');
    if (errEl) errEl.style.display = 'none';
    fetch('/api/watchlist')
        .then(function(r) {
            if (!r.ok) throw new Error('HTTP ' + r.status);
            return r.json();
        })
        .then(function(data) {
            watchlistData = data.watchlist || [];
            if (tbody) {
                tbody.setAttribute('data-state', 'ready');
                tbody.setAttribute('aria-busy', 'false');
            }
            if (errEl) errEl.style.display = 'none';
            renderWatchlist();
        })
        .catch(function(e) {
            console.error('Failed to load watchlist:', e);
            if (tbody) {
                tbody.setAttribute('data-state', 'error');
                tbody.setAttribute('aria-busy', 'false');
                tbody.innerHTML = '<tr><td colspan="8" style="padding:32px 16px; text-align:center; color:var(--signal-sell);">' +
                    '<div style="font-size:0.95rem; font-weight:600;">' + escapeHtml(_t('signals-error-title')) + '</div>' +
                    '<div style="font-size:0.8rem; color:var(--text-muted); margin-top:4px;">' + escapeHtml(e.message || '') + '</div>' +
                    '<button type="button" class="btn btn-sm" style="margin-top:10px;" onclick="loadWatchlist()">' + escapeHtml(_t('signals-error-retry')) + '</button>' +
                    '</td></tr>';
            }
            if (errEl) {
                errEl.style.display = 'block';
                if (errMsg && e && e.message) errMsg.textContent = e.message;
            }
        });
}

function updateStatsPanel() {
    var keys = Object.keys(analysisResults);
    var total = keys.length;
    if (total === 0) {
        document.getElementById('signal-stats').style.display = 'none';
        return;
    }
    document.getElementById('signal-stats').style.display = '';
    var buyCount = 0, sellCount = 0, holdCount = 0, totalScore = 0;
    for (var i = 0; i < keys.length; i++) {
        var r = analysisResults[keys[i]];
        if (r.signal === 'bullish') buyCount++;
        else if (r.signal === 'bearish') sellCount++;
        else holdCount++;
        totalScore += (r.score || 0);
    }
    document.getElementById('stat-total').textContent = total;
    document.getElementById('stat-buy').textContent = buyCount;
    document.getElementById('stat-sell').textContent = sellCount;
    document.getElementById('stat-hold').textContent = holdCount;
    document.getElementById('stat-avg-score').textContent = (totalScore / total).toFixed(1);
    document.getElementById('bar-buy').style.width = (total ? (buyCount / total * 100) : 0) + '%';
    document.getElementById('bar-sell').style.width = (total ? (sellCount / total * 100) : 0) + '%';
    document.getElementById('bar-hold').style.width = (total ? (holdCount / total * 100) : 0) + '%';
}

function applySignalFilters() {
    renderWatchlist();
}

function getFilteredData() {
    var signalType = document.getElementById('filter-signal-type').value;
    var sortBy = document.getElementById('filter-sort').value;

    var items = watchlistData.slice();

    if (signalType !== 'ALL') {
        items = items.filter(function(item) {
            var result = analysisResults[item.ticker];
            if (!result) return false;
            if (signalType === 'BUY') return result.signal === 'bullish';
            if (signalType === 'SELL') return result.signal === 'bearish';
            if (signalType === 'HOLD') return result.signal !== 'bullish' && result.signal !== 'bearish';
            return true;
        });
    }

    items.sort(function(a, b) {
        var ra = analysisResults[a.ticker] || {};
        var rb = analysisResults[b.ticker] || {};
        if (sortBy === 'score-desc') return (rb.score || 0) - (ra.score || 0);
        if (sortBy === 'score-asc') return (ra.score || 0) - (rb.score || 0);
        if (sortBy === 'ticker-asc') return (a.ticker || '').localeCompare(b.ticker || '');
        return 0;
    });

    return items;
}

function renderWatchlist() {
    var tbody = document.getElementById('watchlist-body');
    var items = getFilteredData();

    // Don't overwrite a visible error state with stale data
    if (tbody && tbody.getAttribute('data-state') === 'error') {
        return;
    }
    if (tbody) {
        tbody.setAttribute('data-state', 'ready');
        tbody.setAttribute('aria-busy', 'false');
    }

    if (watchlistData.length === 0) {
        tbody.innerHTML = '<tr><td colspan="8" style="padding:48px 16px; text-align:center; color:var(--text-muted);">' +
            '<div style="font-size:2.4rem; margin-bottom:8px;" aria-hidden="true">&#x1F4CB;</div>' +
            '<div style="font-size:1rem; font-weight:600; color:var(--text-secondary); margin-bottom:6px;">' + escapeHtml(_t('signals-empty-title')) + '</div>' +
            '<div style="font-size:0.82rem; margin-bottom:14px;">' + escapeHtml(_t('signals-empty-desc')) + '</div>' +
            '<div style="display:flex; gap:8px; justify-content:center; flex-wrap:wrap;" role="group" aria-label="Example tickers">' +
            '<button type="button" class="example-chip" onclick="quickAddExample(\'AAPL\')" aria-label="' + escapeHtml(_t('signals-add-example-aria') + ' AAPL') + '">+ AAPL</button>' +
            '<button type="button" class="example-chip" onclick="quickAddExample(\'NVDA\')" aria-label="' + escapeHtml(_t('signals-add-example-aria') + ' NVDA') + '">+ NVDA</button>' +
            '<button type="button" class="example-chip" onclick="quickAddExample(\'MSFT\')" aria-label="' + escapeHtml(_t('signals-add-example-aria') + ' MSFT') + '">+ MSFT</button>' +
            '</div>' +
            '</td></tr>';
        return;
    }

    if (items.length === 0) {
        tbody.innerHTML = '<tr><td colspan="8" role="status" style="padding:32px 16px; text-align:center; color:var(--text-muted);">' +
            escapeHtml(_t('signals-no-filter-match')) + '</td></tr>';
        return;
    }

    var html = '';
    for (var i = 0; i < items.length; i++) {
        var item = items[i];
        var ticker = item.ticker || '';
        var result = analysisResults[ticker] || null;
        var signalHtml = '<span style="color:var(--text-muted);">--</span>';
        var scoreHtml = '<span style="color:var(--text-muted);">--</span>';
        var votesHtml = '<span style="color:var(--text-muted);">--</span>';

        if (result) {
            var sigColor = result.signal === 'bullish' ? 'var(--signal-buy)' :
                           result.signal === 'bearish' ? 'var(--signal-sell)' : 'var(--signal-neutral)';
            var sigText = result.signal === 'bullish' ? 'BUY' :
                          result.signal === 'bearish' ? 'SELL' : 'HOLD';
            signalHtml = '<span style="color:' + sigColor + '; font-weight:600; font-family:var(--font-data);">' + sigText + '</span>';
            scoreHtml = '<span style="color:' + sigColor + '; font-family:var(--font-data);">' + result.score + '/10</span>';
            votesHtml = '<span style="font-family:var(--font-data);">' +
                '<span style="color:var(--signal-buy);">' + result.buy_count + '</span>/' +
                '<span style="color:var(--signal-sell);">' + result.sell_count + '</span>/' +
                '<span style="color:var(--signal-neutral);">' + result.hold_count + '</span></span>';
        }

        html += '<tr class="signal-row-main" tabindex="0" role="button" aria-label="' + escapeHtml(_t('signals-row-aria') + ' ' + ticker) + '" style="border-bottom:1px solid var(--border-color); transition:background 0.2s; cursor:pointer;" onmouseover="this.style.background=\'var(--bg-card-hover)\'" onmouseout="this.style.background=\'transparent\'" onkeydown="if(event.key===\'Enter\'||event.key===\' \'){event.preventDefault();this.click();}">' +
            '<td style="padding:10px 16px; font-family:var(--font-data); font-weight:600;"><a href="/stocks?ticker=' + encodeURIComponent(ticker) + '" title="' + escapeHtml(_t('signals-analyze-link','分析 ' + ticker)) + '" style="color:var(--accent-orange);text-decoration:none;" onmouseover="this.style.textDecoration=\'underline\'" onmouseout="this.style.textDecoration=\'none\'">' + escapeHtml(ticker) + '</a></td>' +
            '<td style="padding:10px 16px; text-align:center; font-family:var(--font-data);">' + (item.pe || '--') + '</td>' +
            '<td style="padding:10px 16px; text-align:center; font-family:var(--font-data);">' + (item.roe ? (item.roe * 100).toFixed(0) + '%' : '--') + '</td>' +
            '<td style="padding:10px 16px; text-align:center; font-family:var(--font-data);">' + (item.gross_margins ? (item.gross_margins * 100).toFixed(0) + '%' : '--') + '</td>' +
            '<td style="padding:10px 16px; text-align:center;">' + signalHtml + '</td>' +
            '<td style="padding:10px 16px; text-align:center;">' + scoreHtml + '</td>' +
            '<td style="padding:10px 16px; text-align:center;">' + votesHtml + '</td>' +
            '<td style="padding:10px 16px; text-align:center;">' +
                '<button type="button" class="remove-ticker-btn" data-ticker="' + escapeHtml(ticker) + '" style="background:none; border:none; color:var(--signal-sell); cursor:pointer; font-size:1rem; padding:2px 6px;" data-i18n-title="signals-remove-aria" title="移除" aria-label="' + escapeHtml(_t('signals-remove-aria') + ' ' + ticker) + '">&times;</button>' +
            '</td>' +
            '</tr>';

        if (result && result.details) {
            html += '<tr class="signal-detail-row"><td colspan="8" style="padding:0 16px;"><div class="signal-detail-content">' +
                '<div class="data-label" style="margin-bottom:6px;">' + escapeHtml(_t('signals-agent-details')) + '</div>' +
                '<div style="display:flex; flex-wrap:wrap; gap:8px;">';
            var details = result.details || [];
            for (var d = 0; d < details.length; d++) {
                var det = details[d];
                var detColor = det.signal === 'bullish' ? 'var(--signal-buy)' : det.signal === 'bearish' ? 'var(--signal-sell)' : 'var(--signal-neutral)';
                html += '<span class="holdings-badge" style="border-color:' + detColor + '; color:' + detColor + ';">' + escapeHtml(det.agent || '') + ' ' + (det.score || '--') + '</span>';
            }
            html += '</div></div></td></tr>';
        }
    }
    tbody.innerHTML = html;
}

function clearTickerHint() {
    var err = document.getElementById('add-ticker-error');
    var input = document.getElementById('add-ticker-input');
    if (err) { err.style.display = 'none'; err.textContent = ''; }
    if (input) input.style.borderColor = '';
}

function showTickerHint(msg) {
    var err = document.getElementById('add-ticker-error');
    var input = document.getElementById('add-ticker-input');
    if (err) { err.textContent = msg; err.style.display = 'block'; }
    if (input) { input.style.borderColor = 'var(--signal-sell)'; input.focus(); }
}

function addTicker() {
    var ticker = document.getElementById('add-ticker-input').value.trim().toUpperCase();
    if (!ticker) {
        showTickerHint(_t('signals-ticker-hint-empty'));
        showToast(_t('msg-enter-ticker'), 'warning');
        return;
    }
    clearTickerHint();

    var body = { ticker: ticker };
    var pe = document.getElementById('add-pe-input').value;
    var roe = document.getElementById('add-roe-input').value;
    var gm = document.getElementById('add-gm-input').value;
    if (pe) body.pe = parseFloat(pe);
    if (roe) body.roe = parseFloat(roe) / 100;
    if (gm) body.gross_margins = parseFloat(gm) / 100;

    var btn = document.querySelector('#add-ticker-input + #add-pe-input, button[onclick="addTicker()"]');
    var addBtn = null;
    var btns = document.querySelectorAll('button');
    for (var bi = 0; bi < btns.length; bi++) {
        if (btns[bi].getAttribute('onclick') === 'addTicker()') { addBtn = btns[bi]; break; }
    }
    if (addBtn && addBtn.disabled) return; // prevent double-submit
    var origLabel = '';
    if (addBtn) {
        addBtn.disabled = true;
        origLabel = addBtn.innerHTML;
        addBtn.innerHTML = '&#x23F3; <span data-i18n="signals-add-pending">' + escapeHtml(_t('signals-add-pending')) + '</span>';
    }
    fetch('/api/watchlist/add', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(body)
    })
    .then(function(r) { return r.json(); })
    .then(function(data) {
        if (addBtn) { addBtn.disabled = false; addBtn.innerHTML = origLabel; }
        if (data.status === 'ok') {
            showToast(ticker + ' ' + _t('signals-added'));
            clearTickerHint();
            document.getElementById('add-ticker-input').value = '';
            document.getElementById('add-pe-input').value = '';
            document.getElementById('add-roe-input').value = '';
            document.getElementById('add-gm-input').value = '';
            loadWatchlist();
        } else {
            showToast(data.detail || _t('signals-add-failed'), 'error');
        }
    })
    .catch(function(e) {
        if (addBtn) { addBtn.disabled = false; addBtn.innerHTML = origLabel; }
        showToast(_t('signals-add-failed') + ': ' + e.message, 'error');
    });
}

function quickAddExample(ticker) {
    fetch('/api/watchlist/add', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ ticker: ticker })
    })
    .then(function(r) { return r.json(); })
    .then(function(data) {
        if (data.status === 'ok') {
            showToast(ticker + ' ' + _t('signals-added'));
            loadWatchlist();
        } else {
            showToast(data.detail || _t('signals-add-failed'), 'error');
        }
    })
    .catch(function(e) { showToast(_t('signals-add-failed') + ': ' + e.message, 'error'); });
}

function removeTicker(ticker) {
    fetch('/api/watchlist/' + ticker, { method: 'DELETE' })
        .then(function(r) { return r.json(); })
        .then(function(data) {
            if (data.status === 'ok') {
                showToast(ticker + ' ' + _t('signals-removed'));
                delete analysisResults[ticker];
                sessionStorage.setItem('augur-analysis-results', JSON.stringify(analysisResults));
                updateStatsPanel();
                loadWatchlist();
            } else {
                showToast(data.detail || _t('signals-remove-failed'), 'error');
            }
        })
        .catch(function(e) {
            showToast(_t('signals-remove-failed') + ': ' + e.message, 'error');
        });
}

function runAllAnalysis() {
    var btn = document.getElementById('run-all-btn');
    btn.disabled = true;
    btn.innerHTML = '&#x25B6; <span>' + escapeHtml(_t('signals-run-all-running')) + '</span>';

    fetchWithTimeout('/api/watchlist/run', { method: 'POST' }, 180000)
        .then(function(r) { return r.json(); })
        .then(function(data) {
            btn.disabled = false;
            btn.innerHTML = '&#x25B6; <span data-i18n="signals-run-all">' + escapeHtml(_t('signals-run-all')) + '</span>';

            if (data.status === 'empty') {
                showToast(_t('signals-empty-title'), 'warning');
                return;
            }

            if (data.results) {
                analysisResults = {};
                for (var i = 0; i < data.results.length; i++) {
                    var r = data.results[i];
                    analysisResults[r.ticker] = r;
                }
                sessionStorage.setItem('augur-analysis-results', JSON.stringify(analysisResults));
                updateStatsPanel();
                renderWatchlist();
                showToast(_t('signals-analysis-done').replace('{n}', data.results.length));
            }
        })
        .catch(function(e) {
            btn.disabled = false;
            btn.innerHTML = '&#x25B6; <span data-i18n="signals-run-all">' + escapeHtml(_t('signals-run-all')) + '</span>';
            var msg = (e && e.name === 'AbortError')
                ? _t('hero-error-timeout')
                : _t('hero-error-request') + e.message;
            showToast(msg, 'error');
        });
}

function loadAlertSettings() {
    var saved = localStorage.getItem('augur-alert-settings');
    if (saved) {
        try {
            var s = JSON.parse(saved);
            if (s.alert_threshold) document.getElementById('alert-threshold').value = s.alert_threshold;
            if (s.alert_threshold) document.getElementById('threshold-value').textContent = s.alert_threshold;
            if (s.alert_channel) document.getElementById('alert-channel').value = s.alert_channel;
            showSavedAlertInfo(s.alert_threshold, s.alert_channel);
        } catch(e) {}
    }
    fetch('/api/notifications/config')
        .then(function(r) { return r.json(); })
        .then(function(data) {
            if (data.status === 'ok' && data.config) {
                var cfg = data.config;
                if (cfg.alert_threshold) {
                    document.getElementById('alert-threshold').value = cfg.alert_threshold;
                    document.getElementById('threshold-value').textContent = cfg.alert_threshold;
                }
                if (cfg.alert_channel) {
                    document.getElementById('alert-channel').value = cfg.alert_channel;
                }
                if (cfg.alert_threshold || cfg.alert_channel) {
                    showSavedAlertInfo(cfg.alert_threshold || 8, cfg.alert_channel || 'telegram');
                }
            }
        })
        .catch(function(e) { /* ignore */ });
}

function saveAlertSettings() {
    var threshold = document.getElementById('alert-threshold').value;
    var channel = document.getElementById('alert-channel').value;
    var settings = { alert_threshold: parseInt(threshold), alert_channel: channel };

    localStorage.setItem('augur-alert-settings', JSON.stringify(settings));

    fetch('/api/notifications/config', {
        method: 'POST',
        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify(settings)
    })
    .then(function(r) { return r.json(); })
    .then(function(data) {
        if (data.status === 'ok') {
            showToast(_t('alert_save'));
            showSavedAlertInfo(threshold, channel);
        } else {
            showToast(_t('signals-save-failed') + (data.detail || data.message), 'error');
        }
    })
    .catch(function(e) {
        showToast(_t('signals-save-failed') + e.message, 'error');
    });
}

function showSavedAlertInfo(threshold, channel) {
    var el = document.getElementById('alert-saved-info');
    var textEl = document.getElementById('alert-saved-text');
    if (el && textEl) {
        el.style.display = 'block';
        textEl.textContent = _t('signals-alert-saved')
            .replace('{threshold}', threshold)
            .replace('{channel}', channel);
    }
}

loadAlertSettings();

function exportSignalsCSV() {
    var items = watchlistData.slice();
    var withResults = items.filter(function(item) { return analysisResults[item.ticker]; });
    if (withResults.length === 0) {
        // export watchlist without analysis if at least one ticker exists
        if (items.length === 0) { showToast(_t('signals-export-empty'), 'warning'); return; }
    }
    var hasResults = withResults.length > 0;
    var header = '' + ['Ticker', 'PE', 'ROE_%', 'Gross_Margin_%',
        hasResults ? 'Signal' : '',
        hasResults ? 'Score' : '',
        hasResults ? 'Buy_Votes' : '',
        hasResults ? 'Sell_Votes' : '',
        hasResults ? 'Hold_Votes' : ''
    ].filter(Boolean).join(',');
    var rows = [header];
    items.forEach(function(item) {
        var r = analysisResults[item.ticker];
        var cols = [
            item.ticker,
            item.pe != null ? item.pe : '',
            item.roe != null ? item.roe : '',
            item.gross_margin != null ? item.gross_margin : ''
        ];
        if (hasResults) {
            cols.push(r ? (r.signal || '') : '');
            cols.push(r ? (r.score != null ? Number(r.score).toFixed(1) : '') : '');
            cols.push(r ? (r.buy_votes != null ? r.buy_votes : '') : '');
            cols.push(r ? (r.sell_votes != null ? r.sell_votes : '') : '');
            cols.push(r ? (r.hold_votes != null ? r.hold_votes : '') : '');
        }
        rows.push(cols.join(','));
    });
    var blob = new Blob([rows.join('\n')], {type: 'text/csv'});
    var a = document.createElement('a');
    a.href = URL.createObjectURL(blob);
    a.download = 'augur-signals-' + new Date().toISOString().slice(0,10) + '.csv';
    a.click();
    showToast(_t('signals-exported'), 'success');
}
</script>
{% endblock %}