Spaces:

OjciecTadeusz
/

anycoder-dev

Sleeping

App Files Files Community

OjciecTadeusz commited on Aug 21, 2025

Commit

7cf60a8

verified ·

1 Parent(s): 3ddc039

Upload src/streamlit_app.py with huggingface_hub

Browse files

Files changed (1) hide show

src/streamlit_app.py +553 -40

src/streamlit_app.py CHANGED Viewed

@@ -1,40 +1,553 @@
-import altair as alt
-import numpy as np
-import pandas as pd
-import streamlit as st
-"""
-# Welcome to Streamlit!
-Edit `/streamlit_app.py` to customize this app to your heart's desire :heart:.
-If you have any questions, checkout our [documentation](https://docs.streamlit.io) and [community
-forums](https://discuss.streamlit.io).
-In the meantime, below is an example of what you can do with just a few lines of code:
-"""
-num_points = st.slider("Number of points in spiral", 1, 10000, 1100)
-num_turns = st.slider("Number of turns in spiral", 1, 300, 31)
-indices = np.linspace(0, 1, num_points)
-theta = 2 * np.pi * num_turns * indices
-radius = indices
-x = radius * np.cos(theta)
-y = radius * np.sin(theta)
-df = pd.DataFrame({
-    "x": x,
-    "y": y,
-    "idx": indices,
-    "rand": np.random.randn(num_points),
-})
-st.altair_chart(alt.Chart(df, height=700, width=700)
-    .mark_point(filled=True)
-    .encode(
-        x=alt.X("x", axis=None),
-        y=alt.Y("y", axis=None),
-        color=alt.Color("idx", legend=None, scale=alt.Scale()),
-        size=alt.Size("rand", legend=None, scale=alt.Scale(range=[1, 150])),
-    ))

