動画の高さに対してブラウザの高さが不足している時に、動作の操作部分を上に配置

README-params.md

@@ -48,6 +48,11 @@ die("ok")
 - **<PARAM NAME="neo_enable_zoom_out" VALUE="true">**  
 このフラグを true にするとズームで、0.5倍、0.2倍に縮小表示できるようになります。  
 オリジナルのPaintBBSには無い機能なので**デフォルトは false です**。  
+- **<PARAM NAME="neo_viewer_buttonswrapper_top" VALUE="true">**  
+このフラグを true にすると動作再生時の操作ボタンや進捗バー等を動画の上に配置できるようになります。  
+ブラウザの表示領域の高さが動画の高さに対して不足している時にのみ上に配置します。  
+極めて大きなサイズの動画の再生時や、小さな画面のスマホ等のデバイスで動作を縮小表示して再生するためのUIです。  
+オリジナルのPaintBBSには無い機能なので**デフォルトは false です**。  
 
 # 動画の仕様の違い
 

README.md

@@ -92,6 +92,15 @@ NEO の入っていない掲示板に投稿して、動作を確認すること
 -->
 
 ## <a name="history">履歴</a>
+
+#### ver1.6.21 (2025/11/28)
+
+- **&lt;PARAM NAME="neo_viewer_buttonswrapper_top" VALUE="true">**  
+このフラグを true にすると動作再生時の操作ボタンや進捗バー等を動画の上に配置できるようになります。  
+ブラウザの表示領域の高さが動画の高さに対して不足している時にのみ上に配置します。  
+極めて大きなサイズの動画の再生時や、小さな画面のスマホ等のデバイスで動作を縮小表示して再生するためのUIです。  
+オリジナルのPaintBBSには無い機能なので**デフォルトは false です**。  
+
 #### ver1.6.20 (2025/11/27)
 - **&lt;PARAM NAME="neo_enable_zoom_out" VALUE="true">**  
 このフラグを true にするとズームで、0.5倍、0.2倍に縮小表示できるようになります。  

dist/neo.js

@@ -10,7 +10,7 @@ document.addEventListener("DOMContentLoaded", function () {
 
 var Neo = function () {};
 
-Neo.version = "1.6.20";
+Neo.version = "1.6.21";
 Neo.painter;
 Neo.fullScreen = false;
 Neo.uploaded = false;
@@ -78,7 +78,9 @@ Neo.init = function () {
             Neo.config.width = pch.width;
             Neo.config.height = pch.height;
             Neo.initViewer(pch);
-            Neo.startViewer();
+            // Neo.initViewer()内へ移動
+            // ボタンが表示される前に再生される事があるため
+            // Neo.startViewer();
           }
         });
       }
@@ -7070,14 +7072,20 @@ Neo.initViewer = function (pch) {
 
   var painter = document.getElementById("painter");
 
+  const viewerWrapperOnTop =
+    Neo.config.neo_viewer_buttonswrapper_top &&
+    window.innerHeight < pageHeight + 100;
+
   painter.style.marginTop = "0";
   painter.style.position = "absolute";
   painter.style.padding = "0";
-  painter.style.bottom = dy + 26 + "px";
+  painter.style.bottom = viewerWrapperOnTop ? 0 : dy + 26 + "px";
   painter.style.left = dx + "px";
 
   var viewerButtonsWrapper = document.getElementById("viewerButtonsWrapper");
   viewerButtonsWrapper.style.width = pageWidth - 2 + "px";
+  viewerButtonsWrapper.style.position = viewerWrapperOnTop ? "absolute" : "";
+  viewerButtonsWrapper.style.top = viewerWrapperOnTop ? "0px" : "";
 
   var viewerBar = document.getElementById("viewerBar");
   viewerBar.style.position = "absolute";
@@ -7135,7 +7143,10 @@ Neo.initViewer = function (pch) {
   if (pch) {
     //Neo.config.pch_file) {
     Neo.painter._actionMgr._items = pch.data;
-    Neo.painter.play();
+    Neo.startViewer();
+    setTimeout(() => {
+      Neo.painter.play();
+    }, 50);
   }
 };