Adding LLMContext generator to website.

docs/md_v2/llmtxt/build.md

@@ -0,0 +1,75 @@
+
+O**Prompt for AI Coding Assistant: Create an Interactive LLM Context Builder Page**
+
+**Objective:**
+
+Your task is to create an interactive HTML webpage with JavaScript functionality that allows users to select and combine different `crawl4ai` LLM context files into a single downloadable Markdown (`.md`) file. This tool will empower users to craft tailored context for their AI assistants based on their specific needs.
+
+**Core Functionality:**
+
+1.  **Display `crawl4ai` Components:** The page will list all available `crawl4ai` documentation components.
+2.  **Select Context Types:** For each component, users can select which types of context they want to include:
+    *   Memory (API facts)
+    *   Reasoning (How-to/why)
+    *   Examples (Code snippets)
+    (All should be selected by default for each initially selected component).
+3.  **Special "Aggregate" Contexts:** Include options for special, pre-combined contexts:
+    *   "Vibe Coding" (a curated mix for general AI prompting)
+    *   "All Library Context" (a comprehensive aggregation of all memory, reasoning, and examples for the entire library).
+4.  **Fetch and Concatenate:** When the user clicks a "Download Combined Context" button:
+    *   The JavaScript will fetch the content of all selected Markdown files from the server (from a predefined folder, e.g., `/llmtxt/`).
+    *   It will concatenate the content of these files into a single string.
+5.  **Client-Side Download:** The concatenated content will be offered to the user as a download (e.g., `custom_crawl4ai_context.md`).
+
+**Input/Assumptions:**
+
+*   **Context Files Location:** All individual context Markdown files are located on the server in a publicly accessible folder named `llmtxt/`.
+*   **File Naming Convention:** Files follow the pattern: `crawl4ai_{{component_name}}_[memory|reasoning|examples]_content.llm.md`.
+    *   `{{component_name}}` can contain underscores (e.g., `deep_crawling`, `config_objects`).
+    *   The special contexts will have names like `crawl4ai_vibe_content.llm.md` and `crawl4ai_all_content.llm.md`.
+*   **Component List:** You will be provided with a list of `crawl4ai` components. For this implementation, use the following list:
+    *   `core`
+    *   `config_objects`
+    *   `deep_crawling`
+    *   `deployment` (covers Installation & Docker Deployment)
+    *   `extraction` (covers Structured Data Extraction)
+    *   `markdown` (covers Markdown Generation Algorithm)
+    *   `pdf_processing`
+    *   *(No separate "Vibe Coding" or "All Library Context" in this list, as they are special top-level selections)*
+
+**Detailed UI/UX Requirements:**
+
+1.  **Main Page Structure:**
+    *   **Header:** "Crawl4AI Interactive LLM Context Builder"
+    *   **Introduction:** Briefly explain the purpose of the tool (from the `USING_LLM_CONTEXTS.md` content you helped draft: "Supercharging Your AI Assistant...").
+    *   **Selection Area:**
+        *   **Special Aggregate Contexts (Radio Buttons or Prominent Checkboxes):**
+            *   [ ] "Vibe Coding Context" (`crawl4ai_vibe_content.llm.md`)
+            *   [ ] "All Library Context (Comprehensive)" (`crawl4ai_all_content.llm.md`)
+            *   *Behavior:* Selecting one of these might disable individual component selections (or vice-versa) to avoid redundancy, or simply add them to the list. Consider user experience here. A simple approach is that if an aggregate is selected, it's the *only* thing downloaded.
+        *   **Individual Component Selection (Table or List of Checkboxes):**
+            *   A section titled "Select Individual Components & Context Types:"
+            *   For each component in the provided list:
+                *   A master checkbox for the component itself (e.g., `[ ] Core Functionality`). Selected by default.
+                *   Nested checkboxes (indented or grouped) for context types, enabled only if the parent component is checked:
+                    *   `[x] Memory (API Facts)`
+                    *   `[x] Reasoning (How-to/Why)`
+                    *   `[x] Examples (Code Snippets)`
+                    (These three sub-checkboxes should be selected by default if the parent component is selected).
+    *   **Action Button:**
+        *   A button: "Generate & Download Combined Context"
+    *   **Status/Feedback Area:** (Optional, but good UX)
+        *   Display messages like "Fetching files...", "Combining context...", "Download starting..." or error messages.
+
+
+**Final Output:**
+
+*   A single HTML file (e.g., `interactive_context_builder.html`).
+*   Associated JavaScript code (can be inline within `<script>` tags or in a separate `.js` file).
+*   Associated CSS code (can be inline within `<style>` tags or in a separate `.css` file).
+
+This interactive tool will greatly enhance the user experience for `crawl4ai` developers looking to leverage your specialized LLM contexts. Please ensure the JavaScript is robust and provides good user feedback.
+
+---
+
+This prompt should give your AI coding assistant a very clear set of requirements and guidelines for building the interactive context builder. Remember to provide it with the list of components as mentioned in the "Input/Assumptions" section.