Viblo 2.0

core/migrations/0001_initial.py

@@ -0,0 +1,48 @@
+# Generated by Django 5.2.7 on 2026-02-08 03:43
+
+import django.db.models.deletion
+import django.utils.timezone
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='Project',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('title', models.CharField(max_length=255)),
+                ('description', models.TextField(blank=True)),
+                ('created_at', models.DateTimeField(default=django.utils.timezone.now)),
+                ('updated_at', models.DateTimeField(auto_now=True)),
+                ('status', models.CharField(choices=[('draft', 'Draft'), ('scripting', 'Scripting'), ('processing', 'Processing'), ('completed', 'Completed')], default='draft', max_length=20)),
+            ],
+        ),
+        migrations.CreateModel(
+            name='MediaAsset',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('file', models.FileField(upload_to='assets/%Y/%m/%d/')),
+                ('asset_type', models.CharField(choices=[('video', 'Video'), ('audio', 'Audio'), ('image', 'Image')], max_length=10)),
+                ('original_name', models.CharField(max_length=255)),
+                ('created_at', models.DateTimeField(default=django.utils.timezone.now)),
+                ('project', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='assets', to='core.project')),
+            ],
+        ),
+        migrations.CreateModel(
+            name='Script',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('prompt', models.TextField()),
+                ('content', models.TextField()),
+                ('created_at', models.DateTimeField(default=django.utils.timezone.now)),
+                ('project', models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='scripts', to='core.project')),
+            ],
+        ),
+    ]

core/models.py

@@ -1,3 +1,44 @@
 from django.db import models
+from django.utils import timezone
 
-# Create your models here.
+class Project(models.Model):
+    STATUS_CHOICES = [
+        ('draft', 'Draft'),
+        ('scripting', 'Scripting'),
+        ('processing', 'Processing'),
+        ('completed', 'Completed'),
+    ]
+    
+    title = models.CharField(max_length=255)
+    description = models.TextField(blank=True)
+    created_at = models.DateTimeField(default=timezone.now)
+    updated_at = models.DateTimeField(auto_now=True)
+    status = models.CharField(max_length=20, choices=STATUS_CHOICES, default='draft')
+    
+    def __str__(self):
+        return self.title
+
+class Script(models.Model):
+    project = models.ForeignKey(Project, on_delete=models.CASCADE, related_name='scripts')
+    prompt = models.TextField()
+    content = models.TextField()  # JSON or structured text from AI
+    created_at = models.DateTimeField(default=timezone.now)
+    
+    def __str__(self):
+        return f"Script for {self.project.title} ({self.created_at.strftime('%Y-%m-%d')})"
+
+class MediaAsset(models.Model):
+    ASSET_TYPE_CHOICES = [
+        ('video', 'Video'),
+        ('audio', 'Audio'),
+        ('image', 'Image'),
+    ]
+    
+    project = models.ForeignKey(Project, on_delete=models.CASCADE, related_name='assets')
+    file = models.FileField(upload_to='assets/%Y/%m/%d/')
+    asset_type = models.CharField(max_length=10, choices=ASSET_TYPE_CHOICES)
+    original_name = models.CharField(max_length=255)
+    created_at = models.DateTimeField(default=timezone.now)
+    
+    def __str__(self):
+        return self.original_name

core/templates/base.html

@@ -1,25 +1,165 @@
+{% load static %}
 <!DOCTYPE html>
 <html lang="en">
-
 <head>
     <meta charset="UTF-8">
