hust-epi/admin-ui/yvanui/yvanui.shortcut.js

var startDomListener = false;
var shortcut = {
    echo: function (shortcust) {
        var r = this.parse(shortcust);
        if ($.type(r) === 'object') {
            return r.echo;
        }
    },

    processButton: function ($dom, item, context) {
        //处理按钮
        if ($.type(item.shortcut) === 'string') {
            var bind = shortcut.parse(item.shortcut);
            if ($.type(bind) === 'object') {
                var echo = bind.echo;
                echo = "<u style='font-size: smaller;'>(" + echo + ")</u>";
                item.text = item.text + echo;

                bind.handler = function () {
                    $dom.trigger('click');
                };

                //在容器中注册快捷键
                context.shortcutContainer.bind.push(bind);
            }
        }

        if ($.type(item.ff) === 'number') {
            setTimeout(function () {
                var $ff = $dom;
                if ($ff.length > 0) {
                    $ff.focus();
                }
            }, item.ff);
        }
    },

    processGrid: function ($dg, item, context) {
        //处理表格
        if ($.type(item.ff) === 'number') {
            setTimeout(function () {
                $dom.closest('.datagrid-view').focus();
            }, item.ff);
        }
        var $dom = $dg.closest('.datagrid-view');
        //允许所有 datagrid 有焦点
        $dom.attr('tabIndex', 10);

        //不允许 pagination 有焦点
        var pagination = $dg.datagrid('getPager');
        pagination.attr('tabIndex', -1);
        pagination.find('a').attr('tabIndex', -1);
        pagination.find('select').attr('tabIndex', -1);
        pagination.find('input').attr('tabIndex', -1);
    },

    processEgridEditor: function ($dg, index, row) {
        //处理 egrid.columns 里面每一个 editor
        var editors = $dg.datagrid('getEditors', index);
        for (var i = 0; i < editors.length; i++) {
            if ($.inArray(editors[i].type, ['textbox', 'numberbox', 'numberspinner', 'combobox', 'combotree', 'combogrid', 'datebox', 'datetimebox', 'searchbox']) >= 0) {
                var $editor = editors[i].target;
                $editor.textbox('textbox').keydown(function (e) {
                    var success = shortcut.processKey(e);
                    if (success) {
                        if (e.preventDefault) {
                            e.preventDefault();
                        } else {
                            e.returnValue = false;
                        }
                    }
                });
            }
        }
    },

    processInputAfter: function ($dom, item, context) {
        //$dom.textbox('textbox').attr('tabIndex', 10);
    },

    processInput: function ($dom, item, context) {
        //处理输入框
        var handler = function ($dom) {
            var $ff = $dom.next('span').find('.validatebox-text');
            if ($ff.length > 0) {
                $ff.focus();
            }
        };
        $dom.attr('tabIndex', 10);

        if ($.type(item.shortcut) === 'string') {
            var bind = this.parse(item.shortcut);
            if ($.type(bind) === 'object') {
                var echo = bind.echo.replace('Alt+', '');
                echo = "<u style='font-size: smaller;'>" + echo + "</u>";
                item.label = item.label + echo;
                bind.handler = function () {
                    handler($dom);
                };

                //在容器中注册快捷键
                context.shortcutContainer.bind.push(bind);
            }
        }

        if ($.type(item.ff) === 'number') {
            setTimeout(function () {
                handler($dom);
            }, item.ff);
        }
    },

    ffApply:function($container) {
        var vv = $container.find('[ff]:first')
        var xtype = vv.attr('xtype')
        if(xtype === 'textbox' || xtype==='searchbox' || xtype==='numberbox'){
            vv.next().children('input:first').focus();
        }
    },

    disableLayroTabIndex: function (layero) {
        //禁用 layer 中的tabIndex辅助按钮
        layero.find('.layui-layer-setwin>a').attr('tabIndex', -1);
    },

    registe: function ($dom, shortcut, handler) {

        if (!$dom.is('.shortcutContainer')) {
            $dom = $dom.closest('.shortcutContainer');
        }
        if ($dom.length <= 0) {
            return false;
        }

        $.data($dom[0], 'shortcut').bind.push(
            $.extend(this.parse(shortcut), {
                handler: handler
            })
        );
    },

    parse: function (shortcust, hasEcho) {
        shortcust = shortcust.toLowerCase();
        var bind = {};
        bind.key = shortcust.replace('+', '').replace(' ', '').replace(',', '').replace('ctrl', '').replace('shift', '').replace('alt', '');
        if ($.type(bind.key) !== 'string' || !$.trim(bind.key)) {
            console.log("非法的快捷键定义:" + shortcust);
            return;
        }
        var array = ['F1',
            'F2',
            'F3',
            'F4',
            'F5',
            'F6',
            'F7',
            'F8',
            'F9',
            'F10',
            'F11',
            'F12',
            'Escape',
            'Enter',
            'PageDown',
            'PageUp',
            'Home',
            'End',
            'Delete',
            'Insert',
            'ArrowUp',
            'ArrowDown',
            'ArrowLeft',
            'ArrowRight'];

        //别名定义
        switch (bind.key) {
            case 'esc':
                bind.key = 'escape';
                break;
            case 'up':
                bind.key = 'ArrowUp';
                break;
            case 'down':
                bind.key = 'ArrowDown';
                break;
            case 'left':
                bind.key = 'ArrowLeft';
                break;
            case 'right':
                bind.key = 'ArrowRight';
                break;
        }

        var find = $.inArray(bind.key, array.map(function (v) {
            return v.toLowerCase()
        }));
        if (bind.key.length !== 1 && find < 0) {
            console.log("非法的快捷键定义:" + shortcust);
            return;
        }

        bind.ctrl = shortcust.indexOf("ctrl") >= 0;
        bind.shift = shortcust.indexOf("shift") >= 0;
        bind.alt = shortcust.indexOf("alt") >= 0;

        if (find < 0) {
            bind.key = bind.key.toUpperCase();
            if (!bind.ctrl && !bind.shift && !bind.alt) {
                bind.alt = true;
            }
        } else {
            bind.key = array[find];
        }

        if (hasEcho !== false) {
            bind.echo = (bind.ctrl ? "Ctrl+" : "") +
                (bind.alt ? "Alt+" : "") +
                (bind.shift ? "Shift+" : "") +
                bind.key;
        }
        bind.key = bind.key.toUpperCase();
        return bind;
    },

    createContainer: function ($dom, context) {
        if (context.hasOwnProperty('shortcutContainer')) {
            //已经包含 shortcutContainer 的设定
            return;
        }

        $dom.addClass('shortcutContainer');
        var shortcutContainer = {bind: []};
        $.data($dom[0], 'shortcut', shortcutContainer);
        context.shortcutContainer = shortcutContainer;
    },

    processKey: function (e) {
        //传入keydown事件参数，如果处理成功 返回true，否则返回false
        var log = function () {
            var arg = ['shortcut'];
            for (var i = 0; i < arguments.length; i++) {
                arg.push(arguments[i]);
            }
            console.log.apply(this, arg);
        };

        var hooks = {
            datagrid: function ($f, e) {

                var dff = function (xtype) {
                    if (e.code === 'PageDown') {
                        if ($f.down(xtype).datagrid('getPager').length <= 0) return false;
                        log(xtype, 'PageDown');
                        var $next = $.data($f.down(xtype).datagrid('getPager')[0]).pagination.bb.next;
                        if (!$next.is('.l-btn-disabled')) {
                            $next.trigger('click');
                        }
                        return true;

                    } else if (e.code === 'PageUp') {
                        if ($f.down(xtype).datagrid('getPager').length <= 0) return false;
                        log(xtype, 'PageUp');
                        var $prev = $.data($f.down(xtype).datagrid('getPager')[0]).pagination.bb.prev;
                        if (!$prev.is('.l-btn-disabled')) {
                            $prev.trigger('click');
                        }
                        return true;

                    } else if (e.code === 'ArrowUp') {
                        log(xtype, 'ArrowUp');
                        var $dg = $f.down(xtype);
                        var row = $dg.datagrid('getSelected');
                        if (!row) return true;
                        var index = $dg.datagrid('getRowIndex', row);
                        if (index <= 0) return true;
                        $dg.datagrid('selectRow', index - 1);
                        return true;

                    } else if (e.code === 'ArrowDown') {
                        log(xtype, 'ArrowDown');
                        var $dg = $f.down(xtype);
                        var row = $dg.datagrid('getSelected');

                        if (xtype === 'egrid') {
                            //egrid 没有任何数据时按"下"键，需要添加操作,并聚焦到第一个编辑框
                            var rowsLength = $dg.datagrid('getRows').length;
                            if (rowsLength <= 0) {
                                $dg.edatagrid('addRow');
                                setTimeout(function () {
                                    $dg.edatagrid('focusEditor');
                                }, 50);
                                return true;
                            }
                        }

                        if (!row) return true;
                        var index = $dg.datagrid('getRowIndex', row);
                        if (xtype === 'egrid') {
                            //egrid 最后一行按"下"键，需要添加操作,并聚焦到第一个编辑框
                            if (index >= rowsLength - 1) {
                                //最后一行
                                $dg.edatagrid('addRow');
                                setTimeout(function () {
                                    $dg.edatagrid('focusEditor');
                                }, 50);
                                return true;
                            }
                        }
                        if (index < 0) return true;
                        $dg.datagrid('selectRow', index + 1);
                        return true;

                    } else if (e.code === 'Escape') {
                        if (xtype === 'egrid') {
                            log(xtype, 'Escape');
                            var $dg = $f.down(xtype);
                            var editRowIndex = $dg.edatagrid('getEditRowIndex');
                            if ($.type(editRowIndex) === 'number' && editRowIndex >= 0) {
                                $dg.edatagrid('cancelRow');
                            }
                        }
                    }
                };

                if ($f.down('list').length > 0) {
                    return dff('list');

                } else if ($f.down('grid').length > 0) {
                    return dff('grid');
                } else if ($f.down('egrid').length > 0) {
                    return dff('egrid');
                }

                return false;
            }
        };

        if (e.key === 'Control' || e.key === 'Shift' || e.key === 'Alt') {
            return false;
        }

        if (e.ctrlKey && e.shiftKey && e.altKey && e.key.toLocaleLowerCase() === 'a') {
            console.log($("[tabindex]"));
            return true;
        }

        if (e.ctrlKey && e.shiftKey && e.altKey && e.key.toLocaleLowerCase() === 'c') {
            console.log($(document.activeElement));
            return true;
        }

        var $f = $(document.activeElement);
        if ($f.is('div.datagrid-view')) {
            //当前是在 grid 体系的容器里
            if (hooks.datagrid($f, e)) {
                return true;
            }
        } else if ($f.closest('div.datagrid-view').down('egrid').length > 0) {
            //当前是在 egrid 表格容器的grid里
            if (hooks.datagrid($f.closest('div.datagrid-view'), e)) {
                return true;
            }
        }


        //找到当前焦点控件的快捷键容器
        var shortcutContainer = $f;
        if (!$f.is('.shortcutContainer')) {
            shortcutContainer = $f.closest('.shortcutContainer');
        }
        if (shortcutContainer.length <= 0) {
            return false;
        }

        shortcutContainer = $.data(shortcutContainer[0], 'shortcut');
        //寻找容器中有没有注册当前的按键
        for (var i = 0; i < shortcutContainer.bind.length; i++) {
            var bind = shortcutContainer.bind[i];
            if ((bind.alt === e.altKey) &&
                (bind.ctrl === e.ctrlKey) &&
                (bind.shift === e.shiftKey) &&
                (bind.key === e.key.toUpperCase())) {
                bind.handler();
            }
        }

        return false;
    }
};

$(function () {

    var setupGridTabIndex = function (data) {
        var $dg = $(this);

        var $dom = $dg.closest('.datagrid-view');
        //允许所有 datagrid 有焦点
        $dom.attr('tabIndex', 10);

        //不允许 pagination 有焦点
        var pagination = $dg.datagrid('getPager');
        pagination.attr('tabIndex', -1);
        pagination.find('a').attr('tabIndex', -1);
        pagination.find('select').attr('tabIndex', -1);
        pagination.find('input').attr('tabIndex', -1);

        //默认选中第一行
        if (data && data.rows.length > 0) {
            $dg.datagrid('selectRow', 0);
        }
    };
    if ($.fn.edatagrid) {
        $.fn.edatagrid.defaults.onLoadSuccess = setupGridTabIndex;
    }
    if ($.fn.datagrid) {
        $.fn.datagrid.defaults.onLoadSuccess = setupGridTabIndex;
    }

    document.onkeydown = function (e) {

        var success = shortcut.processKey(e);
        if (success) {
            if (e.preventDefault) {
                e.preventDefault();
            } else {
                e.returnValue = false;
            }
        }
    };
});