Spaces:
Runtime error
Runtime error
| <html> | |
| <head> | |
| <title>Twitter Accounts</title> | |
| <meta charset="UTF-8"> | |
| <meta name="description" content="This is a simple webpage that is included in my Twitter Account Project"> | |
| <link rel="stylesheet" type="text/css" href="../static/style.css"> | |
| <link rel="shortcut icon" type="image/x-icon" href="../static/tweepy.ico"> | |
| <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> | |
| </head> | |
| <body> | |
| <div class="page"> | |
| <h1>Twitter Accounts</h1> | |
| <div class="form"> | |
| <div class="inner"> | |
| <h2>Twitter Account Info (Live)</h2> | |
| <iframe src="/accounts" width=850 height="250" frameborder="0"></iframe> | |
| </div> | |
| <label for="account">Choose the Twitter account you'd like to generate a response to your input:</label> | |
| <select name="account" id="account"> | |
| <option value="alikarimi_ak8">alikarimi_ak8</option> | |
| <option value="elonmusk">elonmusk</option> | |
| <option value="BarackObama">BarackObama</option> | |
| <option value="taylorlorenz">taylorlorenz</option> | |
| <option value="cathiedwood">cathiedwood</option> | |
| <option value="ylecun">ylecun</option> | |
| </select> | |
| <textarea id="input" placeholder="Enter text here...">Hello world...!?</textarea> | |
| <button id="generate">Generate</button> | |
| <textarea id="output" placeholder="Generated text will appear here..."></textarea> | |
| </div> | |
| <div id="form"> | |
| <div class="tweets"> | |
| <h2>Tweets (Live)</h2> | |
| <iframe id="tweetsFrame" width="850" height="300" frameborder="0"></iframe> | |
| </div> | |
| <div id="summary"> | |
| <button id="generateSummary">Generate Summary</button> | |
| <textarea id="outputSummary" placeholder="Generated text will appear here..." style="width: 100%; height: 150px;"></textarea> | |
| </div> | |
| </div> | |
| <div id="outer"> | |
| <h2>Twitter Account Analysis (Historical)</h2> | |
| <div class="inner"> | |
| <p align="center"><iframe src="/examples1" width=850 height="450" frameborder="0"></iframe></p> | |
| </div> | |
| <div class="inner"> | |
| <p align="center"><iframe src="/examples2" width=900 height="550" frameborder="0"></iframe></p> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="../static/main.js"></script> | |
| <script> | |
| async function fastApiRequest(path, options) { | |
| try { | |
| const response = await fetch(path, options); | |
| const data = await response.json(); | |
| return data; | |
| } catch (error) { | |
| console.error(error); | |
| } | |
| } | |
| function generateTweets() { | |
| var account = document.getElementById("account").value; | |
| var tweetsFrame = document.getElementById("tweetsFrame"); | |
| var outputSummary = document.getElementById("outputSummary"); | |
| outputSummary.value = 'Tweets being pulled and summarized...'; | |
| // Create a new text node | |
| var loadingText = document.createTextNode("Loading..."); | |
| // Append the text node to the iframe element | |
| tweetsFrame.appendChild(loadingText); | |
| // Set the iframe element's visibility to "hidden" | |
| //tweetsFrame.style.visibility = "hidden"; | |
| // Send an AJAX request to the server to retrieve the tweets data | |
| fastApiRequest('/tweets/' + account) | |
| .then(response => { | |
| var tweetsHtml = response.html; | |
| var tweetsData = response.data; | |
| // Display the HTML version of the tweets | |
| tweetsFrame.innerHTML = tweetsHtml; | |
| //tweetsFrame.src = tweetsHtml;//"/tweets/" + account; | |
| tweetsFrame.srcdoc = tweetsHtml; | |
| // Log that tweetsFrame is being updated | |
| console.log('tweetsFrame is being updated. '); | |
| // Make a POST request to the /api/generate_summary endpoint | |
| fastApiRequest('/api/generate_summary', { | |
| method: 'POST', | |
| headers: { 'Content-Type': 'application/json' }, | |
| body: JSON.stringify({ tweetsData: tweetsData }) | |
| }) | |
| .then(summaryResponse => { | |
| console.log('Summary response:', summaryResponse); | |
| // Process the summary response as needed | |
| outputSummary.value = summaryResponse.tweets_summary; | |
| }) | |
| .catch(error => { | |
| console.error('Failed to generate summary:', error); | |
| }); | |
| }) | |
| .catch(error => { | |
| console.error('Failed to retrieve tweets:', error); | |
| }); | |
| } | |
| window.onload = function () { | |
| generateTweets(); // Call generateTweets() when the page finishes loading | |
| }; | |
| document.getElementById("account").addEventListener("change", function () { | |
| generateTweets(); // Call generateTweets() whenever a new account is selected | |
| }); | |
| </script> | |
| </html> |