script.js

// Shared utility functions
class ComicUtils {
    static async fetchComicTemplates() {
        try {
            // In a real app, this would fetch from an API
            return [
                { id: 1, name: 'Classic Panel', thumbnail: 'http://static.photos/education/320x240/1' },
                { id: 2, name: 'Dynamic Layout', thumbnail: 'http://static.photos/education/320x240/2' },
                { id: 3, name: 'Splash Page', thumbnail: 'http://static.photos/education/320x240/3' },
                { id: 4, name: 'Strip Layout', thumbnail: 'http://static.photos/education/320x240/4' },
                { id: 5, name: 'Grid Style', thumbnail: 'http://static.photos/education/320x240/5' },
                { id: 6, name: 'Custom Design', thumbnail: 'http://static.photos/education/320x240/6' }
            ];
        } catch (error) {
            console.error('Error fetching templates:', error);
            return [];
        }
    }

    static getTemplateById(id) {
        const templates = [
            { id: 1, name: 'Classic Panel', layout: 'single', thumbnail: 'http://static.photos/education/320x240/1' },
            { id: 2, name: 'Dynamic Layout', layout: 'dynamic', thumbnail: 'http://static.photos/education/320x240/2' },
            { id: 3, name: 'Splash Page', layout: 'splash', thumbnail: 'http://static.photos/education/320x240/3' },
            { id: 4, name: 'Strip Layout', layout: 'strip', thumbnail: 'http://static.photos/education/320x240/4' },
            { id: 5, name: 'Grid Style', layout: 'grid', thumbnail: 'http://static.photos/education/320x240/5' },
            { id: 6, name: 'Custom Design', layout: 'custom', thumbnail: 'http://static.photos/education/320x240/6' }
        ];
        return templates.find(t => t.id === parseInt(id));
    }

    static saveComic(comicData) {
        let comics = JSON.parse(localStorage.getItem('userComics')) || [];
        comics.unshift(comicData);
        localStorage.setItem('userComics', JSON.stringify(comics));
    }

    static getRecentComics(limit = 3) {
        const comics = JSON.parse(localStorage.getItem('userComics')) || [];
        return comics.slice(0, limit);
    }
}

// Initialize feather icons on page load
document.addEventListener('DOMContentLoaded', () => {
    feather.replace();
});