Schritt 1 - Öffnen Sie Ihre Ratenbegrenzungsdaten
Holen Sie sich zunächst Ihre aktuellen Nutzungs- und Kontingentinformationen direkt von Perplexity.
- Vergewissern Sie sich, dass Sie bei Ihrem Perplexity-Konto in Ihrem Browser angemeldet sind.
- Öffnen Sie diesen Link in einer neuen Registerkarte:
Ihr Browser zeigt einen Block mit JSON-Text an - dies sind Ihre Live-Ratenbeschränkungsdaten (wie viele Nachrichten, Rechercheläufe usw. Sie verwenden können).
Wählen Sie alles auf dieser Seite aus (Strg/⌘ + A, dann Strg/⌘ + C), um sie zu kopieren.
Schritt 2 - Öffnen Sie Ihre Einstellungsdaten
Als Nächstes rufen Sie die Details Ihres Tarifs, die Dateibeschränkungen, die Anschlüsse und die Einstellungen ab.
- Öffnen Sie diesen Link in einer neuen Registerkarte:
Diese Seite zeigt einen weiteren JSON-Block, der Ihre Abonnementdetails, Datei- und Seitenlimits sowie die Konfiguration des Connectors enthält.
Markieren Sie erneut den gesamten Text auf der Seite und kopieren Sie ihn (Strg/⌘ + A, dann Strg/⌘ + C).
Schritt 3 - Einfügen der Daten in das Dashboard
Sie haben jetzt zwei JSON-Blöcke: einen für Ihre Tarifgrenzen und einen für Ihre Kontoeinstellungen.
- Zurück zu dieser Seite.
- Einfügen der Ratenbegrenzung JSON in das erste Eingabefeld ein.
- Einfügen der Einstellungen JSON in das zweite Eingabefeld ein.
- Klicken Sie auf “Visualisiere meine Grenzen” um Ihre Rohdaten in eine saubere, interaktive Übersicht über Ihre Nutzung, Kontingente und Anschlüsse zu verwandeln.
Ihre Daten werden nur in Ihrem Browser zur Visualisierung verwendet. Sie behalten die volle Kontrolle darüber, was Sie einfügen und weitergeben.
:root {
–bg-primary: #0a0a0f;
–bg-secondary: #12121a;
–bg-card: #1a1a24;
–bg-card-hover: #222230;
–text-primary: #ffffff;
–text-secondary: #a0a0b0;
–text-muted: #6b6b7b;
–accent-primary: #6366f1;
–accent-secondary: #8b5cf6;
–accent-success: #10b981;
–accent-warning: #f59e0b;
–accent-danger: #ef4444;
–accent-info: #3b82f6;
–border-color: #2a2a3a;
–shadow: 0 4px 6px -1px rgba(0, 0, 0, 0,3), 0 2px 4px -1px rgba(0, 0, 0, 0,2);
–shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0,4), 0 10px 10px -5px rgba(0, 0, 0, 0,3);
–radius: 12px;
–radius-sm: 8px;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: ‘Inter’, -apple-system, BlinkMacSystemFont, sans-serif;
background: var(–bg-primary);
color: var(–text-primary);
min-height: 100vh;
line-height: 1.6;
}
.container {
max-width: 1400px;
margin: 0 auto;
padding: 2rem;
}
/* Kopfzeile */
.header {
text-align: center;
margin-bottom: 3rem;
padding: 2rem 0;
}
.header h1 {
font-size: 2,5rem;
font-weight: 700;
background: linear-gradient(135deg, var(–accent-primary), var(–accent-secondary));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
margin-bottom: 0.5rem;
}
.header p {
color: var(–text-secondary);
font-size: 1.1rem;
}
/* Eingabebereich */
.input-section {
background: var(–bg-card);
border-radius: var(–radius);
padding: 2rem;
margin-bottom: 2rem;
border: 1px solid var(–border-color);
}
.input-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1rem;
}
.input-header h2 {
font-size: 1.25rem;
font-weight: 600;
display: flex;
align-items: center;
gap: 0.5rem;
}
.input-header h2::before {
content: “📋”;
}
.btn-group {
display: flex;
gap: 0,5rem;
}
.btn {
padding: 0,5rem 1rem;
border-radius: var(–radius-sm);
border: none;
font-size: 0.875rem;
font-weight: 500;
cursor: pointer;
transition: all 0.2s ease;
}
.btn-primary {
background: linear-gradient(135deg, var(–accent-primary), var(–accent-secondary));
color: white;
}
.btn-primary:hover {
transform: translateY(-1px);
box-shadow: 0 4px 12px rgba(99, 102, 241, 0.4);
}
.btn-secondary {
background: var(–bg-secondary);
color: var(–text-primary);
border: 1px solid var(–border-color);
}
.btn-secondary:hover {
background: var(–bg-card-hover);
}
.json-input {
width: 100%;
min-height: 200px;
background: var(–bg-secondary);
border: 1px solid var(–border-color);
border-radius: var(–radius-sm);
padding: 1rem;
color: var(–text-primary);
font-family: ‘JetBrains Mono’, ‘Fira Code’, monospace;
font-size: 0.875rem;
resize: vertical;
transition: border-color 0.2s ease;
}
.json-input:focus {
outline: none;
border-color: var(–accent-primary);
}
.json-input::placeholder {
color: var(–text-muted);
}
/* Dashboard-Raster */
.dashboard {
display: none;
animation: fadeIn 0.5s ease;
}
.dashboard.active {
display: block;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(20px); }
to { opacity: 1; transform: translateY(0); }
}
/* Abschnittsüberschriften */
.section-header {
display: flex;
align-items: center;
gap: 0,75rem;
margin: 2rem 0 1rem 0;
padding-bottom: 0,75rem;
border-bottom: 1px solid var(–border-color);
}
.section-header h2 {
font-size: 1.5rem;
font-weight: 600;
}
.section-icon {
width: 40px;
height: 40px;
border-radius: var(–radius-sm);
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
}
.icon-purple { background: rgba(99, 102, 241, 0.2); }
.icon-green { background: rgba(16, 185, 129, 0.2); }
.icon-blue { background: rgba(59, 130, 246, 0.2); }
.icon-orange { background: rgba(245, 158, 11, 0.2); }
.icon-red { background: rgba(239, 68, 68, 0.2); }
/* Kartenraster */
.cards-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
gap: 1,5rem;
margin-bottom: 2rem;
}
.card {
background: var(–bg-card);
border-radius: var(–radius);
padding: 1,5rem;
border: 1px solid var(–border-color);
transition: all 0,3s ease;
position: relative;
overflow: hidden;
}
.card::before {
content: ”;
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, var(–accent-primary), var(–accent-secondary));
opacity: 0;
transition: opacity 0.3s ease;
}
.card:hover {
transform: translateY(-4px);
box-shadow: var(–shadow-lg);
border-color: var(–accent-primary);
}
.card:hover::before {
opacity: 1;
}
.card-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 1rem;
}
.card-title {
font-size: 0.875rem;
font-weight: 500;
color: var(–text-secondary);
text-transform: uppercase;
letter-spacing: 0,05em;
}
.card-badge {
padding: 0,25rem 0,75rem;
border-radius: 9999px;
font-size: 0,75rem;
font-weight: 600;
}
.badge-success {
background: rgba(16, 185, 129, 0.2);
color: var(–accent-success);
}
.badge-warning {
background: rgba(245, 158, 11, 0.2);
color: var(–accent-warning);
}
.badge-danger {
background: rgba(239, 68, 68, 0.2);
color: var(–accent-danger);
}
.badge-info {
background: rgba(59, 130, 246, 0.2);
color: var(–accent-info);
}
.card-value {
font-size: 2rem;
font-weight: 700;
margin-bottom: 0,5rem;
}
.card-description {
Schriftgröße: 0,875rem;
Farbe: var(–text-muted);
}
/* Fortschrittsbalken */
.progress-container {
Abstand nach oben: 1rem;
}
.progress-header {
display: flex;
justify-content: space-between;
font-size: 0.75rem;
color: var(–text-muted);
margin-bottom: 0.5rem;
}
.progress-bar {
height: 8px;
background: var(–bg-secondary);
border-radius: 9999px;
overflow: hidden;
}
.progress-fill {
height: 100%;
border-radius: 9999px;
transition: width 0.5s ease;
}
.progress-success { background: linear-gradient(90deg, var(–accent-success), #34d399); }
.progress-warning { background: linear-gradient(90deg, var(–accent-warning), #fbbf24); }
.progress-danger { background: linear-gradient(90deg, var(–accent-danger), #f87171); }
.progress-info { background: linear-gradient(90deg, var(–accent-info), #60a5fa); }
/* Quellentabelle */
.sources-table {
width: 100%;
border-collapse: collapse;
background: var(–bg-card);
border-radius: var(–radius);
overflow: hidden;
border: 1px solid var(–border-color);
}
.sources-table th,
.sources-table td {
padding: 1rem 1.5rem;
text-align: left;
}
.sources-table th {
background: var(–bg-secondary);
font-weight: 600;
font-size: 0.875rem;
color: var(–text-secondary);
text-transform: uppercase;
letter-spacing: 0,05em;
}
.sources-table tr {
border-bottom: 1px solid var(–border-color);
}
.sources-table tr:last-child {
border-bottom: none;
}
.sources-table td {
font-size: 0,875rem;
}
.source-name {
display: flex;
align-items: center;
gap: 0,75rem;
}
.source-icon {
width: 32px;
height: 32px;
border-radius: var(–radius-sm);
background: var(–bg-secondary);
display: flex;
align-items: center;
justify-content: center;
font-size: 1rem;
}
.limit-value {
font-weight: 600;
}
.limit-unlimited {
color: var(–accent-success);
}
.limit-zero {
color: var(–accent-danger);
}
.limit-normal {
color: var(–text-primary);
}
/* Verbindungsraster */
.connectors-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
gap: 1rem;
}
.connector-card {
background: var(–bg-card);
border-radius: var(–radius-sm);
padding: 1rem;
border: 1px solid var(–border-color);
display: flex;
align-items: center;
gap: 1rem;
}
.connector-status {
width: 12px;
height: 12px;
border-radius: 50%;
flex-shrink: 0;
}
.status-connected {
background: var(–accent-success);
box-shadow: 0 0 8px var(–accent-success);
}
.status-disconnected {
background: var(–text-muted);
}
.connector-info {
flex: 1;
}
.connector-name {
font-weight: 500;
font-size: 0,875rem;
}
.connector-type {
font-size: 0,75rem;
color: var(–text-muted);
}
/* Fehlermeldung */
.error-message {
background: rgba(239, 68, 68, 0.1);
border: 1px solid var(–accent-danger);
border-radius: var(–radius-sm);
padding: 1rem;
margin-top: 1rem;
color: var(–accent-danger);
display: none;
}
.error-message.active {
display: block;
}
/* Leerer Zustand */
.empty-state {
text-align: center;
padding: 4rem 2rem;
color: var(–text-muted);
}
.empty-state-icon {
font-size: 4rem;
margin-bottom: 1rem;
opacity: 0.5;
}
/* Responsive */
@media (max-width: 768px) {
.container {
padding: 1rem;
}
.header h1 {
font-size: 1.75rem;
}
.cards-grid {
grid-template-columns: 1fr;
}
.sources-table {
font-size: 0.75rem;
}
.sources-table th,
.sources-table td {
padding: 0.75rem;
}
.input-header {
flex-direction: column;
gap: 1rem;
align-items: flex-start;
}
}
/* Animationen */
@keyframes pulse {
0%, 100% { opacity: 1; }
50% { opacity: 0.5; }
}
.pulse {
animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}
/* Bildlaufleiste */
::-webkit-scrollbar {
width: 8px;
height: 8px;
}
::-webkit-scrollbar-track {
background: var(–bg-secondary);
}
::-webkit-scrollbar-thumb {
background: var(–border-color);
border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
background: var(–text-muted);
}
| Quelle |
Monatliches Limit |
Verbleibende |
Status |
📊
Keine Daten zum Anzeigen
Fügen Sie Ihre JSON-Daten oben ein und klicken Sie auf “Parse Data”, um Ihre Grenzwerte zu visualisieren.
// Example data
const example1 = `{“model_specific_limits”:{},”remaining_agentic_research”:0,”remaining_labs”:24,”remaining_pro”:600,”remaining_research”:20,”sources”:{“source_to_limit”:{“asana_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”box”:{“monthly_limit”:0,”remaining”:0},”cbinsights_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”confluence_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”crunchbase”:{“monthly_limit”:0,”remaining”:0},”dropbox”:{“monthly_limit”:null,”remaining”:null},”factset”:{“monthly_limit”:0,”remaining”:0},”gcal”:{“monthly_limit”:null,”remaining”:null},”github_mcp_direct”:{“monthly_limit”:null,”remaining”:null},”google_drive”:{“monthly_limit”:null,”remaining”:null},”jira_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”linear_alt”:{“monthly_limit”:null,”remaining”:null},”microsoft_teams_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”notion_mcp”:{“monthly_limit”:null,”remaining”:null},”onedrive”:{“monthly_limit”:0,”remaining”:0},”org”:{“monthly_limit”:0,”remaining”:0},”outlook”:{“monthly_limit”:null,”remaining”:null},”pitchbook_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”scholar”:{“monthly_limit”:null,”remaining”:null},”sharepoint”:{“monthly_limit”:0,”remaining”:0},”slack_direct”:{“monthly_limit”:null,”remaining”:null},”social”:{“monthly_limit”:null,”remaining”:null},”statista_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”web”:{“monthly_limit”:null,”remaining”:null},”wiley_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5}}}}`;
const example2 = `{“pages_limit”:100,”upload_limit”:50,”create_limit”:99,”article_image_upload_limit”:500,”max_files_per_user”:500,”max_files_per_repository”:50,”connector_limits”:{“repo_type_limits”:{“COLLECTION”:{“max_files”:50,”max_folders”:50},”HEALTH”:{“max_files”:200,”max_folders”:200}},”global_file_count”:500,”max_file_size_mb”:50,”max_attachment_file_size_mb”:50,”daily_attachment_limit”:500,”weekly_attachment_limit”:null,”daily_attachment_limit_non_priority_country”:null},”sources”:{“source_to_limit”:{“web”:{“monthly_limit”:null,”remaining”:null},”scholar”:{“monthly_limit”:null,”remaining”:null},”social”:{“monthly_limit”:null,”remaining”:null},”google_drive”:{“monthly_limit”:null,”remaining”:null},”gcal”:{“monthly_limit”:null,”remaining”:null},”dropbox”:{“monthly_limit”:null,”remaining”:null},”notion_mcp”:{“monthly_limit”:null,”remaining”:null},”outlook”:{“monthly_limit”:null,”remaining”:null},”linear_alt”:{“monthly_limit”:null,”remaining”:null},”github_mcp_direct”:{“monthly_limit”:null,”remaining”:null},”asana_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”slack_direct”:{“monthly_limit”:null,”remaining”:null},”jira_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”confluence_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”microsoft_teams_mcp_merge”:{“monthly_limit”:null,”remaining”:null},”wiley_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”cbinsights_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”pitchbook_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5},”statista_mcp_cashmere”:{“monthly_limit”:5,”remaining”:5}}},”has_ai_profile”:false,”referral_code”:”Q7N0LPC8″,”referral_num_success”:0,”referral_num_coupons”:0,”stripe_status”:”active”,”revenuecat_status”:”none”,”revenuecat_source”:”none”,”subscription_status”:”active”,”subscription_source”:”stripe”,”subscription_tier”:”yearly”,”coupon_metadata”:{“name”:”Deutsche Telekom HR”,”logo_image_url”:null,”logo_dark_image_url”:null,”accent_color”:null,”expires_at”:”2026-01-15T00:00:00″,”coupon_duration”:null,”coupon_duration_days”:null,”coupon_amount”:null,”coupon_percent”:null,”coupon_id”:”yglW31iG”,”promo_code_id”:”promo_1R1CDbGZwjqPfxkZrmz5rHc3″,”default_locale”:null,”has_custom_notifications”:false},”default_model”:”turbo”,”default_image_generation_model”:”gemini-flash”,”default_video_generation_model”:”default”,”query_count”:59,”query_count_copilot”:54,”query_count_mobile”:0,”disable_training”:false,”is_sidebar_collapsed”:null,”default_copilot”:null,”notif_status”:”daily”,”email_status”:”daily”,”time_zone”:”Europe/Berlin”,”device_language”:”en-US”,”discover_homepage_enabled”:false,”always_allow_browser_agent”:false,”has_accepted_api_terms”:false,”has_data_retention_warning”:false,”is_verified”:false,”allow_article_creation”:true,”connectors”:{“connectors”:[{“name”:”google_drive”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”google_drive”,”connection_type”:”GOOGLE_DRIVE”,”capabilities”:{“direct_api_search”:true,”high_precision_search”:true,”file_upload”:true},”disabled_capabilities”:[]},{“name”:”gcal”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”gcal”,”connection_type”:”GCAL”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”dropbox”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”dropbox”,”connection_type”:”DROPBOX”,”capabilities”:{“direct_api_search”:true,”high_precision_search”:true,”file_upload”:true},”disabled_capabilities”:[]},{“name”:”edgar”,”auth_type”:”none”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”edgar”,”connection_type”:null,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”outlook”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”outlook”,”connection_type”:”OUTLOOK”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”linear_alt”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”linear_alt”,”connection_type”:”LINEAR_ALT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”notion_mcp”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”notion_mcp”,”connection_type”:”NOTION_MCP”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”github_mcp_direct”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”github_mcp_direct”,”connection_type”:”GITHUB_MCP_DIRECT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”asana_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”asana_mcp_merge”,”connection_type”:”ASANA_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”slack_direct”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”slack_direct”,”connection_type”:”SLACK_DIRECT”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”jira_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”jira_mcp_merge”,”connection_type”:”JIRA_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”confluence_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”confluence_mcp_merge”,”connection_type”:”CONFLUENCE_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]},{“name”:”microsoft_teams_mcp_merge”,”auth_type”:”oauth”,”connected”:false,”error”:null,”picker_credentials”:null,”connection_display_name”:null,”connection_uuid”:null,”has_required_scopes”:null,”source_id”:”microsoft_teams_mcp_merge”,”connection_type”:”MICROSOFT_TEAMS_MCP_MERGE”,”capabilities”:{},”disabled_capabilities”:[]}]}}`;
// Source icons mapping
const sourceIcons = {
web: ‘🌐’,
scholar: ‘🎓’,
social: ‘💬’,
google_drive: ‘📁’,
gcal: ‘📅’,
dropbox: ‘📦’,
notion_mcp: ‘📝’,
outlook: ‘📧’,
linear_alt: ‘📊’,
github_mcp_direct: ‘💻’,
asana_mcp_merge: ‘✅’,
slack_direct: ‘💬’,
jira_mcp_merge: ‘📋’,
confluence_mcp_merge: ‘📚’,
microsoft_teams_mcp_merge: ‘👥’,
wiley_mcp_cashmere: ‘📖’,
cbinsights_mcp_cashmere: ‘💡’,
pitchbook_mcp_cashmere: ‘💰’,
statista_mcp_cashmere: ‘📈’,
box: ‘📦’,
crunchbase: ‘🏢’,
factset: ‘📊’,
onedrive: ‘☁️’,
org: ‘🏛️’,
sharepoint: ‘📑’,
edgar: ‘⚖️’
};
// Connector icons
const connectorIcons = {
google_drive: ‘📁’,
gcal: ‘📅’,
dropbox: ‘📦’,
edgar: ‘⚖️’,
outlook: ‘📧’,
linear_alt: ‘📊’,
notion_mcp: ‘📝’,
github_mcp_direct: ‘💻’,
asana_mcp_merge: ‘✅’,
slack_direct: ‘💬’,
jira_mcp_merge: ‘📋’,
confluence_mcp_merge: ‘📚’,
microsoft_teams_mcp_merge: ‘👥’
};
function loadExample(num) {
document.getElementById(‘jsonInput’).value = num === 1 ? example1 : example2;
parseJSON();
}
function clearData() {
document.getElementById(‘jsonInput’).value = ”;
document.getElementById(‘dashboard’).classList.remove(‘active’);
document.getElementById(’emptyState’).style.display = ‘block’;
hideError();
}
function showError(message) {
const errorEl = document.getElementById(‘errorMessage’);
errorEl.textContent = message;
errorEl.classList.add(‘active’);
}
function hideError() {
document.getElementById(‘errorMessage’).classList.remove(‘active’);
}
function parseJSON() {
const input = document.getElementById(‘jsonInput’).value.trim();
if (!input) {
showError(‘Please enter JSON data’);
return;
}
try {
const data = JSON.parse(input);
hideError();
renderDashboard(data);
} catch (e) {
showError(‘Invalid JSON: ‘ + e.message);
}
}
function renderDashboard(data) {
document.getElementById(’emptyState’).style.display = ‘none’;
document.getElementById(‘dashboard’).classList.add(‘active’);
renderQueryLimits(data);
renderContentLimits(data);
renderConnectorLimits(data);
renderSources(data);
renderConnectors(data);
renderAccountInfo(data);
}
function createCard(title, value, description, badge = null, progress = null) {
let badgeHtml = ”;
if (badge) {
badgeHtml = `
${badge.text}`;
}
let progressHtml = ”‘;
if (progress) {
const percentage = Math.min(100, (progress.current / progress.max) * 100);
const progressClass = percentage > 90 ? ’danger‘ : percentage > 70 ? ’warning‘ : ’success’;
progressHtml = `
`;
}
return `
${Wert}
${Beschreibung}
${progressHtml}
`;
}
function renderQueryLimits(data) {
const container = document.getElementById(‘queryLimits’);
let html = ”;
if (data.remaining_pro !== undefined) {
html += createCard(
‘Pro-Abfragen’,
data.remaining_pro,
‘Verbleibende Pro-Abfragen’,
data.remaining_pro > 100 ? { type: ‘success’, text: ‘Gut’ } :
data.remaining_pro > 50 ? { type: ‘warning’, text: ‘Niedrig’ } : { type: ‘danger’, text: ‘Kritisch’ }
);
}
if (data.remaining_research !== undefined) {
html += createCard(
‘Forschungsabfragen’,
data.remaining_research,
‘Verbleibende Forschungsabfragen’,
data.remaining_research > 10 ? { type: ‘success’, text: ‘Gut’ } :
data.remaining_research > 5 ? { type: ‘warning’, text: ‘Niedrig’ } : { type: ‘danger’, text: ‘Kritisch’ }
);
}
if (data.remaining_agentic_research !== undefined) {
html += createCard(
‘Agentische Forschung’,
data.remaining_agentic_research,
‘Verbleibende agentische Forschungsanfragen’,
data.remaining_agentic_research > 0 ? { type: ‘success’, text: ‘Verfügbar’ } : { type: ‘danger’, text: ‘Aufgebraucht’ }
);
}
if (data.remaining_labs !== undefined) {
html += createCard(
‘Laboranfragen’,
data.remaining_labs,
‘Verbleibende Labor-/Experimentanfragen’,
data.remaining_labs > 10 ? { type: ‘success’, text: ‘Gut’ } :
data.remaining_labs > 5 ? { type: ‘warning’, text: ‘Niedrig’ } : { type: ‘danger’, text: ‘Kritisch’ }
);
}
if (data.query_count !== undefined) {
html += createCard(
‘Gesamtzahl der Abfragen’,
data.query_count,
‘Gesamtzahl der in diesem Zeitraum durchgeführten Abfragen’
);
}
if (data.query_count_copilot !== undefined) {
html += createCard(
‘Copilot-Abfragen’,
data.query_count_copilot,
‘Über Copilot durchgeführte Abfragen’
);
}
container.innerHTML = html || ‘
Es liegen keine Daten zur Abfragebegrenzung vor
‘;
}
function renderContentLimits(data) {
const container = document.getElementById(‘contentLimits’);
let html = ”;
if (data.pages_limit !== undefined) {
html += createCard(
‘Seitenlimit’,
data.pages_limit,
‘Maximal zulässige Seiten’
);
}
if (data.upload_limit !== undefined) {
html += createCard(
‘Upload-Limit’,
data.upload_limit,
‘Maximal zulässige Uploads’
);
}
if (data.create_limit !== undefined) {
html += createCard(
‘Erstellungslimit’,
data.create_limit,
‘Maximal zulässige Erstellungen’
);
}
if (data.article_image_upload_limit !== undefined) {
html += createCard(
‘Bild-Upload-Limit’,
data.article_image_upload_limit,
‘Maximale Anzahl an hochgeladenen Artikelbildern’
);
}
container.innerHTML = html || ‘
Es liegen keine Daten zur Inhaltsbegrenzung vor
‘;
}
function renderConnectorLimits(data) {
const container = document.getElementById(‘connectorLimits’);
let html = ”;
if (data.max_files_per_user !== undefined) {
html += createCard(
‘Dateien pro Benutzer’,
data.max_files_per_user,
‘Maximale Anzahl an Dateien pro Benutzer’
);
}
if (data.max_files_per_repository !== undefined) {
html += createCard(
‘Dateien pro Repository’,
data.max_files_per_repository,
‘Maximale Anzahl an Dateien pro Repository’
);
}
if (data.connector_limits) {
const cl = data.connector_limits;
if (cl.max_file_size_mb !== undefined) {
html += createCard(
‘Maximale Dateigröße’,
cl.max_file_size_mb + ‘ MB’,
‘Maximale Größe für Datei-Uploads’
);
}
if (cl.max_attachment_file_size_mb !== undefined) {
html += createCard(
‘Maximale Anhangsgröße’,
cl.max_attachment_file_size_mb + ‘ MB’,
‘Maximale Anhangsgröße’
);
}
if (cl.daily_attachment_limit !== undefined) {
html += createCard(
‘Tägliche Anhänge’,
cl.daily_attachment_limit,
‘Tägliches Limit für Anhänge’
);
}
if (cl.global_file_count !== undefined) {
html += createCard(
‘Gesamtanzahl der Dateien’,
cl.global_file_count,
‘Gesamtlimit für Dateien’
);
}
}
container.innerHTML = html || ‘
Es liegen keine Daten zur Anzahl der Anschlüsse vor
‘;
}
function renderSources(data) {
const tbody = document.getElementById(‘sourcesTableBody’);
let html = ”;
const sources = data.sources?.source_to_limit || {};
Object.entries(sources).forEach(([name, limits]) => {
const icon = sourceIcons[name] || ‘🔌’;
const displayName = name.replace(/_/g, ‘ ‘).replace(/bw/g, l => l.toUpperCase());
let limitClass = ‘limit-normal’;
let limitText = limits.monthly_limit === null ? ‘Unbegrenzt’ : limits.monthly_limit;
if (limits.monthly_limit === null) limitClass = ‘limit-unlimited’;
if (limits.monthly_limit === 0) limitClass = ‘limit-zero’;
let remainingClass = ‘limit-normal’;
let remainingText = limits.remaining === null ? ‘Unbegrenzt’ : limits.remaining;
if (limits.remaining === null) remainingClass = ‘limit-unlimited’;
if (limits.remaining === 0) remainingClass = ‘limit-zero’;
let statusBadge = ”;
if (limits.remaining === null && limits.monthly_limit === null) {
statusBadge = ‘
Unbegrenzt‘;
} else if (limits.remaining === 0) {
statusBadge = ‘
Erschöpft‘;
} else if (limits.remaining !== null && limits.monthly_limit !== null) {
const pct = (limits.remaining / limits.monthly_limit) * 100;
if (pct > 50) {
statusBadge = ‘
Gut‘;
} else if (pct > 25) {
statusBadge = ‘
Niedrig‘;
} else {
statusBadge = ‘
Kritisch‘;
}
} else {
statusBadge = ‘
K.A.‘;
}
html += `
|
|
${limitText} |
${restlicherText} |
${statusBadge} |
`;
});
tbody.innerHTML = html || ‘
| Es liegen keine Quelldaten vor |
‘;
}
function renderConnectors(data) {
const container = document.getElementById(‘connectorsGrid’);
let html = ”;
const connectors = data.connectors?.connectors || [];
connectors.forEach(connector => {
const icon = connectorIcons[connector.name] || ‘🔌’;
const displayName = connector.name.replace(/_/g, ‘ ‘).replace(/bw/g, l => l.toUpperCase());
const statusClass = connector.connected ? ‘status-connected’ : ‘status-disconnected’;
const statusText = connector.connected ? ‘Verbunden’ : ‘Getrennt’;
html += `
${icon}
${displayName}
${statusText}
`;
});
container.innerHTML = html || ‘
Es liegen keine Anschlussdaten vor
‘;
}
function renderAccountInfo(data) {
const container = document.getElementById(‘accountInfo’);
let html = ”;
if (data.subscription_tier) {
html += createCard(
‘Abonnementstufe’,
data.subscription_tier.charAt(0).toUpperCase() + data.subscription_tier.slice(1),
‘Ihr aktueller Abonnement-Tarif’,
{ type: ‘success’, text: data.subscription_status === ‘active’ ? ‘Aktiv’ : ‘Inaktiv’ }
);
}
if (data.subscription_source) {
html += createCard(
‘Zahlungsquelle’,
data.subscription_source.charAt(0).toUpperCase() + data.subscription_source.slice(1),
‘Ihr Zahlungsanbieter’
);
}
if (data.referral_code) {
html += createCard(
‘Empfehlungscode’,
data.referral_code,
‘Mit Freunden teilen’
);
}
if (data.default_model) {
html += createCard(
‘Standardmodell’,
data.default_model.charAt(0).toUpperCase() + data.default_model.slice(1),
‘Ihr bevorzugtes KI-Modell’
);
}
if (data.time_zone) {
html += createCard(
‘Zeitzone’,
data.time_zone,
‘Deine lokale Zeitzone’
);
}
if (data.coupon_metadata?.name) {
html += createCard(
‘Gutschein’,
data.coupon_metadata.name,
‘Angewandter Gutschein’,
data.coupon_metadata.expires_at ? {
type: new Date(data.coupon_metadata.expires_at) > new Date() ? ‘success’ : ‘danger’,
text: new Date(data.coupon_metadata.expires_at) > new Date() ? ‘Gültig’ : ‘Abgelaufen’
} : null
);
}
container.innerHTML = html || ‘
Es liegen keine Kontoinformationen vor
‘;
}
// Automatische Analyse beim Einfügen
document.getElementById(‘jsonInput’).addEventListener(‘paste’, function(e) {
setTimeout(() => parseJSON(), 100);
});