Browse Source

更换背景图片

sophieChenyx 6 years ago
parent
commit
821a7b3e83

File diff suppressed because it is too large
+ 6764 - 0
src/lib/js/ckplayer/ckplayer.js


File diff suppressed because it is too large
+ 112 - 0
src/lib/js/ckplayer/ckplayer.min.js


BIN
src/lib/js/ckplayer/ckplayer.swf


File diff suppressed because it is too large
+ 106 - 0
src/lib/js/ckplayer/ckplayer.xml


src/lib/js/hls.js → src/lib/js/ckplayer/hls.min.js


+ 44 - 0
src/lib/js/ckplayer/language.xml

@@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="utf-8"?>
+	<language>
+		<adCountdown>[$second]</adCountdown><!--广告播放结束倒计时-->
+		<skipDelay>[$second]</skipDelay>
+		<buttonOver>
+			<play>点击播放</play>
+			<pause>暂停播放</pause>
+			<mute>静音</mute>
+			<escMute>恢复音量</escMute>
+			<full>全屏</full>
+			<escFull>退出全屏</escFull>
+			<previousPage>上一集</previousPage>
+			<nextPage>下一集</nextPage>
+			<definition>点击选择清晰度</definition>
+		</buttonOver>
+		<volumeSliderOver>
+			音量:[$volume]%
+		</volumeSliderOver>
+		<buffer>[$percentage]%</buffer>
+		<timeSliderOver><!--鼠标经过进度条显示的时间格式-->
+			[$timeh]:[$timei]:[$times]
+		</timeSliderOver>
+		<liveAndVod>
+			[$timeh]:[$timei]:[$times]
+		</liveAndVod>
+		<live>
+			直播中 [$liveTimeY]-[$liveTimem]-[$liveTimed] [$liveTimeh]:[$liveTimei]:[$liveTimes]
+		</live>
+		<m3u8Definition>
+			<name>流畅</name>
+			<name>低清</name>
+			<name>标清</name>
+			<name>高清</name>
+			<name>超清</name>
+			<name>蓝光</name>
+			<name>未知</name>
+		</m3u8Definition>
+		<error>
+			<cannotFindUrl>视频地址不存在</cannotFindUrl>
+			<streamNotFound>加载失败</streamNotFound>
+			<formatError>视频格式错误</formatError>
+		</error>
+		<definition>自动</definition>
+	</language>

File diff suppressed because it is too large
+ 641 - 0
src/lib/js/ckplayer/style.xml


+ 1 - 0
src/res/tpl/IndexScene.tpl

@@ -34,5 +34,6 @@
 		</div>
 	</div>
 	<p class="index_msg">
+		Powered by 领教云课堂
 	</p>
 </div>

+ 1 - 1
src/res/values/api.json

@@ -1,4 +1,4 @@
 {
-    "api_url": "https://weichuang.lingjiao.cn",
+    "api_url": "https://weichuang-winapp.lingjiao.cn",
     "api_url_test": "http://tt-web.api.ai160.com"
 }

+ 2 - 2
src/stage/index/index.html

@@ -55,7 +55,8 @@
 	<script src="../../lib/js/core.min.js"></script>
 	<script src="../../lib/js/sha1.min.js"></script>
 	<script src="../../lib/js/md5.min.js"></script>
-	<script src="../../lib/js/hls.js"></script>
+	<script src="../../lib/js/ckplayer/hls.min.js"></script>
+	<script src="../../lib/js/ckplayer/ckplayer.js"></script>
 	<script>
 		var ts = '201807251125';
 		var appCss = document.createElement('link');
@@ -84,5 +85,4 @@
 		}
 	</script>
 </body>
-
 </html>

+ 2 - 0
src/stage/index/index.less

@@ -2,6 +2,8 @@
 
 @borderSize: 0.05;
 @borderRadius: 0.2;
