feat: complete table of contents and header structure overhaul

- Added comprehensive hierarchical table of contents with proper h2/h3 nesting
- Added missing section IDs to all headers for proper anchor navigation
- Restructured headers to use only h2 (main sections) and h3 (subsections)
- Organized content with logical grouping: Web Client, OpenAI Client, Hermes Model, Node.js, TTS
- Enhanced navigation with complete coverage of all sections and subsections
- Improved document structure and accessibility with semantic HTML

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Russell Ballestrini 2025-07-04 15:53:57 -04:00
parent 38054643d4
commit d9569c77fe

View file

@ -71,12 +71,39 @@
<h3>📋 Table of Contents</h3>
<nav>
<ul>
<li><a href="#client-side">Web Client-Only Solution</a></li>
<li><a href="#quick-start">🚀 Quick Start: Install uncloseai.js</a></li>
<li><a href="#openai-client">Installing the OpenAI Client</a></li>
<li><a href="#hermes-model">Using the Hermes AI Model</a></li>
<li><a href="#nodejs-examples">Node.js Examples</a></li>
<li><a href="#tts">Using the Text To Speech Endpoint</a></li>
<li><a href="#introduction">Introducing uncloseai & Hermes & TTS Speech Endpoints</a></li>
<li><a href="#client-side">Web Client-Only Solution</a>
<ul>
<li><a href="#quick-start">🚀 Quick Start: Install uncloseai.js</a></li>
<li><a href="#installation">✨ One-Line Installation</a></li>
<li><a href="#features">🎯 What You Get</a></li>
</ul>
</li>
<li><a href="#openai-client">Installing the OpenAI Client</a>
<ul>
<li><a href="#python-client">Python Client Installation</a></li>
<li><a href="#nodejs-client">Node.js Client Installation</a></li>
</ul>
</li>
<li><a href="#hermes-model">Using the Hermes AI Model</a>
<ul>
<li><a href="#python-hermes">Python Examples</a></li>
<li><a href="#python-non-streaming">Python Non-Streaming</a></li>
<li><a href="#python-streaming">Python Streaming</a></li>
</ul>
</li>
<li><a href="#nodejs-examples">Node.js Examples</a>
<ul>
<li><a href="#nodejs-non-streaming">Node.js Non-Streaming</a></li>
<li><a href="#nodejs-streaming">Node.js Streaming</a></li>
</ul>
</li>
<li><a href="#tts">Using the Text To Speech Endpoint</a>
<ul>
<li><a href="#python-tts">Python TTS Example</a></li>
<li><a href="#nodejs-tts">Node.js TTS Example</a></li>
</ul>
</li>
<li><a href="#inference">How we run inference</a></li>
<li><a href="#open-source">Open Source & Public Domain</a></li>
<li><a href="#discussions">Questions & Comments & Discussions</a></li>
@ -98,11 +125,11 @@
<p>Add AI capabilities to any website with just one line of code. The floating "uncloseai." button appears automatically, providing access to Hermes AI, text-to-speech, translation, and more.</p>
<h4>✨ One-Line Installation</h4>
<h3 id="installation">✨ One-Line Installation</h3>
<p>Add this script tag to your HTML - that's it! The floating AI button appears automatically:</p>
<pre><code class="html">&lt;script src="https://uncloseai.com/uncloseai.js" type="module"&gt;&lt;/script&gt;</code></pre>
<h4>🎯 What You Get</h4>
<h3 id="features">🎯 What You Get</h3>
<ul>
<li><strong>🤖 Floating AI Assistant</strong> - Always-accessible "uncloseai." button in bottom right</li>
<li><strong>📖 Page-Aware</strong> - Hermes AI understands your page content and provides contextual help</li>
@ -116,12 +143,12 @@
<p>The demo page includes configuration options, embedded widgets, custom implementations, direct API usage, and more advanced features.</p>
<h3 id="openai-client">Installing the OpenAI Client</h3>
<h4>Python</h4>
<h2 id="openai-client">Installing the OpenAI Client</h2>
<h3 id="python-client">Python Client Installation</h3>
<p>To install the OpenAI package for Python, use <code>pip</code>:</p>
<pre><code>pip install openai</code></pre>
<h4>Node.js</h4>
<h3 id="nodejs-client">Node.js Client Installation</h3>
<p>To install the OpenAI package for Node.js, you can use <code>npm</code> in your <code>package.json</code>:</p>
<pre><code>{
"dependencies": {
@ -133,8 +160,8 @@
<pre><code>npm install</code></pre>
<h2 id="hermes-model">Using the Hermes AI Model</h2>
<h3>Python Example</h3>
<h4>Non-Streaming</h4>
<h3 id="python-hermes">Python Examples</h3>
<h3 id="python-non-streaming">Python Non-Streaming</h3>
<pre><code class="python"># Python Fizzbuzz Example
from openai import OpenAI
@ -155,7 +182,7 @@ response = client.chat.completions.create(
print(response.choices[0].message.content)
</code></pre>
<h4>Streaming</h4>
<h3 id="python-streaming">Python Streaming</h3>
<pre><code class="python"># Streaming response in Python
from openai import OpenAI
@ -181,7 +208,7 @@ for chunk in response:
</code></pre>
<h2 id="nodejs-examples">Node.js Example</h2>
<h3>Non-Streaming</h3>
<h3 id="nodejs-non-streaming">Node.js Non-Streaming</h3>
<pre><code class="javascript">const OpenAI = require('openai');
const client = new OpenAI({
@ -211,7 +238,7 @@ async function getResponse() {
getResponse();
</code></pre>
<h3>Streaming</h3>
<h3 id="nodejs-streaming">Node.js Streaming</h3>
<pre><code class="javascript">
const OpenAI = require('openai');
@ -248,7 +275,7 @@ streamResponse();
</code></pre>
<h2 id="tts">Using the Text To Speech Endpoint</h2>
<h3>Python Example</h3>
<h3 id="python-tts">Python TTS Example</h3>
<pre><code class="python"># TTS Speech Example in Python
import openai
@ -266,7 +293,7 @@ with client.audio.speech.with_streaming_response.create(
response.stream_to_file("speech.mp3")
</code></pre>
<h3>Node.js Example</h3>
<h3 id="nodejs-tts">Node.js TTS Example</h3>
<pre><code class="javascript">const OpenAI = require('openai');
const client = new OpenAI({