Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>GenAI & Data Science Portfolio</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"> | |
| <style> | |
| .tab-content { | |
| display: none; | |
| } | |
| .tab-content.active { | |
| display: block; | |
| animation: fadeIn 0.5s; | |
| } | |
| @keyframes fadeIn { | |
| from { opacity: 0; } | |
| to { opacity: 1; } | |
| } | |
| .model-output { | |
| min-height: 150px; | |
| transition: all 0.3s ease; | |
| } | |
| .shap-plot { | |
| background: linear-gradient(135deg, #f5f7fa 0%, #c3cfe2 100%); | |
| border-radius: 0.5rem; | |
| } | |
| #sentiment-meter { | |
| transition: all 0.5s ease; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50 font-sans"> | |
| <!-- Header --> | |
| <header class="bg-gradient-to-r from-blue-600 to-indigo-800 text-white shadow-lg"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <div class="flex flex-col md:flex-row items-center"> | |
| <div class="md:w-1/3 mb-6 md:mb-0"> | |
| <img src="https://avatars.githubusercontent.com/u/1869139?s=400&v=4" alt="Profile" class="w-32 h-32 rounded-full border-4 border-white shadow-md mx-auto md:mx-0"> | |
| </div> | |
| <div class="md:w-2/3 text-center md:text-left"> | |
| <h1 class="text-3xl md:text-4xl font-bold mb-2">GenAI & Data Science Portfolio</h1> | |
| <p class="text-xl text-blue-100 mb-4">LLM Fine-Tuning | Prompt Engineering | Explainable AI</p> | |
| <div class="flex flex-wrap justify-center md:justify-start gap-2"> | |
| <span class="bg-blue-500 px-3 py-1 rounded-full text-sm">Hugging Face</span> | |
| <span class="bg-purple-500 px-3 py-1 rounded-full text-sm">PyTorch</span> | |
| <span class="bg-green-500 px-3 py-1 rounded-full text-sm">TensorFlow</span> | |
| <span class="bg-yellow-500 px-3 py-1 rounded-full text-sm">Streamlit</span> | |
| <span class="bg-red-500 px-3 py-1 rounded-full text-sm">SHAP</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </header> | |
| <!-- Main Content --> | |
| <main class="container mx-auto px-4 py-8"> | |
| <!-- Tabs Navigation --> | |
| <div class="flex overflow-x-auto mb-6 border-b border-gray-200"> | |
| <button class="tab-btn active px-6 py-3 font-medium text-sm border-b-2 border-blue-500 text-blue-600 bg-blue-50" data-tab="llm-playground"> | |
| <i class="fas fa-robot mr-2"></i>LLM Playground | |
| </button> | |
| <button class="tab-btn px-6 py-3 font-medium text-sm text-gray-500 hover:text-blue-600" data-tab="prompt-engineering"> | |
| <i class="fas fa-magic mr-2"></i>Prompt Engineering | |
| </button> | |
| <button class="tab-btn px-6 py-3 font-medium text-sm text-gray-500 hover:text-blue-600" data-tab="forecasting"> | |
| <i class="fas fa-chart-line mr-2"></i>Trend Forecasting | |
| </button> | |
| <button class="tab-btn px-6 py-3 font-medium text-sm text-gray-500 hover:text-blue-600" data-tab="sentiment"> | |
| <i class="fas fa-smile mr-2"></i>Sentiment Analysis | |
| </button> | |
| </div> | |
| <!-- Tab Contents --> | |
| <div class="bg-white rounded-lg shadow-md p-6"> | |
| <!-- LLM Playground Tab --> | |
| <div id="llm-playground" class="tab-content active"> | |
| <h2 class="text-2xl font-bold mb-6 text-gray-800"> | |
| <i class="fas fa-robot text-blue-500 mr-2"></i>LLM Fine-Tuning Playground | |
| </h2> | |
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-6"> | |
| <!-- Sidebar Controls --> | |
| <div class="lg:col-span-1 bg-gray-50 p-4 rounded-lg"> | |
| <h3 class="font-semibold mb-4 text-gray-700">Model Settings</h3> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Model</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"> | |
| <option>GPT-2</option> | |
| <option>T5-small</option> | |
| <option>DistilBERT</option> | |
| <option>BERT-base</option> | |
| </select> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Task</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500"> | |
| <option>Text Classification</option> | |
| <option>Summarization</option> | |
| <option>Question Answering</option> | |
| <option>Text Generation</option> | |
| </select> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Temperature</label> | |
| <input type="range" min="0" max="1" step="0.1" value="0.7" class="w-full"> | |
| <div class="flex justify-between text-xs text-gray-500"> | |
| <span>Precise</span> | |
| <span>Creative</span> | |
| </div> | |
| </div> | |
| <button class="w-full bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-md transition duration-300"> | |
| <i class="fas fa-play mr-2"></i>Run Model | |
| </button> | |
| </div> | |
| <!-- Main Content --> | |
| <div class="lg:col-span-2"> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Input Text</label> | |
| <textarea class="w-full p-3 border border-gray-300 rounded-md focus:ring-blue-500 focus:border-blue-500 h-32" placeholder="Enter your text here...">The quick brown fox jumps over the lazy dog. This sentence contains all the letters in the English alphabet.</textarea> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Model Output</label> | |
| <div class="model-output bg-gray-50 p-4 rounded-md border border-gray-200"> | |
| <div class="flex items-center mb-2"> | |
| <div class="h-2.5 w-2.5 rounded-full bg-blue-500 mr-2"></div> | |
| <span class="text-sm font-medium">Text Classification</span> | |
| </div> | |
| <p class="text-gray-700">This text is likely an example sentence used for typing practice (probability: 87%).</p> | |
| </div> | |
| </div> | |
| <div class="bg-blue-50 p-4 rounded-md border border-blue-200"> | |
| <h4 class="font-medium text-blue-800 mb-2"> | |
| <i class="fas fa-info-circle mr-2"></i>Fine-Tuning Details | |
| </h4> | |
| <p class="text-sm text-blue-700">This model was fine-tuned on a custom dataset of 10,000 example sentences using PyTorch and Hugging Face Transformers. Achieved 92% accuracy on validation set.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Prompt Engineering Tab --> | |
| <div id="prompt-engineering" class="tab-content"> | |
| <h2 class="text-2xl font-bold mb-6 text-gray-800"> | |
| <i class="fas fa-magic text-purple-500 mr-2"></i>Prompt Engineering Toolkit | |
| </h2> | |
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-6"> | |
| <!-- Sidebar Controls --> | |
| <div class="lg:col-span-1 bg-gray-50 p-4 rounded-lg"> | |
| <h3 class="font-semibold mb-4 text-gray-700">Prompt Strategy</h3> | |
| <div class="space-y-4"> | |
| <div class="flex items-center"> | |
| <input id="zero-shot" name="prompt-strategy" type="radio" class="h-4 w-4 text-purple-600 focus:ring-purple-500" checked> | |
| <label for="zero-shot" class="ml-3 block text-sm font-medium text-gray-700">Zero-Shot</label> | |
| </div> | |
| <div class="flex items-center"> | |
| <input id="few-shot" name="prompt-strategy" type="radio" class="h-4 w-4 text-purple-600 focus:ring-purple-500"> | |
| <label for="few-shot" class="ml-3 block text-sm font-medium text-gray-700">Few-Shot (3 examples)</label> | |
| </div> | |
| <div class="flex items-center"> | |
| <input id="cot" name="prompt-strategy" type="radio" class="h-4 w-4 text-purple-600 focus:ring-purple-500"> | |
| <label for="cot" class="ml-3 block text-sm font-medium text-gray-700">Chain-of-Thought</label> | |
| </div> | |
| <div class="flex items-center"> | |
| <input id="react" name="prompt-strategy" type="radio" class="h-4 w-4 text-purple-600 focus:ring-purple-500"> | |
| <label for="react" class="ml-3 block text-sm font-medium text-gray-700">ReAct</label> | |
| </div> | |
| </div> | |
| <div class="mt-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Model</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-purple-500 focus:border-purple-500"> | |
| <option>GPT-3.5</option> | |
| <option>GPT-4</option> | |
| <option>Claude 2</option> | |
| <option>LLaMA 2</option> | |
| </select> | |
| </div> | |
| <button class="w-full mt-6 bg-purple-600 hover:bg-purple-700 text-white py-2 px-4 rounded-md transition duration-300"> | |
| <i class="fas fa-wand-magic-sparkles mr-2"></i>Generate Prompt | |
| </button> | |
| </div> | |
| <!-- Main Content --> | |
| <div class="lg:col-span-2"> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Task Description</label> | |
| <input type="text" class="w-full p-3 border border-gray-300 rounded-md focus:ring-purple-500 focus:border-purple-500" value="Determine if this product review is positive or negative"> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Generated Prompt</label> | |
| <div class="model-output bg-gray-50 p-4 rounded-md border border-gray-200"> | |
| <p class="text-gray-700 font-mono text-sm">Classify the following product review as either "positive" or "negative":</p> | |
| <p class="text-gray-700 font-mono text-sm mt-2">"{review_text}"</p> | |
| <p class="text-gray-700 font-mono text-sm mt-2">Answer:</p> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-1 md:grid-cols-2 gap-4"> | |
| <div class="bg-purple-50 p-4 rounded-md border border-purple-200"> | |
| <h4 class="font-medium text-purple-800 mb-2"> | |
| <i class="fas fa-lightbulb mr-2"></i>Strategy Benefits | |
| </h4> | |
| <ul class="text-sm text-purple-700 list-disc pl-5"> | |
| <li class="mb-1">No training examples needed</li> | |
| <li class="mb-1">Fastest to implement</li> | |
| <li>Works for broad tasks</li> | |
| </ul> | |
| </div> | |
| <div class="bg-purple-50 p-4 rounded-md border border-purple-200"> | |
| <h4 class="font-medium text-purple-800 mb-2"> | |
| <i class="fas fa-exclamation-triangle mr-2"></i>Limitations | |
| </h4> | |
| <ul class="text-sm text-purple-700 list-disc pl-5"> | |
| <li class="mb-1">Lower accuracy on niche tasks</li> | |
| <li class="mb-1">May require prompt tuning</li> | |
| <li>Vulnerable to ambiguous tasks</li> | |
| </ul> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Trend Forecasting Tab --> | |
| <div id="forecasting" class="tab-content"> | |
| <h2 class="text-2xl font-bold mb-6 text-gray-800"> | |
| <i class="fas fa-chart-line text-green-500 mr-2"></i>Social Trend Forecasting | |
| </h2> | |
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-6"> | |
| <!-- Sidebar Controls --> | |
| <div class="lg:col-span-1 bg-gray-50 p-4 rounded-lg"> | |
| <h3 class="font-semibold mb-4 text-gray-700">Forecast Settings</h3> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Model</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-green-500 focus:border-green-500"> | |
| <option>Prophet</option> | |
| <option>ARIMA</option> | |
| <option>LSTM</option> | |
| <option>XGBoost</option> | |
| </select> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Horizon (days)</label> | |
| <input type="number" min="1" max="30" value="7" class="w-full p-2 border border-gray-300 rounded-md focus:ring-green-500 focus:border-green-500"> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Upload Data</label> | |
| <div class="mt-1 flex justify-center px-6 pt-5 pb-6 border-2 border-gray-300 border-dashed rounded-md"> | |
| <div class="space-y-1 text-center"> | |
| <div class="flex text-sm text-gray-600"> | |
| <label class="relative cursor-pointer bg-white rounded-md font-medium text-green-600 hover:text-green-500 focus-within:outline-none"> | |
| <span>Upload CSV</span> | |
| <input type="file" class="sr-only"> | |
| </label> | |
| </div> | |
| <p class="text-xs text-gray-500">or drag and drop</p> | |
| </div> | |
| </div> | |
| </div> | |
| <button class="w-full bg-green-600 hover:bg-green-700 text-white py-2 px-4 rounded-md transition duration-300"> | |
| <i class="fas fa-chart-bar mr-2"></i>Generate Forecast | |
| </button> | |
| </div> | |
| <!-- Main Content --> | |
| <div class="lg:col-span-2"> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Forecast Visualization</label> | |
| <div class="bg-white p-4 rounded-md border border-gray-200"> | |
| <div class="shap-plot h-64 flex items-center justify-center"> | |
| <div class="text-center"> | |
| <i class="fas fa-chart-line text-4xl text-gray-300 mb-2"></i> | |
| <p class="text-gray-500">Forecast visualization will appear here</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">SHAP Explanation</label> | |
| <div class="bg-white p-4 rounded-md border border-gray-200"> | |
| <div class="shap-plot h-64 flex items-center justify-center"> | |
| <div class="text-center"> | |
| <i class="fas fa-brain text-4xl text-gray-300 mb-2"></i> | |
| <p class="text-gray-500">Feature importance analysis will appear here</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-green-50 p-4 rounded-md border border-green-200"> | |
| <h4 class="font-medium text-green-800 mb-2"> | |
| <i class="fas fa-project-diagram mr-2"></i>Model Architecture | |
| </h4> | |
| <p class="text-sm text-green-700">This forecasting pipeline combines time-series analysis with social media metadata (likes, shares, author credibility) to predict virality. The SHAP explainer highlights which features most influence predictions.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Sentiment Analysis Tab --> | |
| <div id="sentiment" class="tab-content"> | |
| <h2 class="text-2xl font-bold mb-6 text-gray-800"> | |
| <i class="fas fa-smile text-yellow-500 mr-2"></i>Real-Time Sentiment Analysis | |
| </h2> | |
| <div class="grid grid-cols-1 lg:grid-cols-3 gap-6"> | |
| <!-- Sidebar Controls --> | |
| <div class="lg:col-span-1 bg-gray-50 p-4 rounded-lg"> | |
| <h3 class="font-semibold mb-4 text-gray-700">Model Settings</h3> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Model</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-yellow-500 focus:border-yellow-500"> | |
| <option>DistilBERT (fine-tuned)</option> | |
| <option>RoBERTa-base</option> | |
| <option>VADER</option> | |
| <option>Custom Ensemble</option> | |
| </select> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Confidence Threshold</label> | |
| <input type="range" min="50" max="95" step="5" value="75" class="w-full"> | |
| <div class="flex justify-between text-xs text-gray-500"> | |
| <span>50%</span> | |
| <span>95%</span> | |
| </div> | |
| </div> | |
| <div class="mb-4"> | |
| <label class="block text-sm font-medium text-gray-700 mb-1">Output Format</label> | |
| <select class="w-full p-2 border border-gray-300 rounded-md focus:ring-yellow-500 focus:border-yellow-500"> | |
| <option>Simple (Positive/Neutral/Negative)</option> | |
| <option>Detailed (0-100 scale)</option> | |
| <option>Emoji Visualization</option> | |
| </select> | |
| </div> | |
| <button class="w-full bg-yellow-600 hover:bg-yellow-700 text-white py-2 px-4 rounded-md transition duration-300"> | |
| <i class="fas fa-play mr-2"></i>Analyze Text | |
| </button> | |
| </div> | |
| <!-- Main Content --> | |
| <div class="lg:col-span-2"> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Input Text</label> | |
| <textarea class="w-full p-3 border border-gray-300 rounded-md focus:ring-yellow-500 focus:border-yellow-500 h-32" placeholder="Enter your text here...">I'm absolutely thrilled with this product! It exceeded all my expectations and arrived earlier than promised. The quality is outstanding and worth every penny.</textarea> | |
| </div> | |
| <div class="mb-6"> | |
| <label class="block text-sm font-medium text-gray-700 mb-2">Sentiment Analysis</label> | |
| <div class="bg-white p-6 rounded-md border border-gray-200"> | |
| <div class="flex items-center justify-between mb-4"> | |
| <div> | |
| <span class="text-lg font-semibold">Positive</span> | |
| <span class="ml-2 text-sm text-gray-500">(94% confidence)</span> | |
| </div> | |
| <div class="w-24 h-6 bg-gray-200 rounded-full overflow-hidden"> | |
| <div id="sentiment-meter" class="h-full bg-gradient-to-r from-red-500 via-yellow-400 to-green-500" style="width: 94%"></div> | |
| </div> | |
| </div> | |
| <div class="grid grid-cols-3 gap-2 text-center"> | |
| <div class="bg-red-50 p-2 rounded"> | |
| <span class="block text-xs text-red-600">Negative</span> | |
| <span class="block text-sm font-medium text-red-800">2%</span> | |
| </div> | |
| <div class="bg-yellow-50 p-2 rounded"> | |
| <span class="block text-xs text-yellow-600">Neutral</span> | |
| <span class="block text-sm font-medium text-yellow-800">4%</span> | |
| </div> | |
| <div class="bg-green-50 p-2 rounded"> | |
| <span class="block text-xs text-green-600">Positive</span> | |
| <span class="block text-sm font-medium text-green-800">94%</span> | |
| </div> | |
| </div> | |
| <div class="mt-4"> | |
| <h4 class="text-sm font-medium text-gray-700 mb-2">Key Sentiment Drivers</h4> | |
| <div class="flex flex-wrap gap-2"> | |
| <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">thrilled (+0.42)</span> | |
| <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">exceeded (+0.38)</span> | |
| <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">outstanding (+0.35)</span> | |
| <span class="px-2 py-1 bg-green-100 text-green-800 text-xs rounded-full">earlier (+0.28)</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="bg-yellow-50 p-4 rounded-md border border-yellow-200"> | |
| <h4 class="font-medium text-yellow-800 mb-2"> | |
| <i class="fas fa-cogs mr-2"></i>Model Details | |
| </h4> | |
| <p class="text-sm text-yellow-700">This sentiment analyzer was fine-tuned on 50,000 product reviews from multiple domains. Achieves 89% accuracy on held-out test data with F1-score of 0.91 for positive/negative classification.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </main> | |
| <!-- Footer --> | |
| <footer class="bg-gray-800 text-white mt-12"> | |
| <div class="container mx-auto px-4 py-8"> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8"> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">About This Portfolio</h3> | |
| <p class="text-gray-300 text-sm">Showcasing practical applications of Generative AI and Data Science with a focus on explainability and production-ready implementations.</p> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Technologies Used</h3> | |
| <ul class="text-gray-300 text-sm space-y-2"> | |
| <li><i class="fas fa-check-circle text-blue-400 mr-2"></i>Hugging Face Transformers</li> | |
| <li><i class="fas fa-check-circle text-blue-400 mr-2"></i>PyTorch & TensorFlow</li> | |
| <li><i class="fas fa-check-circle text-blue-400 mr-2"></i>SHAP & LIME</li> | |
| <li><i class="fas fa-check-circle text-blue-400 mr-2"></i>Streamlit & Plotly</li> | |
| </ul> | |
| </div> | |
| <div> | |
| <h3 class="text-lg font-semibold mb-4">Contact</h3> | |
| <p class="text-gray-300 text-sm mb-2"><i class="fas fa-envelope mr-2"></i>data.scientist@example.com</p> | |
| <p class="text-gray-300 text-sm mb-4"><i class="fas fa-link mr-2"></i>linkedin.com/in/datascientist</p> | |
| <button class="bg-blue-600 hover:bg-blue-700 text-white py-2 px-4 rounded-md transition duration-300"> | |
| <i class="fas fa-paper-plane mr-2"></i>Get in Touch | |
| </button> | |
| </div> | |
| </div> | |
| <div class="border-t border-gray-700 mt-8 pt-8 text-center text-gray-400 text-sm"> | |
| <p>© 2023 GenAI & Data Science Portfolio. All demos use placeholder models or public APIs.</p> | |
| </div> | |
| </div> | |
| </footer> | |
| <script> | |
| // Tab switching functionality | |
| document.addEventListener('DOMContentLoaded', function() { | |
| const tabButtons = document.querySelectorAll('.tab-btn'); | |
| const tabContents = document.querySelectorAll('.tab-content'); | |
| tabButtons.forEach(button => { | |
| button.addEventListener('click', function() { | |
| const tabId = this.getAttribute('data-tab'); | |
| // Remove active class from all buttons and contents | |
| tabButtons.forEach(btn => btn.classList.remove('active', 'border-blue-500', 'text-blue-600', 'bg-blue-50')); | |
| tabContents.forEach(content => content.classList.remove('active')); | |
| // Add active class to clicked button and corresponding content | |
| this.classList.add('active', 'border-blue-500', 'text-blue-600', 'bg-blue-50'); | |
| document.getElementById(tabId).classList.add('active'); | |
| }); | |
| }); | |
| // Simulate sentiment meter animation | |
| const sentimentInput = document.querySelector('textarea'); | |
| sentimentInput.addEventListener('input', function() { | |
| const text = this.value.toLowerCase(); | |
| let sentiment = 50; // neutral | |
| if (text.includes('thrilled') || text.includes('exceeded') || text.includes('outstanding')) { | |
| sentiment = 90 + Math.random() * 10; | |
| } else if (text.includes('disappointed') || text.includes('terrible') || text.includes('awful')) { | |
| sentiment = 10 + Math.random() * 10; | |
| } else if (text.length > 20) { | |
| // Simple heuristic based on text length | |
| sentiment = 50 + (text.length % 40); | |
| </html> |