用于进行配置系统apollo的Key的快速搜索和定位
// ==UserScript==
// @name ApolloConfigSearch
// @namespace https://apollo.com/
// @version 0.3
// @description 用于进行配置系统apollo的Key的快速搜索和定位
// @author AustinYoung
// @match https://*/config.html
// @grant unsafeWindow
// @license MIT
// ==/UserScript==
// 用于进行appllo系统的 Key内容的快速搜索和定位
// 支持用空格分割关键字对输入内容进行“与”方式搜索
// 全局变量保存基础信息
var CurrIndex = 0; // 当前查询到的位置
var ArrlIndex = []; // 总共的位置集合
let PreObj = null; // 前一个获取对象
let PreSearchKey = ''; // 前一个获取对象
var ArrObj = []; // 文字和td对象数组
// 全局变量结束
(function () {
'use strict';
addButton()
// Your code here...
})();
// 返回表格中每一行中 Key的内容，形成数组
function getKeys(objTrs, index) {
//let text,obj;
let objArr = []
objTrs.forEach(x => {
let obj = x.querySelector('td:nth-child(' + (index + 1) + ')')
if (obj == null) {
return;
}
let txt = obj.innerText.toLowerCase(); // 无视大小写
objArr.push({ obj, txt })
})
return objArr;
}
function addButton() {
var strControlHTML = `
<div style="padding:2px;position:fixed;top:40px;left:2px;z-index:99999" id="myselfFloat">
<div style="background-color:rgb(208, 227, 245);opacity: 0.8;">
<span style="cursor:pointer;" onclick="showList()">🔎</span>
<span id="searchBar">
<input id="mySearchKey" size="20" placeholder="请输入回车搜索Key 可空格分割多条件"/>
<span style="cursor:pointer;" id="btPre">▲</span> <span style="cursor:pointer;" id="btNext">▼</span>
<span id="searchHint"></span>
</span>
</div>
</div>
`;
var oNode = document.createElement('div');
oNode.innerHTML = strControlHTML;
document.body.append(oNode);
setTimeout( function(){
getAllKeys()
btPre.onclick= function(){
doSearch(-1)
return false
}
btNext.onclick= function(){
doSearch(1)
return false
}
mySearchKey.onkeypress = function(){
doSearch(window.event)
}
},1)
}
unsafeWindow.showList = function () {
searchBar.style.display = searchBar.style.display == '' ? 'none' : ''
}
function doSearch(e) {
if (e.keyCode == 13) {
// 默认为往下收缩
e = 1
}
// 只有当e不是事件时才执行搜索
if (e.keyCode == null) {
// 获取输入内容
let currKeys = mySearchKey.value.trim();
// 不输入内容，则表示清空
if(currKeys =='')
{
CurrIndex = 0;
ArrlIndex = [];
showHint('请输入内容！','red')
return;
}
if (currKeys != PreSearchKey) {
// 重新搜索
searchTxt(currKeys)
PreSearchKey = currKeys;
}
if (e == 1) {
//console.log('doSearch')
searchFocus(e)
} else if (e == -1) {
//console.log('doSearch back')
searchFocus(e)
}
}
}
function getAllKeys() {
if (ArrObj.length > 0) {
//console.log('getAllKeys.len:',getAllKeys.length)
return;
}
var allTableDiv = document.querySelectorAll('.namespace-view-table table')
allTableDiv.forEach(x => {
// 要获取判断第几列是 Key
if (x.className.indexOf('hide') > -1) {
return
}
let ths = Array.from(x.querySelectorAll('th'))
let keyCol = 2; // 默认第二列
ths.find((v, i) => {
let txt = v.innerText;
if (txt.indexOf('Key') > -1) {
keyCol = i;
return true;
}
})
ArrObj.push(...getKeys(x.querySelectorAll('tr'), keyCol))
})
//console.log("getAllKeys ",ArrObj)
}
// 搜索内容并复位相关标记
function searchTxt(keyword) {
if (ArrObj.length == 0) {
getAllKeys();
}
CurrIndex = 0;
ArrlIndex = [];
// 无视大小写
let arrKey=keyword.toLowerCase().split(/\s+/);
ArrObj.forEach((x, i) => {
// 核心搜索
let hasFound = arrKey.every(y=>{
return (x.txt.indexOf(y) > -1)
})
if (hasFound) {
ArrlIndex.push(i)
}
})
// console.log(ArrlIndex)
}
// 根据当前搜索内容，定位到需要的位置
function searchFocus(flag) {
let curr = CurrIndex
curr += flag
let extHint = ''
let color = 'blue'
if (curr < 0) {
extHint = '到达顶部，从尾部开始'
curr = ArrlIndex.length - 1
} else if (curr >= ArrlIndex.length) {
extHint = '到达尾部，从头开始'
curr = 0
}
// 在范围以内
CurrIndex = curr
// 清除上次的标记
if (PreObj != null) {
PreObj.style.borderColor = ''
}
let realIndex = ArrlIndex[CurrIndex]
if(ArrlIndex.length==0)
{
extHint ='未搜索到任何信息！'
showHint(extHint,'Magenta')
return;
}
let realObj = ArrObj[realIndex]
if(realObj==null){
extHint ='对象不存在！'
color = 'red'
}else{
showFocus(realObj.obj)
}
showHint(extHint,color)
}
// 显示提示信息
function showHint(txt,color)
{
searchHint.innerHTML = `当前${CurrIndex+1}/${ArrlIndex.length} <span style="color:${color}">${txt}<span>`
}
// 高亮搜索到的内容并滚动到当前
function showFocus(obj) {
//console.log(obj)
obj.style.borderColor = 'red'
obj.scrollIntoView({ behavior: "instant", block: "center", inline: "nearest" })
PreObj = obj;
}