党建大屏common.js


function resetRem(){
    let rootWidth = document.documentElement.clientWidth || document.body.clientWidth;
    let rootDom = document.querySelector('html');
    rootDom.style.fontSize = rootWidth / 1920 * 10 + 'px';
}
resetRem();

function forbidMenu(){
    window.event.returnValue=false;  
    return false;  
}


function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
    var r = window.location.search.substr(1).match(reg);
    if (r != null)
        return r[2];
    return null;
}

function statistics(options){
    myAjax({
        url:'/api/logs/upload', 
        type: 'post', 
        params: options, 
        success(){
            console.log('已加入统计', options);
        }
    })
}

function myAjax(options) {
    var options = options || {};
    options.type = (options.type || "GET").toUpperCase();
    options.dataType = options.dataType || "json";
    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function () {
        if (xhr.readyState == 4) {
            var status = xhr.status;
            if (status >= 200 && status < 300) {
                options.success &&
                    options.success(xhr.responseText, xhr.responseXML);
            } else {
                options.error && options.error(status);
            }
        }
    };

    if (options.type == "GET") {
        xhr.open("GET", options.url, true);
        // xhr.setRequestHeader("Content-Type", "application/json");
        xhr.send(null);
    } else if (options.type == "POST") {
        var params = JSON.stringify(options.params)
        xhr.open("POST", options.url, true);
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.send(params);
    }
}

var marqueeTimer;
function scrollText (textBox,text) {// 滚动字幕
    clearInterval(marqueeTimer);
    if (!(textBox && text)) return;
    // console.log('dom',textBox,text)
    let textBoxWidth = textBox.offsetWidth;
    let textWidth = text.offsetWidth;
    console.log('width',textWidth,textBoxWidth)
    if (textWidth > (textBoxWidth + 20)) {  
        let stayTime = 1000;
        let endStay = true;
        marqueeTimer = setInterval(function(){
            if (stayTime !== 0) {
                stayTime = stayTime - 100;
            } else {
                let textLeft = parseInt(text.style.left.slice(0,-2));
                if (textLeft > (textBoxWidth - textWidth)) {
                    text.style.left = (textLeft - 2) + 'px';
                } else {
                    // 结尾处暂停2s;
                    if (endStay) {
                        endStay = false;
                        stayTime = 1000;
                        return;
                    }
                    // 回到开头位置时在开头位置停留2s;后再开始转
                    text.style.left = '0px'
                    stayTime = 1000;
                    endStay = true;
                }
            }
        },100);
    }
}

function scrollTextCol(selector){// 替代height:Xrem;overflow-y:auto;
    var dom = document.querySelector(selector);
    var touchOn = false;
    var lastTouchY = 0;
    dom.addEventListener('touchstart',down,false);
    dom.addEventListener('touchmove',move,false);
    dom.addEventListener('touchend',up,false);
    dom.addEventListener('mousedown',down,false);
    dom.addEventListener('mousemove',move,false);
    dom.addEventListener('mouseup',up,false);

    function down(e){
        lastTouchY = e.pageY || e.touches[0].pageY;
        touchOn = true;
    }
    function move(e){
        if(touchOn){
            if (dom.scrollTop <= dom.scrollHeight - dom.clientHeight){
	            var currTouchY = e.pageY || e.touches[0].pageY;
                dom.scrollTop = dom.scrollTop + (lastTouchY - currTouchY);
            }
            lastTouchY = e.pageY || e.touches[0].pageY;
        }
    }
    function up(e){
        touchOn = false;
    }
}

function changeImg(dom,url,imgMaxNum,type, interval){// 需要添加序列动画帧的元素,序列动画帧图片的地址,序列动画帧图片的最大值(必须是个百位数),序列动画帧图片的后缀名(.png或.jpg)
    var i = 0;
    var intervalNum = interval || 100;
    var timer = setInterval(function(){
        var  data = i;
        if ( i < 10) {
            data = '00' + i;
        } else if ( i < 100) {
            data = '0' + i;
        }
        var img = new Image();
        // img.onload = function() {
            dom.src = url + data + type;
        // }
        i++;
        if (i === imgMaxNum) {
            i = 0;
        } 
    },intervalNum);

    function clearTimer(){
        clearInterval(timer);
        i = 0;
    }

    return {
        clearTimer
    }
}

