player

public/react/package.json

@@ -72,6 +72,7 @@
     "react-infinite-scroller": "^1.2.4",
     "react-loadable": "^5.3.1",
     "react-monaco-editor": "^0.25.1",
+    "react-player": "^1.11.1",
     "react-redux": "5.0.7",
     "react-router": "^4.2.0",
     "react-router-dom": "^4.2.2",

public/react/src/common/components/media/Clappr.js

@@ -1,5 +1,6 @@
 import React,{ Component } from "react";
 import { getUrl2 } from "educoder";
+import ReactPlayer from 'react-player'
 
 const $ = window.$
 let _url_origin = getUrl2()
@@ -15,9 +16,15 @@ class Clappr extends Component{
   }
   
   componentDidMount() {
+
+
+    
     const source = this.props.source || "http://your.video/here.mp4"
     const { id, type } = this.props
     const _id = `#_player${id}`
+
+
+    return;
     if (!window['Clappr'] && window['ClapprLoading'] == true) {
       setTimeout(() => {
         this.componentDidMount()
@@ -84,12 +91,13 @@ class Clappr extends Component{
     const _id = `_player${id}`
     return(
       <React.Fragment>
-        <style>{`
+        <ReactPlayer url={source} playing={false} controls={true} width={400} height={ type == 'mp3' ? 55 : 290}/>
+        {/* <style>{`
             .playback_rate {
                 margin-right: 16px;
             }
         `}</style>
-        <div id={_id} className={className + ' ' + type}></div>
+        <div id={_id} className={className + ' ' + type}></div> */}
       </React.Fragment>
     )
   }

public/react/src/context/EffectDisplayContent.js

@@ -18,7 +18,7 @@ class EffectDisplayContent extends Component {
                     .effectDisplay .content>div {
                         flex: 1
                     }
-                    .effectDisplay .clappr {
+                    .effectDisplay .clappr, .effectDisplay .contentWrap {
                         display: flex;
                         justify-content: center;
                     }
@@ -32,13 +32,13 @@ class EffectDisplayContent extends Component {
                     {content3 && <p className="content_title edu-txt-center fl font-18  mr03precent">预期输出{typeName}</p>}
                 </div>
                 <div className="clearfix df content" >
-                    {content1 && <div className="fl  mr03precent pt10 mb50">
+                    {content1 && <div className="fl  mr03precent pt10 mb50 contentWrap">
                         {content1}
                     </div>}
-                    {content2 && <div className="fl  mr03precent pt10 mb50">
+                    {content2 && <div className="fl  mr03precent pt10 mb50 contentWrap">
                         {content2}
                     </div>}
-                    {content3 && <div className="fl  mr03precent pt10 mb50">
+                    {content3 && <div className="fl  mr03precent pt10 mb50 contentWrap">
                         {content3}
                     </div>}
                 </div>

public/react/src/modules/page/MainContentContainer.js

@@ -368,17 +368,20 @@ class MainContentContainer extends Component {
 	}
 
 	componentDidMount() {
-
+		// if (this.binded == true) {
-
+		// 	return;
-		window.$(window.documents).bind("submitChoose",function(){
+		// } else {
-
+		// 	this.binded = true
-		    alert("hello world!");
+		// 	window.$(window).unload( ()=>{
-
+		// 		alert(111)
-		});
+		// 		var fileUpdatePromise = this.doFileUpdateRequest(true)
-
+		// 	});
-
+		// }
-
+	}
+	componentWillUnmount() {
+		// window.$(window).off( "unload" )
 	}
+	
 
 	doFileUpdateRequestOnCodeMirrorBlur = () => {
 		var fileUpdatePromise = this.doFileUpdateRequest(true)