script.js

// 定义食物数组
const defaultFoods = ['河南烩面', '小谷姐姐麻辣烫', '凉拌黄瓜', '麻辣香锅', '黄焖鸡米饭', '汉堡', '披萨', '寿司', '杨国福麻辣烫', '韩式烤肉', '重庆火锅', '炸鸡', '兰州拉面', '扬州炒饭', '水饺', '沙县小吃', '红烧牛肉面', '过桥米线', '酸菜鱼', '水煮肉片', '鱼香肉丝', '宫保鸡丁', '红烧肉', '糖醋排骨', '地三鲜', '西红柿炒蛋', '农家小炒肉', '烤鱼', '石锅拌饭', '日式咖喱饭', '三明治', '热狗', '墨西哥卷饼', '越南牛肉粉', '泰式炒河粉', '韩式烤肉', '日式豚骨拉面', '天妇罗', '牛排', '意面', '罗宋汤', '奶油蘑菇汤', '可乐鸡翅', '盐酥鸡', '卤肉饭', '担担面', '刀削面', '油泼面', '煎饼果子', '腊汁肉夹馍', '羊肉串', '烤冷面', '鸡蛋灌饼', '手抓饼', '关东煮', '加州卷', '三文鱼刺身', '葡国鸡', '冬阴功汤', '椰汁西米露', '芒果糯米饭'];
const STORAGE_KEY = 'randomFoods_custom';

// 从本地存储加载食物列表
function loadFoods() {
    const stored = localStorage.getItem(STORAGE_KEY);
    if (stored) {
        return [...defaultFoods, ...JSON.parse(stored)];
    }
    return [...defaultFoods];
}

// 保存自定义食物到本地存储
function saveCustomFood(food) {
    const stored = localStorage.getItem(STORAGE_KEY);
    const customFoods = stored ? JSON.parse(stored) : [];
    customFoods.push(food);
    localStorage.setItem(STORAGE_KEY, JSON.stringify(customFoods));
}

// 从本地存储删除自定义食物
function removeCustomFood(food) {
    const stored = localStorage.getItem(STORAGE_KEY);
    if (stored) {
        const customFoods = JSON.parse(stored);
        const index = customFoods.indexOf(food);
        if (index > -1) {
            customFoods.splice(index, 1);
            localStorage.setItem(STORAGE_KEY, JSON.stringify(customFoods));
        }
    }
}

// 判断是否是自定义食物
function isCustomFood(food) {
    return !defaultFoods.includes(food);
}

let eatingSometing = loadFoods();

// DOM元素
const foodList = document.getElementById('foodList');
const resultDisplay = document.getElementById('resultDisplay');
const randomButton = document.getElementById('randomButton');
const foodInput = document.getElementById('foodInput');
const addButton = document.getElementById('addButton');

// 生成随机颜色
function getRandomColor() {
    const colors = [
        ['#ff6b6b', '#ee5a52'],
        ['#4ecdc4', '#45b7d1'],
        ['#f093fb', '#f5576c'],
        ['#667eea', '#764ba2'],
        ['#f5576c', '#f093fb'],
        ['#45b7d1', '#4ecdc4'],
        ['#96ceb4', '#56c596'],
        ['#ffeaa7', '#fdcb6e'],
        ['#a29bfe', '#6c5ce7'],
        ['#fd79a8', '#e84393'],
        ['#00b894', '#00a884'],
        ['#e17055', '#d63031'],
    ];
    return colors[Math.floor(Math.random() * colors.length)];
}

// 初始化食物列表
function initFoodList() {
    eatingSometing.forEach((food, index) => {
        const foodItem = document.createElement('div');
        foodItem.className = 'food-item';
        foodItem.textContent = food;
        foodItem.style.animationDelay = `${index * 0.1}s`;
        const [color1, color2] = getRandomColor();
        foodItem.style.background = `linear-gradient(135deg, ${color1}, ${color2})`;
        if (isCustomFood(food)) {
            foodItem.addEventListener('click', () => deleteFood(foodItem, food));
        }
        foodList.appendChild(foodItem);
    });
}

// 删除食物
function deleteFood(foodItem, food) {
    if (!isCustomFood(food)) {
        foodItem.style.transform = 'scale(0.95)';
        foodItem.style.opacity = '0.5';
        setTimeout(() => {
            foodItem.style.transform = '';
            foodItem.style.opacity = '';
        }, 300);
        return;
    }
    
    foodItem.classList.add('deleting');
    setTimeout(() => {
        const index = eatingSometing.indexOf(food);
        if (index > -1) {
            eatingSometing.splice(index, 1);
            removeCustomFood(food);
            foodItem.remove();
        }
    }, 300);
}

// 添加新食物
function addFood() {
    const food = foodInput.value.trim();
    if (!food) return;
    
    if (eatingSometing.includes(food)) {
        foodInput.classList.add('shake');
        foodInput.placeholder = '⚠️ 已存在';
        setTimeout(() => {
            foodInput.classList.remove('shake');
            foodInput.placeholder = '输入新食物...';
        }, 1000);
        return;
    }
    
    eatingSometing.push(food);
    saveCustomFood(food);
    const foodItem = document.createElement('div');
    foodItem.className = 'food-item';
    foodItem.textContent = food;
    const [color1, color2] = getRandomColor();
    foodItem.style.background = `linear-gradient(135deg, ${color1}, ${color2})`;
    foodItem.addEventListener('click', () => deleteFood(foodItem, food));
    foodList.appendChild(foodItem);
    foodInput.value = '';
}

// 随机抽取食物
function randomFood() {
    // 禁用按钮防止重复点击
    randomButton.disabled = true;
    randomButton.textContent = '🎲 抽取中...';
    
    // 添加旋转动画
    randomButton.classList.add('spinning');
    
    // 随机快速切换食物，模拟旋转效果
    const spinDuration = 2000; // 旋转持续时间（毫秒）
    const spinInterval = 50; // 每次切换间隔（毫秒）
    const spinCount = spinDuration / spinInterval;
    let currentSpin = 0;
    
    const spinIntervalId = setInterval(() => {
        const randomIndex = Math.floor(Math.random() * eatingSometing.length);
        const randomFood = eatingSometing[randomIndex];
        resultDisplay.innerHTML = `<span class="result-text">${randomFood}</span>`;
        
        currentSpin++;
        if (currentSpin >= spinCount) {
            clearInterval(spinIntervalId);
            
            // 停止旋转动画
            randomButton.classList.remove('spinning');
            
            // 恢复按钮状态
            setTimeout(() => {
                randomButton.disabled = false;
                randomButton.textContent = '🎲 随机抽取';
            }, 300);
        }
    }, spinInterval);
}

// 初始化页面
function init() {
    initFoodList();
    
    // 添加按钮点击事件
    randomButton.addEventListener('click', randomFood);
    addButton.addEventListener('click', addFood);
    foodInput.addEventListener('keypress', (e) => {
        if (e.key === 'Enter') addFood();
    });
}

// 页面加载完成后初始化
window.addEventListener('load', init);