-  <title>{% block title %}Knowledge Base{% endblock %}</title>
-  {% if project_description %}
-  <meta name="description" content="{{ project_description }}">
-  <meta property="og:description" content="{{ project_description }}">
-  <meta property="twitter:description" content="{{ project_description }}">
-  {% endif %}
-  {% if project_image_url %}
-  <meta property="og:image" content="{{ project_image_url }}">
-  <meta property="twitter:image" content="{{ project_image_url }}">
-  {% endif %}
-  {% load static %}
-  <link rel="stylesheet" href="{% static 'css/custom.css' %}?v={{ deployment_timestamp }}">
-  {% block head %}{% endblock %}
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{{ title|default:"AI Video Creator" }}</title>
+    <meta name="description" content="AI-powered short-form video creation studio.">
+    
+    <!-- Google Fonts: Inter & Outfit -->
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@600;700;800&display=swap" rel="stylesheet">
+    
+    <!-- Bootstrap 5 CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    
+    <!-- Custom Dark Studio Styles -->
+    <style>
+        :root {
+            --bg-deep: #0f172a;
+            --bg-surface: #1e293b;
+            --bg-elevated: #334155;
+            --accent: #8b5cf6;
+            --accent-glow: rgba(139, 92, 246, 0.4);
+            --text-primary: #f8fafc;
+            --text-secondary: #94a3b8;
+            --border-color: rgba(255, 255, 255, 0.08);
+        }
+
+        body {
+            background-color: var(--bg-deep);
+            color: var(--text-primary);
+            font-family: 'Inter', sans-serif;
+            margin: 0;
+            padding: 0;
+            min-height: 100vh;
+        }
+
+        h1, h2, h3, h4, .font-heading {
+            font-family: 'Outfit', sans-serif;
+        }
+
+        .navbar {
+            background-color: rgba(15, 23, 42, 0.8);
+            backdrop-filter: blur(12px);
+            border-bottom: 1px solid var(--border-color);
+            padding: 1rem 0;
+        }
+
+        .navbar-brand {
+            font-family: 'Outfit', sans-serif;
+            font-weight: 800;
+            font-size: 1.5rem;
+            color: var(--text-primary) !important;
+            letter-spacing: -0.02em;
+        }
+
+        .navbar-brand span {
+            background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+        }
+
+        .btn-accent {
+            background: linear-gradient(135deg, #a78bfa 0%, #8b5cf6 100%);
+            color: white;
+            border: none;
+            font-weight: 600;
+            padding: 0.75rem 1.5rem;
+            border-radius: 12px;
+            transition: all 0.2s ease;
+            box-shadow: 0 4px 12px var(--accent-glow);
+        }
+
+        .btn-accent:hover {
+            transform: translateY(-2px);
+            box-shadow: 0 8px 20px var(--accent-glow);
+            color: white;
+        }
+
+        .card-studio {
+            background-color: var(--bg-surface);
+            border: 1px solid var(--border-color);
+            border-radius: 20px;
+            padding: 1.5rem;
+            transition: all 0.3s ease;
+        }
+
+        .card-studio:hover {
+            border-color: var(--accent);
+            transform: translateY(-4px);
+        }
+
+        .text-gradient {
+            background: linear-gradient(135deg, #f8fafc 0%, #94a3b8 100%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+        }
+
+        .glass-panel {
+            background: rgba(30, 41, 59, 0.7);
+            backdrop-filter: blur(10px);
+            border: 1px solid var(--border-color);
+            border-radius: 24px;
+        }
+
+        .status-badge {
+            padding: 0.25rem 0.75rem;
+            border-radius: 20px;
+            font-size: 0.75rem;
+            font-weight: 600;
+            text-transform: uppercase;
+        }
+
+        .status-draft { background: #334155; color: #f8fafc; }
+        .status-scripting { background: rgba(139, 92, 246, 0.2); color: #a78bfa; }
+        .status-completed { background: rgba(16, 185, 129, 0.2); color: #10b981; }
+
+        footer {
+            padding: 4rem 0 2rem;
+            color: var(--text-secondary);
+            font-size: 0.9rem;
+        }
+    </style>
+    {% block extra_head %}{% endblock %}
 </head>
-
 <body>
-  {% block content %}{% endblock %}
-</body>
 
+    <nav class="navbar navbar-expand-lg sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="{% url 'index' %}">
+                AI<span>Creator</span>
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item">
+                        <a class="nav-link text-white-50 px-3" href="/admin/">Admin</a>
+                    </li>
+                    <li class="nav-item">
+                        <a class="btn btn-accent ms-lg-3" href="{% url 'index' %}">Studio Dashboard</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <main class="py-5">
+        {% block content %}{% endblock %}
+    </main>
+
+    <footer class="text-center">
+        <div class="container border-top border-white-10 pt-4">
+            <p>© 2026 AI Video Creator Studio. Built for Unlimited Creation.</p>
+        </div>
+    </footer>
+
+    <!-- Bootstrap JS -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+    {% block extra_js %}{% endblock %}
+</body>
 </html>

core/templates/core/index.html

@@ -1,145 +1,57 @@
-{% extends "base.html" %}
-
-{% block title %}{{ project_name }}{% endblock %}
-
-{% block head %}
-<link rel="preconnect" href="https://fonts.googleapis.com">
-<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
-<style>
-  :root {
-    --bg-color-start: #6a11cb;
-    --bg-color-end: #2575fc;
-    --text-color: #ffffff;
-    --card-bg-color: rgba(255, 255, 255, 0.01);
-    --card-border-color: rgba(255, 255, 255, 0.1);
-  }
-
-  * {
-    box-sizing: border-box;
-  }
-
-  body {
-    margin: 0;
-    font-family: 'Inter', sans-serif;
-    background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
-    color: var(--text-color);
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    min-height: 100vh;
-    text-align: center;
-    overflow: hidden;
-    position: relative;
-  }
-
-  body::before {
-    content: '';
-    position: absolute;
-    inset: 0;
-    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100'><path d='M-10 10L110 10M10 -10L10 110' stroke-width='1' stroke='rgba(255,255,255,0.05)'/></svg>");
-    animation: bg-pan 20s linear infinite;
-    z-index: -1;
-  }
-
-  @keyframes bg-pan {
-    0% {
-      background-position: 0% 0%;
-    }
-
-    100% {
-      background-position: 100% 100%;
-    }
-  }
-
-  main {
-    padding: 2rem;
-  }
-
-  .card {
-    background: var(--card-bg-color);
-    border: 1px solid var(--card-border-color);
-    border-radius: 16px;
-    padding: 2.5rem 2rem;
-    backdrop-filter: blur(20px);
-    -webkit-backdrop-filter: blur(20px);
-    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.25);
-  }
-
-  h1 {
-    font-size: clamp(2.2rem, 3vw + 1.2rem, 3.2rem);
-    font-weight: 700;
-    margin: 0 0 1.2rem;
-    letter-spacing: -0.02em;
-  }
-
-  p {
-    margin: 0.5rem 0;
-    font-size: 1.1rem;
-    opacity: 0.92;
-  }
-
-  .loader {
-    margin: 1.5rem auto;
-    width: 56px;
-    height: 56px;
-    border: 4px solid rgba(255, 255, 255, 0.25);
-    border-top-color: #fff;
-    border-radius: 50%;
-    animation: spin 1s linear infinite;
-  }
-
-  @keyframes spin {
-    to {
-      transform: rotate(360deg);
-    }
-  }
-
-  .runtime code {
-    background: rgba(0, 0, 0, 0.25);
-    padding: 0.15rem 0.45rem;
-    border-radius: 4px;
-    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-  }
-
-  .sr-only {
-    position: absolute;
-    width: 1px;
-    height: 1px;
-    padding: 0;
-    margin: -1px;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    border: 0;
-  }
-
-  footer {
-    position: absolute;
-    bottom: 1rem;
-    width: 100%;
-    text-align: center;
-    font-size: 0.85rem;
-    opacity: 0.75;
-  }
-</style>
-{% endblock %}
+{% extends 'base.html' %}
 
 {% block content %}
-<main>
-  <div class="card">
-    <h1>Analyzing your requirements and generating your app…</h1>
-    <div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
-      <span class="sr-only">Loading…</span>
+<div class="container">
+    <div class="row align-items-center mb-5">
+        <div class="col-lg-7">
+            <h1 class="display-4 fw-bold mb-3">Create Magic with AI.</h1>
+            <p class="lead text-secondary mb-4">Transform your ideas into viral short-form videos in seconds. No editing skills required.</p>
+        </div>
+        <div class="col-lg-5">
+            <div class="glass-panel p-4 p-md-5">
+                <h3 class="mb-4">New Project</h3>
+                <form action="{% url 'create_project' %}" method="POST">
+                    {% csrf_token %}
+                    <div class="mb-3">
+                        <label class="form-label text-white-50">Project Title</label>
+                        <input type="text" name="title" class="form-control bg-dark text-white border-secondary" placeholder="e.g. My Awesome TikTok" required>
+                    </div>
+                    <div class="mb-4">
+                        <label class="form-label text-white-50">Short Description (Optional)</label>
+                        <textarea name="description" class="form-control bg-dark text-white border-secondary" rows="2"></textarea>
+                    </div>
+                    <button type="submit" class="btn btn-accent w-100">Start Creating</button>
+                </form>
+            </div>
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-12 mb-4">
+            <h2 class="h3 mb-0">Recent Projects</h2>
+        </div>
+        
+        {% for project in projects %}
+        <div class="col-md-6 col-lg-4 mb-4">
+            <div class="card-studio h-100 d-flex flex-column">
+                <div class="d-flex justify-content-between align-items-start mb-3">
+                    <span class="status-badge status-{{ project.status }}">{{ project.get_status_display }}</span>
+                    <span class="text-white-50 small">{{ project.created_at|date:"M d, Y" }}</span>
+                </div>
+                <h4 class="mb-2">{{ project.title }}</h4>
+                <p class="text-secondary small flex-grow-1">{{ project.description|truncatewords:20 }}</p>
+                <div class="mt-4">
+                    <a href="{% url 'project_detail' project.id %}" class="btn btn-outline-light btn-sm w-100 rounded-pill">Open Studio</a>
+                </div>
+            </div>
+        </div>
+        {% empty %}
+        <div class="col-12">
+            <div class="text-center py-5 border border-dashed rounded-4 border-secondary">
+                <p class="text-secondary mb-0">No projects yet. Start by creating your first one above!</p>
+            </div>
+        </div>
+        {% endfor %}
     </div>
-    <p class="hint">AppWizzy AI is collecting your requirements and applying the first changes.</p>
-    <p class="hint">This page will refresh automatically as the plan is implemented.</p>
-    <p class="runtime">
-      Runtime: Django <code>{{ django_version }}</code> · Python <code>{{ python_version }}</code>
-      — UTC <code>{{ current_time|date:"Y-m-d H:i:s" }}</code>
-    </p>
 </div>
-</main>
-<footer>
-  Page updated: {{ current_time|date:"Y-m-d H:i:s" }} (UTC)
-</footer>
 {% endblock %}

core/templates/core/project_detail.html

@@ -0,0 +1,167 @@
+{% extends 'base.html' %}
+
+{% block content %}
+<div class="container">
+    <nav aria-label="breadcrumb" class="mb-4">
+        <ol class="breadcrumb">
+            <li class="breadcrumb-item"><a href="{% url 'index' %}" class="text-white-50 text-decoration-none">Dashboard</a></li>
+            <li class="breadcrumb-item active text-white" aria-current="page">{{ project.title }}</li>
+        </ol>
+    </nav>
+
+    <div class="row">
+        <div class="col-lg-8">
+            <div class="glass-panel p-4 mb-4">
+                <div class="d-flex justify-content-between align-items-center mb-4">
+                    <h2 class="h3 mb-0">AI Script Generator</h2>
+                    <span class="status-badge status-{{ project.status }}">{{ project.get_status_display }}</span>
+                </div>
+                
+                <form id="scriptGeneratorForm" class="mb-4">
+                    {% csrf_token %}
+                    <div class="input-group">
+                        <input type="text" id="scriptPrompt" name="prompt" class="form-control bg-dark text-white border-secondary py-3" placeholder="What is your video about? e.g. '5 tips for better sleep'">
+                        <button class="btn btn-accent" type="submit" id="generateBtn">
+                            <span id="btnText">Generate Script</span>
+                            <span id="btnLoading" class="spinner-border spinner-border-sm d-none" role="status"></span>
+                        </button>
+                    </div>
+                    <div class="form-text text-white-50 mt-2">AI will brainstorm scenes, actions, and dialogue for your short video.</div>
+                </form>
+
+                <div id="scriptResult" class="d-none">
+                    <hr class="border-secondary my-4">
+                    <div class="d-flex justify-content-between align-items-center mb-3">
+                        <h4 class="h5 mb-0">Generated Script</h4>
+                        <button class="btn btn-sm btn-outline-light rounded-pill" onclick="copyScript()">Copy to Clipboard</button>
+                    </div>
+                    <div id="scriptContent" class="bg-dark p-4 rounded-3 text-secondary" style="white-space: pre-wrap; line-height: 1.6; border: 1px solid var(--border-color);">
+                    </div>
+                </div>
+            </div>
+
+            <div class="glass-panel p-4">
+                <h3 class="h5 mb-4">Media Assets</h3>
+                <div class="row g-3">
+                    <div class="col-md-4">
+                        <div class="border border-dashed border-secondary rounded-3 p-4 text-center d-flex flex-column align-items-center justify-content-center h-100" style="min-height: 150px;">
+                            <div class="text-white-50 mb-2">Upload Clips</div>
+                            <button class="btn btn-sm btn-outline-light rounded-pill">Select Files</button>
+                        </div>
+                    </div>
+                    {% for asset in assets %}
+                        <div class="col-md-4">
+                            <div class="bg-dark rounded-3 overflow-hidden" style="height: 150px; position: relative;">
+                                <div class="p-2 small text-truncate" style="position: absolute; bottom: 0; left: 0; right: 0; background: rgba(0,0,0,0.5);">
+                                    {{ asset.original_name }}
+                                </div>
+                            </div>
+                        </div>
+                    {% empty %}
+                        <div class="col-md-8 d-flex align-items-center">
+                            <p class="text-white-50 mb-0 ps-3">Your uploaded video clips and images will appear here.</p>
+                        </div>
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+
+        <div class="col-lg-4">
+            <div class="card-studio mb-4">
+                <h4 class="h5 mb-3">Project Details</h4>
+                <div class="mb-3">
+                    <label class="text-white-50 small d-block">Title</label>
+                    <div class="fw-bold">{{ project.title }}</div>
+                </div>
+                <div class="mb-3">
+                    <label class="text-white-50 small d-block">Created</label>
+                    <div>{{ project.created_at|date:"M d, Y H:i" }}</div>
+                </div>
+                <div class="mb-3">
+                    <label class="text-white-50 small d-block">Description</label>
+                    <div class="text-secondary small">{{ project.description|default:"No description provided." }}</div>
+                </div>
+                <hr class="border-secondary">
+                <button class="btn btn-sm btn-outline-danger w-100">Delete Project</button>
+            </div>
+
+            <div class="card-studio">
+                <h4 class="h5 mb-3">Script History</h4>
+                <div class="list-group list-group-flush bg-transparent">
+                    {% for script in scripts %}
+                        <div class="list-group-item bg-transparent border-white-10 px-0 py-3">
+                            <div class="small text-white-50 mb-1">{{ script.created_at|date:"M d, H:i" }}</div>
+                            <div class="text-white small fw-medium mb-1">{{ script.prompt|truncatechars:40 }}</div>
+                            <button class="btn btn-link btn-sm p-0 text-accent text-decoration-none" onclick="loadScript('{{ script.id }}')">View Script</button>
+                        </div>
+                    {% empty %}
+                        <p class="text-white-50 small mb-0">No scripts generated yet.</p>
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+{% endblock %}
+
+{% block extra_js %}
+<script>
+    const form = document.getElementById('scriptGeneratorForm');
+    const resultDiv = document.getElementById('scriptResult');
+    const contentDiv = document.getElementById('scriptContent');
+    const btnText = document.getElementById('btnText');
+    const btnLoading = document.getElementById('btnLoading');
+    const generateBtn = document.getElementById('generateBtn');
+
+    form.onsubmit = async (e) => {
+        e.preventDefault();
+        const prompt = document.getElementById('scriptPrompt').value;
+        if (!prompt) return;
+
+        // UI state
+        btnText.classList.add('d-none');
+        btnLoading.classList.remove('d-none');
+        generateBtn.disabled = true;
+
+        const formData = new FormData(form);
+        try {
+            const response = await fetch('{% url "generate_script" project.id %}', {
+                method: 'POST',
+                body: formData,
+                headers: {
+                    'X-CSRFToken': '{{ csrf_token }}'
+                }
+            });
+            const data = await response.json();
+            if (data.success) {
+                contentDiv.innerText = data.content;
+                resultDiv.classList.remove('d-none');
+                // Optional: refresh page to show in history, or append via JS
+                location.reload(); 
+            } else {
+                alert('Error: ' + data.error);
+            }
+        } catch (err) {
+            console.error(err);
+            alert('An unexpected error occurred.');
+        } finally {
+            btnText.classList.remove('d-none');
+            btnLoading.classList.add('d-none');
+            generateBtn.disabled = false;
+        }
+    };
+
+    function copyScript() {
+        const text = contentDiv.innerText;
+        navigator.clipboard.writeText(text).then(() => {
+            alert('Script copied to clipboard!');
+        });
+    }
+
+    function loadScript(id) {
+        // For now, simpler to just reload or fetch. 
+        // In this iteration, we'll just let the user see it in the list or reload if they generate a new one.
+        // We could fetch the script content via another endpoint if needed.
+    }
+</script>
+{% endblock %}

core/urls.py

@@ -1,7 +1,9 @@
 from django.urls import path
-
-from .views import home
+from . import views
 
 urlpatterns = [
-    path("", home, name="home"),
+    path('', views.index, name='index'),
+    path('project/create/', views.create_project, name='create_project'),
+    path('project/<int:project_id>/', views.project_detail, name='project_detail'),
+    path('project/<int:project_id>/generate-script/', views.generate_script, name='generate_script'),
 ]

core/views.py

@@ -1,25 +1,68 @@
-import os
-import platform
+import json
+from django.shortcuts import render, redirect, get_object_or_404
+from django.http import JsonResponse
+from django.views.decorators.http import require_POST
+from .models import Project, Script, MediaAsset
+from ai.local_ai_api import LocalAIApi
 
-from django import get_version as django_version
-from django.shortcuts import render
-from django.utils import timezone
+def index(request):
+    projects = Project.objects.all().order_by('-created_at')
+    return render(request, 'core/index.html', {
+        'projects': projects,
+        'title': 'Creator Studio Dashboard',
+    })
 
+@require_POST
+def create_project(request):
+    title = request.POST.get('title', 'Untitled Project')
+    description = request.POST.get('description', '')
+    project = Project.objects.create(title=title, description=description)
+    return redirect('project_detail', project_id=project.id)
 
-def home(request):
-    """Render the landing screen with loader and environment details."""
-    host_name = request.get_host().lower()
-    agent_brand = "AppWizzy" if host_name == "appwizzy.com" else "Flatlogic"
-    now = timezone.now()
+def project_detail(request, project_id):
+    project = get_object_or_404(Project, id=project_id)
+    scripts = project.scripts.all().order_by('-created_at')
+    assets = project.assets.all().order_by('-created_at')
+    return render(request, 'core/project_detail.html', {
+        'project': project,
+        'scripts': scripts,
+        'assets': assets,
+        'title': f'Studio: {project.title}',
+    })
 
-    context = {
-        "project_name": "New Style",
-        "agent_brand": agent_brand,
-        "django_version": django_version(),
-        "python_version": platform.python_version(),
-        "current_time": now,
-        "host_name": host_name,
-        "project_description": os.getenv("PROJECT_DESCRIPTION", ""),
-        "project_image_url": os.getenv("PROJECT_IMAGE_URL", ""),
-    }
-    return render(request, "core/index.html", context)
+@require_POST
+def generate_script(request, project_id):
+    project = get_object_or_404(Project, id=project_id)
+    prompt = request.POST.get('prompt', '')
+    
+    if not prompt:
+        return JsonResponse({'success': False, 'error': 'Prompt is required'})
+    
+    # Construct a high-quality AI prompt for video scripting
+    ai_input = [
+        {"role": "system", "content": "You are an expert social media content creator and scriptwriter for TikTok, Reels, and YouTube Shorts. Generate a catchy script with Scene details, Action, and Dialogue/Narration."},
+        {"role": "user", "content": f"Generate a short-form video script for the following idea: {prompt}"}
+    ]
+    
+    response = LocalAIApi.create_response({
+        "input": ai_input,
+    })
+    
+    if response.get("success"):
+        content = LocalAIApi.extract_text(response)
+        script = Script.objects.create(
+            project=project,
+            prompt=prompt,
+            content=content
+        )
+        return JsonResponse({
+            'success': True, 
+            'content': content,
+            'script_id': script.id,
+            'created_at': script.created_at.strftime('%Y-%m-%d %H:%M')
+        })
+    else:
+        return JsonResponse({
+            'success': False, 
+            'error': response.get('message', 'AI Generation failed')
+        })