Browse Source

音视频播放器---待审核

[wangyj18] 4 years ago
parent
commit
040459d0dc

+ 3 - 0
show-server/src/main/resources/server-page.xml

175
175
176
    <!--前后台切换-->
176
    <!--前后台切换-->
177
    <action name="LifeCycle" template="template/webapp/plugins/lifecycle.html"></action>
177
    <action name="LifeCycle" template="template/webapp/plugins/lifecycle.html"></action>
178
179
    <action name="VideoPlayer" template="template/webapp/plugins/videoPlayer.html"></action>
180
178
</pages>
181
</pages>

BIN
show-server/src/main/webapp/biz/img/share/music.mp3


BIN
show-server/src/main/webapp/biz/img/share/video.avi


BIN
show-server/src/main/webapp/biz/img/share/video.mkv


BIN
show-server/src/main/webapp/biz/img/share/video.mov


BIN
show-server/src/main/webapp/biz/img/share/video.mp4


+ 49 - 0
show-server/src/main/webapp/biz/js/plugins/videoPlayer.js

1
require(["domReady!","wadeMobile", "jcl","iScroll","tap"], function(doc,WadeMobile,$,iScroll) {
2
	var iscroll = new iScroll("scroll-container");
3
	
4
	/**
5
	 * mp4播放器
6
	 */
7
	$("#mp4Player").tap(function(){
8
		WadeMobile.openVideoPlayer("/storage/emulated/0/show-client/biz/img/share/video.mp4",function(res){
9
			alert("播放成功");
10
		},function(msg){
11
			alert("播放失败");
12
		})
13
	});
14
	
15
	//mp3
16
	$("#mp3Player").tap(function() {
17
		WadeMobile.openVideoPlayer("/storage/emulated/0/show-client/biz/img/share/music.mp3",function(res){
18
			alert("播放成功");
19
		},function(msg){
20
			alert("播放失败");
21
		})
22
	});
23
24
	//movPlayer
25
	$("#movPlayer").tap(function() {
26
		WadeMobile.openVideoPlayer("/storage/emulated/0/show-client/biz/img/share/video.mov",function(res){
27
			alert("播放成功");
28
		},function(msg){
29
			alert("播放失败");
30
		})
31
	});
32
33
	// aviPlayer
34
	$("#aviPlayer").tap(function() {
35
		WadeMobile.openVideoPlayer("/storage/emulated/0/show-client/biz/img/share/video.avi",function(res){
36
			alert("播放成功");
37
		},function(msg){
38
			alert("播放失败");
39
		})
40
	});
41
42
	$("#mkvPlayer").tap(function() {
43
		WadeMobile.openVideoPlayer("/storage/emulated/0/show-client/biz/img/share/video.mkv",function(res){
44
			alert("播放成功");
45
		},function(msg){
46
			alert("播放失败");
47
		})
48
	});
49
});

+ 3 - 0
show-server/src/main/webapp/ipu/frame/mobile/expand-mobile.js

719
        // 获取截屏状态插件
719
        // 获取截屏状态插件
720
        storageCallback("getCaptrueScreenStatus", callback);
720
        storageCallback("getCaptrueScreenStatus", callback);
721
        execute("getCaptrueScreenStatus", [], err);
721
        execute("getCaptrueScreenStatus", [], err);
722
      } ,openVideoPlayer:function(videoPath, callback){
723
        storageCallback("openVideoPlayer",callback);
724
        execute("openVideoPlayer",[videoPath]);
722
      }
725
      }
723
    };
726
    };
724
  })();
727
  })();

+ 4 - 1
show-server/src/main/webapp/template/webapp/plugins/pluginIndex.html

129
			<span class="ipu-icon fa fa-map-o"></span>
129
			<span class="ipu-icon fa fa-map-o"></span>
130
			<p>传感器</p>
130
			<p>传感器</p>
131
		</li>
131
		</li>
132
	    
132
		<li class="ipu-col-33 ipu-text-center" data-action="VideoPlayer">
133
			<span class="ipu-icon fa fa-file-video-o"></span>
134
			<p>音视频</p>
135
		</li>
133
	</ul>
136
	</ul>
134
</div>
137
</div>

+ 49 - 0
show-server/src/main/webapp/template/webapp/plugins/videoPlayer.html

1
<!DOCTYPE html>
2
<html>
3
<head>
4
<title>音视频播放</title>
5
{%>template/common/Head.html%}
6
<script type="text/javascript" src="biz/js/plugins/videoPlayer.js"></script>
7
<style>
8
.no-border {
9
	border: 0;
10
}
11
</style>
12
</head>
13
<body>
14
15
<div class="ipu-row-flex ipu-row-flex-ver">
16
		<div class="ipu-col ipu-col-auto">
17
			<header class="ipu-toolbar">
18
				<span class="ipu-icon fa fa-chevron-left ipu-fn-left" id="left-btn"></span> 
19
				<span class="ipu-icon fa fa-home  ipu-fn-right" id="right-btn"></span>
20
				<h1 class="ipu-toolbar-title">音视频播放</h1>
21
			</header>
22
		</div>
23
24
		<div id="scroll-container" class="ipu-col">
25
			<div>
26
				<div class="demo-desc">音视频播放</div>
27
				<ul class="ipu-list ipu-list-function ipu-border-tb">
28
					<li class="ipu-border-t">
29
						<div class="ipu-btn" id="mp4Player">mp4播放</div>
30
					</li>
31
					<li class="ipu-border-t">
32
						<div class="ipu-btn" id="mp3Player">mp3播放</div>
33
					</li>
34
					<li class="ipu-border-t">
35
						<div class="ipu-btn" id="movPlayer">mov播放</div>
36
					</li>
37
					<li class="ipu-border-t">
38
						<div class="ipu-btn" id="aviPlayer">avi播放</div>
39
					</li>
40
					<li class="ipu-border-t">
41
						<div class="ipu-btn" id="mkvPlayer">mkv播放</div>
42
					</li>
43
				</ul>
44
			</div>
45
		</div>
46
</div>
47
48
</body>
49
</html>