function addSlide(dom,leftFn,rightFn,breakOffFn){// 需要绑定左滑右滑的元素,左滑要执行的操作,右滑执行操作,中断执行左滑右滑的操作
    var touchDot,slideDirection;
    dom.addEventListener('mousedown',down,false);
    dom.addEventListener('mousemove',move,false);
    dom.addEventListener('mouseup',up,false);
    dom.addEventListener('mouseout',up,false);

    dom.addEventListener('touchstart',down,false);
    dom.addEventListener('touchmove',move,false);
    dom.addEventListener('touchend',up,false);
    
    function down(event){
        touchDot = event.clientX || event.touches[0].clientX; // 获取触摸时的原点 
    }
    function move(event){
        if (touchDot !== undefined) {
            var touchMove = event.clientX || event.touches[0].clientX;
            // 向左滑动  
            if (touchMove - touchDot <= -40) {
                slideDirection = 'left';
            }
            // 向右滑动 
            if (touchMove - touchDot >= 40) {
                slideDirection = 'right';
            }
        }
    }
    function up(event){
        if (breakOffFn) {
            var breakoff = breakOffFn();
            if (breakoff) {
                slideDirection = 'none';
                touchDot = undefined;
                return; 
            }
        }
        if (slideDirection === 'left') {
            console.log('左滑')
            leftFn();
        } else if (slideDirection === 'right') {
            console.log('右滑')
            rightFn();
        } else {
        }
        slideDirection = 'none';
        touchDot = undefined;
    }
}

function carouselAddSlide(dom,leftFn,rightFn,breakOffFn){// 旋转木马的左滑右滑
    var touchDot,flagLeft = true,flagRight = true; 
    dom.addEventListener('mousedown',down,false);
    dom.addEventListener('mousemove',move,false);
    dom.addEventListener('mouseup',up,false);
    dom.addEventListener('mouseout',up,false);

    
    dom.addEventListener('touchstart',down,false);
    dom.addEventListener('touchmove',move,false);
    dom.addEventListener('touchend',up,false);

    function down(event){
        touchDot = event.clientX || event.touches[0].clientX; // 获取触摸时的原点 
    }
    function move(event){
        if (touchDot !== undefined) {
            if (breakOffFn) {
                var breakoff = breakOffFn();
                if (breakoff) {
                    flagLeft = true;
                    flagRight = true;
                    touchDot = undefined;
                    return;
                } 
            }
            var touchMove = event.clientX || event.touches[0].clientX;
            // 向左滑动  
            if (touchMove - touchDot <= -40) {
                if (flagLeft) {
                    leftFn();
                    flagLeft = false;// 鼠标左滑只能左滑一张,鼠标未抬起之前持续左滑不能左滑更多图片
                    flagRight = true;// 鼠标左滑切换图片后,鼠标未抬起之前可以通过再右滑切换回到之前的图片
                } else {
                    touchDot = touchMove;
                }
            }
            // 向右滑动 
            if (touchMove - touchDot >= 40) {
                if (flagRight) {
                    rightFn();
                    flagRight = false; // 鼠标右滑只能右滑一张,鼠标未抬起之前持续右滑不能右滑更多图片
                    flagLeft = true;// 鼠标右滑切换图片后,鼠标未抬起之前可以通过再左滑切换回到之前的图片
                } else {
                    touchDot = touchMove;
                }
            }
        }
    }
    function up(event){
        // 鼠标抬起重置一切可以进行下一步操作;
        flagRight = true;
        flagLeft = true;
        touchDot = undefined;
    }
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值