diff --git a/lib/webViewInjectjavascript.ts b/lib/webViewInjectjavascript.ts index 5984bf6..411d6ed 100644 --- a/lib/webViewInjectjavascript.ts +++ b/lib/webViewInjectjavascript.ts @@ -46,6 +46,14 @@ export const injectJavascriptData = ({ // 上部ヘッダーの取り扱い、自動再読み込み、setStringsの実行 const bootData = ` + // 停止中 点滅アニメーション CSS を動的注入 + (function(){ + const s = document.createElement('style'); + s.textContent = '@keyframes _jrs_blink{0%,55%{opacity:1}70%,90%{opacity:0}100%{opacity:1}}' + + '@keyframes _jrs_glow{0%,55%{box-shadow:0 0 12px 3px rgba(255,0,0,0.9)}70%,90%{box-shadow:0 0 6px 2px rgba(255,0,0,0.45)}100%{box-shadow:0 0 12px 3px rgba(255,0,0,0.9)}}'; + document.head.appendChild(s); + })(); + // Font Awesome は FA6/7 ともに CSS Custom Properties (content:var(--fa)) 依存で // 古い WebView (Chrome 49未満) では表示されないため、インライン SVG に置き換え済み。 // CDN依存・外部リソースロードも不要になった。 @@ -693,11 +701,11 @@ export const injectJavascriptData = ({ badgeHtml += "
"; } - 行き先情報.insertAdjacentHTML('beforebegin', "
" + badgeHtml + "

" + (TrainNumberOverride ? TrainNumberOverride : TrainNumber) + "

" + (isWanman ? "ワンマン " : "") + "

" + viaData + "

" + optionalText + "

" + trainName + "

" + (ToData ? ToData + "行" : ToData) + "

" + trainType + "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); + 行き先情報.insertAdjacentHTML('beforebegin', "
" + badgeHtml + "

" + (TrainNumberOverride ? TrainNumberOverride : TrainNumber) + "

" + (isWanman ? "ワンマン " : "") + "

" + viaData + "

" + optionalText + "

" + trainName + "

" + (ToData ? ToData + "行" : ToData) + "

" + trainType + "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); `: ` 行き先情報.insertAdjacentHTML('beforebegin', "

" + returnText1 + "

"); 行き先情報.insertAdjacentHTML('beforebegin', "

" + (ToData ? ToData + "行 " : ToData) + "

" + (TrainNumberOverride ? TrainNumberOverride : TrainNumber) + "

"); - 行き先情報.insertAdjacentHTML('beforebegin', "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); + 行き先情報.insertAdjacentHTML('beforebegin', "

" + (hasProblem ? "‼️停止中‼️" : "") + "

"); `} } `; @@ -726,9 +734,11 @@ const setNewTrainItem = (element,hasProblem,type)=>{ element.style.borderStyle = 'solid'; element.style.borderRadius = '10%'; if(hasProblem){ - element.style.boxShadow = '0 0 10px rgba(255, 0, 0, 0.9)'; + element.style.boxShadow = ''; + element.style.animation = '_jrs_glow 3s linear infinite'; }else{ element.style.boxShadow = '0 0 4px rgba(0, 0, 0, 0.2)'; + element.style.animation = ''; } element.style.margin = '2px'; element.style.display = 'flex';