+# AI Research Assistant Interface
+Based on your requirements, I'll create a clean, responsive web interface for an AI research assistant that specializes in web research and content extraction.
+=== index.html ===
+<!DOCTYPE html>
+<html lang="pl">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="Zaawansowany Asystent AI do badań internetowych i ekstrakcji treści">
+    <meta name="keywords" content="AI, research, web scraping, content extraction, data saving">
+    <title>AI Research Assistant</title>
+    <link rel="stylesheet" href="assets/css/styles.css">
+</head>
+<body>
+    <header>
+        <div class="container">
+            <h1>AI Research Assistant</h1>
+            <p>Zaawansowany asystent do badań internetowych i ekstrakcji treści</p>
+        </div>
+    </header>
+    <main class="container">
+        <section class="intro">
+            <h2>Jak mogę Ci pomóc?</h2>
+            <p>Jestem specjalistą w badaniach internetowych i ekstrakcji treści. Wybierz jedną z poniższych opcji:</p>
+        </section>
+        <div class="tabs">
+            <div class="tab-buttons">
+                <button class="tab-button active" data-tab="search">Wyszukiwanie WWW</button>
+                <button class="tab-button" data-tab="scrape">Scrapowanie strony</button>
+                <button class="tab-button" data-tab="save">Zapisywanie plików</button>
+            </div>
+            <div class="tab-content">
+                <div id="search-tab" class="tab-pane active">
+                    <h3>Wyszukiwanie informacji w internecie</h3>
+                    <p>Wprowadź zapytanie, a przeszukam internet w poszukiwaniu odpowiedzi.</p>
+                    <form id="search-form">
+                        <div class="form-group">
+                            <label for="search-query">Twoje zapytanie:</label>
+                            <input type="text" id="search-query" placeholder="Wprowadź temat wyszukiwania..." required>
+                        </div>
+                        <button type="submit" class="btn-primary">Wyszukaj</button>
+                    </form>
+                    <div id="search-results" class="results-container hidden"></div>
+                </div>
+                <div id="scrape-tab" class="tab-pane">
+                    <h3>Pobieranie treści ze strony</h3>
+                    <p>Podaj adres URL, a pobiorę i wyczyścę treść ze wskazanej strony.</p>
+                    <form id="scrape-form">
+                        <div class="form-group">
+                            <label for="scrape-url">Adres URL:</label>
+                            <input type="url" id="scrape-url" placeholder="https://przyklad.com/artykul" required>
+                        </div>
+                        <button type="submit" class="btn-primary">Pobierz treść</button>
+                    </form>
+                    <div id="scrape-results" class="results-container hidden"></div>
+                </div>
+                <div id="save-tab" class="tab-pane">
+                    <h3>Zapisywanie treści do pliku</h3>
+                    <p>Wybierz format i zapisz pobrane treści.</p>
+                    <form id="save-form">
+                        <div class="form-group">
+                            <label for="save-content">Treść do zapisania:</label>
+                            <textarea id="save-content" rows="6" placeholder="Wklej tutaj treść do zapisania..." required></textarea>
+                        </div>
+                        <div class="form-group">
+                            <label for="format-select">Wybierz format:</label>
+                            <select id="format-select">
+                                <option value="md">Markdown (.md)</option>
+                                <option value="json">JSON (.json)</option>
+                                <option value="pdf">PDF (.pdf)</option>
+                            </select>
+                        </div>
+                        <div class="form-group">
+                            <label for="filename">Nazwa pliku:</label>
+                            <input type="text" id="filename" placeholder="nazwa-pliku" required>
+                        </div>
+                        <button type="submit" class="btn-primary">Zapisz plik</button>
+                    </form>
+                    <div id="save-results" class="results-container hidden"></div>
+                </div>
+            </div>
+        </div>
+        <section class="features">
+            <h2>Moje narzędzia</h2>
+            <div class="feature-grid">
+                <div class="feature-card">
+                    <h3>Wyszukiwanie WWW</h3>
+                    <p>Przeszukuję internet na podstawie Twoich zapytań, priorytetyzując wiarygodne źródła.</p>
+                </div>
+                <div class="feature-card">
+                    <h3>Scrapowanie treści</h3>
+                    <p>Pobieram i czyszczę treści ze stron, usuwając reklamy, menu i elementy powtarzalne.</p>
+                </div>
+                <div class="feature-card">
+                    <h3>Zapisywanie plików</h3>
+                    <p>Zapisuję treści w wybranych formatach: Markdown, JSON lub PDF.</p>
+                </div>
+            </div>
+        </section>
+    </main>
+    <footer>
+        <div class="container">
+            <p>Zaawansowany Asystent AI &copy; 2023. Wszystkie prawa zastrzeżone.</p>
+        </div>
+    </footer>
+    <script src="assets/js/script.js"></script>
+</body>
+</html>
+=== assets/css/styles.css ===
+/* Reset i podstawowe style */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+body {
+    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
+    line-height: 1.6;
+    color: #333;
+    background-color: #f8f9fa;
+}
+.container {
+    width: 100%;
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 20px;
+}
+/* Nagłówek */
+header {
+    background: linear-gradient(135deg, #4a6fa5, #2a4e6c);
+    color: white;
+    padding: 2rem 0;
+    text-align: center;
+    margin-bottom: 2rem;
+}
+header h1 {
+    font-size: 2.5rem;
+    margin-bottom: 0.5rem;
+}
+header p {
+    font-size: 1.1rem;
+    opacity: 0.9;
+}
+/* Sekcja wprowadzenia */
+.intro {
+    text-align: center;
+    margin-bottom: 2rem;
+}
+.intro h2 {
+    font-size: 2rem;
+    margin-bottom: 1rem;
+    color: #2a4e6c;
+}
+/* Zakładki */
+.tabs {
+    background: white;
+    border-radius: 8px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
+    overflow: hidden;
+    margin-bottom: 3rem;
+}
+.tab-buttons {
+    display: flex;
+    border-bottom: 1px solid #e9ecef;
+}
+.tab-button {
+    padding: 1rem 1.5rem;
+    background: none;
+    border: none;
+    cursor: pointer;
+    font-size: 1rem;
+    font-weight: 500;
+    color: #6c757d;
+    transition: all 0.3s ease;
+}
+.tab-button:hover {
+    background-color: #f8f9fa;
+    color: #4a6fa5;
+}
+.tab-button.active {
+    color: #4a6fa5;
+    border-bottom: 3px solid #4a6fa5;
+}
+.tab-content {
+    padding: 2rem;
+}
+.tab-pane {
+    display: none;
+}
+.tab-pane.active {
+    display: block;
+}
+/* Formularze */
+.form-group {
+    margin-bottom: 1.5rem;
+}
+label {
+    display: block;
+    margin-bottom: 0.5rem;
+    font-weight: 500;
+}
+input[type="text"],
+input[type="url"],
+textarea,
+select {
+    width: 100%;
+    padding: 0.75rem;
+    border: 1px solid #ced4da;
+    border-radius: 4px;
+    font-size: 1rem;
+    transition: border-color 0.3s;
+}
+input[type="text"]:focus,
+input[type="url"]:focus,
+textarea:focus,
+select:focus {
+    outline: none;
+    border-color: #4a6fa5;
+    box-shadow: 0 0 0 3px rgba(74, 111, 165, 0.25);
+}
+textarea {
+    resize: vertical;
+    min-height: 120px;
+}
+/* Przyciski */
+.btn-primary {
+    background-color: #4a6fa5;
+    color: white;
+    border: none;
+    padding: 0.75rem 1.5rem;
+    border-radius: 4px;
+    font-size: 1rem;
+    cursor: pointer;
+    transition: background-color 0.3s;
+}
+.btn-primary:hover {
+    background-color: #3a5a80;
+}
+/* Wyniki */
+.results-container {
+    margin-top: 2rem;
+    padding: 1.5rem;
+    background-color: #f8f9fa;
+    border-radius: 4px;
+    border-left: 4px solid #4a6fa5;
+}
+.hidden {
+    display: none;
+}
+.result-item {
+    margin-bottom: 1rem;
+    padding-bottom: 1rem;
+    border-bottom: 1px solid #e9ecef;
+}
+.result-item:last-child {
+    border-bottom: none;
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+.result-title {
+    font-weight: 600;
+    color: #2a4e6c;
+    margin-bottom: 0.25rem;
+}
+.result-url {
+    color: #6c757d;
+    font-size: 0.9rem;
+    margin-bottom: 0.5rem;
+}
+.result-description {
+    margin-bottom: 0.5rem;
+}
+/* Sekcja funkcji */
+.features {
+    margin-bottom: 3rem;
+}
+.features h2 {
+    text-align: center;
+    font-size: 2rem;
+    margin-bottom: 2rem;
+    color: #2a4e6c;
+}
+.feature-grid {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+    gap: 2rem;
+}
+.feature-card {
+    background: white;
+    padding: 2rem;
+    border-radius: 8px;
+    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
+    text-align: center;
+    transition: transform 0.3s ease;
+}
+.feature-card:hover {
+    transform: translateY(-5px);
+}
+.feature-card h3 {
+    color: #4a6fa5;
+    margin-bottom: 1rem;
+}
+/* Stopka */
+footer {
+    background-color: #2a4e6c;
+    color: white;
+    text-align: center;
+    padding: 1.5rem 0;
+    margin-top: 3rem;
+}
+/* Responsywność */
+@media (max-width: 768px) {
+    .tab-buttons {
+        flex-direction: column;
+    }
+    .tab-button {
+        width: 100%;
+        text-align: center;
+    }
+    .feature-grid {
+        grid-template-columns: 1fr;
+    }
+    header h1 {
+        font-size: 2rem;
+    }
+}
+=== assets/js/script.js ===
+document.addEventListener('DOMContentLoaded', function() {
+    // Obsługa zakładek
+    const tabButtons = document.querySelectorAll('.tab-button');
+    const tabPanes = document.querySelectorAll('.tab-pane');
+    tabButtons.forEach(button => {
+        button.addEventListener('click', () => {
+            const tabId = button.getAttribute('data-tab');
+            // Usuń aktywną klasę ze wszystkich przycisków i paneli
+            tabButtons.forEach(btn => btn.classList.remove('active'));
+            tabPanes.forEach(pane => pane.classList.remove('active'));
+            // Dodaj aktywną klasę do klikniętego przycisku i odpowiedniego panelu
+            button.classList.add('active');
+            document.getElementById(`${tabId}-tab`).classList.add('active');
+        });
+    });
+    // Obsługa formularza wyszukiwania
+    const searchForm = document.getElementById('search-form');
+    const searchResults = document.getElementById('search-results');
+    searchForm.addEventListener('submit', function(e) {
+        e.preventDefault();
+        const query = document.getElementById('search-query').value.trim();
+        if (query) {
+            // Symulacja wyszukiwania (w rzeczywistości połączyłoby się z API)
+            simulateWebSearch(query);
+        }
+    });
+    // Obsługa formularza scrapowania
+    const scrapeForm = document.getElementById('scrape-form');
+    const scrapeResults = document.getElementById('scrape-results');
+    scrapeForm.addEventListener('submit', function(e) {
+        e.preventDefault();
+        const url = document.getElementById('scrape-url').value.trim();
+        if (url) {
+            // Symulacja scrapowania (w rzeczywistości połączyłoby się z API)
+            simulateWebScrape(url);
+        }
+    });
+    // Obsługa formularza zapisywania
+    const saveForm = document.getElementById('save-form');
+    const saveResults = document.getElementById('save-results');
+    saveForm.addEventListener('submit', function(e) {
+        e.preventDefault();
+        const content = document.getElementById('save-content').value.trim();
+        const format = document.getElementById('format-select').value;
+        const filename = document.getElementById('filename').value.trim();
+        if (content && filename) {
+            // Symulacja zapisywania (w rzeczywistości połączyłoby się z API)
+            simulateSaveFile(content, format, filename);
+        }
+    });
+    // Funkcje symulujące działanie API
+    function simulateWebSearch(query) {
+        searchResults.innerHTML = '<p class="loading">Wyszukiwanie... (symulacja)</p>';
+        searchResults.classList.remove('hidden');
+        // Symulacja opóźnienia zapytania
+        setTimeout(() => {
+            const results = [
+                {
+                    title: 'Wynik wyszukiwania 1 dla: ' + query,
+                    url: 'https://przyklad.com/wynik-1',
+                    description: 'To jest przykładowy opis wyniku wyszukiwania. Zawiera istotne informacje na temat zapytania.'
+                },
+                {
+                    title: 'Wynik wyszukiwania 2 dla: ' + query,
+                    url: 'https://przyklad.com/wynik-2',
+                    description: 'Kolejny przykładowy wynik wyszukiwania z odpowiednimi informacjami.'
+                },
+                {
+                    title: 'Wynik wyszukiwania 3 dla: ' + query,
+                    url: 'https://przyklad.com/wynik-3',
+                    description: 'Trzeci przykładowy wynik zawierający wartościowe treści związane z zapytaniem.'
+                }
+            ];
+            displaySearchResults(results);
+        }, 1500);
+    }
+    function displaySearchResults(results) {
+        let html = '<h3>Wyniki wyszukiwania:</h3>';
+        results.forEach(result => {
+            html += `
+                <div class="result-item">
+                    <div class="result-title">${result.title}</div>
+                    <div class="result-url">${result.url}</div>
+                    <div class="result-description">${result.description}</div>
+                    <button class="btn-primary scrape-from-result" data-url="${result.url}">Pobierz treść</button>
+                </div>
+            `;
+        });
+        searchResults.innerHTML = html;
+        // Dodanie obsługi przycisków do scrapowania z wyników
+        document.querySelectorAll('.scrape-from-result').forEach(button => {
+            button.addEventListener('click', function() {
+                const url = this.getAttribute('data-url');
+                document.getElementById('scrape-url').value = url;
+                // Przełączenie na zakładkę scrapowania
+                document.querySelector('[data-tab="scrape"]').click();
+                // Automatyczne uruchomienie scrapowania
+                simulateWebScrape(url);
+            });
+        });
+    }
+    function simulateWebScrape(url) {
+        scrapeResults.innerHTML = '<p class="loading">Pobieranie treści... (symulacja)</p>';
+        scrapeResults.classList.remove('hidden');
+        // Symulacja opóźnienia scrapowania
+        setTimeout(() => {
+            const content = `
+                <h3>Przykładowa treść pobrana z: ${url}</h3>
+                <p>To jest symulowana treść artykułu pobrana ze wskazanej strony internetowej. W rzeczywistym scenariuszu ta treść zostałaby pobrana, wyczyszczona z elementów takich jak reklamy, menu nawigacyjne i komentarze.</p>
+                <p>Treść została przetworzona w celu zachowania tylko istotnych informacji z artykułu, zgodnie z zasadami robots.txt i warunkami serwisu.</p>
+                <div class="actions">
+                    <button class="btn-primary save-scraped-content" data-content="Przykładowa treść pobrana z: ${url}">Zapisz tę treść</button>
+                </div>
+            `;
+            scrapeResults.innerHTML = content;
+            // Dodanie obsługi przycisku zapisywania
+            document.querySelector('.save-scraped-content').addEventListener('click', function() {
+                const content = this.getAttribute('data-content');
+                document.getElementById('save-content').value = content;
+                // Przełączenie na zakładkę zapisywania
+                document.querySelector('[data-tab="save"]').click();
+            });
+        }, 2000);
+    }
+    function simulateSaveFile(content, format, filename) {
+        saveResults.innerHTML = '<p class="loading">Zapisywanie pliku... (symulacja)</p>';
+        saveResults.classList.remove('hidden');
+        // Symulacja opóźnienia zapisywania
+        setTimeout(() => {
+            const fullFilename = `${filename}.${format}`;
+            saveResults.innerHTML = `
+                <div class="success-message">
+                    <h3>Plik został zapisany!</h3>
+                    <p>Treść została pomyślnie zapisana jako <strong>${fullFilename}</strong></p>
+                    <p>W rzeczywistym scenariuszu plik zostałby pobrany na Twój komputer.</p>
+                </div>
+            `;
+            // Reset formularza
+            document.getElementById('save-form').reset();
+        }, 1500);
+    }
+});