control.js

/**

 * control.js - UIコントロールとイベント管理

 * 

 * 主な機能:

 * - サイドバーの制御（表示/非表示、リサイズ）

 * - キーボードショートカット

 * - ローカルストレージのクリア

 * - レイアウトの自動調整

 * - モデルリストの更新

 * 

 * 重要な関数:

 * - initSidebarResize(): サイドバーのリサイズ機能を初期化

 * - resizeMain(): メインコンテンツのサイズを調整

 * - updateModelList(): 利用可能なモデルリストを更新

 */

updateHistoryList();
loadFromUserStorage();
setInterval(() => {
    saveToUserStorage();
}, 60000);
// 入力フォームの内容を保存する
document.querySelectorAll('input, textarea').forEach(input => {
    input.addEventListener('input', saveToUserStorage);
});
// Ctrl+Enterでプロンプト生成を実行する
document.addEventListener('keydown', function (event) {
    if (event.ctrlKey && event.key === 'Enter') {
        event.preventDefault(); // デフォルトの動作を防ぐ
        generatePrompt(); // プロンプト生成関数を呼び出す
    }
});

// サイドバーの切り替え機能を修正
document.getElementById('sidebarToggle').addEventListener('click', function () {
    const sidebarContainer = document.getElementById('sidebar-container');
    const content = document.getElementById('content');
    const isActive = sidebarContainer.classList.toggle('active');
    
    if (isActive) {
        // サイドバーを開く
        sidebarContainer.style.width = '250px';
        content.style.marginLeft = '250px';
    } else {
        // サイドバーを閉じる
        sidebarContainer.style.width = '0';
        content.style.marginLeft = '0';
    }
});

// サイドバーのリサイズ機能を修正
function initSidebarResize() {
    const sidebarContainer = document.getElementById('sidebar-container');
    const content = document.getElementById('content');
    const resizer = document.getElementById('sidebar-resizer');
    let isResizing = false;

    resizer.addEventListener('mousedown', (e) => {
        isResizing = true;
        document.addEventListener('mousemove', resize);
        document.addEventListener('mouseup', stopResize);
    });

    function resize(e) {
        if (!isResizing) return;
        const newWidth = e.clientX;
        const minWidth = 250;
        const maxWidth = 500;
        const sidebarWidth = Math.min(Math.max(minWidth, newWidth), maxWidth);
        
        sidebarContainer.style.width = `${sidebarWidth}px`;
        content.style.marginLeft = `${sidebarWidth}px`;
        sidebarContainer.classList.add('active'); // サイドバーを開いた状態にする
    }

    function stopResize() {
        isResizing = false;
        document.removeEventListener('mousemove', resize);
        document.removeEventListener('mouseup', stopResize);
    }
}

// localStorageをクリアする機能を追加
function initClearStorageButton() {
    const clearStorageButton = document.getElementById('clearStorageButton');
    clearStorageButton.addEventListener('click', () => {
        const userInput = prompt('全てのデータを削除します。よろしければ「YES」と入力してください。');
        if (userInput === 'YES') {
            localStorage.clear();
            alert('全てのデータが削除されました。ページを再読み込みします。');
            location.reload();
        } else {
            alert('削除がキャンセルされました。');
        }
    });
}

function resizeMain() {
    if (window.innerWidth >= 768) {
        document.querySelector("main").style.height = `calc(100vh - ${document.querySelector("main").offsetTop}px)`
    }
}

// DOMContentLoadedイベントリスナーを更新
document.addEventListener('DOMContentLoaded', function () {
    resizeMain();
    initSidebarResize();
    initClearStorageButton();
    updateModelList(); // 新しい関数を呼び出し
});

window.addEventListener("resize", resizeMain);

async function updateModelList() {
    try {
        const models = await getModelList();
        const endpointSelect = document.getElementById('endpointSelect');
        const currentOptions = Array.from(endpointSelect.options).map(option => option.value);

        models.forEach(model => {
            const modelPath = `models/${model.name.split('/').pop()}`;
            if (!currentOptions.includes(modelPath)) {
                const option = document.createElement('option');
                option.value = modelPath;
                option.textContent = model.name.split('/').pop();
                endpointSelect.appendChild(option);
            }
        });
    } catch (error) {
        console.error('モデルリストの更新中にエラーが発生しました:', error);
    }
    loadFromUserStorage();
}