function play_v1(video){
video.muted=false;
}
(function(){
var config={
site_domain:'http://xiuke.com/',
videoOther:'http://video.xiuke.258jituan.com/flash/b/65.flv', //url
videoPhone:'http://video.xiuke.258jituan.com/flash/b/65sj.mp4', //url2
videoCanvas:'http://video.xiuke.258jituan.com/flash/b/65kt.mp4', //url3
videoWebm:'http://video.xiuke.258jituan.com/flash/b/65.webm', //url4
width:'292',
height:'460',
position:'top',
rand:'99466575', //随机数
is_follow:'0', //是否跟随页面滚动
videoImg:'http://video.xiuke.258jituan.com/flash/b/65sj.jpg', //封面图
playNum: '3', //播放次数
leftRigth:'-305', //左右边距
topBottom:'110' //上下边距
};
config.positionType=config.is_follow=='0'?'absolute':'fixed';
config.leftRigth=parseInt(config.leftRigth);
config.topBottom=parseInt(config.topBottom);
config.width=parseInt(config.width);
config.height=parseInt(config.height);
config.playNum=parseInt(config.playNum);
var rand='?v='+config.rand;
config.videoOther+=rand;
config.videoPhone+=rand;
config.videoCanvas+=rand;
config.videoWebm+=rand;
var swfHeight=false;
var videoType=myBrowser();
var displayWebm="block",
displayCanvas="none",
autoPlay="autoplay muted";
width=config.width;
height=config.height;
if(document.documentElement.clientWidth<640){
width/=2;
height/=2;
}
var htmlStr='';
//videoType="swf";
if(videoType=='webm'){
videoUrl=config.videoWebm;
videoType='webm';
htmlStr='\
\
\
\
\
\
\
\
\
'
}
else if(videoType=='canvas'){
videoUrl=config.videoCanvas;
displayWebm="none";
displayCanvas="block";
htmlStr='\
\
\
\
\
\
\
\
\
\
\
'
}
else if(videoType=='mp4'){
videoUrl=config.videoPhone;
autoPlay="";
displayWebm="block";
displayCanvas="none";
htmlStr='\
\
'
}
else{
videoUrl=config.videoOther;
swfHeight=config.height+(config.width/config.height)*48*2;
htmlStr='\
\
\
'
}
var positionStyle,
leftCenter=document.documentElement.clientWidth/2-config.width/2,
topCenter=(document.documentElement.clientHeight/2-config.height/2-20);
leftCenter+=config.leftRigth;
topCenter+=config.topBottom;
var chazhi=0;
if(document.documentElement.clientWidth<640){
chazhi=56;
chazhi=0;
}
switch(config.position){
case 'lb':
positionStyle='left:'+config.leftRigth+'px;bottom:'+(config.topBottom+chazhi)+'px;';
break;
case 'lt':
positionStyle='left:'+config.leftRigth+'px;top:'+config.topBottom+'px;';
break;
case 'rb':
positionStyle='right:'+(-config.leftRigth)+'px;bottom:'+(-config.topBottom+chazhi)+'px;';
break;
case 'rt':
positionStyle='right:'+(-config.leftRigth)+'px;top:'+config.topBottom+'px;';
break;
case 'top':
positionStyle='left:'+leftCenter+'px;top:'+config.topBottom+'px;';
break;
case 'bottom':
positionStyle='left:'+leftCenter+'px;bottom:'+(-config.topBottom+chazhi)+'px;';
break;
case 'center':
positionStyle='left:'+leftCenter+'px;top:'+topCenter+'px;';
break;
}
var swfWh=videoType=='swf'?('width:'+config.width+'px;height:'+(swfHeight?swfHeight:(config.height+32))+'px'):'';
var html='\
\
\
'+htmlStr+'
\
';
var dom_html=document.createElement('div');
dom_html.innerHTML=html;
document.getElementsByTagName("body")[0].appendChild(dom_html);
var video = document.getElementById("videoBottom"),
outputCanvas = document.getElementById('output'),
output,
bufferCanvas = document.getElementById('buffer'),
buffer,
widthV,
heightV,
interval;
if(videoType=='canvas'){
buffer = bufferCanvas.getContext('2d');
output = outputCanvas.getContext('2d');
widthV = outputCanvas.width;
heightV = outputCanvas.height;
}
function processFrame() {
buffer.drawImage(video, 0, 0);
var image = buffer.getImageData(0, 0, widthV, heightV);
var imageData = image.data;
alphaData = buffer.getImageData(0, heightV, widthV, heightV).data;
for (var i = 3, len = imageData.length; i < len; i = i + 4) {
imageData[i] = alphaData[i-1];
}
output.putImageData(image, 0, 0, 0, 0, widthV, heightV);
}
if(videoType!='swf'){
var videoStart=document.getElementById('videoStart'),
videoStop=document.getElementById('videoStop'),
videoVoiceEsc=document.getElementById('videoVoiceEsc'),
videoVoiceOpen=document.getElementById('videoVoiceOpen');
video.addEventListener('play', function() {
clearInterval(interval);
if(videoType=='canvas')interval = setInterval(processFrame, 70);
try{
videoStart.style.display="none";
videoStop.style.display="block";
}catch(e){}
if(config.playNum<=0&&videoType!="mp4"){
videoStop.click();
}
else{
config.playNum--;
}
event.preventDefault();
}, false);
video.addEventListener('ended', function() {
videoVoiceEsc.click();
clearInterval(interval);
if(config.playNum>0){
video.play();
}
else{
videoStop.click();
}
}, false);
if(videoType!='mp4'){
videoStop.addEventListener('click', function(event) {
video.pause();
videoStart.style.display="block";
videoStop.style.display="none";
event.preventDefault();
}, false);
videoVoiceEsc.addEventListener('click',function(){
video.volume=0;
videoVoiceOpen.style.display="block";
videoVoiceEsc.style.display="none";
video.muted=false;
});
videoVoiceOpen.addEventListener('click',function(){
video.volume=1;
videoVoiceOpen.style.display="none";
videoVoiceEsc.style.display="block";
video.muted=false;
});
videoStart.addEventListener('click', function(event) {
config.playNum++;
video.play();
event.preventDefault();
}, false);
}
else{
videoStart.addEventListener('click', function(event) {
video.play();
document.getElementById('videoMp4Bg').remove();
}, false);
}
document.getElementById('videoEsc').addEventListener('click',function(event){
document.getElementById('videoCon').remove();
});
}
else{
var swfEsc=document.getElementById('swfEsc');
if(swfEsc.addEventListener){
swfEsc.addEventListener('click',function(){
escVideoXiuke();
});
}
else{
swfEsc.attachEvent('onclick',function(){
escVideoXiuke();
});
}
}
var dh={};
dh.dom=document.getElementById('videoCon');
dh.domUp=document;
/*事件添加统一调用函数*/
dh.xy=function(e){//获取xy坐标
var x = e.pageX;//dh.sf为画布缩放比例(重要)
var y =e.pageY;
if(!x){
x=event.clientX;
y=event.clientY;
}
//var x = e.layerX/dh.sf;
//var y = e.layerY/dh.sf;
return {x:x,y:y};
}
var funXy=function(e,fun){
var xy=dh.xy(e);
var x=xy.x,
y=xy.y;
var ret=0;
try{
ret=fun(x,y,e);
}
catch(e){}
return ret;
}
dh.down=function(fun,dom){
dom=dom?dom:dh.dom;
dh.down.fun=function(e){
if(e.targetTouches){
e=e.targetTouches[0];
}
if(funXy(e,fun)!==false)dh.down.isGo=true;
};
if(dom.addEventListener){
dom.addEventListener('touchstart',dh.down.fun);
dom.addEventListener('mousedown',dh.down.fun);
}
else{
dom.attachEvent('onmousedown',dh.down.fun);
}
}
dh.move=function(fun,downGo,dom){
dom=dom?dom:dh.dom;
dh.move.fun=function(e){
e.preventDefault&&e.preventDefault();
if(e.targetTouches){
e=e.targetTouches[0];
}
if(downGo){
dh.down.isGo&&funXy(e,fun);
}
else{
funXy(e,fun);
}
};
if(dom.addEventListener){
dom.addEventListener('touchmove',dh.move.fun);
dom.addEventListener('mousemove',dh.move.fun);
}
else{
dom.attachEvent('onmousemove',dh.move.fun);
}
};
dh.up=function(fun,dom){
dom=dom?dom:dh.dom;
dh.up.fun=function(e){
dh.down.isGo=false;
funXy(e,fun);
};
if(dom.addEventListener){
dom.addEventListener('touchend',dh.up.fun);
dom.addEventListener('mouseup',dh.up.fun);
}
else{
dom.attachEvent('onmouseup',dh.up.fun);
}
}
dh.down(function(x,y){
dh.leftGo=x;
dh.topGo=y;
dh.leftPx=dh.dom.offsetLeft;
dh.topPx=dh.dom.offsetTop;
try{
dh.dom.style.right='initial';
dh.dom.style.bottom='initial';
}catch(e){}
dh.dom.style.left=dh.leftPx+'px';
dh.dom.style.top=dh.topPx+'px';
dh.dom.style.transition="none";
maxHeight=document.body.scrollHeight;
});
dh.move(function(x,y,e){
var xm=x-dh.leftGo;
var ym=y-dh.topGo;
dh.dom.style.left=(xm+dh.leftPx)+'px';
dh.dom.style.top=(ym+dh.topPx)+'px';
},true);
var maxHeight=document.body.scrollHeight;
dh.up(function(x,y,e){
var maxw=document.documentElement.clientWidth,
maxh=document.documentElement.clientHeight;
if(config.is_follow=='0'){
maxh=maxHeight;
}
var t=dh.dom.offsetTop,
l=dh.dom.offsetLeft;
var w=dh.dom.clientWidth,
h=dh.dom.clientHeight;
dh.dom.style.transition="all 0.3s";
if(t<0){
dh.dom.style.top='0px';
}
else if((t+h)>maxh){
dh.dom.style.top=(maxh-h)+'px';
}
if(l<0){
dh.dom.style.left='0px';
}
else if((l+w)>maxw){
dh.dom.style.left=(maxw-w)+'px';
}
},dh.domUp);
function myBrowser(){
//return "webm";
var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串
if (document.documentElement.clientWidth<640) {
return 'mp4';
}
else if (userAgent.indexOf("Edge") > -1) {
return "canvas";
}
else if (userAgent.indexOf("Chrome") > -1) {
return "webm";
}
else if(userAgent.indexOf("Safari") > -1){
return "canvas";
}
else if (userAgent.indexOf("Firefox") > -1) {
return "webm";
}
else{
return "swf";
}
}
window.escVideoXiuke=function(){
var con=document.getElementById('videoCon');
con.style.display='none';
con.innerHTML='';
}
var mouse=function(){
document.getElementById('videoBottom').play();
document.getElementsByTagName('body')[0].removeEventListener('mousedown',mouse);
}
setTimeout(function(){
document.getElementsByTagName('body')[0].addEventListener('mousedown',mouse);
},2000);
})();