script.js

// Main application script
document.addEventListener('DOMContentLoaded', () => {
    console.log('Structa Clone loaded');
    
    // Initialize tooltips
    const tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
    tooltipTriggerList.map(function (tooltipTriggerEl) {
        return new bootstrap.Tooltip(tooltipTriggerEl);
    });
    
    // Smooth scrolling for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            document.querySelector(this.getAttribute('href')).scrollIntoView({
                behavior: 'smooth'
            });
        });
    });
});

// Data structure visualization functions
class StructaVisualizer {
    constructor(canvasId) {
        this.canvas = document.getElementById(canvasId);
        this.ctx = this.canvas.getContext('2d');
        this.structures = {};
        this.currentStructure = null;
    }
    
    addStructure(name, config) {
        this.structures[name] = config;
    }
    
    visualize(name, data) {
        if (!this.structures[name]) {
            console.error(`Structure ${name} not found`);
            return;
        }
        
        this.currentStructure = name;
        this.clearCanvas();
        this.structures[name].draw(this.ctx, data);
    }
    
    clearCanvas() {
        this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
    }
    
    resizeCanvas() {
        const container = this.canvas.parentElement;
        this.canvas.width = container.clientWidth;
        this.canvas.height = container.clientHeight;
    }
}

// Initialize visualizer when needed
function initVisualizer() {
    if (document.getElementById('visualization-canvas')) {
        const visualizer = new StructaVisualizer('visualization-canvas');
        return visualizer;
    }
    return null;
}