Update app.py

app.py

@@ -284,7 +284,7 @@ def get_recipe_suggestions(api_key, image_paths, num_recipes=3, dietary_restrict
                 {"role": "system", "content": system_prompt},
                 {"role": "user", "content": user_prompt}
             ],
-            max_tokens=2048,
+            max_tokens=20000,
             temperature=0.7
         )
         
@@ -508,7 +508,7 @@ body {
     padding: 0;
 }
 .container {
-    max-width: 1200px;
+    width: 100%;
     margin: 0 auto;
     padding: 20px;
 }
@@ -519,6 +519,7 @@ body {
     text-align: center;
     border-radius: 0 0 30px 30px;
     box-shadow: var(--box-shadow);
+    width: 100%;
 }
 .app-title {
     font-size: 2.8em;
@@ -537,6 +538,7 @@ body {
     padding: 30px;
     box-shadow: var(--box-shadow);
     margin-bottom: 30px;
+    width: 100%;
 }
 .section-header {
     font-size: 1.6em;
@@ -658,43 +660,6 @@ button.download-button:hover {
     color: var(--primary-color);
     margin-bottom: 10px;
 }
-.loading-container {
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    background-color: rgba(0, 0, 0, 0.5);
-    z-index: 1000;
-    opacity: 0;
-    visibility: hidden;
-    transition: opacity 0.3s ease, visibility 0.3s ease;
-}
-.loading-container.visible {
-    opacity: 1;
-    visibility: visible;
-}
-.loading-spinner {
-    border: 8px solid #f3f3f3;
-    border-top: 8px solid var(--primary-color);
-    border-radius: 50%;
-    width: 60px;
-    height: 60px;
-    animation: spin 1s linear infinite;
-}
-@keyframes spin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-}
-.loading-text {
-    color: white;
-    font-size: 1.3em;
-    margin-top: 20px;
-}
 .footer {
     background-color: var(--card-background);
     padding: 40px 20px;
@@ -702,6 +667,7 @@ button.download-button:hover {
     color: var(--text-color);
     font-size: 1.1em;
     box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.05);
+    width: 100%;
 }
 .footer-content {
     max-width: 800px;
@@ -727,19 +693,6 @@ html_header = """
     <div class="app-title">🍲 Visual Recipe Assistant</div>
     <div class="app-subtitle">Upload images of ingredients you have on hand and get personalized recipe suggestions powered by AI</div>
 </div>
-<div id="loading-overlay" class="loading-container">
-    <div class="loading-spinner"></div>
-    <div class="loading-text">Generating your recipes...</div>
-</div>
-<script>
-    function showLoading() {
-        document.getElementById('loading-overlay').classList.add('visible');
-    }
-    
-    function hideLoading() {
-        document.getElementById('loading-overlay').classList.remove('visible');
-    }
-</script>
 """
 
 html_footer = """
@@ -755,37 +708,6 @@ html_footer = """
         </div>
     </div>
 </div>
-<script>
-    document.addEventListener('DOMContentLoaded', function() {
-        const submitBtn = document.querySelector('button.primary-button');
-        if (submitBtn) {
-            submitBtn.addEventListener('click', function() {
-                showLoading();
-                // Check every second for output content
-                const checkInterval = setInterval(function() {
-                    const output = document.querySelector('.recipe-output');
-                    if (output && output.innerHTML.trim().length > 0) {
-                        hideLoading();
-                        clearInterval(checkInterval);
-                        clearTimeout(forceHideTimeout);
-                        
-                        // Show download button if it exists
-                        const downloadBtn = document.getElementById('download-button');
-                        if (downloadBtn) {
-                            downloadBtn.style.display = 'flex';
-                        }
-                    }
-                }, 1000);
-                
-                // Force hide after 120 seconds
-                const forceHideTimeout = setTimeout(function() {
-                    hideLoading();
-                    clearInterval(checkInterval);
-                }, 120000);
-            });
-        }
-    });
-</script>
 """
 
 with gr.Blocks(css=custom_css) as app:
@@ -873,8 +795,7 @@ with gr.Blocks(css=custom_css) as app:
     submit_button.click(
         fn=process_and_update_file_path,
         inputs=[api_key_input, file_upload, num_recipes, dietary_restrictions, cuisine_preference],
-        outputs=[output, html_file_path, download_button],
-        show_progress=True  # Show Gradio's built-in progress indicator as well
+        outputs=[output, html_file_path, download_button]
     )
     
     # Handle download button click
@@ -885,4 +806,4 @@ with gr.Blocks(css=custom_css) as app:
     )
 
 if __name__ == "__main__":
-    app.launch()
+    app.launch()