画像アップロードに対応

gemini.js

@@ -6,6 +6,55 @@ let lastIndexUpdateTimestamp = 0;
 
 let replaceProofReadHistory = [];
 
+// 画像アップロード関連の機能
+let imageCounter = 0;
+
+function addImageInput() {
+    const container = document.getElementById('imageInputsContainer');
+    const imageInputGroup = document.createElement('div');
+    imageInputGroup.className = 'input-group mb-2';
+    imageInputGroup.id = `imageGroup_${imageCounter}`;
+
+    const input = document.createElement('input');
+    input.type = 'file';
+    input.className = 'form-control';
+    input.accept = 'image/*';
+    input.id = `imageInput_${imageCounter}`;
+
+    const deleteButton = document.createElement('button');
+    deleteButton.className = 'btn btn-outline-danger';
+    deleteButton.innerHTML = '<i class="fas fa-trash"></i>';
+    deleteButton.onclick = function() {
+        removeImageInput(this.parentElement);
+    };
+
+    imageInputGroup.appendChild(input);
+    imageInputGroup.appendChild(deleteButton);
+    container.appendChild(imageInputGroup);
+
+    imageCounter++;
+}
+
+function removeImageInput(element) {
+    if (element) {
+        element.remove();
+    }
+}
+
+function getAttachedImages() {
+    const images = [];
+    const container = document.getElementById('imageInputsContainer');
+    const inputs = container.getElementsByTagName('input');
+    
+    for (let input of inputs) {
+        if (input.files && input.files[0]) {
+            images.push(input.files[0]);
+        }
+    }
+    
+    return images;
+}
+
 function replaceProofRead(textarea, proofReadText) {
     let novelContent1TextLines = document.getElementById("novelContent1").value.split("\n");
     let proofReadTextLines = proofReadText.split("\n");
@@ -42,9 +91,31 @@ async function getModelList() {
         });
 }
 
