蜜柑动画快速过滤器

try to take over the world!

目前為 2017-11-02 提交的版本,檢視 最新版本

// ==UserScript==
// @name         蜜柑动画快速过滤器
// @namespace    pks
// @version      0.1
// @description  try to take over the world!
// @author       You
// @include        /https?://mikanani\.me/?/
// @grant        none
// ==/UserScript==
$(function () {
    function scrollToElement(ele) {
        var eleTop = $(ele).offset().top;
        $(window).animate({scrollTop: eleTop - 80});
    }

    var bangumis = [];

    $('.an-info a').each(function(index,element){
        var obj = {};
        obj.name = element.title;
        obj.element = $(element).closest('li')[0];
        bangumis.push(obj);
    });

    $('<input id="filter" placeholder="新番快速查找">')
        .css({
        'width': '350px',
        'height': '64px',
        'position': 'fixed',
        'top': 0,
        'right': 0,
        'bottom': 0,
        'left': 0,
        'margin': 'auto',
        'fontSize': '24px',
        'opacity': '0.7',
        'textAlign': 'center',
        'display':'none'
    }).appendTo('body');

    $('#filter').on('keydown', function (e) {
        if (e.keyCode === 27 && !!$(this).val()) {
            $(this).wrap('<form></form>');
            $(this).parent()[0].reset();
            $(this).unwrap();
            $(this).focus();
        } else if (/^(13|8|27)$/.test(e.keyCode) && $(this).val()==='') {
            $(this).css('display', 'none').blur();
        } else if (e.keyCode === 13 && !!$(this).val() ) {
            var dropDownList = [];
            bangumis.forEach(function(item,index,arr){
                if (item.name.toLowerCase().indexOf($('#filter').val().toLowerCase()) !== -1 && dropDownList.length <= 5) {
                    dropDownList.push(index);
                }
            });
            console.log(dropDownList);
            if (dropDownList.length > 0) {
                scrollToElement(bangumis[dropDownList[0]].element);
            }
            $('#filter').val('');
            $(this).css('display', 'none').blur();
        }
    });
    var callFilter = function (e) {
        if (e.target.nodeName !== 'INPUT' && e.target.nodeName !== 'TEXTAREA' && /^(70|83)$/.test(e.keyCode) && $(window).width() >=992) {
            $('#filter').css('display', 'block').focus();
        }
    };
    $(document).on('keyup.wideScreenOnly', callFilter);
    $(window).on('resize', function (e) {
        if ($(window).width() <= 991) {
            $('#filter').css('display', 'none').blur();
            $(document).off('.wideScreenOnly');
        } else {
            $(document).on('keyup.wideScreenOnly', callFilter);
        }
    });
    $(document).on('click', function (e) {
        if (e.target.id !== 'filter' && $('#filter').css('display') === 'block') {
            $('#filter').css('display', 'none').blur();
        }
    });
});