248 lines
12 KiB
HTML
248 lines
12 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Twitter API Interface - Sentinel Team</title>
|
|
<link rel="stylesheet" href="style.css">
|
|
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<h1>Twitter API Interface</h1>
|
|
<p>Interface for managing Twitter accounts and retrieving tweets</p>
|
|
<p><small>API Server: <a href="https://tweets.nunosempere.com" target="_blank">https://tweets.nunosempere.com</a></small></p>
|
|
</header>
|
|
|
|
<main>
|
|
<section class="tool-section">
|
|
<h2>Health Check</h2>
|
|
<p>Check if the Twitter API server is running:</p>
|
|
|
|
<button id="health-check" class="primary-btn">Check Server Health</button>
|
|
<div id="health-result" class="results-container"></div>
|
|
</section>
|
|
|
|
<section class="tool-section">
|
|
<h2>Account Management</h2>
|
|
<p>Add or view monitored accounts from the database.</p>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Add Account</h3>
|
|
<p style="font-size: 15px">To add many at once, consider downloading the list of people you follow. (More > Settings and Privacy > Your account > Download an archive of your data)</p>
|
|
|
|
<div class="input-group">
|
|
<label for="add-username">Twitter Username:</label>
|
|
<input type="text" id="add-username" placeholder="elonmusk" aria-label="Twitter username to add">
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="add-account" class="primary-btn">Add Account</button>
|
|
</div>
|
|
|
|
<div id="account-result" class="results-container"></div>
|
|
</div>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Bulk Import Accounts</h3>
|
|
<p>Add multiple accounts at once. Enter one username per line. An extension like <a href="https://chromewebstore.google.com/detail/twlistexport-export-twitt/goplibopdcpikpipdlfeelhjnieeaeia?hl=en">this one</a> to export twitter lists might be useful to you here.</p>
|
|
|
|
<div class="input-group">
|
|
<label for="bulk-usernames">Twitter Usernames (one per line):</label>
|
|
<textarea id="bulk-usernames" rows="6" placeholder="elonmusk OpenAI AnthropicAI username4" aria-label="Multiple usernames to add" style="resize: vertical;"></textarea>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="bulk-add-accounts" class="primary-btn">Add All Accounts</button>
|
|
</div>
|
|
|
|
<div id="bulk-result" class="results-container"></div>
|
|
</div>
|
|
|
|
<div class="account-subsection">
|
|
<h3>View Monitored Accounts</h3>
|
|
<p>View all accounts currently being monitored by the system.</p>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="show-accounts" class="secondary-btn">Show Monitored Accounts</button>
|
|
<button id="hide-accounts" class="secondary-btn" style="display: none;">Hide Accounts</button>
|
|
</div>
|
|
|
|
<div id="monitored-accounts-result" class="results-container"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="tool-section">
|
|
<h2>List Management</h2>
|
|
<p>View and create lists for organizing monitored accounts.</p>
|
|
|
|
<div class="account-subsection">
|
|
<h3>View All Lists</h3>
|
|
<p>View all lists currently in the system.</p>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="show-lists" class="secondary-btn">Show All Lists</button>
|
|
<button id="hide-lists" class="secondary-btn" style="display: none;">Hide Lists</button>
|
|
</div>
|
|
|
|
<div id="lists-result" class="results-container"></div>
|
|
</div>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Create New List</h3>
|
|
<p>Create a new list from existing monitored accounts.</p>
|
|
|
|
<div class="input-group">
|
|
<label for="new-list-name">List Name:</label>
|
|
<input type="text" id="new-list-name" placeholder="freight" aria-label="New list name">
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<label for="list-usernames">Usernames for List (one per line):</label>
|
|
<textarea id="list-usernames" rows="6" placeholder="typesfast FreightAlley FreightWaves FreightGuy11 SpencerHakimian" aria-label="Usernames to add to list" style="resize: vertical;"></textarea>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="create-list" class="primary-btn">Create List</button>
|
|
</div>
|
|
|
|
<div id="create-list-result" class="results-container"></div>
|
|
</div>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Edit Existing List</h3>
|
|
<p style="color: #d32f2f; font-weight: bold;">⚠️ WARNING: This operation is destructive and will completely replace the existing list contents.</p>
|
|
<p style="font-size: 15px;">Before editing, you can copy the current list items from the "View All Lists" section above using the "Copy List" button.</p>
|
|
|
|
<div class="input-group">
|
|
<label for="edit-list-name">List Name to Edit:</label>
|
|
<input type="text" id="edit-list-name" placeholder="existing-list-name" aria-label="Name of list to edit">
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<label for="edit-list-usernames">New Usernames for List (one per line):</label>
|
|
<textarea id="edit-list-usernames" rows="6" placeholder="username1 username2 username3" aria-label="New usernames to replace in list" style="resize: vertical;"></textarea>
|
|
</div>
|
|
|
|
<div class="input-group">
|
|
<label for="edit-list-password">Password:</label>
|
|
<input type="password" id="edit-list-password" placeholder="Required for editing lists" aria-label="Password for editing lists">
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="edit-list" class="primary-btn">Edit List</button>
|
|
</div>
|
|
|
|
<div id="edit-list-result" class="results-container"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="tool-section">
|
|
<h2>Tweet Retrieval</h2>
|
|
<p>Retrieve tweets from monitored accounts or specific users.</p>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Get Tweets from All Accounts</h3>
|
|
<p>Retrieve tweets from all monitored accounts with optional list filtering:</p>
|
|
|
|
<div class="input-grid">
|
|
<div class="input-group">
|
|
<label for="tweets-list">List Name:</label>
|
|
<input type="text" id="tweets-list" placeholder="whitehouse" aria-label="Filter by list name">
|
|
</div>
|
|
<div class="input-group">
|
|
<label for="tweets-limit">Limit (max 1000):</label>
|
|
<input type="number" id="tweets-limit" value="1000" min="1" max="1000" aria-label="Number of tweets to retrieve">
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="get-all-tweets" class="primary-btn">Get All Tweets</button>
|
|
<button id="hide-all-tweets" class="secondary-btn" style="display: none; margin-left: 10px;">Hide Results</button>
|
|
</div>
|
|
|
|
<div id="tweets-result" class="results-container"></div>
|
|
</div>
|
|
|
|
<div class="account-subsection">
|
|
<h3>Get User Tweets</h3>
|
|
<p>Retrieve tweets from a specific user:</p>
|
|
|
|
<div class="input-grid">
|
|
<div class="input-group">
|
|
<label for="user-tweets-username">Username:</label>
|
|
<input type="text" id="user-tweets-username" placeholder="elonmusk" aria-label="Username to get tweets from">
|
|
</div>
|
|
<div class="input-group">
|
|
<label for="user-tweets-limit">Limit (max 1000):</label>
|
|
<input type="number" id="user-tweets-limit" value="1000" min="1" max="1000" aria-label="Number of tweets from user">
|
|
</div>
|
|
</div>
|
|
|
|
<div style="margin-bottom: 20px;">
|
|
<button id="get-user-tweets" class="primary-btn">Get User Tweets</button>
|
|
<button id="hide-user-tweets" class="secondary-btn" style="display: none; margin-left: 10px;">Hide Results</button>
|
|
</div>
|
|
|
|
<div id="user-tweets-result" class="results-container"></div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="tool-section">
|
|
<h2>AI Tweet Filtering</h2>
|
|
<p>Filter tweets from the last seven days, using natural language questions; only the tweets for which the question answers in the positive will be shown. Provide either a list name OR specific usernames. Once started, this process will take a few minutes.</p>
|
|
|
|
<div class="input-container" style="margin-bottom: 20px;">
|
|
<label for="filter-question">Filter Question:</label>
|
|
<textarea
|
|
id="filter-question"
|
|
rows="3"
|
|
placeholder="Does this tweet discuss artificial intelligence or machine learning?"
|
|
aria-label="Question to filter tweets with"
|
|
style="width: 100%; resize: vertical;"
|
|
></textarea>
|
|
</div>
|
|
|
|
<div class="input-container" style="margin-bottom: 20px;">
|
|
<label for="summarization-question">Summarization Question:</label>
|
|
<textarea
|
|
id="summarization-question"
|
|
rows="3"
|
|
placeholder="What are the key AI developments discussed in these tweets?"
|
|
aria-label="Question for summarizing filtered tweets"
|
|
style="width: 100%; resize: vertical;"
|
|
></textarea>
|
|
</div>
|
|
|
|
<div class="input-container" style="margin-bottom: 20px;">
|
|
<label for="filter-list">List Name (optional):</label>
|
|
<input
|
|
type="text"
|
|
id="filter-list"
|
|
placeholder="whitehouse"
|
|
aria-label="Filter tweets from this list"
|
|
style="width: 100%;"
|
|
>
|
|
</div>
|
|
|
|
<div class="input-container" style="margin-bottom: 20px;">
|
|
<label for="filter-users">OR Usernames (one per line):</label>
|
|
<textarea
|
|
id="filter-users"
|
|
rows="5"
|
|
placeholder="OpenAI elonmusk AnthropicAI"
|
|
aria-label="Usernames to filter tweets from"
|
|
style="width: 100%; resize: vertical;"
|
|
></textarea>
|
|
</div>
|
|
|
|
<button id="filter-tweets" class="primary-btn">Filter Tweets</button>
|
|
<button id="hide-filter-results" class="secondary-btn" style="display: none; margin-left: 10px;">Hide Results</button>
|
|
<div id="filter-result" class="results-container"></div>
|
|
</section>
|
|
</main>
|
|
|
|
<script type="module" src="twit.js"></script>
|
|
</body>
|
|
</html>
|