commit 352e848c3a44313d8e513cf6fa7984d241c9dfa9
Author: root <root@hub.scroll.pub> Date: 2024-12-28 13:39:57 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..9ca071f --- /dev/null +++ b/body.html @@ -0,0 +1,50 @@ +<header class="hero"> + <h1>TweetWiz</h1> + <p class="tagline">Your AI-Powered Twitter Content Optimizer</p> +</header> + +<main> + <section class="tool-section"> + <h2>Content Analyzer</h2> + <div class="tool-container"> + <textarea id="tweetInput" placeholder="Paste your tweet draft here..." aria-label="Tweet input"></textarea> + <div class="metrics-grid"> + <div class="metric"> + <span class="metric-value" id="charCount">0</span> + <span class="metric-label">Characters</span> + </div> + <div class="metric"> + <span class="metric-value" id="wordCount">0</span> + <span class="metric-label">Words</span> + </div> + <div class="metric"> + <span class="metric-value" id="hashtagCount">0</span> + <span class="metric-label">Hashtags</span> + </div> + <div class="metric"> + <span class="metric-value" id="linkCount">0</span> + <span class="metric-label">Links</span> + </div> + </div> + <button id="analyzeBtn" class="cta-button">Analyze Tweet</button> + </div> + </section> + + <section class="suggestion-section"> + <h2>Content Suggestions</h2> + <div class="suggestion-container"> + <div class="suggestion-card"> + <h3>Trending Topics</h3> + <ul id="trendingTopics"></ul> + </div> + <div class="suggestion-card"> + <h3>Optimal Posting Times</h3> + <div id="postingTimesChart"></div> + </div> + </div> + </section> +</main> + +<footer> + <p>Made with ❤️ for Twitter creators</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..b10298f --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://tweetwiz.scroll.pub +metaTags +editButton /edit.html +title TweetWiz - Optimize Your Twitter Content +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..aa01f2d --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "bc1c1068-c10c-4931-b987-4c9a56f5ea8e", + "object": "chat.completion", + "created": 1735393169, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\ntweetwiz.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://tweetwiz.scroll.pub\nmetaTags\neditButton /edit.html\ntitle TweetWiz - Optimize Your Twitter Content\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header class=\"hero\">\n <h1>TweetWiz</h1>\n <p class=\"tagline\">Your AI-Powered Twitter Content Optimizer</p>\n</header>\n\n<main>\n <section class=\"tool-section\">\n <h2>Content Analyzer</h2>\n <div class=\"tool-container\">\n <textarea id=\"tweetInput\" placeholder=\"Paste your tweet draft here...\" aria-label=\"Tweet input\"></textarea>\n <div class=\"metrics-grid\">\n <div class=\"metric\">\n <span class=\"metric-value\" id=\"charCount\">0</span>\n <span class=\"metric-label\">Characters</span>\n </div>\n <div class=\"metric\">\n <span class=\"metric-value\" id=\"wordCount\">0</span>\n <span class=\"metric-label\">Words</span>\n </div>\n <div class=\"metric\">\n <span class=\"metric-value\" id=\"hashtagCount\">0</span>\n <span class=\"metric-label\">Hashtags</span>\n </div>\n <div class=\"metric\">\n <span class=\"metric-value\" id=\"linkCount\">0</span>\n <span class=\"metric-label\">Links</span>\n </div>\n </div>\n <button id=\"analyzeBtn\" class=\"cta-button\">Analyze Tweet</button>\n </div>\n </section>\n\n <section class=\"suggestion-section\">\n <h2>Content Suggestions</h2>\n <div class=\"suggestion-container\">\n <div class=\"suggestion-card\">\n <h3>Trending Topics</h3>\n <ul id=\"trendingTopics\"></ul>\n </div>\n <div class=\"suggestion-card\">\n <h3>Optimal Posting Times</h3>\n <div id=\"postingTimesChart\"></div>\n </div>\n </div>\n </section>\n</main>\n\n<footer>\n <p>Made with ❤️ for Twitter creators</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #1DA1F2;\n --secondary-color: #14171A;\n --background-color: #F5F8FA;\n --text-color: #657786;\n --accent-color: #E1E8ED;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;\n background-color: var(--background-color);\n color: var(--text-color);\n line-height: 1.6;\n padding: 20px;\n}\n\n.hero {\n text-align: center;\n margin: 2rem 0;\n}\n\n.hero h1 {\n font-size: 2.5rem;\n color: var(--secondary-color);\n}\n\n.tagline {\n font-size: 1.2rem;\n color: var(--primary-color);\n}\n\n.tool-section {\n max-width: 800px;\n margin: 2rem auto;\n}\n\n.tool-container {\n background: white;\n padding: 2rem;\n border-radius: 12px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\ntextarea {\n width: 100%;\n min-height: 150px;\n padding: 1rem;\n border: 2px solid var(--accent-color);\n border-radius: 8px;\n font-size: 1rem;\n margin-bottom: 1.5rem;\n resize: vertical;\n}\n\n.metrics-grid {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\n gap: 1rem;\n margin-bottom: 1.5rem;\n}\n\n.metric {\n text-align: center;\n padding: 1rem;\n background: var(--background-color);\n border-radius: 8px;\n}\n\n.metric-value {\n font-size: 1.5rem;\n font-weight: bold;\n color: var(--primary-color);\n display: block;\n}\n\n.metric-label {\n font-size: 0.9rem;\n color: var(--text-color);\n}\n\n.cta-button {\n background: var(--primary-color);\n color: white;\n border: none;\n padding: 0.8rem 2rem;\n border-radius: 25px;\n font-size: 1rem;\n cursor: pointer;\n transition: background 0.3s ease;\n width: 100%;\n}\n\n.cta-button:hover {\n background: #1991db;\n}\n\n.suggestion-section {\n max-width: 1200px;\n margin: 3rem auto;\n}\n\n.suggestion-container {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));\n gap: 2rem;\n}\n\n.suggestion-card {\n background: white;\n padding: 1.5rem;\n border-radius: 12px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\n.suggestion-card h3 {\n color: var(--secondary-color);\n margin-bottom: 1rem;\n}\n\n#postingTimesChart {\n height: 200px;\n background: var(--background-color);\n border-radius: 8px;\n margin-top: 1rem;\n}\n\nfooter {\n text-align: center;\n margin: 2rem 0;\n color: var(--text-color);\n}\n\n@media (max-width: 768px) {\n .hero h1 {\n font-size: 2rem;\n }\n \n .tool-container {\n padding: 1rem;\n }\n \n .metrics-grid {\n grid-template-columns: repeat(2, 1fr);\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', function() {\n const tweetInput = document.getElementById('tweetInput');\n const charCount = document.getElementById('charCount');\n const wordCount = document.getElementById('wordCount');\n const hashtagCount = document.getElementById('hashtagCount');\n const linkCount = document.getElementById('linkCount');\n const analyzeBtn = document.getElementById('analyzeBtn');\n const trendingTopics = document.getElementById('trendingTopics');\n const postingTimesChart = document.getElementById('postingTimesChart');\n\n // Update metrics in real-time\n tweetInput.addEventListener('input', updateMetrics);\n\n // Analyze button click handler\n analyzeBtn.addEventListener('click', function() {\n generateSuggestions();\n generatePostingTimesChart();\n });\n\n function updateMetrics() {\n const text = tweetInput.value;\n \n // Character count\n charCount.textContent = text.length;\n \n // Word count\n const words = text.split(/\\s+/).filter(word => word.length > 0);\n wordCount.textContent = words.length;\n \n // Hashtag count\n const hashtags = text.match(/#\\w+/g) || [];\n hashtagCount.textContent = hashtags.length;\n \n // Link count\n const links = text.match(/https?:\\/\\/[^\\s]+/g) || [];\n linkCount.textContent = links.length;\n }\n\n function generateSuggestions() {\n // Simulate trending topics\n const topics = [\n 'AI in Social Media',\n 'Content Creation Tips',\n 'Twitter Analytics',\n 'Social Media Strategy',\n 'Engagement Techniques'\n ];\n \n trendingTopics.innerHTML = topics\n .map(topic => `<li>${topic}</li>`)\n .join('');\n }\n\n function generatePostingTimesChart() {\n // Simulate posting times data\n const data = {\n labels: ['6 AM', '9 AM', '12 PM', '3 PM', '6 PM', '9 PM'],\n values: [20, 80, 60, 90, 70, 40]\n };\n\n // Create a simple bar chart\n postingTimesChart.innerHTML = '';\n data.values.forEach((value, index) => {\n const bar = document.createElement('div');\n bar.style.height = `${value}%`;\n bar.style.width = `${100 / data.values.length}%`;\n bar.style.backgroundColor = `hsl(${index * 60}, 70%, 50%)`;\n bar.style.display = 'inline-block';\n bar.style.marginRight = '2px';\n bar.setAttribute('aria-label', `${data.labels[index]}: ${value}% engagement`);\n postingTimesChart.appendChild(bar);\n });\n }\n\n // Initial setup\n updateMetrics();\n generateSuggestions();\n generatePostingTimesChart();\n});\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 263, + "completion_tokens": 1974, + "total_tokens": 2237, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 263 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..9a19202 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# tweetwiz.scroll.pub +Website generated by DeepSeek from prompt: I want a website that will help me decide the content of my twitter account. So it should have some numerical tools and interactivity. Be creative. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..f2ff5c0 --- /dev/null +++ b/script.js @@ -0,0 +1,79 @@ +document.addEventListener('DOMContentLoaded', function() { + const tweetInput = document.getElementById('tweetInput'); + const charCount = document.getElementById('charCount'); + const wordCount = document.getElementById('wordCount'); + const hashtagCount = document.getElementById('hashtagCount'); + const linkCount = document.getElementById('linkCount'); + const analyzeBtn = document.getElementById('analyzeBtn'); + const trendingTopics = document.getElementById('trendingTopics'); + const postingTimesChart = document.getElementById('postingTimesChart'); + + // Update metrics in real-time + tweetInput.addEventListener('input', updateMetrics); + + // Analyze button click handler + analyzeBtn.addEventListener('click', function() { + generateSuggestions(); + generatePostingTimesChart(); + }); + + function updateMetrics() { + const text = tweetInput.value; + + // Character count + charCount.textContent = text.length; + + // Word count + const words = text.split(/\s+/).filter(word => word.length > 0); + wordCount.textContent = words.length; + + // Hashtag count + const hashtags = text.match(/#\w+/g) || []; + hashtagCount.textContent = hashtags.length; + + // Link count + const links = text.match(/https?:\/\/[^\s]+/g) || []; + linkCount.textContent = links.length; + } + + function generateSuggestions() { + // Simulate trending topics + const topics = [ + 'AI in Social Media', + 'Content Creation Tips', + 'Twitter Analytics', + 'Social Media Strategy', + 'Engagement Techniques' + ]; + + trendingTopics.innerHTML = topics + .map(topic => `<li>${topic}</li>`) + .join(''); + } + + function generatePostingTimesChart() { + // Simulate posting times data + const data = { + labels: ['6 AM', '9 AM', '12 PM', '3 PM', '6 PM', '9 PM'], + values: [20, 80, 60, 90, 70, 40] + }; + + // Create a simple bar chart + postingTimesChart.innerHTML = ''; + data.values.forEach((value, index) => { + const bar = document.createElement('div'); + bar.style.height = `${value}%`; + bar.style.width = `${100 / data.values.length}%`; + bar.style.backgroundColor = `hsl(${index * 60}, 70%, 50%)`; + bar.style.display = 'inline-block'; + bar.style.marginRight = '2px'; + bar.setAttribute('aria-label', `${data.labels[index]}: ${value}% engagement`); + postingTimesChart.appendChild(bar); + }); + } + + // Initial setup + updateMetrics(); + generateSuggestions(); + generatePostingTimesChart(); +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..c7cac50 --- /dev/null +++ b/style.css @@ -0,0 +1,151 @@ +:root { + --primary-color: #1DA1F2; + --secondary-color: #14171A; + --background-color: #F5F8FA; + --text-color: #657786; + --accent-color: #E1E8ED; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + background-color: var(--background-color); + color: var(--text-color); + line-height: 1.6; + padding: 20px; +} + +.hero { + text-align: center; + margin: 2rem 0; +} + +.hero h1 { + font-size: 2.5rem; + color: var(--secondary-color); +} + +.tagline { + font-size: 1.2rem; + color: var(--primary-color); +} + +.tool-section { + max-width: 800px; + margin: 2rem auto; +} + +.tool-container { + background: white; + padding: 2rem; + border-radius: 12px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +textarea { + width: 100%; + min-height: 150px; + padding: 1rem; + border: 2px solid var(--accent-color); + border-radius: 8px; + font-size: 1rem; + margin-bottom: 1.5rem; + resize: vertical; +} + +.metrics-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); + gap: 1rem; + margin-bottom: 1.5rem; +} + +.metric { + text-align: center; + padding: 1rem; + background: var(--background-color); + border-radius: 8px; +} + +.metric-value { + font-size: 1.5rem; + font-weight: bold; + color: var(--primary-color); + display: block; +} + +.metric-label { + font-size: 0.9rem; + color: var(--text-color); +} + +.cta-button { + background: var(--primary-color); + color: white; + border: none; + padding: 0.8rem 2rem; + border-radius: 25px; + font-size: 1rem; + cursor: pointer; + transition: background 0.3s ease; + width: 100%; +} + +.cta-button:hover { + background: #1991db; +} + +.suggestion-section { + max-width: 1200px; + margin: 3rem auto; +} + +.suggestion-container { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; +} + +.suggestion-card { + background: white; + padding: 1.5rem; + border-radius: 12px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +.suggestion-card h3 { + color: var(--secondary-color); + margin-bottom: 1rem; +} + +#postingTimesChart { + height: 200px; + background: var(--background-color); + border-radius: 8px; + margin-top: 1rem; +} + +footer { + text-align: center; + margin: 2rem 0; + color: var(--text-color); +} + +@media (max-width: 768px) { + .hero h1 { + font-size: 2rem; + } + + .tool-container { + padding: 1rem; + } + + .metrics-grid { + grid-template-columns: repeat(2, 1fr); + } +} \ No newline at end of file