55 lines
2.9 KiB
HTML
55 lines
2.9 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>/ES Confluence</title>
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
<script src="https://unpkg.com/vue@3/dist/vue.global.prod.js"></script>
|
|
<script src="https://unpkg.com/lightweight-charts@5.2.0/dist/lightweight-charts.standalone.production.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<header>
|
|
<div><span class="eyebrow">CME FUTURES</span><h1>/ES <strong>CONFLUENCE</strong></h1></div>
|
|
<div class="status" :class="status.stream"><i></i>{{ status.stream }} · {{ status.source || 'source' }}</div>
|
|
</header>
|
|
<main>
|
|
<section class="chart-shell">
|
|
<div class="chart-head">
|
|
<div><span class="symbol">{{ status.symbol || 'ES=F' }}</span><span class="price">{{ price == null ? '—' : price.toFixed(2) }}</span></div>
|
|
<div class="timeframes"><button v-for="tf in timeframes" :key="tf" :class="{active: timeframe === tf}" @click="selectTimeframe(tf)">{{ tf }}</button></div>
|
|
</div>
|
|
<div id="chart"></div>
|
|
<div class="statusbar">
|
|
<span>FEED <b>{{ status.stream }}</b></span>
|
|
<span>LAST BAR <b>{{ barAge }}</b></span>
|
|
<span>HELD <b>{{ status.bars_held?.[timeframe] || 0 }} {{ timeframe }}</b></span>
|
|
</div>
|
|
</section>
|
|
<aside>
|
|
<h2>Layers</h2>
|
|
<div class="layer-group">
|
|
<label class="master"><input type="checkbox" :checked="allEnabled('1d')" @change="toggleGroup('1d', $event.target.checked)"><span class="swatch tf-1d"></span>Daily MAs</label>
|
|
<div class="periods"><label v-for="period in [10,20,50,100,200]" :key="period"><input type="checkbox" :value="period" v-model="prefs.enabled.ma['1d']">{{ period }}</label></div>
|
|
</div>
|
|
<div class="layer-group optional">
|
|
<label><input type="checkbox" :checked="allEnabled('4h')" @change="toggleGroup('4h', $event.target.checked)"><span class="swatch tf-4h"></span>4h MAs</label>
|
|
<label><input type="checkbox" :checked="allEnabled('1h')" @change="toggleGroup('1h', $event.target.checked)"><span class="swatch tf-1h"></span>1h MAs</label>
|
|
</div>
|
|
<div class="layer-group">
|
|
<label><input type="checkbox" v-model="prefs.enabled.manual"><span class="swatch manual"></span>Manual lines</label>
|
|
<label class="disabled"><input type="checkbox" disabled>Auto trendlines</label>
|
|
</div>
|
|
<label class="score-hidden"><input type="checkbox" v-model="prefs.hidden_levels_score">Hidden levels still count toward confluence</label>
|
|
<h2>Confluence zones</h2>
|
|
<div class="empty">Analysis layers arrive after aggregation.</div>
|
|
<h2>Alert log</h2>
|
|
<div class="empty">No alerts fired.</div>
|
|
</aside>
|
|
</main>
|
|
</div>
|
|
<script src="/static/chart.js"></script>
|
|
<script src="/static/app.js"></script>
|
|
</body>
|
|
</html>
|