Greasy Fork

Greasy Fork is available in English.

Yandex视频横屏插件

移动端Yandex浏览器看视频全屏时强制为横屏观看(安卓已经过测试运行,ios并未测试)

当前为 2019-08-24 提交的版本,查看 最新版本

// ==UserScript==
// @name           Yandex视频横屏插件
// @name:en        Yandex Video Player Horizontal Screen Plug-in
// @description    移动端Yandex浏览器看视频全屏时强制为横屏观看(安卓已经过测试运行,ios并未测试)
// @description:en Yandex browser is set to play horizontally when viewing full-screen video. This is for Android, and IOS is not tested.
// @version        2.1.0
// @author         L.Xavier
// @namespace      http://greasyfork.icu/zh-CN/users/128493
// @match          *://*/*
// @grant          none
// @run-at         document-end
// @note           功能说明:1.全屏下强制为横屏观看,支持重力感应切换方向(需要设备支持)。2.添加双击全屏功能。一些网站全屏按钮无法使视频进入全屏模式(例如m.bilibili.com),新增在视频播放状态下,双击全屏(支持双击退出全屏)。该功能需要关闭yandex浏览器的"忽略网站的禁止字体缩放请求"功能,不关闭双击会缩放网页。3.竖屏模式。有些视频更适宜在竖屏状态下观看,新增摇一摇切换竖屏,再次摇一摇换回横屏(需要设备支持)。
// @v1.1.0        2019-01-01 - 1.添加竖屏模式。有些视频更适宜在竖屏状态下观看,全屏状态下,手机竖直摆放时会重新回到竖屏模式。2.添加双击全屏功能。一些网站全屏按钮无法使视频进入全屏模式(例如m.bilibili.com),新增在视频播放状态下,双击全屏(支持双击退出全屏)。该功能需要关闭yandex浏览器的"忽略网站的禁止字体缩放请求"功能,不关闭双击会缩放网页。
// @v1.1.1        2019-01-02 - 优化了代码逻辑
// @v1.1.2        2019-01-12 - Yandex浏览器版本18.11.1(安卓自2018年12月26日,版本号979),切换竖屏会退出全屏状态,暂时取消竖屏模式,其他保持不变。不是该版本浏览器,有竖屏观看需要的可以安装本脚本历史版本1.1.1。
// @v1.2.1        2019-02-01 - 重写了一部分代码,使之使用更加人性化。重新添加竖屏观看模式。使用方法,摇一摇切换竖屏观看,再摇一摇可换回横屏观看(可调节灵敏度,SHAKE_THRESHOLD参数,越小越灵敏)。火狐浏览器(安卓)使用该版本,除了双击全屏,其他功能正常。
// @v1.2.2        2019-02-03 - 防止误操作,摇一摇调整为全屏下执行。
// @v1.2.3        2019-02-04 - 修复了摇一摇短时间内可能触发两次的问题。
// @v1.2.4        2019-02-09 - 修复了后加载视频,某些功能可能需要多次点击才能生效的问题。
// @v1.2.5        2019-02-13 - 调整视频标签查找逻辑和事件方法,添加了更新说明。
// @v2.0.0        2019-08-22 - 新增视频滑动进行前进后退功能;修复在已有视频标签下,重新请求视频源双击全屏无效问题。
// @v2.1.0        2019-08-24 - 完善视频滑动前进后退进度,添加进度时间小tip(可能不同手机会有位置不居中的问题,大家可以用bilibili的桌面版页面测试)。优化代码逻辑。
// @note         注:新版yandex浏览器已支持横屏播放,但页面切换到电脑端模式仍不支持,本脚本可以完美解决。本脚本给有这类需求的人,以及使用该脚本双击功能习惯的朋友,有爱自取!(双击功能使用说明:在视频播放状态下,双击网页(包含该视频标签)任何一处,即可全屏,不需要再按小按钮了)
// ==/UserScript==
(function() {
    'use strict';
    //重力感应
    var oriHway='landscape-primary',oriHgamma=0,oriHbeta=0,isLock=false;

    function orientationHandler(event) {
        oriHgamma=Math.round(event.gamma);
        oriHbeta=Math.abs(Math.round(event.beta));
        if((oriHbeta<45 && Math.abs(oriHgamma)>25) || (oriHbeta>135 && Math.abs(oriHgamma)>25)){
            oriHway=((oriHgamma>25 && oriHbeta<45) || (oriHgamma<-25 && oriHbeta>135)) ? 'landscape-secondary' : 'landscape-primary';
        }
        if(!isLock){screen.orientation.lock(oriHway);}
    }

    //摇一摇
    var SHAKE_THRESHOLD=1800;//摇一摇灵敏度,越小越灵敏
    var acceleration=null,curTime=new Date().getTime(),last_update=curTime,diffTime=0,speed=0;
    var x=0,y=0,z=0,last_x=0,last_y=0,last_z=0,isReady_shake=true;

    function deviceMotionHandler(eventData) {
        if(document.webkitFullscreenElement && isReady_shake){
            acceleration=eventData.accelerationIncludingGravity;
            curTime=new Date().getTime();
            if ((curTime-last_update)>10) {
                diffTime=curTime-last_update;
                last_update=curTime;
                x=acceleration.x;
                y=acceleration.y;
                z=acceleration.z;
                speed=Math.abs(x+y+z-last_x-last_y-last_z)/diffTime*1000;
                if (speed>SHAKE_THRESHOLD) {
                    if(isLock){
                        isLock=false;
                        screen.orientation.lock(oriHway);
                    }
                    else{
                        isLock=true;
                        screen.orientation.lock('portrait-primary');
                    }
                    isReady_shake=false;
                    setTimeout(function(){isReady_shake=true;},1000);
                }
                last_x=x;
                last_y=y;
                last_z=z;
            }
        }
    }

    //滑屏进度
    var angx=0,angy=0,angle=0;
    var startx=0,starty=0,endx=0,endy=0,direction=0,isReady_touch=true;
    var videoRect=null,videox=0,videoy=0,videow=0,videoh=0;
    var tipM=0,tipS=0,tempTime=0,timeTip=null;

    function getDirection(startx,starty,endx,endy) {
        angx=endx-startx;
        angy=endy-starty;
        if (Math.abs(angx)<10 && Math.abs(angy)<10) {
            return 0;
        }
        angle=Math.atan2(angy,angx)*180/Math.PI;
        if ((angle>=135 && angle<=180) || (angle>=-180 && angle<=-135)) {
            return 1;
        } else if (angle>=-45 && angle<=45) {
            return 1;
        }
        return 0;
    }

    function sliderbackListener(){
        document.body.addEventListener('touchstart',function(e){
            if(videoplay){
                startx=e.changedTouches[0].clientX;
                starty=e.changedTouches[0].clientY;
                videoRect=videoplay.getBoundingClientRect();
                videox=videoRect.x;
                videoy=videoRect.y;
                videow=videoRect.width;
                videoh=videoRect.height;
          }
      }, false);
      document.body.addEventListener('touchmove',function(e){
          if(e.targetTouches.length>1 || e.scale && e.scale!==1) return;
          event.preventDefault();
          if(document.webkitFullscreenElement && startx>videox && startx<(videox+videow) && starty>videoy && starty<(videoy+videoh)){
              endx=e.changedTouches[0].clientX;
              endy=e.changedTouches[0].clientY;
              direction=getDirection(startx,starty,endx,endy);
              if(direction){
              timeTip.style.display='block';
              tempTime=videoplay.currentTime+endx-startx;
              tempTime=(tempTime>0) ? tempTime : 0;
              tipM=Math.floor(tempTime/60);
              tipS=Math.round(tempTime%60);
              if(startx>endx){
                  timeTip.innerHTML='◀◀ ';
                  if(tipM<10){timeTip.innerHTML+='0';}
                  timeTip.innerHTML+=tipM+' : ';
                  if(tipS<10){timeTip.innerHTML+='0';}
                  timeTip.innerHTML+=tipS;
              }else{
                  timeTip.innerHTML='▶▶ ';
                  if(tipM<10){timeTip.innerHTML+='0';}
                  timeTip.innerHTML+=tipM+' : ';
                  if(tipS<10){timeTip.innerHTML+='0';}
                  timeTip.innerHTML+=tipS;
              }}
          }
      },false);
      document.body.addEventListener('touchend', function(e){
          if(isReady_touch && startx>videox && startx<(videox+videow) && starty>videoy && starty<(videoy+videoh)){
              timeTip.style.display='none';
              endx=e.changedTouches[0].clientX;
              endy=e.changedTouches[0].clientY;
              direction=getDirection(startx,starty,endx,endy);
              if(direction){
                  videoplay.currentTime+=(endx-startx);
              }
              isReady_touch=false;
              setTimeout(function(){isReady_touch=true;},100);
          }
      }, false);
    }

    //双击全屏
    function dblfull(){
        if(videoplay){
            if(document.webkitFullscreenElement){videoplay.webkitExitFullscreen();}
            else{videoplay.webkitRequestFullScreen();}
        }
    }

    //全局Ajax触发回调
    !(function(){
        if(typeof window.CustomEvent==='function') return false;
        function CustomEvent(event,params){
            params=params || {bubbles:false,cancelable:false,detail:undefined};
            var evt=document.createEvent('CustomEvent');
            evt.initCustomEvent(event,params.bubbles,params.cancelable,params.detail);
            return evt;
        }
        CustomEvent.prototype=window.Event.prototype;
        window.CustomEvent=CustomEvent;
    })();

    !(function(){
        function ajaxEventTrigger(event){
            var ajaxEvent=new CustomEvent(event,{detail:this});
            window.dispatchEvent(ajaxEvent);
        }
        var oldXHR=window.XMLHttpRequest;
        function newXHR(){
            var realXHR=new oldXHR();
            realXHR.addEventListener('abort',function(){ajaxEventTrigger.call(this,'ajaxAbort');},false);
            realXHR.addEventListener('error',function(){ajaxEventTrigger.call(this,'ajaxError');},false);
            realXHR.addEventListener('load',function(){ajaxEventTrigger.call(this,'ajaxLoad');},false);
            realXHR.addEventListener('loadstart',function(){ajaxEventTrigger.call(this,'ajaxLoadStart');},false);
            realXHR.addEventListener('progress',function(){ajaxEventTrigger.call(this,'ajaxProgress');},false);
            realXHR.addEventListener('timeout',function(){ajaxEventTrigger.call(this,'ajaxTimeout');},false);
            realXHR.addEventListener('loadend',function(){ajaxEventTrigger.call(this,'ajaxLoadEnd');},false);
            realXHR.addEventListener('readystatechange',function(){ajaxEventTrigger.call(this,'ajaxReadyStateChange');},false);
            return realXHR;
        }
        window.XMLHttpRequest=newXHR;
    })();

    //事件绑定
    var videoEle=document.getElementsByTagName('video');
    var videoplay=null,vi=0,isReady_ajax=true,isBind=false;
    function setVideo(e){videoplay=this;}

    function videoEvent(){
        if(isReady_ajax){
            isReady_ajax=false;
            setTimeout(function(){
                for(vi=0;vi<videoEle.length;vi++){
                    if(!videoEle[vi].playing){videoEle[vi].addEventListener('playing',setVideo,false);}
                }
                if(!isBind && videoEle.length>0){
                    window.addEventListener('deviceorientation',orientationHandler,false);
                    window.addEventListener('devicemotion',deviceMotionHandler,false);
                    document.body.addEventListener('dblclick',dblfull,false);
                    timeTip=document.createElement('div');
                    timeTip.style.cssText='width:100px;height:50px;position:fixed;text-align:center;z-index:2147483647;top:calc(50% - 25px);left:calc(50% - 50px);display:none;color:#1e87f0;font-size:16px;line-height:50px;background-color:#ffffff;border-radius:20px;';
                    document.body.appendChild(timeTip);
                    sliderbackListener();
                    isBind=true;
                }
                isReady_ajax=true;
            },1000);
        }
    }

    window.addEventListener('ajaxReadyStateChange',videoEvent,false);
    videoEvent();

})();