diff --git a/templates/chat.html b/templates/chat.html index b2b32a7..143c5af 100644 --- a/templates/chat.html +++ b/templates/chat.html @@ -1364,9 +1364,16 @@ function addCopyButtonToCodeBlock(block, wasTruncated = false) { executeCodeBlock(contentToCopy, block, playButton); }; + // Create a button to download compiled binary (hidden initially) + const downloadBinaryButton = document.createElement('button'); + downloadBinaryButton.textContent = '⬇ Download Binary'; + downloadBinaryButton.classList.add('download-binary-button'); + downloadBinaryButton.style.display = 'none'; + // Add buttons to container buttonContainer.appendChild(copyButton); buttonContainer.appendChild(playButton); + buttonContainer.appendChild(downloadBinaryButton); // Insert the button container after the
 element (not inside it)
     // block is , block.parentNode is 
@@ -1600,55 +1607,57 @@ function displayExecutionResults(result, resultsContainer, language) {
 
     resultsContainer.innerHTML = outputHtml;
 
+    // Find the download binary button (it's in the button container next to the Run button)
+    // resultsContainer is inside 
, button container is the next sibling of 
+    const preElement = resultsContainer.parentNode;
+    const buttonContainer = preElement.nextSibling;
+    const downloadButton = buttonContainer?.querySelector('.download-binary-button');
+
     // Check for compiled binary artifact
     if (result.artifact && result.artifact.type === 'base64' && result.artifact.data) {
-        // Create download binary button
-        const downloadButton = document.createElement('button');
-        downloadButton.textContent = '⬇ Download Binary';
-        downloadButton.style.marginTop = '10px';
-        downloadButton.style.padding = '6px 12px';
-        downloadButton.style.backgroundColor = 'var(--button-primary)';
-        downloadButton.style.color = 'white';
-        downloadButton.style.border = 'none';
-        downloadButton.style.borderRadius = '4px';
-        downloadButton.style.cursor = 'pointer';
-        downloadButton.style.fontFamily = 'inherit';
-        downloadButton.style.fontSize = '14px';
+        // Show and populate the download button
+        if (downloadButton) {
+            downloadButton.style.display = 'inline-block';
+            downloadButton.onclick = () => {
+                try {
+                    // Convert base64 to binary
+                    const binaryString = atob(result.artifact.data);
+                    const bytes = new Uint8Array(binaryString.length);
+                    for (let i = 0; i < binaryString.length; i++) {
+                        bytes[i] = binaryString.charCodeAt(i);
+                    }
 
-        downloadButton.onclick = () => {
-            try {
-                // Convert base64 to binary
-                const binaryString = atob(result.artifact.data);
-                const bytes = new Uint8Array(binaryString.length);
-                for (let i = 0; i < binaryString.length; i++) {
-                    bytes[i] = binaryString.charCodeAt(i);
+                    // Create blob and download
+                    const blob = new Blob([bytes], { type: 'application/octet-stream' });
+                    const url = URL.createObjectURL(blob);
+                    const a = document.createElement('a');
+                    a.href = url;
+                    a.download = result.artifact.filename || 'compiled_binary';
+                    document.body.appendChild(a);
+                    a.click();
+                    document.body.removeChild(a);
+                    URL.revokeObjectURL(url);
+                } catch (error) {
+                    console.error('Error downloading binary:', error);
+                    alert('Failed to download binary: ' + error.message);
                 }
+            };
+        }
+    } else {
+        // Hide the download button if no artifact or artifact error
+        if (downloadButton) {
+            downloadButton.style.display = 'none';
+        }
 
-                // Create blob and download
-                const blob = new Blob([bytes], { type: 'application/octet-stream' });
-                const url = URL.createObjectURL(blob);
-                const a = document.createElement('a');
-                a.href = url;
-                a.download = result.artifact.filename || 'compiled_binary';
-                document.body.appendChild(a);
-                a.click();
-                document.body.removeChild(a);
-                URL.revokeObjectURL(url);
-            } catch (error) {
-                console.error('Error downloading binary:', error);
-                alert('Failed to download binary: ' + error.message);
-            }
-        };
-
-        resultsContainer.appendChild(downloadButton);
-    } else if (result.artifact && result.artifact.type === 'error') {
         // Show artifact error if present
-        const artifactError = document.createElement('div');
-        artifactError.style.color = 'var(--text-warning)';
-        artifactError.style.marginTop = '8px';
-        artifactError.style.fontSize = '12px';
-        artifactError.textContent = `Artifact error: ${result.artifact.error}`;
-        resultsContainer.appendChild(artifactError);
+        if (result.artifact && result.artifact.type === 'error') {
+            const artifactError = document.createElement('div');
+            artifactError.style.color = 'var(--text-warning)';
+            artifactError.style.marginTop = '8px';
+            artifactError.style.fontSize = '12px';
+            artifactError.textContent = `Artifact error: ${result.artifact.error}`;
+            resultsContainer.appendChild(artifactError);
+        }
     }
 }