+@designWidth: 19.2;
+@designHeight: 10.8;
 
 body {
     width: 100%;

+ 40 - 20
src/stage/index/scene/ImageWareFullScreenScene.js

@@ -63,46 +63,66 @@ class ImageWareFullScreenScene extends scene {
 		const hasNextWare = this.curWareIndex < this.wareList.length - 1 ? true : false;
 		//当前图片是该图片课件最后一张图片,且后边还有课件则切换课件
 		if (this.curImageIndex === this.curImageList.length - 1 && hasNextWare) {
-			const nextWareIndex = this.curWareIndex + 1;
-			this.dynamicChangeWare(nextWareIndex, 'NEXT')
+			// const nextWareIndex = this.curWareIndex + 1;
+			// this.dynamicChangeWare(nextWareIndex, 'NEXT')
+			return;
 		//当前图片是该图片课件最后一张图片,且后边没有课件,给出提示
 		} else if (this.curImageIndex === this.curImageList.length - 1 && !hasNextWare) {
-			TVUtil.Toast.show('已经是最后一个课件了', 2000);
+			// TVUtil.Toast.show('已经是最后一个课件了', 2000);
+			return;
 		//当前图片不是该图片课件的最后一张图片
-    	} else {
+  	} else {
 			this.curImageIndex += 1;
 			this.renderImageView();
-    	}
+			if (this.curImageIndex === this.curImageList.length - 1) {
+				document.getElementById('imgRight').style.display = 'none';
+			}
+			if (this.curImageIndex === 1) {
+				document.getElementById('imgLeft').style.display = 'block';
+			}
+  	}
 	}
 
 	keyLeftHandler() {
 		const hasPreviousWare = this.curWareIndex === 0 ? false : true;
 		//当前图片是该图片课件的第一张图片,且前边还有课件
-	    if (this.curImageIndex == 0 && hasPreviousWare) {
-			const previousWareIndex = this.curWareIndex - 1;
-			this.dynamicChangeWare(previousWareIndex, 'BACK');
+	  if (this.curImageIndex == 0 && hasPreviousWare) {
+			// const previousWareIndex = this.curWareIndex - 1;
+			// this.dynamicChangeWare(previousWareIndex, 'BACK');
+			return;
 		//当前图片是该图片课件的第一张图片,且前边没有课件,则给出提示
 		} else if (this.curImageIndex === 0 && !hasPreviousWare) {
-			TVUtil.Toast.show('已经是第一个课件了', 2000);
+			// TVUtil.Toast.show('已经是第一个课件了', 2000);
+			return;
 		//当前图片不是该图片课件的第一张图片
 		} else {
 			this.curImageIndex -= 1;
 			this.renderImageView();
+			if (this.curImageIndex === 0) {
+				document.getElementById('imgLeft').style.display = 'none';
+			}
+			if (this.curImageIndex === this.curImageList.length - 2) {
+				document.getElementById('imgRight').style.display = 'block';
+			}
 		}
 	}
 
 	onCreate(data) {
-	    this.wareList = data.wareList;
-	    this.curWareIndex = data.curWareIndex;
-	    if (data.curImageList) {
+    this.wareList = data.wareList;
+    this.curWareIndex = data.curWareIndex;
+    if (data.curImageList) {
 			this.curImageList = data.curImageList;
-	    }
-	    if (data.curImageIndex) {
+    }
+    if (data.curImageIndex) {
 			this.curImageIndex = data.curImageIndex;
-	    }
-	    this.curWareType = this.wareList[this.curWareIndex].type;
+    }
+    this.curWareType = this.wareList[this.curWareIndex].type;
 		this.setContentView(require('../../../res/tpl/ImageWareFullScreen.tpl'), {}, 'ImageWareFullScreen', {}, () => {
 			this.renderImageView();
+			document.getElementById('imgLeft').style.display = 'none';
+			if (this.curImageList.length === 1) {
+				document.getElementById('imgRight').style.display = 'none';
+			}
 		});
 	}
 
@@ -127,15 +147,15 @@ class ImageWareFullScreenScene extends scene {
 	}
 
 	onOK(e) {
-        // 后退
-        if (e.target.con.classList.contains('goback')) {
+    // 后退
+    if (e.target.con.classList.contains('goback')) {
 			this.hideScene({
 				curWareIndex: this.curWareIndex,
 				curImageList: this.curImageList,
 				curImageIndex: this.curImageIndex,
 			}, 'LessonScene');
-            return;
-        }
+      return;
+    }
 		if (e.target.id === 'imgLeft') {
 			this.keyLeftHandler();
 		} else if (e.target.id === 'imgRight') {

+ 60 - 95
src/stage/index/scene/LessonScene.js

@@ -1,7 +1,7 @@
 import APIClient from '../../../util/API/APIClient';
 import Consts from '../../../util/Consts';
 import Utils from '../../../util/Utils';
-import HlsVideoPlugin from '../../../util/HlsVideoPlugin';
+import EfunVideoPlayer from '../../../util/EfunVideoPlayer';
 import {CommandBus, CMD_TYPE} from '../../../util/CommandBus';
 
 function matchWare(wareList, wareId) {
@@ -148,14 +148,17 @@ class LessonScene extends scene {
     			if (list && list.length >= 1) {
     				playUrl = Utils.videoUrlFormat(list[0].url);
     			}
+          /*
     			let videoViewDom =
-                `
-                  <div id="view-full-screen" fe-role="Widget" class="view-full-screen-video">
-                  </div>
-                  <div id="view-video-start" fe-role="Widget">
-                    <div class="transparent-btn">暂停</div>
-                  </div>
-                `;
+            `
+              <div id="view-full-screen" fe-role="Widget" class="view-full-screen-video">
+              </div>
+              <div id="view-video-start" fe-role="Widget">
+                <div class="transparent-btn">播放</div>
+              </div>
+            `;
+          */
+          let videoViewDom = '';
     			document.getElementById('view-bottom').innerHTML = videoViewDom;
     			this.moye.root.reRender();
     			this.renderVideoView(title, playUrl, type);
@@ -165,12 +168,12 @@ class LessonScene extends scene {
     			`
     				<div id="view-full-screen" fe-role="Widget" class="view-full-screen-img"></div>
     				<div id="view-previous" fe-role="Widget">
-                        <div class="transparent-btn">上一页</div>
-                    </div>
+              <div class="transparent-btn">上一页</div>
+            </div>
     				<div id="view-page">1/1</div>
-                        <div id="view-next" fe-role="Widget">
-                        <div class="transparent-btn">下一页</div>
-                    </div>
+              <div id="view-next" fe-role="Widget">
+              <div class="transparent-btn">下一页</div>
+            </div>
     			`;
     			document.getElementById('view-bottom').innerHTML = imageViewDom;
     			this.moye.root.reRender();
@@ -273,25 +276,25 @@ class LessonScene extends scene {
     * 渲染视频视图
     */
     renderVideoView(name, url, type) {
-        if (window.efunbox) {
-            window.efunbox.initAndroidPlayer(
-            	name,
-            	url,
-            	1, //与android里的音视频类型定义有关,这里写死为type=1
-            	this.videoPosition.top,
-            	this.videoPosition.left,
-            	this.videoPosition.width,
-            	this.videoPosition.height,
-            	false
-            );
-            window.efunbox.start();
-            this.videoPlayer = window.efunbox;
-        } else {
-            const videoDom = `<video id="hls-video" controls autoplay>你的浏览器不支持视频播放</video>`;
-            document.getElementById('view-content').innerHTML = videoDom;
-            this.videoPlayer = new HlsVideoPlugin();
-            this.videoPlayer.initH5Player(url, 'hls-video');
-        }
+      if (window.efunbox) {
+          window.efunbox.initAndroidPlayer(
+          	name,
+          	url,
+          	1, //与android里的音视频类型定义有关,这里写死为type=1
+          	this.videoPosition.top,
+          	this.videoPosition.left,
+          	this.videoPosition.width,
+          	this.videoPosition.height,
+          	false
+          );
+          window.efunbox.start();
+          this.videoPlayer = window.efunbox;
+      } else {
+          const videoDom = `<div id="hls-video"></div>`;
+          document.getElementById('view-content').innerHTML = videoDom;
+          this.videoPlayer = new EfunVideoPlayer();
+          this.videoPlayer.initPlayer(url, 'hls-video');
+      }
     	// 监控到初始化视频成功后暂停画面
     	this.timer = window.setInterval(() => {
     		if (this.videoPlayer.playStatus()) {
@@ -314,29 +317,31 @@ class LessonScene extends scene {
     			if (list && list.length >= 1) {
     				playUrl = Utils.videoUrlFormat(list[0].url);
     			}
-                let playText = '播放';
-                if (this.videoPlayer && this.videoPlayer.playStatus()) {
-                    playText = '暂停';
-                }
+          /*
+          let playText = '播放';
+          if (this.videoPlayer && this.videoPlayer.playStatus()) {
+              playText = '暂停';
+          }
     			let videoViewDom =
-                `
-                  <div id="view-full-screen" fe-role="Widget" class="view-full-screen-video">
-                  </div>
-                  <div id="view-video-start" fe-role="Widget">
-                    <div class="transparent-btn">${playText}</div>
-                  </div>
-                `;
-    			document.getElementById('view-bottom').innerHTML = videoViewDom;
+            `
+              <div id="view-full-screen" fe-role="Widget" class="view-full-screen-video">
+              </div>
+              <div id="view-video-start" fe-role="Widget">
+                <div class="transparent-btn">${playText}</div>
+              </div>
+            `;
+          */
+    			document.getElementById('view-bottom').innerHTML = '';
     			this.moye.root.reRender();
-                //如果是H5播放器,则重新创建video标签
-                if (window.efunbox) {
-                    window.efunbox.customScreen(270, 790, 1072, 603);
-                } else {
-                    const videoDom = `<video id="hls-video" controls>你的浏览器不支持视频播放</video>`;
-                    document.getElementById('view-content').innerHTML = videoDom;
-                    this.videoPlayer = new HlsVideoPlugin();
-                    this.videoPlayer.initH5Player(playUrl, 'hls-video');
-                }
+          //如果是H5播放器,则重新创建video标签
+          if (window.efunbox) {
+              window.efunbox.customScreen(270, 790, 1072, 603);
+          } else {
+            const videoDom = `<div id="hls-video"></div>`;
+            document.getElementById('view-content').innerHTML = videoDom;
+            this.videoPlayer = new EfunVideoPlayer();
+            this.videoPlayer.initPlayer(playUrl, 'hls-video');
+          }
     			break;
     		case Consts.TYPE_IMAGE:
     			let imageViewDom =
@@ -354,24 +359,8 @@ class LessonScene extends scene {
     			this.moye.root.reRender();
     			this.renderImageView();
     			break;
-    		case Consts.TYPE_AUDIOBOOK:
-    			let audioViewDom =
-    			`
-    				<div id="view-full-screen" fe-role="Widget" class="view-full-screen-img"></div>
-    				<div id="view-previous" fe-role="Widget">
-                        <div class="transparent-btn">上一页</div>
-                    </div>
-    				<div id="view-page">1/1</div>
-    				<div id="view-next" fe-role="Widget">
-                        <div class="transparent-btn">下一页</div>
-                    </div>
-    			`;
-    			document.getElementById('view-bottom').innerHTML = audioViewDom;
-    			this.moye.root.reRender();
-    			this.renderAudioView();
-    			break;
-            default:
-                break;
+        default:
+          break;
     	}
     }
 
@@ -519,35 +508,11 @@ class LessonScene extends scene {
                         video.webkitEnterFullScreen();
                         // document.getElementById('view-content').removeChild(video);
                     }
-//<<<<<<< HEAD
                     // this.showScene(require('./VideoWareFullScreenScene.js'), {
                     //     isFull: true,
                     //     wareList: this.wareList,
                     //     curWareIndex: this.curWareIndex,
                     // });
-//=======
-                    this.showScene(require('./VideoWareFullScreenScene.js'), {
-                        isFull: true,
-                        wareList: this.wareList,
-                        curWareIndex: this.curWareIndex,
-                    });
-                } else if (this.curWareType === Consts.TYPE_AUDIOBOOK) {
-                    // 全屏前移除audio标签
-                    let audio = document.getElementById('courseware-audio');
-                    let controls = document.querySelector('.audio-controls');
-                    if (audio) {
-                        document.getElementById('view-content').removeChild(audio);
-                    }
-                    if (controls) {
-                        document.getElementById('view-content').removeChild(controls);
-                    }
-                    this.showScene(require('./AudioWareFullScreenScene.js'), {
-            			wareList: this.wareList,
-            			curWareIndex: this.curWareIndex,
-            			curAudioList: this.curAudioList,
-            			curAudioIndex: this.curAudioIndex,
-                    });
-//>>>>>>> d5e875c37ec87209fd4b2af78511367bc689d7f4
                 }
     			this.postPlayRecord(this.cur_item_id, this.courseId);
     			break;

+ 2 - 2
src/stage/index/style/ImageWareFullScreen.less

@@ -23,7 +23,7 @@
 		height: 100%;
 	}
 	&.fe-focus {
-		border: solid unit(@borderSize, rem) #ffe100;
+		// border: solid unit(@borderSize, rem) #ffe100;
 	}
 }
 #imgRight {
@@ -40,6 +40,6 @@
 		height: 100%;
 	}
 	&.fe-focus {
-		border: solid unit(@borderSize, rem) #ffe100;
+		// border: solid unit(@borderSize, rem) #ffe100;
 	}
 }

+ 4 - 4
src/stage/index/style/IndexScene.less

@@ -46,10 +46,10 @@
 	}
 }
 
-
 #IndexScene {
 	position: absolute;
-	width: 100%;
+	width: unit(@designWidth, rem);
+	height: unit(@designHeight, rem);
 	padding: 0.05rem 1.2rem .5rem;
 	background-image: url('assets/img/IndexScene/background.png');
 	background-size: cover;
@@ -107,13 +107,13 @@
 	}
 	.m-main {
 		width: 100%;
-		height: 7.6rem;
+		height: 7.8rem;
 		margin-top: 0.3rem;
 		padding: .2rem 0rem 0rem 0rem;
 		overflow-y: hidden;
 		.scroll-list {
 			width: 100%;
-			padding-bottom: 0.5rem;
+			padding-bottom: 0.3rem;
 
 			.history-wrapper {
 				font-size: 0;

+ 5 - 5
src/stage/index/style/LessonScene.less

@@ -97,7 +97,7 @@
 		top: 1.6rem;
 		left: 7.9rem;
 		width: 10.72rem;
-		height: 8.15rem;
+		height: 8.03rem;
 		background-color: #2b63e2;
 
 		#view-top {
@@ -120,7 +120,7 @@
 				width: 100%;
 				height: 100%;
 			}
-			video {
+			#hls-video {
 				width: 100%;
 				height: 100%;
 			}
@@ -178,7 +178,7 @@
 			left: 0rem;
 			top: 7.03rem;
 			width: 10.72rem;
-			height: 1.12rem;
+			height: 1rem;
 
 			.view-text-ctl-btn{
 				position: absolute;
@@ -219,7 +219,7 @@
 				position: absolute;
 				left: 5.88rem;
 				//left: 4.82rem;
-				top: 0.2rem;
+				top: 0.15rem;
 				width: 1.4rem;
 				//height: 0.65rem;
 				//line-height: 0.65rem;
@@ -267,7 +267,7 @@
 			}
 
 			.view-full-screen-video {
-        		position: absolute;
+        position: absolute;
 				left:1.53rem;
 				top: 0.2rem;
 				width: 2.2rem;

+ 2 - 2
src/stage/index/style/TerminalScene.less

@@ -55,11 +55,11 @@
 			background-color: #1b79ca;
 			border-radius: .5rem;
 			text-align: center;
-			line-height: .55rem;
+			line-height: .65rem;
 			color: #FFF;
 			font-size: .38rem;
 			&.fe-focus {
-				.after-focus(@borderSize; #ffe100);
+				//.after-focus(@borderSize; #ffe100);
 			}
 		}
 		.terminal-remind {

+ 0 - 1
src/util/API/AJAXHelper.js

@@ -64,7 +64,6 @@ class AJAXHelper {
 		xmlHttpReq.setRequestHeader('terminal', platform);
 		xmlHttpReq.setRequestHeader('merchant', 'weichuang');
 		xmlHttpReq.setRequestHeader('requestId', requestId);
-		xmlHttpReq.setRequestHeader('merchant', 'baby');
 		xmlHttpReq.setRequestHeader('Authentication', sign); //header中增加Authentication以兼容老版本
 		xmlHttpReq.setRequestHeader('Content-Type', 'application/' + (method == 'POST' || method == 'PUT' ? 'json' : 'text'));
 		//构造请求体

+ 58 - 0
src/util/EfunVideoPlayer.js

@@ -0,0 +1,58 @@
+class EfunVideoPlayer {
+  constructor() {
+    this.efunplayer = null;
+    this.metadata = null;
+  }
+
+  loadedHandler() {
+    this.efunplayer.addListener('loadedmetadata', () => {
+      this.metadata = this.efunplayer.getMetaDate();
+    });
+  }
+
+  initPlayer(url, domId) {
+    let videoObject = {
+      autoplay: true,
+      container: `#${domId}`,
+      variable: 'player',
+      video: url,
+    };
+    if (Hls.isSupported()) {
+      videoObject.html5m3u8 = true;
+    } else {
+      videoObject.flashplayer = true;
+    }
+    this.efunplayer = new ckplayer(videoObject);
+  }
+
+  playStatus() {
+    return (this.metadata || {})['paused'];
+  }
+
+  pause() {
+    console.log('click pause btn...');
+    this.efunplayer.videoPause();
+  }
+
+  start() {
+    this.efunplayer.videoPlay();
+  }
+
+  fullScreen() {
+    this.efunplayer.webkitRequestFullScreen();
+  }
+
+  getCurtime() {
+    return this.efunplayer.currentTime * 1000;
+  }
+
+  getDuration() {
+    return this.efunplayer.duration * 1000;
+  }
+
+  seekProgress(currentTime) {
+    this.efunplayer.videoSeek(currentTime);
+  }
+}
+
+module.exports = EfunVideoPlayer;

+ 1 - 1
src/util/Utils.js

@@ -201,7 +201,7 @@ class Utils {
         if (url.startsWith('http')) {
             return url.replace('http://ljvideo.ai160.com', Consts.VIDEO_PATH);
         } else if (url.startsWith('https')) {
-            return url;
+            return url.replace('https', 'http');
         } else {
             return url;
         }