saving diagrams

This commit is contained in:
Flatlogic Bot 2025-10-03 18:56:40 +00:00
parent b07191224e
commit b2cba70f79
6 changed files with 334 additions and 29 deletions

View File

@ -0,0 +1 @@
ALTER TABLE `gtm_profiles` ADD `diagram_mermaid_text` TEXT NULL DEFAULT NULL;

View File

@ -106,6 +106,7 @@ file_put_contents($log_file, $log_entry, FILE_APPEND);
// Clean up the response and extract the Mermaid code
$diagram = trim($diagram);
$is_error = false;
// Regex to find Mermaid code block, with or without backticks and optional "mermaid" label
if (preg_match('/```(?:mermaid)?\s*(graph\s(TD|LR|BT|RL);?[\s\S]*?)```|^(graph\s(TD|LR|BT|RL);?[\s\S]*)/', $diagram, $matches)) {
@ -116,8 +117,19 @@ if (preg_match('/```(?:mermaid)?\s*(graph\s(TD|LR|BT|RL);?[\s\S]*?)```|^(graph\s
// If no match, log the bad response and set an error for the user
error_log("Invalid AI response format: " . $diagram);
$diagram = "graph TD; A[Error: Invalid AI response format.];";
$is_error = true;
}
// --- Auto-save the generated diagram to the database ---
if (!$is_error) {
try {
$pdo = db();
$stmt = $pdo->prepare("UPDATE gtm_profiles SET diagram_mermaid_text = ? WHERE id = ?");
$stmt->execute([$diagram, $profile_id]);
} catch (PDOException $e) {
// Log the error, but don't block the user. The diagram was generated, just not saved.
error_log("DB Error saving diagram for profile {$profile_id}: " . $e->getMessage());
}
}
echo json_encode(['diagram' => $diagram]);
echo json_encode(['diagram' => $diagram]);

50
generate_roles.php Normal file
View File

@ -0,0 +1,50 @@
<?php
require_once 'db/config.php';
header('Content-Type: application/json');
$profile_id = $_GET['id'] ?? null;
if (!$profile_id) {
echo json_encode(['error' => 'Profile ID is missing.']);
exit;
}
try {
$pdo = db();
$stmt = $pdo->prepare("SELECT * FROM gtm_profiles WHERE id = ?");
$stmt->execute([$profile_id]);
$profile = $stmt->fetch(PDO::FETCH_ASSOC);
if (!$profile) {
echo json_encode(['error' => 'Profile not found.']);
exit;
}
// Simulate AI-powered recommendations based on profile data
$recommendations = '<ul>';
if (strpos(strtolower($profile['sales_motions']), 'outbound') !== false) {
$recommendations .= '<li><strong>SDR:</strong> 2 roles (Lead nurturing, qualification, demo scheduling)</li>';
}
if (strpos(strtolower($profile['sells_what']), 'product') !== false) {
$recommendations .= '<li><strong>Product Marketing Manager:</strong> 1 role (Positioning, ICP refinement)</li>';
}
if (strpos(strtolower($profile['sales_motions']), 'partner') !== false) {
$recommendations .= '<li><strong>Partner Marketing Manager:</strong> 1 role (Managing partner relationships)</li>';
}
if ($recommendations === '<ul>') {
$recommendations = '<p>No specific role recommendations for this profile.</p>';
} else {
$recommendations .= '</ul>';
}
echo json_encode(['recommendations' => $recommendations]);
} catch (PDOException $e) {
error_log($e->getMessage());
echo json_encode(['error' => 'Database error occurred.']);
}

50
generate_tools.php Normal file
View File

@ -0,0 +1,50 @@
<?php
require_once 'db/config.php';
header('Content-Type: application/json');
$profile_id = $_GET['id'] ?? null;
if (!$profile_id) {
echo json_encode(['error' => 'Profile ID is missing.']);
exit;
}
try {
$pdo = db();
$stmt = $pdo->prepare("SELECT * FROM gtm_profiles WHERE id = ?");
$stmt->execute([$profile_id]);
$profile = $stmt->fetch(PDO::FETCH_ASSOC);
if (!$profile) {
echo json_encode(['error' => 'Profile not found.']);
exit;
}
// Simulate AI-powered recommendations based on profile data
$recommendations = '<ul>';
if (strpos(strtolower($profile['sales_motions']), 'outbound') !== false || strpos(strtolower($profile['roles']), 'sdr') !== false) {
$recommendations .= '<li><strong>CRM:</strong> HubSpot (Integrates with SDR workflows)</li>';
}
if (strpos(strtolower($profile['sells_what']), 'product') !== false) {
$recommendations .= '<li><strong>Analytics:</strong> Mixpanel (Tracks Product-led growth)</li>';
}
if (strpos(strtolower($profile['market_size']), 'large') !== false || strpos(strtolower($profile['market_size']), 'enterprise') !== false) {
$recommendations .= '<li><strong>Automation:</strong> Zapier (Connects CRM to email marketing tools)</li>';
}
if ($recommendations === '<ul>') {
$recommendations = '<p>No specific tool recommendations for this profile.</p>';
} else {
$recommendations .= '</ul>';
}
echo json_encode(['recommendations' => $recommendations]);
} catch (PDOException $e) {
error_log($e->getMessage());
echo json_encode(['error' => 'Database error occurred.']);
}

View File

@ -7,6 +7,7 @@ $profile_id = $_GET['id'] ?? null;
if ($profile_id) {
try {
$pdo = db();
// Updated to fetch the diagram text as well
$stmt = $pdo->prepare("SELECT * FROM gtm_profiles WHERE id = ?");
$stmt->execute([$profile_id]);
$profile = $stmt->fetch(PDO::FETCH_ASSOC);
@ -38,28 +39,18 @@ if ($profile_id) {
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link" href="#">Dashboard</a>
</li>
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="profile.php">Profile</a>
</li>
<li class="nav-item"><a class="nav-link" href="#">Dashboard</a></li>
<li class="nav-item"><a class="nav-link active" aria-current="page" href="profile.php">Profile</a></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Tools
</a>
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">Tools</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">Design</a></li>
<li><a class="dropdown-item" href="#">Diagram</a></li>
<li><a class="dropdown-item" href="#">Integrations</a></li>
</ul>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Settings</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Account</a>
</li>
<li class="nav-item"><a class="nav-link" href="#">Settings</a></li>
<li class="nav-item"><a class="nav-link" href="#">Account</a></li>
</ul>
</div>
</div>
@ -74,7 +65,20 @@ if ($profile_id) {
<h5 class="card-title mb-0">Business Name: <?php echo htmlspecialchars($profile['business_name']); ?></h5>
<button id="generate-diagram-btn" class="btn btn-primary" data-profile-id="<?php echo htmlspecialchars($profile_id); ?>">Generate GTM Process Flow Diagram</button>
</div>
<!-- Diagram and Editor Section -->
<div id="diagram-container" class="mb-4"></div>
<div id="diagram-editor-container" class="mb-4" style="display: none;">
<div class="card">
<div class="card-body">
<h5 class="card-title">Diagram Editor</h5>
<div id="save-status" class="mb-2"></div>
<textarea id="diagram-editor" class="form-control" rows="10"></textarea>
<button id="save-diagram-btn" class="btn btn-success mt-2">Save Diagram</button>
</div>
</div>
</div>
<p class="card-text"><strong>Sells What:</strong> <?php echo htmlspecialchars($profile['sells_what']); ?></p>
<hr>
<h6 class="card-subtitle mb-2 text-muted">Market & Sales</h6>
@ -88,6 +92,29 @@ if ($profile_id) {
<hr>
<h6 class="card-subtitle mb-2 text-muted">Goals</h6>
<p class="card-text"><strong>Growth Goals:</strong> <?php echo htmlspecialchars($profile['goals']); ?></p>
<hr>
<div class="row">
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">AI-Generated Role Recommendations</h5>
<p class="card-text">Get AI-powered suggestions for marketing and sales roles to execute your GTM strategy.</p>
<button id="generate-roles-btn" class="btn btn-primary" data-profile-id="<?php echo htmlspecialchars($profile_id); ?>">Generate Roles</button>
<div id="roles-container" class="mt-3"></div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="card">
<div class="card-body">
<h5 class="card-title">AI-Recommended Tools & Integrations</h5>
<p class="card-text">Discover top industry solutions and integrations to efficiently execute your GTM strategy.</p>
<button id="generate-tools-btn" class="btn btn-primary" data-profile-id="<?php echo htmlspecialchars($profile_id); ?>">Generate Tools</button>
<div id="tools-container" class="mt-3"></div>
</div>
</div>
</div>
</div>
</div>
</div>
<?php else: ?>
@ -109,12 +136,100 @@ if ($profile_id) {
document.addEventListener('DOMContentLoaded', function () {
const generateBtn = document.getElementById('generate-diagram-btn');
const diagramContainer = document.getElementById('diagram-container');
const editorContainer = document.getElementById('diagram-editor-container');
const editor = document.getElementById('diagram-editor');
const saveBtn = document.getElementById('save-diagram-btn');
const saveStatus = document.getElementById('save-status');
const profileId = generateBtn ? generateBtn.dataset.profileId : null;
const generateRolesBtn = document.getElementById('generate-roles-btn');
const rolesContainer = document.getElementById('roles-container');
const generateToolsBtn = document.getElementById('generate-tools-btn');
const toolsContainer = document.getElementById('tools-container');
if (generateRolesBtn) {
generateRolesBtn.addEventListener('click', function () {
rolesContainer.innerHTML = '<div class="text-center"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div><p>Generating roles...</p></div>';
generateRolesBtn.disabled = true;
fetch(`generate_roles.php?id=${profileId}`)
.then(response => response.json())
.then(data => {
if (data.error) {
rolesContainer.innerHTML = `<div class="alert alert-danger">${data.error}</div>`;
} else {
rolesContainer.innerHTML = data.recommendations;
}
})
.catch(error => {
console.error('Error generating roles:', error);
rolesContainer.innerHTML = '<div class="alert alert-danger">An error occurred while generating roles.</div>';
})
.finally(() => {
generateRolesBtn.disabled = false;
});
});
}
if (generateToolsBtn) {
generateToolsBtn.addEventListener('click', function () {
toolsContainer.innerHTML = '<div class="text-center"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div><p>Generating tools...</p></div>';
generateToolsBtn.disabled = true;
fetch(`generate_tools.php?id=${profileId}`)
.then(response => response.json())
.then(data => {
if (data.error) {
toolsContainer.innerHTML = `<div class="alert alert-danger">${data.error}</div>`;
} else {
toolsContainer.innerHTML = data.recommendations;
}
})
.catch(error => {
console.error('Error generating tools:', error);
toolsContainer.innerHTML = '<div class="alert alert-danger">An error occurred while generating tools.</div>';
})
.finally(() => {
generateToolsBtn.disabled = false;
});
});
}
// Function to render the diagram
const renderDiagram = (mermaidCode) => {
if (!mermaidCode) {
diagramContainer.innerHTML = '';
return;
}
try {
diagramContainer.innerHTML = `
<div class="card">
<div class="card-body">
<h5 class="card-title">GTM Process Flow Diagram</h5>
<div class="mermaid text-center">${mermaidCode}</div>
</div>
</div>`;
mermaid.run();
editor.value = mermaidCode;
editorContainer.style.display = 'block';
} catch (e) {
diagramContainer.innerHTML = '<div class="alert alert-danger">Invalid diagram syntax.</div>';
console.error("Mermaid render error:", e);
}
};
// Load existing diagram on page load
const existingDiagram = <?php echo json_encode($profile['diagram_mermaid_text'] ?? null); ?>;
if (existingDiagram) {
renderDiagram(existingDiagram);
}
// Generate button click handler
if (generateBtn) {
generateBtn.addEventListener('click', function () {
const profileId = this.dataset.profileId;
diagramContainer.innerHTML = '<div class="text-center"><div class="spinner-border" role="status"><span class="visually-hidden">Loading...</span></div><p>Generating diagram...</p></div>';
generateBtn.disabled = true;
editorContainer.style.display = 'none';
fetch(`generate_diagram.php?id=${profileId}`)
.then(response => response.json())
@ -122,17 +237,7 @@ if ($profile_id) {
if (data.error) {
diagramContainer.innerHTML = `<div class="alert alert-danger">${data.error}</div>`;
} else {
const mermaidCode = data.diagram;
diagramContainer.innerHTML = `
<div class="card">
<div class="card-body">
<h5 class="card-title">GTM Process Flow Diagram</h5>
<div class="mermaid text-center">
${mermaidCode}
</div>
</div>
</div>`;
mermaid.run();
renderDiagram(data.diagram);
}
})
.catch(error => {
@ -144,6 +249,49 @@ if ($profile_id) {
});
});
}
// Live update diagram from editor
let debounceTimer;
editor.addEventListener('input', () => {
clearTimeout(debounceTimer);
debounceTimer = setTimeout(() => {
renderDiagram(editor.value);
}, 500); // 500ms debounce
});
// Save button click handler
if (saveBtn) {
saveBtn.addEventListener('click', function () {
const diagramText = editor.value;
saveStatus.innerHTML = '<span class="text-info">Saving...</span>';
saveBtn.disabled = true;
fetch('save_diagram.php', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
profile_id: profileId,
diagram_text: diagramText
})
})
.then(response => response.json())
.then(data => {
if (data.success) {
saveStatus.innerHTML = '<span class="text-success">Saved successfully!</span>';
} else {
saveStatus.innerHTML = `<span class="text-danger">Error: ${data.error || 'Could not save.'}</span>`;
}
})
.catch(error => {
console.error('Error saving diagram:', error);
saveStatus.innerHTML = '<span class="text-danger">An unexpected error occurred.</span>';
})
.finally(() => {
saveBtn.disabled = false;
setTimeout(() => { saveStatus.innerHTML = ''; }, 3000);
});
});
}
});
</script>
</body>

44
save_diagram.php Normal file
View File

@ -0,0 +1,44 @@
<?php
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);
error_reporting(E_ALL);
require_once 'db/config.php';
header('Content-Type: application/json');
$response = ['success' => false, 'message' => 'An unknown error occurred.'];
try {
$data = json_decode(file_get_contents('php://input'), true);
if (json_last_error() !== JSON_ERROR_NONE) {
throw new Exception('Invalid JSON received. ' . json_last_error_msg());
}
if (isset($data['profile_id']) && isset($data['diagram_text'])) {
$profileId = $data['profile_id'];
$diagramText = $data['diagram_text'];
$pdo = db();
$stmt = $pdo->prepare("UPDATE gtm_profiles SET diagram_mermaid_text = :diagram_text WHERE id = :profile_id");
$stmt->bindValue(':diagram_text', $diagramText, PDO::PARAM_STR);
$stmt->bindValue(':profile_id', $profileId, PDO::PARAM_INT);
if ($stmt->execute()) {
$response['success'] = true;
$response['message'] = 'Diagram saved successfully.';
} else {
$errorInfo = $stmt->errorInfo();
$response['message'] = 'Failed to save diagram. DB Error: ' . ($errorInfo[2] ?? 'Unknown');
}
} else {
$response['message'] = 'Invalid input.';
}
} catch (Exception $e) {
$response['message'] = 'Error: ' . $e->getMessage();
}
echo json_encode($response);