+function getSafetySettings(endpoint) {
+    const threshold = endpoint.startsWith('models/model-exp-') ? 'OFF' : 'BLOCK_NONE';
+    return [
+        {
+            "category": "HARM_CATEGORY_HATE_SPEECH",
+            "threshold": threshold
+        },
+        {
+            "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
+            "threshold": threshold
+        },
+        {
+            "category": "HARM_CATEGORY_HARASSMENT",
+            "threshold": threshold
+        },
+        {
+            "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
+            "threshold": threshold
+        }
+    ];
+}
+
 async function proofRead(textarea) {
     let content = textarea.value;
-    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-pro-002:generateContent?key=${document.getElementById('geminiApiKey').value}`;
+    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash-exp:generateContent?key=${document.getElementById('geminiApiKey').value}`;
     let prompt = `以下の文章を校正してください。文法がおかしい、誤字脱字、冗長な表現などを校正するのみに留め、内容は一切変更しないでください。\n\n${content}`;
     const payload = {
         method: 'POST',
@@ -52,31 +123,10 @@ async function proofRead(textarea) {
         body: JSON.stringify({
             contents: [{ parts: [{ text: prompt }] }],
             generationConfig: {
-                "temperature": 1.0,
-                "max_output_tokens": 4096
+                "temperature": parseFloat(document.getElementById('temperature').value),
+                "max_output_tokens": 8192
             },
-            safetySettings: [
-                {
-                    "category": "HARM_CATEGORY_HATE_SPEECH",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_HARASSMENT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_CIVIC_INTEGRITY",
-                    "threshold": "BLOCK_NONE"
-                }
-            ]
+            safetySettings: getSafetySettings('models/gemini-2.0-flash-exp')
         })
     };
     let proofReadText;
@@ -128,32 +178,18 @@ function unmalform(text) {
 }
 
 async function summerize(text) {
-    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash-002:generateContent?key=${document.getElementById('geminiApiKey').value}`;
+    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash-exp:generateContent?key=${document.getElementById('geminiApiKey').value}`;
     const prompt = `以下の文章を240文字程度に要約してください:\n\n${text}`;
     const payload = {
         method: 'POST',
         headers: {},
         body: JSON.stringify({
             contents: [{ parts: [{ text: prompt }] }],
-            generationConfig: { temperature: 0.7, max_output_tokens: 256 },
-            safetySettings: [
-                {
-                    "category": "HARM_CATEGORY_HATE_SPEECH",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_HARASSMENT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
-                    "threshold": "BLOCK_NONE"
-                }
-            ]
+            generationConfig: { 
+                temperature: parseFloat(document.getElementById('temperature').value), 
+                max_output_tokens: 512 
+            },
+            safetySettings: getSafetySettings('models/gemini-2.0-flash-exp')
         })
     };
     try {
@@ -294,7 +330,7 @@ function loadFromUserStorage() {
                 }
 
                 // 特別な処理が必要な要素
-                if (key === 'characterCount' || key === 'encodeLength' || key === 'contentWidth') {
+                if (key === 'encodeLength' || key === 'contentWidth') {
                     const inputElem = document.getElementById(`${key}Input`);
                     if (inputElem) {
                         inputElem.value = geminiClientData[key];
@@ -368,52 +404,71 @@ function createPayload() {
     const lines = text.split('\n').filter(x => x);
 
     let systemPrompt = `${partialEncodeURI(document.getElementById('generatePrompt').value)}`;
-    let prompt = `続きを書いて。${partialEncodeURI(document.getElementById('nextPrompt').value)} ${document.getElementById('characterCountInput').value}文字程度。${systemPrompt}`;
-    let messages = [
-        {
-            "role": "user",
-            "parts": [{ "text": "." }]
-        },
-        {
-            "role": "model",
-            "parts": [{ "text": partialEncodeURI(lines.join("\n")) }]
-        },
-        {
-            "role": "user",
-            "parts": [{ "text": prompt }]
-        }
-    ];
+    let prompt = `続きを書いて。${partialEncodeURI(document.getElementById('nextPrompt').value)} ${systemPrompt}`;
+    
+    // 画像の取得と変換
+    const attachedImages = getAttachedImages();
+    const imagePromises = attachedImages.map(file => {
+        return new Promise((resolve, reject) => {
+            const reader = new FileReader();
+            reader.onload = () => {
+                // Base64エンコードされた画像データを取得（"data:image/jpeg;base64,"などのプレフィックスを除去）
+                const base64Data = reader.result.split(',')[1];
+                resolve({
+                    inline_data: {
+                        data: base64Data,
+                        mime_type: file.type
+                    }
+                });
+            };
+            reader.onerror = reject;
+            reader.readAsDataURL(file);
+        });
+    });
 
-    return {
-        method: 'POST',
-        headers: {},
-        body: JSON.stringify({
-            contents: messages,
-            generationConfig: {
-                "temperature": 1.0,
-                "max_output_tokens": 4096
+    // 画像の処理が完了してからペイロードを作成
+    return Promise.all(imagePromises).then(imageParts => {
+        let messages = [
+            {
+                "role": "user",
+                "parts": [{ "text": "." }]
             },
-            safetySettings: [
-                {
-                    "category": "HARM_CATEGORY_HATE_SPEECH",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
-                    "threshold": "BLOCK_NONE"
-                },
-                {
-                    "category": "HARM_CATEGORY_HARASSMENT",
-                    "threshold": "BLOCK_NONE"
+            {
+                "role": "model",
+                "parts": [{ "text": partialEncodeURI(lines.join("\n")) }]
+            },
+            {
+                "role": "user",
+                "parts": [
+                    { "text": prompt },
+                    ...imageParts
+                ]
+            }
+        ];
+
+        let max_output_tokens = 4096;
+        let selectedEndpoint = document.getElementById('endpointSelect').value;
+        if (selectedEndpoint.match(/^models\/gemini-2\.0/)) {
+            max_output_tokens = 8192;
+        }
+        if (selectedEndpoint.match(/^models\/gemini-2\.0-flash-thinking/)) {
+            max_output_tokens = 65536;
+        }
+
+        return {
+            method: 'POST',
+            headers: {},
+            body: JSON.stringify({
+                contents: messages,
+                generationConfig: {
+                    "temperature": parseFloat(document.getElementById('temperature').value),
+                    "max_output_tokens": max_output_tokens
                 },
-                {
-                    "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
-                    "threshold": "BLOCK_NONE"
-                }
-            ]
-        }),
-        mode: 'cors'
-    };
+                safetySettings: getSafetySettings(selectedEndpoint)
+            }),
+            mode: 'cors'
+        };
+    });
 }
 
 function debugPrompt() {
@@ -601,7 +656,7 @@ function createOpenAIPayload() {
             "role": "assistant"
         },
         {
-            "content": `続きを${document.getElementById('characterCountInput').value}文字程度で書いてください。${partialEncodeURI(document.getElementById('nextPrompt').value)}`,
+            "content": `続きを書いてください。${partialEncodeURI(document.getElementById('nextPrompt').value)}`,
             "role": "user"
         },
         {
@@ -742,7 +797,7 @@ async function tokenCount() {
 }
 
 async function createDraft() {
-    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-flash-002:generateContent?key=` + document.getElementById('geminiApiKey').value;
+    const ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash-exp:generateContent?key=` + document.getElementById('geminiApiKey').value;
     let payload = createPayload();
     const response = await fetch(ENDPOINT, payload);
     const data = await response.json();
@@ -768,9 +823,9 @@ async function Request() {
 
     if (selectedEndpoint.startsWith('models/gemini')) {
         ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/${selectedEndpoint}:generateContent?key=` + document.getElementById('geminiApiKey').value;
-        payload = createPayload();
+        payload = await createPayload();  // 非同期処理を待機
     } else if (selectedEndpoint === 'restart') {
-        ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-1.5-pro-002:generateContent?key=` + document.getElementById('geminiApiKey').value;
+        ENDPOINT = `https://generativelanguage.googleapis.com/v1beta/models/gemini-2.0-flash-exp:generateContent?key=` + document.getElementById('geminiApiKey').value;
         document.getElementById('novelContent2').value = '（下書き中）';
         try {
             draft = await createDraft();
@@ -785,7 +840,7 @@ async function Request() {
         }
         //document.getElementById('novelContent2').value = `# 下書き\n${draft}\n\n# リライト\n`;
         document.getElementById('novelContent2').value = "";
-        const prompt = `以下の文章を、要件を満たす形に直したものを返信してください。\n返信内容は直した後のテキストのみになるようにし他の内容が混ざらないようにしてください。\n\n# 要件\n- 元の文章や会話の言い回しは不自然な日本語になっている部分もかなり多いので、根本的に書き替えること。ただし、登場人物の一人称や他者への呼称は変更しないこと。\n- 物語の大筋やキャラクターの性格は保ったまま、文章は全く別物に書き換える必要がある。元のテキストそのものはなるべく流用しないで新規に書くよう心掛ける。\n- 随所にレトリックを駆使しつつも凝り過ぎて読み辛くなることのないシンプルな美文になることを意識する。\n- 登場人物の会話を重視し、文脈を読み取り元のキャラクター設定に合った台詞回しを保ちつつ、より生き生きとした魅力的な人物像に仕上がるようにする。\n- 細かい動作や心理描写のディテールを重視し、よりリアルな描写になるようにする。\n- 文章の終わりに「。」をつける、字下げをするなど、一般的な小説のフォーマットに従う書き方にする。\n\n# 文章\n${draft}`;
+        const prompt = `以下の文章を、要件を満たす形に直したものを返信してください。\n返信内容は直した後のテキストのみになるようにし他の内容が混ざらないようにしてください。\n\n# 要件\n- 元の文章や会話の言い回しは不自然な日本語になっている部分もかなり多いので、根本的に書き替えること。ただし、登場人物の一人称や他者への呼称は変更しないこと。\n- 物語の大筋やキャラクターの性格は保ったまま、文章は全く別物に書き換える必要がある。元のテキストそのものはなるべく流用しないで新規に書くよう心掛ける。\n- 随所にレトリックを駆使しつつも凝り過ぎて読み辛くなることのないシンプルな美文になることを意識する。\n- 登場人物の会話を重視し、文脈を読み取り元のキャラクター設定に合った台詞回しを保ちつつ、より生き生きとした魅力的な物像に仕上がるようにする。\n- 細かい動作や心理描写のディテールを重視し、よりリアルな描写になるようにする。\n- 文章の終わりに「。」をつける、字下げをするなど、一般的な小説のフォーマットに従う書き方にする。\n\n# 文章\n${draft}`;
         payload = {
             method: 'POST',
             headers: {},
@@ -800,32 +855,15 @@ async function Request() {
                         "role": "user"
                     }
                 ],
-                "generationConfig": {
+                generationConfig: {
                     "temperature": 1.0,
-                    "max_output_tokens": 4096
+                    "max_output_tokens": 8192
                 },
-                safetySettings: [
-                    {
-                        "category": "HARM_CATEGORY_HATE_SPEECH",
-                        "threshold": "BLOCK_NONE"
-                    },
-                    {
-                        "category": "HARM_CATEGORY_DANGEROUS_CONTENT",
-                        "threshold": "BLOCK_NONE"
-                    },
-                    {
-                        "category": "HARM_CATEGORY_HARASSMENT",
-                        "threshold": "BLOCK_NONE"
-                    },
-                    {
-                        "category": "HARM_CATEGORY_SEXUALLY_EXPLICIT",
-                        "threshold": "BLOCK_NONE"
-                    }
-                ]
+                safetySettings: getSafetySettings('models/gemini-2.0-flash-exp')
             }),
             mode: 'cors'
         };
-        selectedEndpoint = 'models/gemini-1.5-pro-002';
+        selectedEndpoint = 'models/gemini-2.0-flash-exp';
     } else {
         ENDPOINT = document.getElementById('openaiEndpoint').value;
         payload = createOpenAIPayload();
@@ -1277,7 +1315,7 @@ document.addEventListener('DOMContentLoaded', function () {
     });
 
     // 設定画面の要素のイベントリスナー
-    ['memo', 'geminiApiKey', 'endpointSelect', 'openaiEndpoint', 'openaiHeaders', 'openaiJsonBody', 'characterCount', 'encodeLength'].forEach(id => {
+    ['memo', 'geminiApiKey', 'endpointSelect', 'openaiEndpoint', 'openaiHeaders', 'openaiJsonBody', 'encodeLength', 'temperature'].forEach(id => {
         document.getElementById(id).addEventListener('input', () => {
             saveToUserStorage(true);
         });
@@ -1326,11 +1364,11 @@ document.addEventListener('DOMContentLoaded', function () {
 
     // 初期表示時にも実行
     updateNavbarBrand();
-    generateIndexMenu(true);
+    //generateIndexMenu(true);
     updateAllAccordionHeaderCounts();
 
     // diff2htmlライブラリの読み込み
     const script = document.createElement('script');
     script.src = 'https://cdnjs.cloudflare.com/ajax/libs/jsdiff/5.1.0/diff.min.js';
     document.head.appendChild(script);
-});
+});