script.js

// Real-time data simulation
function simulateData() {
    return {
        production: Math.floor(Math.random() * 500) + 1000,
        inventory: Math.floor(Math.random() * 2000) + 4000,
        revenue: Math.floor(Math.random() * 30000) + 15000,
        dues: Math.floor(Math.random() * 10000) + 8000
    };
}

// Update dashboard stats in real-time
function updateDashboardStats() {
    const data = simulateData();
    document.querySelectorAll('[data-stat="production"]').forEach(el => el.textContent = data.production.toLocaleString());
    document.querySelectorAll('[data-stat="inventory"]').forEach(el => el.textContent = data.inventory.toLocaleString());
    document.querySelectorAll('[data-stat="revenue"]').forEach(el => `₹${data.revenue.toLocaleString()}`);
    document.querySelectorAll('[data-stat="dues"]').forEach(el => `₹${data.dues.toLocaleString()}`);
}

// Initialize app
document.addEventListener('DOMContentLoaded', function() {
    // Start real-time updates
    setInterval(updateDashboardStats, 5000);
    updateDashboardStats();
console.log('BrickMaster Pro initialized');
    
    // Check subscription status (mock function)
    function checkSubscription() {
        // In a real app, this would call your backend API
        const subscriptionStatus = 'active'; // 'trial', 'active', or 'inactive'
        const trialEndDate = '2024-03-15'; // Only relevant for trial status
        const planExpiryDate = '2024-12-31'; // Only relevant for active status
        
        if (subscriptionStatus === 'inactive') {
            showPaywall();
        }
    }
    
    // Show paywall function
    function showPaywall() {
        const paywallHTML = `
            <div class="fixed inset-0 bg-black bg-opacity-50 z-50 flex items-center justify-center p-4">
                <div class="bg-white rounded-lg max-w-md w-full p-6 shadow-xl">
                    <div class="text-center mb-6">
                        <i data-feather="lock" class="w-12 h-12 text-red-500 mx-auto mb-4"></i>
                        <h3 class="text-xl font-bold text-gray-800 mb-2">Your Free Trial Has Ended</h3>
                        <p class="text-gray-600">Please subscribe to continue managing your factory.</p>
                    </div>
                    
                    <div class="space-y-3 mb-6">
                        <div class="border rounded-lg p-4 hover:border-blue-400 cursor-pointer">
                            <div class="flex justify-between items-center">
                                <div>
                                    <h4 class="font-bold text-gray-800">Monthly Plan</h4>
                                    <p class="text-sm text-gray-600">Billed monthly</p>
                                </div>
                                <span class="font-bold text-blue-600">₹999/month</span>
                            </div>
                        </div>
                        
                        <div class="border rounded-lg p-4 hover:border-blue-400 cursor-pointer bg-blue-50 border-blue-200">
                            <div class="flex justify-between items-center">
                                <div>
                                    <h4 class="font-bold text-gray-800">Yearly Plan</h4>
                                    <p class="text-sm text-gray-600">Billed annually (save 17%)</p>
                                </div>
                                <span class="font-bold text-blue-600">₹9,999/year</span>
                            </div>
                        </div>
                    </div>
                    
                    <button id="subscribeBtn" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition-colors">
                        Subscribe Now
                    </button>
                </div>
            </div>
        `;
        
        document.body.insertAdjacentHTML('beforeend', paywallHTML);
        feather.replace();
        
        document.getElementById('subscribeBtn').addEventListener('click', function() {
            // In a real app, this would initiate Razorpay checkout
            alert('Redirecting to payment gateway...');
        });
    }
    
    // Run subscription check
    checkSubscription();
    
    // Toast notification function
    window.showToast = function(message, type = 'success') {
        const toast = document.createElement('div');
        const colors = {
            success: 'bg-green-100 border-green-200 text-green-800',
            error: 'bg-red-100 border-red-200 text-red-800',
            warning: 'bg-yellow-100 border-yellow-200 text-yellow-800',
            info: 'bg-blue-100 border-blue-200 text-blue-800'
        };
        
        toast.className = `fixed bottom-4 right-4 border rounded-lg px-4 py-2 shadow-lg ${colors[type]} z-50`;
        toast.textContent = message;
        document.body.appendChild(toast);
        
        setTimeout(() => {
            toast.classList.add('opacity-0', 'transition-opacity', 'duration-300');
            setTimeout(() => toast.remove(), 300);
        }, 3000);
    };
});