sneedpage/index.html
The Ghost of FOSS' Future 592099f64c
Update index.html
2024-09-17 07:39:45 -05:00

96 lines
2.8 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<title>SneedPage</title>
<style>
#preview {
width: 100%;
height: 400px; /* Adjust height as needed */
border: 1px solid #ccc;
}
</style>
</head>
<body>
<textarea id="prompt" rows="10" cols="50"></textarea>
<button onclick="generateWebsite()">Generate</button>
<iframe id="preview"></iframe>
<button onclick="saveHTML()">Save HTML</button>
<script>
let currentHTML = '';
function generateWebsite() {
const prompt = document.getElementById("prompt").value;
const generatedHTML = generateHTMLFromPrompt(prompt);
// Load the generated HTML into the iframe
const iframe = document.getElementById("preview");
const iframeDoc = iframe.contentWindow.document;
iframeDoc.open();
iframeDoc.write(generatedHTML);
iframeDoc.close();
}
function saveHTML() {
if (!currentHTML) {
alert("No HTML to save. Generate content first.");
return;
}
const blob = new Blob([currentHTML], { type: "text/html" });
const a = document.createElement("a");
a.href = URL.createObjectURL(blob);
a.download = "generated_website.html";
a.click();
}
function generateHTMLFromPrompt(prompt) {
const url = `https://cloud.sparksammy.com/yaps.php?targetUrl=https://ollama-api.nodemixaholic.com/api/generate`; // https://ollama-api.nodemixaholic.com/api/generate
const answerCount = 0; // Assuming you want this to start at 0
if (answerCount < 1) {
prompt += `
Create this in HTML, CSS, and Javascript as a single-page application with dynamically loading content.
Do NOT use external libraries.`;
} else {
prompt += `
See that? Yeah do that to the following website code:
"
${currentHTML}
"
Be sure to use HTML, CSS, and Javascript and make it a single-page application with dynamically loading content.
Do NOT use external libraries.
Fix any bugs as well.`;
}
const body = JSON.stringify({
model: "starcoder2:7b",
prompt: prompt // User's prompt from the text area
});
return fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: body
})
.then(response => response.json())
.then(data => {
// Update the currentHTML and display it in the iframe
currentHTML = data.response;
document.getElementById("preview").contentWindow.document.open();
document.getElementById("preview").contentWindow.document.write(currentHTML);
document.getElementById("preview").contentWindow.document.close();
return data.response;
})
.catch(error => {
console.error('Error:', error);
// Handle API errors and display an error message to the user
});
}
</script>
</body>
</html>