From 6d8dd24a1394da0e75bb7291101261fd332d6124 Mon Sep 17 00:00:00 2001 From: Deniz Ulker <156104354+uelkerd@users.noreply.github.com> Date: Fri, 26 Sep 2025 21:21:35 +0200 Subject: [PATCH 1/8] feat: streamline demo website with fortress compliance MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Delete docs/site/demo.html and docs/site/integration.html (unnecessary complexity) - Minimize docs/site/index.html content (remove hype, simplify to 3 features) - Add docs/site/css/styles.css (shared design system with glassmorphism) - Maintain comprehensive-demo.html as full-featured option Fortress-compliant: 4 files changed (≤5 limit) šŸ¤– Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude --- docs/site/css/styles.css | 170 +++++ docs/site/demo.html | 881 ------------------------- docs/site/index.html | 484 ++------------ docs/site/integration.html | 1274 ------------------------------------ 4 files changed, 220 insertions(+), 2589 deletions(-) create mode 100644 docs/site/css/styles.css delete mode 100644 docs/site/demo.html delete mode 100644 docs/site/integration.html diff --git a/docs/site/css/styles.css b/docs/site/css/styles.css new file mode 100644 index 000000000..44e309193 --- /dev/null +++ b/docs/site/css/styles.css @@ -0,0 +1,170 @@ +/* Shared styles for SAMO-DL website */ +:root { + /* Color palette for modern design */ + --primary-color: #6366f1; + --secondary-color: #8b5cf6; + --success-color: #10b981; + --warning-color: #f59e0b; + --danger-color: #ef4444; + --dark-color: #1f2937; + --light-color: #f9fafb; + + /* Advanced gradients */ + --primary-gradient: linear-gradient(135deg, #6366f1 0%, #8b5cf6 50%, #a855f7 100%); + --secondary-gradient: linear-gradient(135deg, #1e1b4b 0%, #312e81 50%, #3730a3 100%); + --dark-gradient: linear-gradient(135deg, #0f0f23 0%, #1a1a2e 50%, #16213e 100%); + --accent-gradient: linear-gradient(135deg, #7c3aed 0%, #9333ea 50%, #c084fc 100%); + + /* Glassmorphism effects */ + --glass-bg: rgba(139, 92, 246, 0.1); + --glass-border: rgba(139, 92, 246, 0.2); + + /* Animations and transitions */ + --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); + --transition-bounce: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55); + --shadow-glow: 0 10px 40px rgba(139, 92, 246, 0.3); + --shadow-glass: 0 8px 32px rgba(0, 0, 0, 0.3); + + /* Additional colors for compatibility */ + --accent-color: #c084fc; + --darker-color: #0a0a1a; + --light-accent: #e9d5ff; +} + +body { + font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; + line-height: 1.8; + font-size: 17px; + color: #f1f5f9; + background: var(--dark-gradient); + background-attachment: fixed; + min-height: 100vh; +} + +.navbar { + background: rgba(15, 15, 35, 0.95); + backdrop-filter: blur(20px); + border-bottom: 1px solid var(--glass-border); +} + +.footer { + background: var(--dark-gradient); + color: #f1f5f9; + padding: 80px 0 40px; + border-top: 1px solid var(--glass-border); +} + +/* Hero section styling */ +.hero-section { + background: linear-gradient(135deg, var(--primary-color), var(--secondary-color)); + color: white; + padding: 100px 0; + position: relative; + overflow: hidden; +} + +.hero-section::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: url('data:image/svg+xml,'); + opacity: 0.3; +} + +.hero-content { + position: relative; + z-index: 2; +} + +/* Button enhancements */ +.btn-primary { + background: var(--primary-gradient); + border: none; + border-radius: 12px; + padding: 12px 30px; + font-weight: 600; + transition: var(--transition-bounce); + box-shadow: var(--shadow-glow); +} + +.btn-primary:hover { + transform: translateY(-2px) scale(1.05); + box-shadow: 0 15px 50px rgba(139, 92, 246, 0.4); +} + +/* Card and component styling */ +.feature-card { + background: var(--glass-bg); + backdrop-filter: blur(15px); + border: 1px solid var(--glass-border); + border-radius: 20px; + box-shadow: var(--shadow-glass); + transition: var(--transition-bounce); + height: 100%; + color: inherit; + padding: 30px; + text-align: center; +} + +.feature-card:hover { + transform: translateY(-10px) scale(1.02); + box-shadow: var(--shadow-glow); +} + +/* Loading states and UX improvements */ +.loading-spinner { + display: inline-block; + width: 20px; + height: 20px; + border: 3px solid rgba(255, 255, 255, 0.3); + border-radius: 50%; + border-top-color: var(--primary-color); + animation: spin 1s ease-in-out infinite; +} + +@keyframes spin { + to { transform: rotate(360deg); } +} + +.status-indicator { + display: inline-block; + width: 8px; + height: 8px; + border-radius: 50%; + margin-right: 8px; +} + +.status-indicator.online { + background-color: var(--success-color); + box-shadow: 0 0 6px var(--success-color); +} + +.status-indicator.offline { + background-color: var(--danger-color); + box-shadow: 0 0 6px var(--danger-color); +} + +/* Enhanced form styling */ +.form-control:focus { + border-color: var(--primary-color); + box-shadow: 0 0 0 0.25rem rgba(99, 102, 241, 0.25); +} + +/* Responsive improvements */ +@media (max-width: 768px) { + body { + font-size: 16px; + line-height: 1.6; + } + + .feature-card { + padding: 20px; + } + + .hero-section { + padding: 60px 0; + } +} diff --git a/docs/site/demo.html b/docs/site/demo.html deleted file mode 100644 index a73d72aa0..000000000 --- a/docs/site/demo.html +++ /dev/null @@ -1,881 +0,0 @@ - - - - - - Live Emotion Detection Demo - SAMO Deep Learning - - - - - - - - - - - - - - - - - - -
-
-
-
-

- Live Emotion Detection Demo -

-

- Experience SAMO-DL's emotion detection API in real-time. Test with your own text and see instant results. -

- -
-
-
-
-
-

>90%

- F1 Score -
-
-
-
-

<50ms

- Latency -
-
-
-
-

28

- Emotions -
-
-
-
-

2.3x

- Faster -
-
-
-
-
-
-
- - -
-
-
-
-
-

Interactive Emotion Detection

-

- Enter any text below and watch our AI analyze emotions in real-time -

-
-
- - -
-
-
- - -
- -
- - -
-
-
- - -
-
- Loading... -
-

Analyzing emotions...

-
- - -
-
-
-

Analysis Results

- - -
-
-
Detected Emotions:
-
-
-
- - -
-
-
-
-
Emotion Confidence Distribution
-
- -
-
-
-
-
- - -
-
-
-
-
-
- Response Time - - -
-
- API Status - - -
-
- Avg Confidence - - -
-
- Model Version - v2.1.0 -
-
-
-
-
-
-
-
-
-
-
-
- - -
-
-
-
-
-
-
- -
-
Lightning Fast
-

- Sub-50ms response times with ONNX optimization. -

-
-
-
-
-
-
-
- -
-
High Accuracy
-

- >90% F1 score across 28 emotion categories. -

-
-
-
-
-
-
-
- -
-
Production Ready
-

- Deployed on Google Cloud Run with 99.9% uptime. -

-
-
-
-
-
-
- - - - - - - - - - diff --git a/docs/site/index.html b/docs/site/index.html index 38103159e..59c4aaf91 100644 --- a/docs/site/index.html +++ b/docs/site/index.html @@ -3,139 +3,19 @@ - SAMO Deep Learning - Production Emotion Detection API - + SAMO Deep Learning - Emotion Detection API + - - - + + - - + -
-
-
- -
Team Guides
-

Integration guides for all teams

- Learn More -
-
-
diff --git a/website/integration.html b/website/integration.html deleted file mode 100644 index de5713285..000000000 --- a/website/integration.html +++ /dev/null @@ -1,1822 +0,0 @@ - - - - - - Team Integration Guide - SAMO Deep Learning - - - - - - - - - - - - - - - - - -
-
-
-
-

Team Integration Guide

-

- Complete integration guides for backend, frontend, UX, and data science teams. - Get your team up and running with SAMO-DL in minutes. -

-
-
-
-
- - -
-
-
-
-

API Overview

-
-
Base URL
- https://samo-unified-api-frrnetyhfa-uc.a.run.app -
- -

Available Endpoints

- -
-
Health Check
- GET /health -

Check API status and model health

-
- -
-
Emotion Detection
- POST /predict -

Analyze text and return detected emotions

-
- -
-
Metrics
- GET /metrics -

Prometheus metrics for monitoring

-
-
-
-
-
- - -
-
-
-
-

- - Backend Integration Guide -

- -
-
-
-
-
Python (Flask/Django)
-

Integrate with Python web frameworks

-
    -
  • Flask integration
  • -
  • Django integration
  • -
  • FastAPI support
  • -
-
-
-
-
-
-
-
Node.js (Express)
-

Integrate with Node.js applications

-
    -
  • Express.js middleware
  • -
  • Error handling
  • -
  • Rate limiting
  • -
-
-
-
-
- -

Quick Start

- -
-
1
-
-
Install Dependencies
-
-
pip install requests
-# or
-npm install axios
-
-
-
- -
-
2
-
-
Create Integration Function
-
-
import requests
-
-def detect_emotion(text: str) -> dict:
-    """Integrate with SAMO Emotion API"""
-    try:
-         response = requests.post(
-            "https://samo-unified-api-frrnetyhfa-uc.a.run.app/analyze/journal",
-            json={"text": text},
-            headers={"Content-Type": "application/json"},
-            timeout=10
-        )
-        response.raise_for_status()
-        return response.json()
-    except requests.exceptions.RequestException as e:
-        print(f"API Error: {e}")
-        return {"error": "Failed to analyze emotions"}
-
-# Example usage
-emotions = detect_emotion("I'm feeling excited about this project!")
-print(emotions)  # [{"emotion": "excitement", "confidence": 0.92}]
-
-
-
- -
-
3
-
-
Add Error Handling
-
-
def safe_emotion_detection(text: str) -> dict:
-    """Safe emotion detection with comprehensive error handling"""
-    if not text or len(text.strip()) == 0:
-        return {"error": "Empty text provided"}
-
-    if len(text) > 1000:
-        return {"error": "Text too long (max 1000 characters)"}
-
-    try:
-        emotions = detect_emotion(text)
-        if "error" in emotions:
-            return emotions
-
-        # Validate response format
-        if not isinstance(emotions, list):
-            return {"error": "Invalid response format"}
-
-        return {"success": True, "emotions": emotions}
-    except Exception as e:
-        return {"error": f"Unexpected error: {str(e)}"}
-
-
-
-
-
-
-
- - -
-
-
-
-

- - Frontend Integration Guide -

- -
-
-
-
-
React
-

React hooks and components

-
    -
  • Custom hooks
  • -
  • Error boundaries
  • -
  • Loading states
  • -
-
-
-
-
-
-
-
Vue.js
-

Vue composables and components

-
    -
  • Composables
  • -
  • Reactive data
  • -
  • Error handling
  • -
-
-
-
-
-
-
-
Angular
-

Angular services and components

-
    -
  • Injectable services
  • -
  • Observables
  • -
  • Error handling
  • -
-
-
-
-
- -

React Integration Example

- -
-
import React, { useState } from 'react';
-
-// Custom hook for emotion detection
-const useEmotionDetection = () => {
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState(null);
-  const [emotions, setEmotions] = useState([]);
-
-  const analyzeEmotion = async (text) => {
-    setLoading(true);
-    setError(null);
-
-    try {
-      const response = await fetch(
-        'https://samo-unified-api-frrnetyhfa-uc.a.run.app/analyze/journal',
-        {
-          method: 'POST',
-          headers: { 'Content-Type': 'application/json' },
-          body: JSON.stringify({ text, generate_summary: false })
-        }
-      );
-
-      if (!response.ok) {
-        throw new Error(`HTTP error! status: ${response.status}`);
-      }
-
-      const data = await response.json();
-      setEmotions(data);
-    } catch (err) {
-      setError(err.message);
-    } finally {
-      setLoading(false);
-    }
-  };
-
-  return { analyzeEmotion, emotions, loading, error };
-};
-
-// React component
-const EmotionAnalyzer = () => {
-  const [text, setText] = useState('');
-  const { analyzeEmotion, emotions, loading, error } = useEmotionDetection();
-
-  const handleSubmit = (e) => {
-    e.preventDefault();
-    if (text.trim()) {
-      analyzeEmotion(text);
-    }
-  };
-
-  return (
-    
- -