feat(portfolio): add ChemaVX portfolio with Polymarket live metrics
This commit is contained in:
@@ -0,0 +1,20 @@
|
|||||||
|
apiVersion: argoproj.io/v1alpha1
|
||||||
|
kind: Application
|
||||||
|
metadata:
|
||||||
|
name: portfolio
|
||||||
|
namespace: argocd
|
||||||
|
spec:
|
||||||
|
project: default
|
||||||
|
source:
|
||||||
|
repoURL: http://gitea.gitea.svc.cluster.local:3000/chemavx/k8s-manifests.git
|
||||||
|
targetRevision: main
|
||||||
|
path: portfolio
|
||||||
|
destination:
|
||||||
|
server: https://kubernetes.default.svc
|
||||||
|
namespace: portfolio
|
||||||
|
syncPolicy:
|
||||||
|
automated:
|
||||||
|
prune: true
|
||||||
|
selfHeal: true
|
||||||
|
syncOptions:
|
||||||
|
- CreateNamespace=true
|
||||||
@@ -0,0 +1,326 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: ConfigMap
|
||||||
|
metadata:
|
||||||
|
name: portfolio-html
|
||||||
|
namespace: portfolio
|
||||||
|
data:
|
||||||
|
index.html: |
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>ChemaVX</title>
|
||||||
|
<style>
|
||||||
|
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
|
||||||
|
|
||||||
|
:root {
|
||||||
|
--bg: #0d1117;
|
||||||
|
--surface: #161b22;
|
||||||
|
--border: #30363d;
|
||||||
|
--text: #e6edf3;
|
||||||
|
--muted: #8b949e;
|
||||||
|
--accent: #58a6ff;
|
||||||
|
--green: #3fb950;
|
||||||
|
--red: #f85149;
|
||||||
|
--yellow: #d29922;
|
||||||
|
--purple: #bc8cff;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
background: var(--bg);
|
||||||
|
color: var(--text);
|
||||||
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
|
||||||
|
min-height: 100vh;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
padding: 3rem 1.5rem 4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Header ─────────────────────────────────── */
|
||||||
|
header {
|
||||||
|
text-align: center;
|
||||||
|
margin-bottom: 3.5rem;
|
||||||
|
}
|
||||||
|
.avatar {
|
||||||
|
width: 80px; height: 80px;
|
||||||
|
border-radius: 50%;
|
||||||
|
background: linear-gradient(135deg, #1f6feb 0%, #bc8cff 100%);
|
||||||
|
display: flex; align-items: center; justify-content: center;
|
||||||
|
font-size: 2rem; font-weight: 700; color: #fff;
|
||||||
|
margin: 0 auto 1.25rem;
|
||||||
|
box-shadow: 0 0 0 3px var(--border);
|
||||||
|
}
|
||||||
|
h1 { font-size: 2rem; font-weight: 700; letter-spacing: -0.5px; }
|
||||||
|
.tagline {
|
||||||
|
color: var(--muted); font-size: 0.95rem; margin-top: 0.4rem;
|
||||||
|
}
|
||||||
|
.dot { display: inline-block; width: 8px; height: 8px;
|
||||||
|
border-radius: 50%; background: var(--green);
|
||||||
|
margin-right: 6px; animation: pulse 2s infinite; }
|
||||||
|
@keyframes pulse {
|
||||||
|
0%, 100% { opacity: 1; }
|
||||||
|
50% { opacity: 0.4; }
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Section title ───────────────────────────── */
|
||||||
|
.section-title {
|
||||||
|
font-size: 0.7rem; font-weight: 600; letter-spacing: 0.08em;
|
||||||
|
text-transform: uppercase; color: var(--muted);
|
||||||
|
margin-bottom: 0.875rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* ── Services grid ───────────────────────────── */
|
||||||
|
.services-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
|
||||||
|
gap: 0.75rem;
|
||||||
|
width: 100%; max-width: 720px;
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
.service-card {
|
||||||
|
background: var(--surface);
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
border-radius: 10px;
|
||||||
|
padding: 1rem 1.1rem;
|
||||||
|
text-decoration: none;
|
||||||
|
color: var(--text);
|
||||||
|
transition: border-color 0.15s, transform 0.15s, box-shadow 0.15s;
|
||||||
|
display: flex; align-items: center; gap: 0.65rem;
|
||||||
|
}
|
||||||
|
.service-card:hover {
|
||||||
|
border-color: var(--accent);
|
||||||
|
transform: translateY(-2px);
|
||||||
|
box-shadow: 0 4px 16px rgba(88,166,255,0.1);
|
||||||
|
}
|
||||||
|
.service-icon { font-size: 1.3rem; flex-shrink: 0; }
|
||||||
|
.service-name { font-size: 0.9rem; font-weight: 500; }
|
||||||
|
|
||||||
|
/* ── Polymarket card ─────────────────────────── */
|
||||||
|
.poly-wrapper { width: 100%; max-width: 720px; }
|
||||||
|
.poly-card {
|
||||||
|
background: var(--surface);
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
border-radius: 12px;
|
||||||
|
padding: 1.5rem;
|
||||||
|
margin-bottom: 2.5rem;
|
||||||
|
}
|
||||||
|
.poly-header {
|
||||||
|
display: flex; align-items: center; justify-content: space-between;
|
||||||
|
margin-bottom: 1.25rem;
|
||||||
|
}
|
||||||
|
.poly-title {
|
||||||
|
display: flex; align-items: center; gap: 0.5rem;
|
||||||
|
font-size: 0.95rem; font-weight: 600;
|
||||||
|
}
|
||||||
|
.poly-badge {
|
||||||
|
font-size: 0.65rem; font-weight: 600; letter-spacing: 0.04em;
|
||||||
|
padding: 2px 7px; border-radius: 20px;
|
||||||
|
background: rgba(188,140,255,0.15); color: var(--purple);
|
||||||
|
border: 1px solid rgba(188,140,255,0.3);
|
||||||
|
}
|
||||||
|
#poly-updated {
|
||||||
|
font-size: 0.72rem; color: var(--muted);
|
||||||
|
}
|
||||||
|
|
||||||
|
.metrics-grid {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
gap: 0.75rem;
|
||||||
|
}
|
||||||
|
@media (min-width: 480px) {
|
||||||
|
.metrics-grid { grid-template-columns: repeat(4, 1fr); }
|
||||||
|
}
|
||||||
|
.metric {
|
||||||
|
background: var(--bg);
|
||||||
|
border: 1px solid var(--border);
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 0.875rem 1rem;
|
||||||
|
}
|
||||||
|
.metric-label {
|
||||||
|
font-size: 0.68rem; color: var(--muted);
|
||||||
|
text-transform: uppercase; letter-spacing: 0.06em;
|
||||||
|
margin-bottom: 0.35rem;
|
||||||
|
}
|
||||||
|
.metric-value {
|
||||||
|
font-size: 1.35rem; font-weight: 700; font-variant-numeric: tabular-nums;
|
||||||
|
transition: color 0.3s;
|
||||||
|
}
|
||||||
|
.metric-value.positive { color: var(--green); }
|
||||||
|
.metric-value.negative { color: var(--red); }
|
||||||
|
.metric-value.neutral { color: var(--text); }
|
||||||
|
.metric-value.loading { color: var(--muted); font-size: 1rem; }
|
||||||
|
|
||||||
|
/* ── Footer ──────────────────────────────────── */
|
||||||
|
footer {
|
||||||
|
color: var(--muted); font-size: 0.75rem; text-align: center;
|
||||||
|
width: 100%; max-width: 720px;
|
||||||
|
border-top: 1px solid var(--border);
|
||||||
|
padding-top: 1.25rem;
|
||||||
|
}
|
||||||
|
footer a { color: var(--accent); text-decoration: none; }
|
||||||
|
footer a:hover { text-decoration: underline; }
|
||||||
|
</style>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<div class="avatar">C</div>
|
||||||
|
<h1>ChemaVX</h1>
|
||||||
|
<p class="tagline">
|
||||||
|
<span class="dot"></span>Homelab · k3s · Self-hosted
|
||||||
|
</p>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<!-- Services -->
|
||||||
|
<div style="width:100%;max-width:720px;margin-bottom:2.5rem;">
|
||||||
|
<p class="section-title">Services</p>
|
||||||
|
<div class="services-grid">
|
||||||
|
<a class="service-card" href="https://grafana.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">📊</span>
|
||||||
|
<span class="service-name">Grafana</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://n8n.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">⚙️</span>
|
||||||
|
<span class="service-name">n8n</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://home.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">🏠</span>
|
||||||
|
<span class="service-name">Homarr</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://polymarket.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">📈</span>
|
||||||
|
<span class="service-name">Polymarket Bot</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://chat.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">🤖</span>
|
||||||
|
<span class="service-name">Open WebUI</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://git.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">🐙</span>
|
||||||
|
<span class="service-name">Gitea</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://argocd.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">🔄</span>
|
||||||
|
<span class="service-name">ArgoCD</span>
|
||||||
|
</a>
|
||||||
|
<a class="service-card" href="https://vaultwarden.chemavx.xyz" target="_blank" rel="noopener">
|
||||||
|
<span class="service-icon">🔐</span>
|
||||||
|
<span class="service-name">Vaultwarden</span>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Polymarket live metrics -->
|
||||||
|
<div class="poly-wrapper">
|
||||||
|
<p class="section-title">Polymarket Bot — Live</p>
|
||||||
|
<div class="poly-card">
|
||||||
|
<div class="poly-header">
|
||||||
|
<div class="poly-title">
|
||||||
|
<span>📈</span>
|
||||||
|
<span>Portfolio Summary</span>
|
||||||
|
<span class="poly-badge" id="poly-mode">PAPER</span>
|
||||||
|
</div>
|
||||||
|
<span id="poly-updated">Loading…</span>
|
||||||
|
</div>
|
||||||
|
<div class="metrics-grid">
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">P&L</div>
|
||||||
|
<div class="metric-value loading" id="m-pnl">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Win Rate</div>
|
||||||
|
<div class="metric-value loading" id="m-winrate">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Deployed</div>
|
||||||
|
<div class="metric-value loading" id="m-deployed">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Trades</div>
|
||||||
|
<div class="metric-value loading" id="m-trades">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Bankroll</div>
|
||||||
|
<div class="metric-value loading" id="m-bankroll">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Sharpe</div>
|
||||||
|
<div class="metric-value loading" id="m-sharpe">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Calibration</div>
|
||||||
|
<div class="metric-value loading" id="m-calibration">—</div>
|
||||||
|
</div>
|
||||||
|
<div class="metric">
|
||||||
|
<div class="metric-label">Status</div>
|
||||||
|
<div class="metric-value loading" id="m-status">—</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<p>
|
||||||
|
Hosted on <strong>k3s</strong> —
|
||||||
|
<a href="https://grafana.chemavx.xyz/d/chemavx-homelab-v1/chemavx-homelab-overview" target="_blank">Cluster Dashboard</a>
|
||||||
|
— <a href="https://git.chemavx.xyz" target="_blank">Gitea</a>
|
||||||
|
</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const API = 'https://polymarket.chemavx.xyz/api/summary';
|
||||||
|
const fmt$ = v => v == null ? '—' : '$' + v.toFixed(2);
|
||||||
|
const fmtPct = v => v == null ? '—' : (v * 100).toFixed(1) + '%';
|
||||||
|
const fmtN = v => v == null ? '—' : String(v);
|
||||||
|
const fmtF = (v, d=3) => v == null ? '—' : v.toFixed(d);
|
||||||
|
|
||||||
|
function colorClass(id, val) {
|
||||||
|
const el = document.getElementById(id);
|
||||||
|
el.classList.remove('positive','negative','neutral','loading');
|
||||||
|
if (val > 0) el.classList.add('positive');
|
||||||
|
else if (val < 0) el.classList.add('negative');
|
||||||
|
else el.classList.add('neutral');
|
||||||
|
}
|
||||||
|
|
||||||
|
async function fetchMetrics() {
|
||||||
|
try {
|
||||||
|
const r = await fetch(API, { cache: 'no-store' });
|
||||||
|
if (!r.ok) throw new Error(r.status);
|
||||||
|
const d = await r.json();
|
||||||
|
|
||||||
|
document.getElementById('m-pnl').textContent = fmt$(d.total_pnl);
|
||||||
|
document.getElementById('m-winrate').textContent = fmtPct(d.win_rate);
|
||||||
|
document.getElementById('m-deployed').textContent = fmt$(d.total_deployed);
|
||||||
|
document.getElementById('m-trades').textContent = fmtN(d.total_trades);
|
||||||
|
document.getElementById('m-bankroll').textContent = fmt$(d.paper_bankroll);
|
||||||
|
document.getElementById('m-sharpe').textContent = fmtF(d.sharpe_ratio, 2);
|
||||||
|
document.getElementById('m-calibration').textContent = fmtF(d.calibration_score, 3);
|
||||||
|
document.getElementById('m-status').textContent = d.promotion_ready ? '🚀 Ready' : '⏳ Training';
|
||||||
|
|
||||||
|
colorClass('m-pnl', d.total_pnl);
|
||||||
|
colorClass('m-sharpe', d.sharpe_ratio);
|
||||||
|
|
||||||
|
const mode = d.paper_mode ? 'PAPER' : 'LIVE';
|
||||||
|
const badge = document.getElementById('poly-mode');
|
||||||
|
badge.textContent = mode;
|
||||||
|
badge.style.background = d.paper_mode
|
||||||
|
? 'rgba(188,140,255,0.15)' : 'rgba(63,185,80,0.15)';
|
||||||
|
badge.style.color = d.paper_mode ? 'var(--purple)' : 'var(--green)';
|
||||||
|
badge.style.borderColor = d.paper_mode
|
||||||
|
? 'rgba(188,140,255,0.3)' : 'rgba(63,185,80,0.3)';
|
||||||
|
|
||||||
|
const now = new Date();
|
||||||
|
document.getElementById('poly-updated').textContent =
|
||||||
|
'Updated ' + now.toLocaleTimeString();
|
||||||
|
} catch (e) {
|
||||||
|
document.getElementById('poly-updated').textContent = 'Error: ' + e.message;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
fetchMetrics();
|
||||||
|
setInterval(fetchMetrics, 30000);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -0,0 +1,40 @@
|
|||||||
|
apiVersion: apps/v1
|
||||||
|
kind: Deployment
|
||||||
|
metadata:
|
||||||
|
name: portfolio
|
||||||
|
namespace: portfolio
|
||||||
|
spec:
|
||||||
|
replicas: 1
|
||||||
|
selector:
|
||||||
|
matchLabels:
|
||||||
|
app: portfolio
|
||||||
|
template:
|
||||||
|
metadata:
|
||||||
|
labels:
|
||||||
|
app: portfolio
|
||||||
|
spec:
|
||||||
|
containers:
|
||||||
|
- name: nginx
|
||||||
|
image: nginx:alpine
|
||||||
|
ports:
|
||||||
|
- containerPort: 80
|
||||||
|
volumeMounts:
|
||||||
|
- name: html
|
||||||
|
mountPath: /usr/share/nginx/html
|
||||||
|
readinessProbe:
|
||||||
|
httpGet:
|
||||||
|
path: /
|
||||||
|
port: 80
|
||||||
|
initialDelaySeconds: 3
|
||||||
|
periodSeconds: 10
|
||||||
|
resources:
|
||||||
|
requests:
|
||||||
|
cpu: 10m
|
||||||
|
memory: 16Mi
|
||||||
|
limits:
|
||||||
|
cpu: 100m
|
||||||
|
memory: 64Mi
|
||||||
|
volumes:
|
||||||
|
- name: html
|
||||||
|
configMap:
|
||||||
|
name: portfolio-html
|
||||||
@@ -0,0 +1,25 @@
|
|||||||
|
apiVersion: networking.k8s.io/v1
|
||||||
|
kind: Ingress
|
||||||
|
metadata:
|
||||||
|
name: portfolio
|
||||||
|
namespace: portfolio
|
||||||
|
annotations:
|
||||||
|
cert-manager.io/cluster-issuer: letsencrypt-prod
|
||||||
|
traefik.ingress.kubernetes.io/router.entrypoints: websecure
|
||||||
|
spec:
|
||||||
|
ingressClassName: traefik
|
||||||
|
rules:
|
||||||
|
- host: chemavx.xyz
|
||||||
|
http:
|
||||||
|
paths:
|
||||||
|
- path: /
|
||||||
|
pathType: Prefix
|
||||||
|
backend:
|
||||||
|
service:
|
||||||
|
name: portfolio
|
||||||
|
port:
|
||||||
|
number: 80
|
||||||
|
tls:
|
||||||
|
- hosts:
|
||||||
|
- chemavx.xyz
|
||||||
|
secretName: portfolio-tls
|
||||||
@@ -0,0 +1,4 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: Namespace
|
||||||
|
metadata:
|
||||||
|
name: portfolio
|
||||||
@@ -0,0 +1,11 @@
|
|||||||
|
apiVersion: v1
|
||||||
|
kind: Service
|
||||||
|
metadata:
|
||||||
|
name: portfolio
|
||||||
|
namespace: portfolio
|
||||||
|
spec:
|
||||||
|
selector:
|
||||||
|
app: portfolio
|
||||||
|
ports:
|
||||||
|
- port: 80
|
||||||
|
targetPort: 80
|
||||||
Reference in New Issue
Block a user