engineering/uncloseai.com
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix: disable non-working features in demo.html

Browse source 
- Remove file upload references from system message
- Comment out smart-translate feature examples (not working yet)
- Disable smart translate demo with "Under Development" styling
- Keep traditional translate modal working
- Style disabled features with greyed-out appearance
- Fix demo page to only show working functionality
This commit is contained in:
Russell Ballestrini 2025-07-04 12:49:53 -04:00
parent ce7014e83a
commit 61b4cb0d5c
1 changed files with 26 additions and 24 deletions
Download patch file Download diff file Expand all files Collapse all files

50
demo.html
View file

@ -51,7 +51,7 @@
Additional context for this demo page:
- You're helping users explore and test AI features on uncloseai.com
- This is a demonstration page showing various AI capabilities
- Encourage users to try different features like TTS, file uploads, and the Hermes chat
- Encourage users to try different features like TTS, translation, and the Hermes chat
- Be enthusiastic and helpful when explaining how the features work
- If users ask about implementation, reference the code examples on this page
`);
@ -226,19 +226,19 @@
<!-- 6. Feature Buttons Only -->
<section id="feature-buttons">
<h3>6. 🔧 Feature Buttons Only</h3>
<p>TTS, Upload, and Read buttons without chat:</p>
<p>TTS and Read buttons without chat:</p>
<h4>📄 Code Example</h4>
<details open>
<summary><strong>Feature Buttons Code</strong></summary>
<p>Embed specific feature buttons:</p>
<pre><code class="html">&lt;div class="uncloseai" data-features="tts,upload,read"&gt;&lt;/div&gt;</code></pre>
<pre><code class="html">&lt;div class="uncloseai" data-features="tts,read"&gt;&lt;/div&gt;</code></pre>
</details>
<h4>🎯 Live Example</h4>
<p>Try the feature buttons below:</p>
<div style="border: 2px dashed #43a047; padding: 20px; margin: 15px 0; border-radius: 8px; background: rgba(67, 160, 71, 0.05);">
<div class="uncloseai" data-features="tts,upload,read" id="demo-buttons"></div>
<div class="uncloseai" data-features="tts,read" id="demo-buttons"></div>
</div>
</section>
@ -273,11 +273,11 @@
<pre><code class="html">&lt;!-- Traditional Modal (full options) --&gt;
&lt;div class="uncloseai" data-features="translate"&gt;&lt;/div&gt;
&lt;!-- Smart Dropdown (quick translate) --&gt;
&lt;div class="uncloseai" data-features="smart-translate"&gt;&lt;/div&gt;
&lt;!-- Smart Dropdown (quick translate) - DISABLED: Not working yet --&gt;
&lt;!-- &lt;div class="uncloseai" data-features="smart-translate"&gt;&lt;/div&gt; --&gt;
&lt;!-- Both options together --&gt;
&lt;div class="uncloseai" data-features="translate,smart-translate"&gt;&lt;/div&gt;</code></pre>
&lt;!-- Both options together - DISABLED: Smart translate not working --&gt;
&lt;!-- &lt;div class="uncloseai" data-features="translate,smart-translate"&gt;&lt;/div&gt; --&gt;</code></pre>
</details>
<h4>🎯 Live Examples</h4>
@ -297,13 +297,15 @@
</ul>
</div>
<!-- New Smart Dropdown -->
<div style="border: 2px dashed #43a047; padding: 20px; border-radius: 8px; background: rgba(67, 160, 71, 0.05);">
<h5>🤖 Smart AI Dropdown (New!)</h5>
<p>AI-powered quick translation:</p>
<div class="uncloseai" data-features="smart-translate" id="demo-translate-smart"></div>
<p><strong>✨ Smart Features:</strong></p>
<ul>
<!-- Smart Dropdown - DISABLED: Feature under development -->
<div style="border: 2px dashed #ccc; padding: 20px; border-radius: 8px; background: rgba(128, 128, 128, 0.05); opacity: 0.6;">
<h5>🤖 Smart AI Dropdown <span style="color: #999; font-size: 0.8em;">(Under Development)</span></h5>
<p>AI-powered quick translation (coming soon):</p>
<div style="padding: 20px; background: #f5f5f5; border-radius: 4px; text-align: center; color: #666;">
Smart translate feature is under development
</div>
<p><strong>🚧 Planned Features:</strong></p>
<ul style="color: #666;">
<li>🤖 AI-powered translation with language selection</li>
<li>🌐 Triple format: code • English • Native (es • Spanish • Español)</li>
<li>📋 Quick dropdown selection</li>
@ -370,9 +372,9 @@ for await (const chunk of sendMessage('Your question here')) {
const result = await speakText('Hello world', 'alloy', 0.9);
document.body.appendChild(result.audio);
// Upload and analyze files
const response = await uploadFile(fileInput.files[0]);
console.log(response);
// Upload and analyze files - COMMENTED OUT: Not working
// const response = await uploadFile(fileInput.files[0]);
// console.log(response);
// Read page content with AI
await readPageWithHermes();</code></pre>
@ -417,12 +419,12 @@ await readPageWithHermes();</code></pre>
<div id="custom-tts-result" style="margin: 10px 0;"></div>
</div>
<!-- Custom File Upload Example -->
<div style="border: 2px dashed #43a047; padding: 20px; border-radius: 8px; background: rgba(67, 160, 71, 0.05);">
<h5>📁 Custom File Analysis</h5>
<p>Your own file upload interface:</p>
<input type="file" id="custom-file-input" style="width: 100%; margin: 5px 0;">
<button onclick="customFileExample()" style="width: 100%;">Analyze File</button>
<!-- Custom File Upload Example - DISABLED: Upload functionality under development -->
<div style="border: 2px dashed #ccc; padding: 20px; border-radius: 8px; background: rgba(128, 128, 128, 0.05); opacity: 0.6;">
<h5>📁 Custom File Analysis <span style="color: #999; font-size: 0.8em;">(Under Development)</span></h5>
<p>File upload interface (temporarily disabled):</p>
<input type="file" id="custom-file-input" style="width: 100%; margin: 5px 0;" disabled>
<button onclick="alert('File upload feature is under development')" style="width: 100%;" disabled>Analyze File (Coming Soon)</button>
<div id="custom-file-result" style="margin: 10px 0; padding: 10px; background: #f9f9f9; border-radius: 5px; display: none;"></div>
</div>