From 828a974070c74113b93bbf136e70e1128630cd54 Mon Sep 17 00:00:00 2001
From: harukin-expo-dev-env <harukin@haruk.in>
Date: Tue, 25 Mar 2025 07:16:55 +0000
Subject: [PATCH] =?UTF-8?q?=E9=97=87=E8=90=BD=E3=81=A1=E6=A9=9F=E8=83=BD?=
 =?UTF-8?q?=E3=82=92=E8=BF=BD=E5=8A=A0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 lib/webViewInjectjavascript.ts | 156 +++++++++++++++++----------------
 1 file changed, 82 insertions(+), 74 deletions(-)

diff --git a/lib/webViewInjectjavascript.ts b/lib/webViewInjectjavascript.ts
index e88d81f..5cf0625 100644
--- a/lib/webViewInjectjavascript.ts
+++ b/lib/webViewInjectjavascript.ts
@@ -28,9 +28,16 @@ export const injectJavascriptData: InjectJavascriptData = (
 
   // 上部ヘッダーの取り扱い、自動再読み込み、setStringsの実行
   const bootData = `
+    let probremsData = [];
+    fetch("https://n8n.haruk.in/webhook/jrshikoku-position-problems").then((response) => response.json()).then((data) => {
+      probremsData = data.data;
+    });
     const setReload = () =>{
       try{
         document.getElementById('refreshIcon').click();
+        fetch("https://n8n.haruk.in/webhook/jrshikoku-position-problems").then((response) => response.json()).then((data) => {
+          probremsData = data.data;
+        });
         setStrings();
       }catch(error){}
       setTimeout(setReload, 10000);
@@ -39,16 +46,16 @@ export const injectJavascriptData: InjectJavascriptData = (
   `;
   // 左か右かを判定してアイコンを設置する
   const trainIcon = `
-    const setStationIcon = (setIconElem,img) =>{
+    const setStationIcon = (setIconElem,img,hasProblem) =>{
       if(setIconElem.getAttribute("style").includes("left")){
-        setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:left;height:20px;'>");
+        setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:left;height:20px; background-color: "+(hasProblem ? 'black' : 'white')+";'>");
       }
       else{
-        setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:right;height:20px;'>");
+        setIconElem.insertAdjacentHTML('beforebegin', "<img src="+img+" style='float:right;height:20px; background-color: "+(hasProblem ? 'black' : 'white')+";'>");
       }
       setIconElem.remove();
     }
-    const setTrainIcon = (列番データ,e) =>{
+    const setTrainIcon = (列番データ,e,hasProblem) =>{
       switch(列番データ){
       //しおかぜメイン
       //8000 ノーマル
@@ -70,14 +77,14 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "25M":
       case "27M":
       case "29M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000nr.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000nr.png',hasProblem);
         break;
       //8000 アンパン
       case "10M":
       case "22M":
       case "9M":
       case "21M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png',hasProblem);
         break;
 
 
@@ -90,7 +97,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "11M":
       case "19M":
       case "23M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600.png',hasProblem);
         break;
 
       //いしづちメイン
@@ -113,7 +120,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "1025M":
       case "1027M":
       case "1029M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000no.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000no.png',hasProblem);
         break;
 
       //8000 アンパン
@@ -121,7 +128,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "1022M":
       case "1009M":
       case "1021M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png',hasProblem);
         break;
 
       //8600
@@ -133,29 +140,29 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "1011M":
       case "1019M":
       case "1023M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png',hasProblem);
         break;
 
       //MEXP
       //8000
       case "1092M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000nr.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000nr.png',hasProblem);
         break;
       //8600
       case "1091M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png',hasProblem);
         break;
       //三桁いしづち
       //8000 アンパン
       case "1041M":
       case "1044M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8000ap.png',hasProblem);
         break;
       //8600
       case "1043M":
       case "1042M":
       case "1046M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s8600_isz.png',hasProblem);
         break;
 
 
@@ -178,7 +185,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "51D":
       case "53D":
       case "55D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700.png',hasProblem);
         break;
       //2700アンパン
       case "32D":
@@ -211,7 +218,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "3019D":
       case "3025D":
       case "3031D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_uzu.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_uzu.png',hasProblem);
         break;
 
       //2700 二両編成
@@ -225,7 +232,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "3017D":
       case "3023D":
       case "3029D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_uzu.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_uzu.png',hasProblem);
         break;
 
       //2600
@@ -239,7 +246,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "3021D":
       case "3027D":
       case "3033D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2600.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2600.png',hasProblem);
         break;
 
       //マリンライナー
@@ -311,14 +318,14 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "3167M":
       case "3169M":
       case "3175M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s5001.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s5001.png',hasProblem);
         break;
       case "3102M":
       case "3101M":
       case "3103M":
       case "3171M":
       case "3173M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s5001k.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s5001k.png',hasProblem);
         break;
 
       //サンライズ瀬戸
@@ -326,7 +333,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "5031M":
       case "8041M": //琴平延長高松迄
       case "8031M": //琴平延長高松以降
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/w285.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/w285.png',hasProblem);
         break;
 
       //宇和海
@@ -357,7 +364,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "1077D":
       case "1079D":
       case "1081D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2000_uwa.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2000_uwa.png',hasProblem);
       break;
       //2000 アンパン込み
       case "1058D":
@@ -366,14 +373,14 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "1053D":
       case "1059D":
       case "1067D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2002a.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2002a.png',hasProblem);
       break;
       //しまんと
       case "2002D":
       case "2004D":
       case "2001D":
       case "2003D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_smn.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_smn.png',hasProblem);
       break;
 
       //あしずり 2000
@@ -385,7 +392,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "2073D":
       case "2079D":
       case "2081D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2000_asi.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2000_asi.png',hasProblem);
       break;
 
       //あしずり 2700
@@ -395,7 +402,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "2075D":
       case "2077D":
       case "2083D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_asi.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s2700_asi.png',hasProblem);
       break;
       //剣山
       case "4002D":
@@ -405,14 +412,14 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "4003D":
       case "4005D":
       case "4007D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185tu.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185tu.png',hasProblem);
       break;
 
 
       //よしのがわトロッコ
       case "8452D":
       case "8451D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185to_ai.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185to_ai.png',hasProblem);
       break;
 
       //岡山高松アントロ
@@ -421,14 +428,14 @@ export const injectJavascriptData: InjectJavascriptData = (
       //岡山琴平アントロ
       case "8277D":
       case "8278D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32to4.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32to4.png',hasProblem);
       break;
 
 
       //千年ものがたり
       case "8021D":
       case "8022D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185mm1.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185mm1.png',hasProblem);
       break;
 
       //夜明けものがたり
@@ -436,12 +443,12 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "8083D":
       case "8073D":
       case "8074D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185ym1.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185ym1.png',hasProblem);
       break;
       //ラマルドボア
       case "9253M":
       case "9256M":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/w213w.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/w213w.png',hasProblem);
         break;
 
       // 貨物
@@ -463,7 +470,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "8071":
       case "8072":
       case "8077":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/ef210a.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/ef210a.png',hasProblem);
         break;
 
       // // 普通列車系統、6000系運用
@@ -479,7 +486,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "147M":
       // //962運用
       // case "114M":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s6000p.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s6000p.png',hasProblem);
       //   break;
 
 
@@ -487,31 +494,31 @@ export const injectJavascriptData: InjectJavascriptData = (
       // // ごな線
       // case "5851D": //219D併結 [ToDo: 219Dとの分割対策]
       // case "5854D": 
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640jgr.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640jgr.png',hasProblem);
       //   break;
       
       //   //JR車両乗り入れ運用
       // case "5858D": 
       // case "5869D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem);
       //   break;
       // //併結運用の併結される側  [ToDo: 分割対策]
       // case "5845D":
       // case "5851D":
       // case "5818D":
       // case "5820D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png',hasProblem);
       //   break;
       // // 土讃線単体列車のキハ32運用
       // case "715D":
       // case "718D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32ns.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32ns.png',hasProblem);
       //   break;
       
       // // サンライズに伴う気動車代走
       // case "6219D":
       // case "6222D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem);
       //   break;
       // // それ以外の土讃線ごな線直通列車
       // case "5811D":
@@ -540,7 +547,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "5876D":
       // case "5880D":
       // case "5882D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/tosa9640.png',hasProblem);
       //   break;
       // // それ以外の土讃線普通列車(1000)
       // case "4210D":
@@ -661,7 +668,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "757D":
       // case "761D":
         
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem);
       //   break;
       // // 予讃線/土讃線普通列車運用(7000,7200)
       // // 下り列車(伊予西条-松山は全て7000系)
@@ -715,7 +722,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "155M":
       // case "1263M":
       // case "157M":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem);
       //   break;
       //   // 下り7000系
       // case "101M":
@@ -727,7 +734,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "555M":
       // case "4565M":
       // case "159M":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem);
       //   break;
       //   // 上り列車 7200系
       // case "5102M":
@@ -781,7 +788,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "1606M":
       // case "5160M":
       // case "5256M":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem);
       //   break;
       // // 上り7000系
       // case "114M":
@@ -792,7 +799,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "4542M":
       // case "162M":
       // case "4166M":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem);
       //   break;
       // // 松山界隈気動車運用
       // // 上り下りの概念アリ
@@ -815,28 +822,28 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "4824D":
       // case "4813D":
       // case "4664D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32s.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32s.png',hasProblem);
       //   break;
       // // 河童うようよ号偶数
       // case "4816D":
       // case "4830D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy2.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy2.png',hasProblem);
       //   break;
       // // 河童うようよ号奇数
       // case "4827D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy1.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32kpuy1.png',hasProblem);
       //   break;
       // // 新幹線偶数
       // case "4810D":
       // case "4822D":
       // case "4826D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32tht.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32tht.png',hasProblem);
       //   break;
       // // 新幹線奇数
       // case "4817D":
       // case "4823D":
       // case "4829D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32thtk.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s32thtk.png',hasProblem);
       //   break;
       // // キハ54 通常運用
       // case "4632D":
@@ -879,29 +886,29 @@ export const injectJavascriptData: InjectJavascriptData = (
       // case "4922D":
       // case "4923D":
       // case "4663D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54s.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54s.png',hasProblem);
       //   break;
       // // 54しまんとろっこ
       // case "4623D":
       // case "8814D":
       // case "8819D":
       // case "4662D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54to0ys.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s54to0ys.png',hasProblem);
       //   break;
       // // キハ185 通常運用
       // case "911D":
       // case "628D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185cm.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185cm.png',hasProblem);
       //   break;
       // // 伊予灘ものがたり 赤
       // case "8091D":
       // case "8093D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185iyor.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185iyor.png',hasProblem);
       //   break;
       // // 伊予灘ものがたり 黄
       // case "8092D":
       // case "8094D":
-      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185iyoy.png');
+      //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s185iyoy.png',hasProblem);
       //   break;
 
       // 高徳線、徳島線、牟岐線、鳴門線普通列車系統
@@ -927,7 +934,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "976D":
       case "980D":
       case "982D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s40.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s40.png',hasProblem);
         break;
       // 1000形
       case "4311D":
@@ -940,7 +947,7 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "450D":
       case "4458D":
       case "474D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1000.png',hasProblem);
         break;
       // 1200形
       case "4301D":
@@ -981,56 +988,56 @@ export const injectJavascriptData: InjectJavascriptData = (
       case "4958D":
       case "4962D":
       case "4966D":
-        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1200n.png');
+        setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1200n.png',hasProblem);
         break;
 
         
       default: //指定車両でなく、Regexでの指定に移動
       //     // 琴平直通系普通電車  
       //   if(new RegExp(/^(1|4|5)2\\d\\dM$/).test(列番データ)){
-      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png');
+      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem);
       //     break;
       //   }
       //   else if(new RegExp(/^(1|4|5)(1|5|6)\\d\\dM$/).test(列番データ)){
-      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png');
+      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem);
       //     break;
       //   }
       //   else if(new RegExp(/^(1|5|6)\\d\\dM$/).test(列番データ)){
-      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png');
+      //     setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem);
       //     break;
       //   }// 高徳線 普通列車系統
       //   else 
         if(new RegExp(/^(4|5)3\\d\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }
         else if(new RegExp(/^3\\d\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }// 徳島線 普通列車系統
         else if(new RegExp(/^(4|5)4\\d\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }
         else if(new RegExp(/^4\\d\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }// 鳴門線普通列車系統
         else if(new RegExp(/^(4|5)9(5|6|7|8)\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }
         else if(new RegExp(/^9(5|6|7|8)\\dD$/).test(列番データ)){
-          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png');
+          setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s1500.png',hasProblem);
           break;
         }
         // 牟岐線普通列車系統 一旦閉鎖
         // else if(new RegExp(/^(4|5)5\\d\\dD$/).test(列番データ)){
-        //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png');
+        //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7200.png',hasProblem);
         //   break;
         // }
         // else if(new RegExp(/^5\\d\\dD$/).test(列番データ)){
-        //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png');
+        //   setStationIcon(e.querySelector("img"),'https://storage.haruk.in/s7000.png',hasProblem);
         //   break;
         // }
         break;
@@ -1039,7 +1046,7 @@ export const injectJavascriptData: InjectJavascriptData = (
     `;
 
   const normal_train_name = `
-  const nameReplace = (列車名データ,列番データ,行き先情報) =>{
+  const nameReplace = (列車名データ,列番データ,行き先情報,hasProblem) =>{
     let isWanman = false;
     let trainName = "";
     let viaData = "";
@@ -1256,8 +1263,8 @@ export const injectJavascriptData: InjectJavascriptData = (
     const returnText1 = (isWanman ? "ワンマン " : "") + trainName + viaData;
     const returnText2 = (ToData ? ToData+"行 " : ToData)+ TrainNumber;
     行き先情報.innerText = "";
-    行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;'>" + returnText1 + "</p>");
-    行き先情報.insertAdjacentHTML('beforebegin', "<div style='display:inline-flex;flex-direction:row;'><p style='font-size:10px;font-weight: bold;padding:0;'>" + (ToData ? ToData + "行 " : ToData) + "</p><p style='font-size:10px;padding:0;'>" + TrainNumber + (JRF ? "":"レ") + "</p></div>");
+    行き先情報.insertAdjacentHTML('beforebegin', "<p style='font-size:10px;font-weight:bold;padding:0;color:" + (hasProblem ? "red" : "black") + ";background-color:"+ (hasProblem ? "black" : "unset") +";'>" + returnText1 + (hasProblem ? "\[停止中\]" : "") + "</p>");
+    行き先情報.insertAdjacentHTML('beforebegin', "<div style='display:inline-flex;flex-direction:row;'><p style='font-size:10px;font-weight: bold;padding:0;color:" + (hasProblem ? "red" : "black") + ";background-color:"+ (hasProblem ? "black" : "unset") +";'>" + (ToData ? ToData + "行 " : ToData) + "</p><p style='font-size:10px;padding:0;color:" + (hasProblem ? "red" : "black") + ";background-color:"+ (hasProblem ? "black" : "unset") +";'>" + TrainNumber + (JRF ? "":"レ") + "</p></div>");
   }
   `;
 
@@ -1274,12 +1281,13 @@ const setStrings = () =>{
       var 行き先情報 = element.getElementsByTagName("p")[0];
       var 列番データ = element.getAttribute('offclick').split('"')[1];
       var 列車名データ = element.getAttribute('offclick').split('"')[3];
+      const hasProblem = probremsData.find(e => e.TrainNum == 列番データ);
       var flag=false;
       var TrainType = undefined;
       setTrainMenuDialog(element)
      
-      ${iconSetting == "true" ? "setTrainIcon(列番データ,element);" : ""}
-      nameReplace(列車名データ,列番データ,行き先情報); 
+      ${iconSetting == "true" ? "setTrainIcon(列番データ,element,hasProblem);" : ""}
+      nameReplace(列車名データ,列番データ,行き先情報,hasProblem); 
     }
     try{
       for(let d of document.getElementById('disp').childNodes){