commentBox.js 10 KB

1234567891011
  1. (global["webpackJsonp"]=global["webpackJsonp"]||[]).push([["pages_course/components/commentBox"],{773:function(t,e,n){"use strict";n.r(e);var s=n(774),i=n(776);for(var o in i)["default"].indexOf(o)<0&&function(t){n.d(e,t,(function(){return i[t]}))}(o);n(778);var r,u=n(34),a=Object(u["default"])(i["default"],s["render"],s["staticRenderFns"],!1,null,"64343b3a",null,!1,s["components"],r);a.options.__file="pages_course/components/commentBox.vue",e["default"]=a.exports},774:function(t,e,n){"use strict";n.r(e);var s=n(775);n.d(e,"render",(function(){return s["render"]})),n.d(e,"staticRenderFns",(function(){return s["staticRenderFns"]})),n.d(e,"recyclableRender",(function(){return s["recyclableRender"]})),n.d(e,"components",(function(){return s["components"]}))},775:function(t,e,n){"use strict";var s;n.r(e),n.d(e,"render",(function(){return i})),n.d(e,"staticRenderFns",(function(){return r})),n.d(e,"recyclableRender",(function(){return o})),n.d(e,"components",(function(){return s}));var i=function(){var t=this,e=t.$createElement,n=(t._self._c,1==t.openCommentStatus?t.msgs&&0==t.msgs.length:null);t.$mp.data=Object.assign({},{$root:{g0:n}})},o=!1,r=[];i._withStripped=!0},776:function(t,e,n){"use strict";n.r(e);var s=n(777),i=n.n(s);for(var o in s)["default"].indexOf(o)<0&&function(t){n.d(e,t,(function(){return s[t]}))}(o);e["default"]=i.a},777:function(t,e,n){"use strict";(function(t){var s=n(4);Object.defineProperty(e,"__esModule",{value:!0}),e.default=void 0;var i=s(n(18)),o=n(468),r={props:{height:{type:String,default:"0px"},urlOption:{type:Object,default:{}},time:{type:[String,Number],default:0},viewCommentNum:{type:[String,Number],default:200},openCommentStatus:{type:[String,Number],default:3},showDanmu:{type:[String,Number],default:1}},data:function(){return{statusBarHeight:t.getSystemInfoSync().statusBarHeight,scrollTop:0,inputText:"",isSocketOpen:!1,socket:null,isSend:!0,commentList:[],msgs:[],pageNum:1,pageSize:10,userInfo:{},userId:"",pingpangTimes:null,danmuList:[],tracks:[],activeDanmus:[],flagTime:0,danmuItemStyle:{color:"#ffffff",fontSize:"16px",border:"solid 1px #ffffff",borderRadius:"5px",padding:"2px 2px",backgroundColor:"rgba(255, 255, 255, 0.1)"},ctx:null,danmuIndex:{}}},mounted:function(){this.getCommentsFun(),this.getUser(),this.initTracks(),this.socket&&this.isSocketOpen||this.initSocket()},methods:{back:function(){t.navigateBack()},getUser:function(){var e=t.getStorageSync("userInfo");e&&"{}"!=JSON.stringify(e)?(this.userInfo=JSON.parse(e),this.userId=this.userInfo.userId||""):(this.userInfo={},this.userId="")},getCommentsFun:function(){var t=this,e=this;(0,o.getComments)({pageNum:2==this.openCommentStatus?1:this.pageNum,pageSize:2==this.openCommentStatus?this.viewCommentNum:this.pageSize,courseId:this.urlOption.courseId,videoId:this.urlOption.videoId,openCommentStatus:this.openCommentStatus}).then((function(n){if(200==n.code)if(2==t.openCommentStatus)t.danmuList=n.data.list.map((function(e){return{commentId:e.commentId,content:e.content,time:e.time||t.time,color:"#FFFFFF",mode:e.mode||"scroll",top:null,style:{color:1==e.isColor&&e.color||t.danmuItemStyle.color,fontSize:e.fontSize||t.danmuItemStyle.fontSize,padding:t.danmuItemStyle.padding,border:t.userInfo.userId==e.userId?e.color?"solid 1px ".concat(e.color):t.danmuItemStyle.border:"none",borderRadius:t.userInfo.userId==e.userId?t.danmuItemStyle.borderRadius:0,backgroundColor:t.userInfo.userId==e.userId?t.danmuItemStyle.backgroundColor:"transparent"}}})),t.initDanmuIndex(),e.$emit("getMore",0);else if(1==t.openCommentStatus){t.danmuList=[],t.activeDanmus=[],t.danmuIndex={};var s=n.data.list.reverse();1==e.pageNum?(e.commentList=s,e.handleScrollBottom()):e.commentList=e.commentList.concat(s),e.msgs=[].concat((0,i.default)(s),(0,i.default)(e.msgs)),e.commentList.length>=n.data.total||e.commentList.length>=Number(t.viewCommentNum||200)?e.$emit("getMore",1):(t.pageNum++,e.$emit("getMore",0))}else e.danmuList=[],e.activeDanmus=[],e.danmuIndex={},e.commentList=[],e.msgs=e.msgs,e.$emit("getMore",0);else e.danmuList=[],e.danmuIndex={},e.commentList=[],e.msgs=e.msgs,e.$emit("getMore",0)}))},saveMsg:function(){var e=this;if(""!=this.inputText&&""!=this.inputText.trim()){if(this.isSend){var n={userId:this.userId||"",userType:2,courseId:this.urlOption.courseId,videoId:this.urlOption.videoId,type:1,content:this.inputText,time:this.time,fontSize:"16px",mode:"scroll",color:"#ffffff"};(0,o.saveMsg)(n).then((function(s){if(200==s.code){var i=s.status?0:1;e.sendMsg(n,i)}else t.showToast({title:s.msg,icon:"none"})}))}}else t.showToast({title:"请输入评论",icon:"none"})},handleInput:function(t){this.inputText=t,this.isSocketOpen?this.saveMsg():this.initSocket("reStart")},handleScrollBottom:function(){var e=this;setTimeout((function(){var n=t.createSelectorQuery().in(e);n.select("#msglist").boundingClientRect((function(t){if(t){t.height;e.scrollTop=t.height,e.$emit("getScrollTop",e.scrollTop)}})).exec()}),500)},initSocket:function(e){var n=this,s=this.userInfo.userId,i=this;this.socket&&(this.socket.close(),this.socket=null),this.socket=t.connectSocket({url:this.$store.state.wsDanmuUrl+"/app/webSocket/"+s,multiple:!0,success:function(t){console.log("WebSocket连接已打开1!"),i.isSocketOpen=!0,i.pingpangTimes&&(clearInterval(i.pingpangTimes),i.pingpangTimes=null),i.pingpangTimes=setInterval((function(){var t={userId:i.userId||"",userType:2,courseId:i.urlOption.courseId,videoId:i.urlOption.videoId,type:1,cmd:"heartbeat"};i.socket.send({data:JSON.stringify(t),success:function(){},fail:function(){i.isSocketOpen=!1}})}),15e3)},error:function(t){console.log(t)}}),this.socket.onMessage((function(t){console.log("收到消息parse",JSON.parse(t.data));var e=JSON.parse(t.data);"heartbeat"==e.cmd||"sendMsg"==e.cmd&&(i.isSend=!0,i.addMsg(e))})),this.socket.onOpen((function(){console.log("WebSocket连接已打开2!"),i.isSocketOpen=!0,i.isSend=!0,"reStart"==e&&n.saveMsg()})),this.socket.onClose((function(){i.isSocketOpen=!1,i.socket=null,console.log("WebSocket连接已关闭!"),i.pingpangTimes&&(clearInterval(i.pingpangTimes),i.pingpangTimes=null)})),this.socket.onError((function(t){console.log("socket err:",t),i.isSocketOpen=!1,i.socket=null,i.pingpangTimes&&(clearInterval(i.pingpangTimes),i.pingpangTimes=null)}))},sendMsg:function(t,e){var n=this;if(1==e)return this.isSend=!0,void this.addMsg({msg:t.content,time:t.time},2);if(this.isSocketOpen){this.userInfo.userId;var s={userId:this.userId||"",userType:2,courseId:this.urlOption.courseId,videoId:this.urlOption.videoId,type:1,msg:t.content,cmd:"sendMsg",time:t.time,fontSize:"16px",mode:"scroll",color:"#ffffff"};this.socket.send({data:JSON.stringify(s),success:function(){console.log("发送成功"),n.isSend=!1},fail:function(){console.log("发送失败")}})}},addMsg:function(t,e){var n={};n=2==e?{content:t.msg,courseId:this.urlOption.courseId,type:1,userId:this.userId,userType:2,videoId:this.urlOption.videoId,nickName:"",time:t.time,fontSize:t.fontSize,mode:t.mode,color:t.color}:{content:t.msg,courseId:this.urlOption.courseId,type:t.type,userId:t.userId,userType:t.userType,videoId:this.urlOption.videoId,nickName:t.nickName,time:t.time,fontSize:t.fontSize,mode:t.mode,color:t.color},1==this.openCommentStatus?(this.msgs.push(n),this.handleScrollBottom()):2==this.openCommentStatus&&this.addDanmuMsg(n),this.inputText="",this.$emit("setInputText")},addDanmuMsg:function(t){var e=t.userId+"_"+(new Date).getTime(),n={color:t.color||this.danmuItemStyle.color,fontSize:t.fontSize||this.danmuItemStyle.fontSize,border:t.color?"solid 1px ".concat(t.color):this.danmuItemStyle.border,borderRadius:this.danmuItemStyle.borderRadius,padding:this.danmuItemStyle.padding,backgroundColor:this.danmuItemStyle.backgroundColor},s={color:t.color||this.danmuItemStyle.color,fontSize:t.fontSize||this.danmuItemStyle.fontSize,padding:this.danmuItemStyle.padding},i=(t.mode,{commentId:t.commentId||e,userId:t.userId,content:t.content,time:this.flagTime+1,color:t.color||this.danmuItemStyle.color,style:this.userInfo.userId==t.userId?n:s,top:null});if(0!=this.showDanmu){var o=1e4;this.danmuList.length>=o&&this.danmuList.shift(),this.danmuList.push(i),this.danmuIndex[i.time]||(this.danmuIndex[i.time]=[]),this.danmuIndex[i.time].push(i)}},closeWSocket:function(){null!=this.socket&&this.socket.close(),this.pingpangTimes&&(clearInterval(this.pingpangTimes),this.pingpangTimes=null)},initTracks:function(){this.tracks=[];for(var t=22,e=3,n=0;n<e;n++)this.tracks.push({top:n*t+10,isFree:!0,releaseTime:0})},getTextWidth:function(e){this.ctx||(this.ctx=t.createCanvasContext("myCanvas"));var n=this.ctx.measureText(e);return Math.ceil(n.width)},getFreeTrack:function(e){for(var n=t.getSystemInfoSync().screenWidth,s=this.getTextWidth(e.content),i=s+n,o=8,r=Date.now(),u=0;u<this.tracks.length;u++)if(this.tracks[u].isFree||this.tracks[u].releaseTime<=r)return this.tracks[u].isFree=!1,this.tracks[u].releaseTime=r+Math.ceil(1e3*o/i*s)+1e3,this.tracks[u].top;if(this.userInfo.userId&&e.userId==this.userInfo.userId){var a=this.tracks[this.tracks.length-1].top;return Math.random()*a+16}return"abandon"},initDanmuIndex:function(){var t=this;this.danmuIndex={},this.danmuList.forEach((function(e){t.danmuIndex[e.time]||(t.danmuIndex[e.time]=[]),t.danmuIndex[e.time].push(e)}))},checkDanmu:function(t){var e=this;if(this.flagTime=t,0!=this.showDanmu){var n=this.danmuList.filter((function(t){return Math.abs(t.time-e.flagTime)<1})),s=n.map((function(t){return t.top||(t.top=e.getFreeTrack(t)),t})).filter((function(t){return"abandon"!==t.top}));this.activeDanmus=[].concat((0,i.default)(this.activeDanmus),(0,i.default)(s)),this.$emit("getActiveDanmus",this.activeDanmus)}},animationend:function(t,e){this.activeDanmus=this.activeDanmus.filter((function(e){return e.commentId!==t.commentId})),this.$emit("getActiveDanmus",this.activeDanmus)}},beforeDestroy:function(){null!=this.socket&&this.socket.close(),this.pingpangTimes&&(clearInterval(this.pingpangTimes),this.pingpangTimes=null)}};e.default=r}).call(this,n(2)["default"])},778:function(t,e,n){"use strict";n.r(e);var s=n(779),i=n.n(s);for(var o in s)["default"].indexOf(o)<0&&function(t){n.d(e,t,(function(){return s[t]}))}(o);e["default"]=i.a},779:function(t,e,n){}}]);
  2. //# sourceMappingURL=../../../.sourcemap/mp-weixin/pages_course/components/commentBox.js.map
  3. ;(global["webpackJsonp"] = global["webpackJsonp"] || []).push([
  4. 'pages_course/components/commentBox-create-component',
  5. {
  6. 'pages_course/components/commentBox-create-component':(function(module, exports, __webpack_require__){
  7. __webpack_require__('2')['createComponent'](__webpack_require__(773))
  8. })
  9. },
  10. [['pages_course/components/commentBox-create-component']]
  11. ]);