Changes to voiceagents.scroll.pub

root
root
23 days ago
Initial commit
body.html
Changed around line 1
+
+

Voice Agents Dashboard

+

Create and manage your voice agents with ease using Vapi API.

+
+
+
+
+

Create New Voice Agent

+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+

Your Voice Agents

+
    +
    +
    +
    +
    +

    Powered by Vapi API

    +
    index.scroll
    Changed around line 1
    + buildHtml
    + baseUrl https://voiceagents.scroll.pub
    + metaTags
    + editButton /edit.html
    + title Voice Agents Dashboard
    + style.css
    + body.html
    + script.js
    prompt.json
    Changed around line 1
    + {
    + "id": "cd88de53-0327-4462-8861-3e3e004429bb",
    + "object": "chat.completion",
    + "created": 1735494727,
    + "model": "deepseek-chat",
    + "choices": [
    + {
    + "index": 0,
    + "message": {
    + "role": "assistant",
    + "content": "---domain---\nvoiceagents.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://voiceagents.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Voice Agents Dashboard\nstyle.css\nbody.html\nscript.js\n---body.html---\n
    \n

    Voice Agents Dashboard

    \n

    Create and manage your voice agents with ease using Vapi API.

    \n
    \n\n
    \n
    \n

    Create New Voice Agent

    \n
    \n \n \n \n \n \n \n \n \n \n \n
    \n
    \n\n
    \n

    Your Voice Agents

    \n
      \n
      \n
      \n\n
      \n

      Powered by Vapi API

      \n
      \n---style.css---\n:root {\n --primary-color: #4a90e2;\n --secondary-color: #f5f5f5;\n --text-color: #333;\n --border-radius: 8px;\n --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\nbody {\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n line-height: 1.6;\n margin: 0;\n padding: 0;\n color: var(--text-color);\n background-color: var(--secondary-color);\n}\n\nheader {\n background-color: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n}\n\nmain {\n padding: 2rem;\n max-width: 800px;\n margin: 0 auto;\n}\n\nsection {\n background: white;\n padding: 1.5rem;\n margin-bottom: 2rem;\n border-radius: var(--border-radius);\n box-shadow: var(--box-shadow);\n}\n\nform {\n display: grid;\n gap: 1rem;\n}\n\nlabel {\n font-weight: bold;\n}\n\ninput, textarea, select {\n width: 100%;\n padding: 0.5rem;\n border: 1px solid #ddd;\n border-radius: var(--border-radius);\n}\n\nbutton {\n background-color: var(--primary-color);\n color: white;\n padding: 0.75rem;\n border: none;\n border-radius: var(--border-radius);\n cursor: pointer;\n transition: background-color 0.3s ease;\n}\n\nbutton:hover {\n background-color: darken(var(--primary-color), 10%);\n}\n\n#agent-list ul {\n list-style: none;\n padding: 0;\n}\n\n#agent-list li {\n background: var(--secondary-color);\n padding: 1rem;\n margin-bottom: 0.5rem;\n border-radius: var(--border-radius);\n}\n\nfooter {\n text-align: center;\n padding: 1rem;\n background-color: var(--primary-color);\n color: white;\n}\n\n@media (max-width: 600px) {\n main {\n padding: 1rem;\n }\n\n header {\n padding: 1rem;\n }\n}\n---script.js---\ndocument.getElementById('agent-form').addEventListener('submit', function(event) {\n event.preventDefault();\n \n const agentName = document.getElementById('agent-name').value;\n const agentDescription = document.getElementById('agent-description').value;\n const agentLanguage = document.getElementById('agent-language').value;\n \n const agent = {\n name: agentName,\n description: agentDescription,\n language: agentLanguage\n };\n \n addAgentToList(agent);\n clearForm();\n});\n\nfunction addAgentToList(agent) {\n const agentList = document.getElementById('agents');\n \n const li = document.createElement('li');\n li.innerHTML = `\n

      ${agent.name}

      \n

      ${agent.description}

      \n Language: ${agent.language}\n `;\n \n agentList.appendChild(li);\n}\n\nfunction clearForm() {\n document.getElementById('agent-form').reset();\n}\n---end---"
      + },
      + "logprobs": null,
      + "finish_reason": "stop"
      + }
      + ],
      + "usage": {
      + "prompt_tokens": 248,
      + "completion_tokens": 1045,
      + "total_tokens": 1293,
      + "prompt_cache_hit_tokens": 0,
      + "prompt_cache_miss_tokens": 248
      + },
      + "system_fingerprint": "fp_f1afce2943"
      + }
      readme.scroll
      Changed around line 1
      + # voiceagents.scroll.pub
      + Website generated by DeepSeek from prompt: create a working dashboard where users can create voice agents using vapi api
      script.js
      Changed around line 1
      + document.getElementById('agent-form').addEventListener('submit', function(event) {
      + event.preventDefault();
      +
      + const agentName = document.getElementById('agent-name').value;
      + const agentDescription = document.getElementById('agent-description').value;
      + const agentLanguage = document.getElementById('agent-language').value;
      +
      + const agent = {
      + name: agentName,
      + description: agentDescription,
      + language: agentLanguage
      + };
      +
      + addAgentToList(agent);
      + clearForm();
      + });
      +
      + function addAgentToList(agent) {
      + const agentList = document.getElementById('agents');
      +
      + const li = document.createElement('li');
      + li.innerHTML = `
      +

      ${agent.name}

      +

      ${agent.description}

      + Language: ${agent.language}
      + `;
      +
      + agentList.appendChild(li);
      + }
      +
      + function clearForm() {
      + document.getElementById('agent-form').reset();
      + }
      style.css
      Changed around line 1
      + :root {
      + --primary-color: #4a90e2;
      + --secondary-color: #f5f5f5;
      + --text-color: #333;
      + --border-radius: 8px;
      + --box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      + }
      +
      + body {
      + font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
      + line-height: 1.6;
      + margin: 0;
      + padding: 0;
      + color: var(--text-color);
      + background-color: var(--secondary-color);
      + }
      +
      + header {
      + background-color: var(--primary-color);
      + color: white;
      + padding: 2rem;
      + text-align: center;
      + }
      +
      + main {
      + padding: 2rem;
      + max-width: 800px;
      + margin: 0 auto;
      + }
      +
      + section {
      + background: white;
      + padding: 1.5rem;
      + margin-bottom: 2rem;
      + border-radius: var(--border-radius);
      + box-shadow: var(--box-shadow);
      + }
      +
      + form {
      + display: grid;
      + gap: 1rem;
      + }
      +
      + label {
      + font-weight: bold;
      + }
      +
      + input, textarea, select {
      + width: 100%;
      + padding: 0.5rem;
      + border: 1px solid #ddd;
      + border-radius: var(--border-radius);
      + }
      +
      + button {
      + background-color: var(--primary-color);
      + color: white;
      + padding: 0.75rem;
      + border: none;
      + border-radius: var(--border-radius);
      + cursor: pointer;
      + transition: background-color 0.3s ease;
      + }
      +
      + button:hover {
      + background-color: darken(var(--primary-color), 10%);
      + }
      +
      + #agent-list ul {
      + list-style: none;
      + padding: 0;
      + }
      +
      + #agent-list li {
      + background: var(--secondary-color);
      + padding: 1rem;
      + margin-bottom: 0.5rem;
      + border-radius: var(--border-radius);
      + }
      +
      + footer {
      + text-align: center;
      + padding: 1rem;
      + background-color: var(--primary-color);
      + color: white;
      + }
      +
      + @media (max-width: 600px) {
      + main {
      + padding: 1rem;
      + }
      +
      + header {
      + padding: 1rem;
      + }
      + }