teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

5

入力ミス修正

2021/08/20 00:16

投稿

beam1111
beam1111

スコア1

title CHANGED
File without changes
body CHANGED
@@ -60,7 +60,7 @@
60
60
  'no' => 動画の再生順番号,
61
61
  'source' => m3u8マスターファイル格納場所,
62
62
  'obj' => null,
63
- 'content' => null,
63
+ 'content' => <video id="mp4_video"></video>,
64
64
  },
65
65
  ...
66
66
  ];

4

playmp4, pausemp4の入力ミス修正

2021/08/20 00:16

投稿

beam1111
beam1111

スコア1

title CHANGED
File without changes
body CHANGED
@@ -144,6 +144,7 @@
144
144
  $(function () {
145
145
  $.each(mp4, function(i, val) {
146
146
  if (val.type == 'mp4') {
147
+ $("#mp4_play_block").html(mp4[i].content);
147
148
  mp4[i].obj = document.getElementById('mp4_video');
148
149
  mp4[i].content = $("#mp4_video");
149
150
  // hls.jsの設定

3

playmp4, pausemp4の入力ミス修正

2021/08/20 00:13

投稿

beam1111
beam1111

スコア1

title CHANGED
File without changes
body CHANGED
@@ -67,12 +67,14 @@
67
67
  */
68
68
 
69
69
  function playMp4(i) {
70
+ $("#mp4_play_block").html(mp4[i].content);
70
71
  mp4[i].obj.currentTime = 0;
71
72
  mp4[i].obj.play();
72
73
  }
73
74
 
74
75
 
75
76
  function pauseMp4(i) {
77
+ $("#mp4_play_block").html(mp4[i].content);
76
78
  mp4[i].obj.pause();
77
79
  mp4[i].obj.currentTime = 0;
78
80
  }

2

入力ミスの修正

2021/08/20 00:12

投稿

beam1111
beam1111

スコア1

title CHANGED
File without changes
body CHANGED
@@ -41,7 +41,7 @@
41
41
  ```php
42
42
  // 動画のwrapper部分
43
43
  <?php foreach ($materials as $material): ?>
44
- <div class="<?= h($material['class']); ?>" style="display: none;">
44
+ <div class="box type_mp4" id="mp4_play_block" style="display: none;">
45
45
  <video id="mp4_video"></video>
46
46
  </div>
47
47
  <?php endforeach; ?>

1

動画を再生しているページのコード、Androidアプリの動画再生ページのコードの追加

2021/08/19 09:36

投稿

beam1111
beam1111

スコア1

title CHANGED
File without changes
body CHANGED
@@ -33,4 +33,224 @@
33
33
 
34
34
  android studio : 4.2.1
35
35
 
36
- SMART TV BOX(実機): AP6330
36
+ SMART TV BOX(実機): AP6330
37
+
38
+ コードを追記いたしました。ご指摘ありがとうございます。
39
+
40
+ ### コード
41
+ ```php
42
+ // 動画のwrapper部分
43
+ <?php foreach ($materials as $material): ?>
44
+ <div class="<?= h($material['class']); ?>" style="display: none;">
45
+ <video id="mp4_video"></video>
46
+ </div>
47
+ <?php endforeach; ?>
48
+ ```
49
+
50
+ ```javascript
51
+ var mp4;
52
+
53
+ <?php if (!empty($material_mp4)): ?>
54
+ mp4 = <?= json_encode(($material_mp4)); ?>;
55
+ <?php endif; ?>
56
+ /*
57
+ $material_mp4 = [
58
+ {
59
+ 'type' => 'mp4',
60
+ 'no' => 動画の再生順番号,
61
+ 'source' => m3u8マスターファイル格納場所,
62
+ 'obj' => null,
63
+ 'content' => null,
64
+ },
65
+ ...
66
+ ];
67
+ */
68
+
69
+ function playMp4(i) {
70
+ mp4[i].obj.currentTime = 0;
71
+ mp4[i].obj.play();
72
+ }
73
+
74
+
75
+ function pauseMp4(i) {
76
+ mp4[i].obj.pause();
77
+ mp4[i].obj.currentTime = 0;
78
+ }
79
+
80
+
81
+ var scene_manager = function () {
82
+ var items = <?= json_encode($items); ?>;
83
+ /*
84
+ items = [
85
+ { time: 指定した動画再生時間, action: 'play_video_' + 動画の再生順番号 },
86
+ ...
87
+ ]
88
+ */
89
+ var START_INDEX = 1;
90
+ var END_INDEX = <?= $item_count; ?>;
91
+ var index = START_INDEX;
92
+ var prev = START_INDEX;
93
+
94
+ var show = function () {
95
+ var now = index;
96
+ // 動画の切り替えをする
97
+ $('.type_' + scene_box_list[prev]).fadeOut(0, function () {
98
+ $('.type_' + scene_box_list[now]).fadeIn(0);
99
+ });
100
+
101
+ var flg = 0;
102
+
103
+ // 次の動画を再生する
104
+ $.each(mp4, function(i, val) {
105
+ if (items[index].action == 'play_mp4_' + val.no) {
106
+ playMp4(i);
107
+ return false;
108
+ }
109
+ });
110
+
111
+ // 動画の切り替えを予約しておく
112
+ if (flg == 0) {
113
+ setTimeout(function(){
114
+ pauseVideos();
115
+ next();
116
+ }, items[index].time);
117
+ }
118
+ };
119
+
120
+ // 再生中の動画の停止する
121
+ var pauseVideos = function() {
122
+ if (items[index].action.indexOf('play_mp4_') == 0) {
123
+ pauseMp4(index);
124
+ }
125
+ }
126
+ // 次の動画への切り替えの準備
127
+ var next = function () {
128
+ prev = index;
129
+ index++;
130
+ if(index > END_INDEX) {
131
+ index = START_INDEX;
132
+ }
133
+
134
+ show();
135
+ };
136
+ return function () {
137
+ show();
138
+ };
139
+ }();
140
+
141
+
142
+ $(function () {
143
+ $.each(mp4, function(i, val) {
144
+ if (val.type == 'mp4') {
145
+ mp4[i].obj = document.getElementById('mp4_video');
146
+ mp4[i].content = $("#mp4_video");
147
+ // hls.jsの設定
148
+ if (Hls.isSupported()) {
149
+ var hls_config = {
150
+ maxMaxBufferLength: 20,
151
+ };
152
+ var hls = new Hls(hls_config);
153
+ hls.loadSource(mp4[i].source);
154
+ hls.attachMedia(mp4[i].obj);
155
+ } else if (mp4[i].obj.canPlayType('application/vnd.apple.mpegurl')) {
156
+ mp4[i].obj.src = mp4[i].source;
157
+ }
158
+ }
159
+ });
160
+ });
161
+
162
+
163
+ window.onload = function() {
164
+ scene_manager();
165
+ }
166
+ ```
167
+
168
+ ```kotlin
169
+ // Activity
170
+ class MainActivity : AppCompatActivity() {
171
+
172
+ private val longPressHandler = Handler(Looper.getMainLooper())
173
+
174
+ private var myWebView : WebView? = null
175
+
176
+ override fun onCreate(savedInstanceState: Bundle?) {
177
+ super.onCreate(savedInstanceState)
178
+ setContentView(R.layout.activity_main)
179
+
180
+ myWebView = initWebView()
181
+ }
182
+
183
+
184
+ override fun onResume() {
185
+ super.onResume()
186
+ myWebView!!.clearCache(true)
187
+ displayWebPage()
188
+ }
189
+
190
+ private fun initWebView() : WebView {
191
+ // WebViewの設定
192
+ WebView.setWebContentsDebuggingEnabled(true)
193
+ val webView : WebView = findViewById(R.id.webView)
194
+
195
+ with(webView) {
196
+ settings.javaScriptEnabled = true
197
+ settings.mediaPlaybackRequiresUserGesture = false
198
+ settings.useWideViewPort = true
199
+ settings.loadWithOverviewMode = true
200
+ }
201
+ return webView
202
+ }
203
+
204
+
205
+ private fun displayWebPage() {
206
+ val textURL: String = 指定URL
207
+ myWebView?.loadUrl(textURL)
208
+ }
209
+ }
210
+ ```
211
+
212
+ ```kotlin
213
+ // manifest
214
+ <uses-permission android:name="android.permission.INTERNET" />
215
+
216
+ <application
217
+ android:allowBackup="true"
218
+ android:icon="@mipmap/ic_launcher"
219
+ android:label="@string/app_name"
220
+ android:roundIcon="@mipmap/ic_launcher_round"
221
+ android:supportsRtl="true"
222
+ android:theme="@style/Theme.アプリ名"
223
+ android:usesCleartextTraffic="true"
224
+ android:hardwareAccelerated="true"
225
+ android:largeHeap="true">
226
+
227
+ <activity android:name=".MainActivity">
228
+ <intent-filter>
229
+ <action android:name="android.intent.action.MAIN" />
230
+
231
+ <category android:name="android.intent.category.LAUNCHER" />
232
+ </intent-filter>
233
+ </activity>
234
+
235
+ </application>
236
+ ```
237
+
238
+ ```kotlin
239
+ // layout
240
+ <?xml version="1.0" encoding="utf-8"?>
241
+ <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
242
+ xmlns:app="http://schemas.android.com/apk/res-auto"
243
+ xmlns:tools="http://schemas.android.com/tools"
244
+ android:layout_width="match_parent"
245
+ android:layout_height="match_parent"
246
+ tools:context=".MainActivity">
247
+
248
+ <!--WebView-->
249
+ <WebView
250
+ android:id="@+id/webView"
251
+ android:layout_width="match_parent"
252
+ android:layout_height="match_parent"/>
253
+ <!--/WebView-->
254
+
255
+ </androidx.constraintlayout.widget.ConstraintLayout>
256
+ ```