generated from coulomb/repo-seed
tegwick
1fe4b6b9fa
Implemented all cleanup items from CLEANUP_REPORT.md: Legacy Code Removal: - Removed document-controls-legacy.js wrapper - Updated 4 test files to use DocumentControls directly - Updated scripts/list_components.py acronym mappings - Updated tests/test_component_listing.py expectations Archive and Organization: - Moved relicts/ to docs/prototypes/ with README explaining history - Moved MIGRATION_STATUS.md to docs/migration/ - Removed IMPLEMENTATION_NOTES.md legacy references Test Verification: - All 68 JavaScript tests passing (Jest) - All 3 Python component tests passing - No breaking changes to functionality The codebase is now cleaner with no legacy wrappers or empty directories. Migration is complete and documented. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
201 lines
8.2 KiB
HTML
Executable File
201 lines
8.2 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Test Control Footer Feature</title>
|
|
<meta name="filename" content="footer-test.md">
|
|
<style>
|
|
body {
|
|
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
|
|
margin: 0;
|
|
padding: 20px;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.test-content {
|
|
background: white;
|
|
padding: 2rem;
|
|
border-radius: 8px;
|
|
margin-bottom: 1rem;
|
|
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
|
}
|
|
|
|
.feature-box {
|
|
background: #e8f5e8;
|
|
padding: 1rem;
|
|
border-radius: 4px;
|
|
margin: 1rem 0;
|
|
border-left: 4px solid #2e7d32;
|
|
}
|
|
|
|
.example-box {
|
|
background: #f8f9fa;
|
|
padding: 1rem;
|
|
border-radius: 4px;
|
|
margin: 1rem 0;
|
|
border-left: 4px solid #6c757d;
|
|
font-family: monospace;
|
|
font-size: 0.9rem;
|
|
}
|
|
|
|
.info-box {
|
|
background: #e3f2fd;
|
|
padding: 1rem;
|
|
border-radius: 4px;
|
|
margin: 1rem 0;
|
|
border-left: 4px solid #1565c0;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="test-content">
|
|
<h1>Control Footer Feature Test</h1>
|
|
|
|
<div class="feature-box">
|
|
<strong>✨ New Feature: Control Footers</strong>
|
|
<p>All controls now have configurable footers with a default Markitect copyright notice!</p>
|
|
|
|
<ul>
|
|
<li><strong>Default Footer:</strong> "© Markitect [VERSION]" when no custom footer is provided</li>
|
|
<li><strong>Custom Footer:</strong> Controls can override with custom text</li>
|
|
<li><strong>Styling:</strong> Consistent small grey footer with border at bottom of controls</li>
|
|
<li><strong>Auto-styling:</strong> Footer automatically styled when control expands</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<h2>Expected Footer Examples</h2>
|
|
|
|
<div class="example-box">
|
|
<strong>Default Footer (Status Control, Debug Control, Contents Control):</strong><br>
|
|
<code>© Markitect 2024.11.11</code>
|
|
|
|
<br><br>
|
|
<strong>Custom Footer (Edit Control):</strong><br>
|
|
<code>Document management • [current time]</code>
|
|
</div>
|
|
|
|
<div class="info-box">
|
|
<strong>Testing Instructions:</strong>
|
|
<ol>
|
|
<li>Open any control (Contents, Status, Debug, Edit)</li>
|
|
<li>Look at the bottom of the expanded control</li>
|
|
<li>Verify footer appears with appropriate text</li>
|
|
<li>Check that footer has light grey background and border</li>
|
|
<li>Edit Control should show custom footer with timestamp</li>
|
|
<li>Other controls should show "© Markitect [version]"</li>
|
|
</ol>
|
|
</div>
|
|
|
|
<h3>Footer Styling</h3>
|
|
|
|
<p>The footer should have the following characteristics:</p>
|
|
<ul>
|
|
<li><strong>Position:</strong> Bottom of control panel</li>
|
|
<li><strong>Background:</strong> Light grey (#f8f9fa)</li>
|
|
<li><strong>Border:</strong> Top border (#e9ecef)</li>
|
|
<li><strong>Text:</strong> Small, italicized, centered</li>
|
|
<li><strong>Color:</strong> Muted grey (#6c757d)</li>
|
|
</ul>
|
|
|
|
<h3>Version Detection</h3>
|
|
|
|
<p>The footer tries to get the version from:</p>
|
|
<ol>
|
|
<li><code>window.markitectVersion</code> (if set)</li>
|
|
<li>Fallback to <code>2024.11.11</code></li>
|
|
</ol>
|
|
|
|
<div class="feature-box">
|
|
<strong>Implementation Details:</strong>
|
|
<ul>
|
|
<li><strong>Base Class:</strong> Added footer functionality to both Control classes</li>
|
|
<li><strong>Template Update:</strong> Added footer div to control HTML template</li>
|
|
<li><strong>Auto-styling:</strong> <code>styleFooter()</code> called automatically on expand</li>
|
|
<li><strong>Configuration:</strong> <code>config.footer</code> property controls footer text</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<p>This document provides test content to verify that all control footers are working correctly with both default and custom footer text.</p>
|
|
</div>
|
|
|
|
<script>
|
|
// Set a custom version for testing
|
|
window.markitectVersion = '1.2.3-test';
|
|
|
|
// Mock section manager
|
|
window.sectionManager = {
|
|
getDocumentMarkdown: function() {
|
|
return `# Footer Test\n\nTest content for footer functionality.\n\nGenerated: ${new Date().toISOString()}`;
|
|
}
|
|
};
|
|
|
|
// Load the clean document manager
|
|
fetch('/markitect/clean_document_manager.py')
|
|
.then(response => response.text())
|
|
.then(pythonCode => {
|
|
const jsMatches = pythonCode.match(/'''(\s*(?:\/\/.*\n)*\s*(?:if \(window\.location\.href\.includes\(['"]edit['"].*?(?:\n.*?)*?}\s*)\s*'''/gs);
|
|
|
|
if (jsMatches && jsMatches.length > 0) {
|
|
const jsCode = jsMatches[0].replace(/'''/g, '').trim();
|
|
|
|
const script = document.createElement('script');
|
|
script.textContent = `
|
|
Object.defineProperty(window.location, 'href', {
|
|
value: 'http://localhost:8080/edit?file=footer-test.md',
|
|
writable: false
|
|
});
|
|
|
|
${jsCode}
|
|
|
|
setTimeout(() => {
|
|
console.log('🦶 Testing Control Footer Feature...');
|
|
|
|
// Test all controls have footer functionality
|
|
const controls = [
|
|
window.contentsControl,
|
|
window.statusControl,
|
|
window.debugControl,
|
|
window.editControl
|
|
].filter(Boolean);
|
|
|
|
console.log(\`📊 Found \${controls.length} controls to test\`);
|
|
|
|
controls.forEach((control, index) => {
|
|
if (control && control.getFooter) {
|
|
const defaultFooter = control.getDefaultFooter();
|
|
const actualFooter = control.getFooter();
|
|
|
|
console.log(\`\${index + 1}. \${control.config.title} Control:\`);
|
|
console.log(\` Default footer: "\${defaultFooter}"\`);
|
|
console.log(\` Actual footer: "\${actualFooter}"\`);
|
|
console.log(\` Custom footer set: \${control.config.footer !== null}\`);
|
|
console.log(\` Version: \${control.getMarkitectVersion()}\`);
|
|
} else {
|
|
console.log(\`\${index + 1}. Control missing footer functionality\`);
|
|
}
|
|
});
|
|
|
|
// Test version detection
|
|
if (controls.length > 0) {
|
|
const version = controls[0].getMarkitectVersion();
|
|
if (version === '1.2.3-test') {
|
|
console.log('✅ Version detection working (using window.markitectVersion)');
|
|
} else {
|
|
console.log(\`⚠️ Version detection: \${version} (expected 1.2.3-test)\`);
|
|
}
|
|
}
|
|
|
|
console.log('👀 Open any control to see the footer at the bottom!');
|
|
|
|
}, 2000);
|
|
`;
|
|
document.head.appendChild(script);
|
|
}
|
|
})
|
|
.catch(error => {
|
|
console.error('Error loading clean_document_manager.py:', error);
|
|
});
|
|
</script>
|
|
</body>
|
|
</html> |