自動生成でキャンセル処理を追加

Author: new-sankaku

css/ui/overlay-progress.css

@@ -8,4 +8,7 @@
 .op-loading-step {color:#695138;font-size:1rem;margin:0;font-weight:500;font-family:'Noto Sans JP',sans-serif}
 .op-loading-substep {color:#8a6c56;font-size:0.875rem;margin:0.5rem 0 0;font-family:'Noto Sans JP',sans-serif}
 .op-progress-bar {width:100%;height:4px;background-color:#e9e5dc;border-radius:2px;margin-top:1rem;overflow:hidden}
-.op-progress-bar-fill {height:100%;background-color:#c3a992;width:0}
+.op-progress-bar-fill {height:100%;background-color:#c3a992;width:0}
+.op-cancel-button {margin-top:1rem;padding:0.5rem 1.5rem;background-color:#e74c3c;color:white;border:none;border-radius:4px;cursor:pointer;font-size:0.875rem;font-family:'Noto Sans JP',sans-serif;transition:background-color 0.2s}
+.op-cancel-button:hover {background-color:#c0392b}
+.op-cancel-button:disabled {background-color:#95a5a6;cursor:not-allowed}

js/ai/ai-management.js

@@ -25,10 +25,18 @@ if(sdQueueStatus.total>0){
 return true;
 }
 
-const comfyuiQueueStatus=sdQueue.getStatus();
+const comfyuiQueueStatus=comfyuiQueue.getStatus();
 if(comfyuiQueueStatus.total>0){
 return true;
 }
+return false;
+}
+
+function clearAllQueues() {
+const sdCleared=sdQueue.clearQueue();
+const comfyCleared=comfyuiQueue.clearQueue();
+logger.info(`All queues cleared: SD=${sdCleared}, ComfyUI=${comfyCleared}`);
+return sdCleared+comfyCleared;
 }
 
 

js/ai/prompt/auto/auto-generation.js

@@ -1,5 +1,5 @@
 async function autoMultiGenerate() {
-const loading=OP_showLoading({icon: 'process',step: 'Step1',substep: 'Multi Page',progress: 0});
+const loading=OP_showLoading({icon: 'process',step: 'Step1',substep: 'Multi Page',progress: 0},true);
 await new Promise(requestAnimationFrame);
 
 try{
@@ -8,14 +8,26 @@ let onePanelNumber=$("onePanelGenerateNumber").value;
 let guidList=btmGetGuids();
 for (const [index,guid] of guidList.entries()) {
 
+if(OP_isCancelled()){
 OP_updateLoadingState(loading,{
-icon: 'process',step: 'Step2',substep: 'Page:'+(index+1),progress: 50
+icon: 'process',step: typeof getText==='function'?getText('op_cancelled'):'Cancelled',substep: '',progress: 100
+});
+break;
+}
+
+OP_updateLoadingState(loading,{
+icon: 'process',step: 'Step2',substep: 'Page:'+(index+1)+'/'+guidList.length,progress: Math.round((index/guidList.length)*100)
 });
 await new Promise(requestAnimationFrame);
 
 await chengeCanvasByGuid(guid);
 
 for (let i=0;i<onePanelNumber;i++) {
+
+if(OP_isCancelled()){
+break;
+}
+
 const promises=[];
 let panelList=getPanelObjectList();
 
@@ -24,9 +36,16 @@ var spinner=createSpinner(canvasMenuIndex);
 promises.push(T2I(panel,spinner));
 });
 
-await Promise.all(promises);
+await Promise.allSettled(promises);
+
+if(OP_isCancelled()){
+break;
+}
 
 while (true) {
+if(OP_isCancelled()){
+break;
+}
 if (existsWaitQueue()) {
 await new Promise((r)=>setTimeout(r,2000));
 continue;
@@ -37,8 +56,10 @@ break;
 
 }
 
+if(!OP_isCancelled()){
 await btmSaveProjectFile();
 }
+}
 }finally{
 OP_hideLoading(loading);
 }

js/ai/queue/task-queue.js

@@ -7,7 +7,10 @@ this.activeCount=0;
 
 add(task) {
 return new Promise((resolve,reject)=>{
-this.queue.push(()=>task().then(resolve).catch(reject));
+this.queue.push({
+execute:()=>task().then(resolve).catch(reject),
+reject:reject
+});
 this.processQueue();
 });
 }
@@ -17,12 +20,12 @@ if (this.activeCount>=this.concurrency||this.queue.length===0) {
 return;
 }
 
-const task=this.queue.shift();
+const taskItem=this.queue.shift();
 this.activeCount++;
 
 try {
 logger.debug("task is run.");
-await task();
+await taskItem.execute();
 } catch (error) {
 logger.error("Task error:",error);
 } finally {
@@ -50,4 +53,16 @@ waiting: this.getWaitingCount(),
 total: this.getTotalCount()
 };
 }
+
+clearQueue() {
+const clearedCount=this.queue.length;
+this.queue.forEach(taskItem=>{
+try{
+taskItem.reject(new Error('Queue cancelled'));
+}catch(e){}
+});
+this.queue=[];
+logger.debug(`Queue cleared: ${clearedCount} tasks removed`);
+return clearedCount;
+}
 }

js/ui/overlay-progress.js

@@ -5,7 +5,17 @@ save: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" s
 download: `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="op-icon-spin"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></svg>`
 };
 
-function OP_createLoadingOverlay() {
+let OP_cancelRequested=false;
+
+function OP_isCancelled(){
+return OP_cancelRequested;
+}
+
+function OP_resetCancel(){
+OP_cancelRequested=false;
+}
+
+function OP_createLoadingOverlay(showCancel=false) {
 const overlay=document.createElement('div');
 const content=document.createElement('div');
 const iconContainer=document.createElement('div');
@@ -27,6 +37,23 @@ content.appendChild(iconContainer);
 content.appendChild(stepText);
 content.appendChild(subStepText);
 content.appendChild(progressBar);
+
+if(showCancel){
+const cancelBtn=document.createElement('button');
+cancelBtn.className='op-cancel-button';
+cancelBtn.textContent=typeof getText==='function'?getText('op_cancel'):'Cancel';
+cancelBtn.onclick=function(){
+OP_cancelRequested=true;
+cancelBtn.disabled=true;
+cancelBtn.textContent=typeof getText==='function'?getText('op_cancelling'):'Cancelling...';
+subStepText.textContent=typeof getText==='function'?getText('op_waitingTask'):'Waiting for current task...';
+if(typeof clearAllQueues==='function'){
+clearAllQueues();
+}
+};
+content.appendChild(cancelBtn);
+}
+
 overlay.appendChild(content);
 document.body.appendChild(overlay);
 return overlay;
@@ -47,8 +74,11 @@ function OP_hideLoading(overlay) {
 if (overlay&&overlay.parentNode) overlay.parentNode.removeChild(overlay);
 }
 
-function OP_showLoading(options={}) {
-const overlay=OP_createLoadingOverlay();
+function OP_showLoading(options={},showCancel=false) {
+if(showCancel){
+OP_resetCancel();
+}
+const overlay=OP_createLoadingOverlay(showCancel);
 OP_updateLoadingState(overlay,options);
 return overlay;
 }

js/ui/third/i18next.js

@@ -27,6 +27,18 @@ const resources = {
 "th": {"unsupportedProjectFileFormat": "รูปแบบไฟล์ไม่รองรับ", "unsupportedProjectFileFormatMessage": "กรุณาเลือกไฟล์ .zip หรือ .lz4", "OutlinePen": "เส้นขอบคู่", "outline1-color": "สีขอบ1", "outline2-color": "สีขอบ2", "outline1-size": "ความกว้างขอบ1", "outline2-size": "ความกว้างขอบ2", "outline1-opacity": "ความทึบขอบ1", "outline2-opacity": "ความทึบขอบ2"},
 "de": {"unsupportedProjectFileFormat": "Nicht unterstütztes Dateiformat", "unsupportedProjectFileFormatMessage": "Bitte wählen Sie eine .zip- oder .lz4-Datei", "OutlinePen": "Doppelumriss", "outline1-color": "Umriss1 Farbe", "outline2-color": "Umriss2 Farbe", "outline1-size": "Umriss1 Breite", "outline2-size": "Umriss2 Breite", "outline1-opacity": "Umriss1 Deckkraft", "outline2-opacity": "Umriss2 Deckkraft"}
 },
+"20260112": {
+"ja": {"op_cancel": "キャンセル", "op_cancelling": "キャンセル中...", "op_cancelled": "キャンセル済み", "op_waitingTask": "現在のタスクを待機中..."},
+"en": {"op_cancel": "Cancel", "op_cancelling": "Cancelling...", "op_cancelled": "Cancelled", "op_waitingTask": "Waiting for current task..."},
+"ko": {"op_cancel": "취소", "op_cancelling": "취소 중...", "op_cancelled": "취소됨", "op_waitingTask": "현재 작업 대기 중..."},
+"fr": {"op_cancel": "Annuler", "op_cancelling": "Annulation...", "op_cancelled": "Annulé", "op_waitingTask": "En attente de la tâche en cours..."},
+"zh": {"op_cancel": "取消", "op_cancelling": "取消中...", "op_cancelled": "已取消", "op_waitingTask": "等待当前任务..."},
+"ru": {"op_cancel": "Отмена", "op_cancelling": "Отмена...", "op_cancelled": "Отменено", "op_waitingTask": "Ожидание текущей задачи..."},
+"es": {"op_cancel": "Cancelar", "op_cancelling": "Cancelando...", "op_cancelled": "Cancelado", "op_waitingTask": "Esperando tarea actual..."},
+"pt": {"op_cancel": "Cancelar", "op_cancelling": "Cancelando...", "op_cancelled": "Cancelado", "op_waitingTask": "Aguardando tarefa atual..."},
+"th": {"op_cancel": "ยกเลิก", "op_cancelling": "กำลังยกเลิก...", "op_cancelled": "ยกเลิกแล้ว", "op_waitingTask": "รอการทำงานปัจจุบัน..."},
+"de": {"op_cancel": "Abbrechen", "op_cancelling": "Abbrechen...", "op_cancelled": "Abgebrochen", "op_waitingTask": "Warte auf aktuelle Aufgabe..."}
+},
 "20250413": {
 "ja": {"upscaleButton": "画像を高解像度化します", "cropButton": "Crop", "importButton": "インポート", "exitModeButton": "モード解除"},
 "en": {"upscaleButton": "Upscale image", "cropButton": "Crop", "importButton": "Import", "exitModeButton": "Exit Mode"},