Spaces:

Really-amin
/

Datasourceforcryptocurrency

Running

App Files Files Community

Datasourceforcryptocurrency / ADMIN_HTML_INTEGRATION.md

Really-amin

Upload 378 files

deedeab verified 6 days ago

preview code

raw

history blame contribute delete

7.51 kB

Admin.html Integration Guide

✅ فایل HTML بدون تغییر

فایل admin.html شما کاملاً compatible با backend جدید است و نیازی به تغییر ندارد چون:

✅ تمام endpoint های مورد نیاز پیاده شده
✅ Response structure ها سازگار هستند
✅ WebSocket support اضافه شده
✅ JavaScript modules با backend sync هستند

📁 ساختار فایل‌ها

admin.html
└── static/js/
    ├── app.js              # Main app initializer
    ├── apiClient.js        # API wrapper (✅ compatible)
    ├── wsClient.js         # WebSocket client (✅ compatible)
    ├── overviewView.js     # Overview tab
    ├── marketView.js       # Market tab
    ├── newsView.js         # News tab
    ├── chartLabView.js     # Charts tab
    ├── aiAdvisorView.js    # AI Sentiment tab
    ├── datasetsModelsView.js  # Datasets & Models tab
    ├── apiExplorerView.js  # API Explorer tab
    ├── debugConsoleView.js # Diagnostics tab
    ├── providersView.js    # Providers tab
    └── settingsView.js     # Settings tab

🔌 API Endpoints Mapping

apiClient.js Calls → Backend Endpoints

Frontend Call	Backend Endpoint	Status
`getHealth()`	`GET /api/health`	✅
`getTopCoins(limit)`	`GET /api/coins/top?limit={limit}`	✅
`getCoinDetails(symbol)`	`GET /api/coins/{symbol}`	✅
`getMarketStats()`	`GET /api/market/stats`	✅
`getLatestNews(limit)`	`GET /api/news/latest?limit={limit}`	✅
`getProviders()`	`GET /api/providers`	✅
`getPriceChart(symbol, timeframe)`	`GET /api/charts/price/{symbol}?timeframe={timeframe}`	✅
`analyzeChart(payload)`	`POST /api/charts/analyze`	✅
`runQuery(payload)`	`POST /api/query`	✅
`analyzeSentiment(payload)`	`POST /api/sentiment/analyze`	✅
`summarizeNews(item)`	`POST /api/news/summarize`	✅
`getDatasetsList()`	`GET /api/datasets/list`	✅
`getDatasetSample(name)`	`GET /api/datasets/sample?name={name}`	✅
`getModelsList()`	`GET /api/models/list`	✅
`testModel(payload)`	`POST /api/models/test`	✅

WebSocket

Frontend	Backend	Status
`wsClient.connect()` → `ws://host/ws`	`WS /ws`	✅
Message format: `{type, payload}`	Same	✅

🔄 Response Structure Compatibility

Example: GET /api/coins/top

Frontend expects:

{
  success: true,
  coins: [
    {
      rank: 1,
      symbol: "BTC",
      name: "Bitcoin",
      price: 45000,
      price_change_24h: 2.5,
      volume_24h: 25000000000,
      market_cap: 850000000000
    }
  ],
  count: 10
}

Backend returns: ✅ Same structure

Example: GET /api/market/stats

Frontend expects:

{
  success: true,
  stats: {
    total_market_cap: 1500000000000,
    total_volume_24h: 75000000000,
    btc_dominance: 45.5,
    eth_dominance: 18.2
  }
}

Backend returns: ✅ Same structure

Example: POST /api/sentiment/analyze

Frontend sends:

{
  text: "Bitcoin is breaking new ATH!"
}

Backend returns:

{
  success: true,
  sentiment: "bullish",
  confidence: 0.89,
  details: {
    label: "bullish",
    confidence: 0.89,
    scores: {...},
    model_count: 2
  }
}

✅ Frontend compatible

🎨 CSS Files

تمام CSS files موجود هستند:

✅ static/css/design-tokens.css
✅ static/css/design-system.css
✅ static/css/dashboard.css
✅ static/css/pro-dashboard.css

🚀 Deployment

Step 1: Copy files

# Admin HTML
cp admin.html /path/to/project/admin.html

# Ensure static files exist
ls static/css/
ls static/js/

Step 2: Start backend

uvicorn hf_unified_server:app --host 0.0.0.0 --port 7860

Step 3: Access dashboard

http://localhost:7860/
# یا
http://localhost:7860/admin.html

✅ Checklist

Backend Endpoints

/api/health - Working
/api/coins/top - Returns top coins
/api/coins/{symbol} - Returns coin details
/api/market/stats - Returns market stats
/api/news/latest - Returns news with sentiment
/api/charts/price/{symbol} - Returns price chart
/api/charts/analyze - Returns chart analysis
/api/sentiment/analyze - Ensemble sentiment
/api/query - NLP query
/api/providers - Provider list
/api/datasets/list - Dataset list
/api/datasets/sample - Dataset sample
/api/models/list - Model list
/api/models/test - Model test
/ws - WebSocket real-time

Frontend Features

Overview tab - Shows market stats + top coins
Market tab - Interactive coins table
Chart Lab - Price charts + AI analysis
Sentiment & AI - Sentiment analyzer
News tab - News with sentiment badges
Providers tab - Provider list
API Explorer - Endpoint list
Diagnostics - Health & logs
Datasets & Models - HF integration
Settings - Preferences

WebSocket Features

Auto-connect on page load
Real-time market updates (10s interval)
Connection status indicator
Auto-reconnect on disconnect

🐛 Troubleshooting

Problem: 404 on endpoints

Solution: مطمئن شوید backend running است:

curl http://localhost:7860/api/health

Problem: WebSocket connection failed

Solution: چک کردن CORS و WebSocket config:

# در hf_unified_server.py
app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

Problem: Sentiment returns neutral

Solution: اولین بار model download می‌کنه (~30s):

# Check logs
docker logs crypto-hub
# یا
tail -f logs/app.log

Problem: Dataset sample empty

Solution: بعضی datasets نیاز به authentication دارند:

export HF_TOKEN=your_token

🎯 Testing

Quick Test Script

#!/bin/bash

# Health check
echo "Testing health..."
curl http://localhost:7860/api/health

# Top coins
echo -e "\n\nTesting coins..."
curl http://localhost:7860/api/coins/top?limit=5

# Market stats
echo -e "\n\nTesting market stats..."
curl http://localhost:7860/api/market/stats

# Sentiment
echo -e "\n\nTesting sentiment..."
curl -X POST http://localhost:7860/api/sentiment/analyze \
  -H "Content-Type: application/json" \
  -d '{"text": "Bitcoin breaking ATH!"}'

# Models
echo -e "\n\nTesting models..."
curl http://localhost:7860/api/models/list

# Datasets
echo -e "\n\nTesting datasets..."
curl http://localhost:7860/api/datasets/list

echo -e "\n\n✅ All tests completed"

📝 Notes

No changes needed to admin.html
JavaScript modules کاملاً compatible هستند
Sentiment از ensemble models استفاده می‌کند
WebSocket هر 10 ثانیه update می‌فرستد
Dataset sampling نیاز به HF_TOKEN دارد

🎉 Result

admin.html بدون هیچ تغییری کار می‌کند!

فقط کافیه:

Backend رو run کنید
admin.html رو باز کنید
همه features کار می‌کنند ✅

تاریخ: 2025-11-18
نسخه: v5.0.0-hf-integrated
Status: Production Ready 🚀