Greasy Fork

Greasy Fork is available in English.

BilibiliTimer

B站H5播放器全屏时实时显示当前系统时间

当前为 2017-06-12 提交的版本,查看 最新版本

// ==UserScript==
// @name         BilibiliTimer
// @version      1.3.1
// @description  B站H5播放器全屏时实时显示当前系统时间
// @author       AnnAngela
// @match        *://www.bilibili.com/video/*
// @match        *://www.bilibili.com/html/*layer.htm*
// @match        *://live.bilibili.com/*
// @compatible   chrome
// @run-at       document-start
// @grant        unsafeWindow
// @namespace    http://greasyfork.icu/users/129402
// ==/UserScript==

(function() {
    'use strict';
    /* 防止重复加载 */
    if (unsafeWindow.BilibiliTimer) return;
    unsafeWindow.BilibiliTimer = true;
    /*
     * 出于实现上的考虑,以下代码被保存为纯文本,并通过unsafeWindow.eval运行,以操作真实环境下的DOM节点
     */
    var code = [
        "(function() {",
        "    'use strict';",
        "    if (!String.prototype.includes) String.prototype.includes = function includes(s) {",
        "        return this.indexOf(s) !== -1;",
        "    };",
        "    function bilibiliPlayerDate() {",
        "        var _date = new Date();",
        "        ['getDate', 'getFullYear', 'getHours', 'getMilliseconds', 'getMinutes', 'getMonth', 'getSeconds', 'getTime', 'getUTCDate', 'getUTCFullYear', 'getUTCHours', 'getUTCMilliseconds', 'getUTCMinutes', 'getUTCMonth', 'getUTCSeconds', 'getYear'].forEach(function(key) {",
        "            _date[key] = function() {",
        "                var result = Date.prototype[key].apply(_date, arguments);",
        "                if (key.includes('Month')) result++;",
        "                if (typeof result === 'number' && (result + '').length === 1) return '0' + result;",
        "                else return result + '';",
        "            };",
        "        });",
        "        return _date;",
        "    }",
        "    function isLive(a, b) {",
        "        return location.host === 'live.bilibili.com' ? a : b",
        "    }",
        "    var selector = isLive({",
        "        container: '.bilibili-live-player-video-area',",
        "        fullscreenButton: '.bilibili-live-player-video-controller-fullscreen-btn > i',",
        "        controller: '.bilibili-live-player-video-controller',",
        "        fullscreenSendbar: null",
        "    }, {",
        "        container: '.bilibili-player-video-wrap',",
        "        fullscreenButton: '.bilibili-player-video-btn-fullscreen > i',",
        "        controller: '.bilibili-player-video-control',",
        "        fullscreenSendbar: '.bilibili-player-video-sendbar.active'",
        "    });",
        "    var classList = isLive({",
        "        timer: 'bilibili-live-player-video-info-container',",
        "        closeButton: 'bilibili-live-player-video-info-close',",
        "        panel: 'bilibili-live-player-video-info-panel'",
        "    }, {",
        "        timer: 'bilibili-player-video-info-container',",
        "        closeButton: 'bilibili-player-video-info-close',",
        "        panel: 'bilibili-player-video-info-panel'",
        "    });",
        "    var globallock = false;",
        "    var onResizing = 0;",
        "    function getControllerTop() {",
        "        var controller = $(selector.controller);",
        "        if (controller.closest('.mode-miniscreen')[0]) return $(window).height();",
        "        var _top = $(selector.controller).offset().top;",
        "        var fullscreenSendbar = $(selector.fullscreenSendbar);",
        "        if (fullscreenSendbar[0]) _top -= fullscreenSendbar.outerHeight(true);",
        "        return _top;",
        "    }",
        "    function BilibiliTimerInit() {",
        "        $(document).add(window).add(selector.fullscreenButton).off('.BilibiliTimer');",
        "        onResizing = 0;",
        "        var timer = $('<div/>');",
        "        timer.attr('id', 'BilibiliTimer').addClass(classList.timer);",
        "        timer.data('widthSet', false);",
        "        timer.css('cursor', 'move');",
        "        if (!localStorage.getItem('BilibiliTimerOffset')) {",
        "            timer.css({",
        "                right: '10px',",
        "                top: '10px'",
        "            }).css({",
        "                left: timer.offset().left + 'px',",
        "                right: 'auto'",
        "            });",
        "        } else timer.css(JSON.parse(localStorage.getItem('BilibiliTimerOffset')));",
        "        timer.on('mousedown', function(e) {",
        "            var baseX = e.clientX;",
        "            var baseY = e.clientY;",
        "            var baseOffsetX = timer.offset().left;",
        "            var baseOffsetY = timer.offset().top;",
        "            timer.data({",
        "                baseOffset: {",
        "                    left: baseOffsetX - baseX,",
        "                    top: baseOffsetY - baseY",
        "                },",
        "                onMousedown: true",
        "            });",
        "        });",
        "        $(window).on('resize.BilibiliTimer', function() {",
        "            onResizing = 1;",
        "            console.debug('onResizing.resize', onResizing);",
        "        })",
        "        $(document).on({",
        "            'mousemove.BilibiliTimer': function(e) {",
        "                if (timer.data('onMousedown')) {",
        "                    var maxTop = getControllerTop() - timer.outerHeight() - 10;",
        "                    var maxLeft = $(window).width() - timer.outerWidth() - 10;",
        "                    timer.css({",
        "                        left: Math.max(Math.min(timer.data('baseOffset').left + e.clientX, maxLeft), 10),",
        "                        top: Math.max(Math.min(timer.data('baseOffset').top + e.clientY, maxTop), 10)",
        "                    });",
        "                    window.getSelection().removeAllRanges();",
        "                }",
        "            },",
        "            'mouseup.BilibiliTimer': function() {",
        "                if (timer.data('onMousedown')) {",
        "                    timer.data('onMousedown', false);",
        "                    localStorage.setItem('BilibiliTimerOffset', JSON.stringify({",
        "                        top: timer.css('top'),",
        "                        left: timer.css('left')",
        "                    }));",
        "                }",
        "            }",
        "        });",
        "        var button = $('<a/>');",
        "        button.text('[x]').attr('href', 'javascript:void(0);');",
        "        button.addClass(classList.closeButton);",
        "        timer.append(button);",
        "        button.on('click', function() {",
        "            globallock = true;",
        "            timer.fadeOut(370);",
        "        });",
        "        var panel = $('<div/>');",
        "        panel.addClass(classList.panel);",
        "        panel.append(\"<div class='info-line'><span class='info-title'>系统时间:</span><span class='info-data' id='BilibiliTimerNowTime'></span></div>\");",
        "        panel.append(isLive('', \"<div class='info-line'><span class='info-title'>播放进度:</span><span class='info-data' id='BilibiliTimerVideoTime'></span></div>\"));",
        "        timer.append(panel);",
        "        $(selector.container).append(timer);",
        "        console.info('BilibiliTimer', 'Init', $('#BilibiliTimer'));",
        "    }",
        "    setInterval(function() {",
        "        if ($(selector.container)[0] && !$(selector.container).find('#BilibiliTimer')[0]) BilibiliTimerInit();",
        "    }, 1307);",
        "    setInterval(function() {",
        "        var timer = $('#BilibiliTimer');",
        "        if (!timer[0]) return;",
        "        if (!!$(':-webkit-full-screen')[0]) {",
        "            if (!globallock) {",
        "                timer.fadeIn();",
        "                if (onResizing === 2) {",
        "                    console.debug('onResizing.intervalTrigger', onResizing);",
        "                    onResizing = 0;",
        "                    var maxTop = getControllerTop() - timer.outerHeight() - 10;",
        "                    var maxLeft = $(window).width() - timer.outerWidth() - 10;",
        "                    timer.css({",
        "                        left: Math.max(Math.min(parseInt(timer.css('left')), maxLeft), 10),",
        "                        top: Math.max(Math.min(parseInt(timer.css('top')), maxTop), 10)",
        "                    });",
        "                    localStorage.setItem('BilibiliTimerOffset', JSON.stringify({",
        "                        top: timer.css('top'),",
        "                        left: timer.css('left')",
        "                    }));",
        "                } else if (onResizing === 1) {",
        "                    console.debug('onResizing.intervalChange', onResizing);",
        "                    onResizing = 2;",
        "                }",
        "            }",
        "        } else {",
        "            onResizing = 0;",
        "            globallock = false;",
        "            timer.fadeOut();",
        "        }",
        "        if (timer.is(':visible')) {",
        "            var date = bilibiliPlayerDate();",
        "            timer.find('#BilibiliTimerNowTime').text(date.getFullYear() + '-' + date.getMonth() + '-' + date.getDate() + ' ' + date.getHours() + ':' + date.getMinutes() + ':' + date.getSeconds());",
        "            timer.find('#BilibiliTimerVideoTime').text($('.bilibili-player-video-time-wrap').text());",
        "            if (!timer.data('widthSet')) {",
        "                var maxWidth = 0;",
        "                timer.find('.info-line').each(function() {",
        "                    var width = 0;",
        "                    $(this).children().each(function() {",
        "                        if ($(this).is('.info-title')) $(this).width($(this).text().length * parseInt($(this).css('font-size')));",
        "                        width += $(this).outerWidth(true);",
        "                    });",
        "                    if (maxWidth < width) maxWidth = width;",
        "                });",
        "                timer.width(maxWidth);",
        "                timer.data('widthSet', true);",
        "            }",
        "        }",
        "    }, 100);",
        "})();"
    ].join('\n');
    unsafeWindow.addEventListener('load', function() {
        unsafeWindow.eval(code);
    });
})();