diff --git a/Chrome-tools-plugin/dataBase.js b/Chrome-tools-plugin/dataBase.js
index a7b41167a3792bd8c49a72f2ce6b0494bf591c51..0ab16b500e5e2048716cd8bb78d66d693ad4cd12 100644
--- a/Chrome-tools-plugin/dataBase.js
+++ b/Chrome-tools-plugin/dataBase.js
@@ -103,6 +103,7 @@ class DataBase{
* @param {object} data 数据
*/
updateDB(db,storeName, data) {
+ console.log(db,storeName,data);
var request = db
.transaction([storeName], "readwrite") // 事务对象
.objectStore(storeName) // 仓库对象
@@ -117,7 +118,7 @@ class DataBase{
};
}
- setDb(){
+ setDb(db){
this.db = db;
}
dbGet(key){
diff --git a/Chrome-tools-plugin/dialogBase.js b/Chrome-tools-plugin/dialogBase.js
index 7beced28a5145fbc4806fed5f8ea19bea82b67d7..b2d534ac8a6d37f2a7fb36219e3d35e8ceb575bf 100644
--- a/Chrome-tools-plugin/dialogBase.js
+++ b/Chrome-tools-plugin/dialogBase.js
@@ -1,8 +1,16 @@
+/*
+ * @Author: zheng yong tao
+ * @Date: 2021-12-30 00:51:37
+ * @LastEditors: zheng yong tao
+ * @LastEditTime: 2021-12-30 02:21:36
+ * @Description: "弹窗组件类封装"
+ */
class Dialog {
constructor(innerHTML){
this.dialogInit();
this.generatePreviewContent(innerHTML);
}
+ //初始化配置信息
dialogInit(){
const mask = document.getElementsByClassName('mask');
const dialog = document.getElementsByClassName('dialog');
@@ -50,115 +58,34 @@ class Dialog {
}
mask = tagConfingSet(mask,maskStyles);
dialog = tagConfingSet(dialog,dialogStyles);
- dialog.innerHTML = innerHTML;
+ let icon = `
+
+
+ x
+
+
+ `;
+ dialog.innerHTML = icon + innerHTML;
ghtml.appendChild(dialog);
- $('#dialogCloseBtn').click(()=>{
- this.dialogBtnClick('close');
- })
- $('#dialogDeleteBtn').click(()=>{
- this.dialogBtnClick('delete');
- })
- $('#dialogSetBtn').click(()=>{
- this.dialogBtnClick('set');
- })
- $('#filterNameSaveBtn').click(()=>{
- const filterName = $('#filterName')[0];
- this.dialogBtnClick('filterNameSave',filterName.value);
- })
- $('#filterNameResetBtn').click(()=>{
- $('#filterName')[0].value = '';
- })
- $('#splitBoard').click(()=>{
- let splitUrl1 = $('#splitUrl1')[0].value;
- let splitUrl2 = $('#splitUrl2')[0].value;
- if(splitUrl1 != '' && splitUrl2 != ''){
- this.dialogBtnClick('splitBoard',[splitUrl1,splitUrl2]);
- }
- })
- let searchInput = $('#dialogSearchInput')[0];
- let searchTip = $('#searchTip')[0];
- //获取当前快捷键跳转地址
- searchInput.oninput = function(){
- let val = searchInput.value.trim();
- let tip = '';
- let append = '本窗口打开:';
- if(val.length == 0) searchTip.innerText = searchConfig.baseUrl;
- else{
- val = val.split(' ');
- }
- if(val.length > 1){
- if(val[1].length > 0){
- append = "新窗口打开:";
- }
- }
- tip = searchConfig[val[0]] || "";
- if(tip !== "") tip = append + tip;
- searchTip.innerText = tip;
- };
ghtml.appendChild(mask);
+ let closebtn = dialog.getElementsByClassName('dialogCloseBtn')[0];
+ closebtn.onclick = ()=>{
+ this.close();
+ };
+ this.dialog = dialog;
+ this.mask = mask;
}
- setStyle(type='',style=''){
- if(style != 'tip') style += 'line-height:40px;height:40px;'
- switch(type){
- case 'btn':
- style += 'background-color: cadetblue;margin-left: 8px;text-align:center;cursor:pointer;'
- break;
- case 'label':
- style += 'background-color:white;text-align:center;border-radius: 5px;'
- break;
- case 'input':
- style += ''
- break;
- case 'tip':
- style += 'color:red;text-align:center;';
- break;
- default:
- break;
- }
- return style;
- }
- dialogBtnClick(method = '',para = ''){
- const dialog = document.getElementById('dialog');
- const mask = document.getElementById('mask');
- switch(method){
- case 'close':
- dialog.style.display = 'none';
- mask.style.display = 'none';
- this.isHide = true;
- break;
- case 'set':
- dialog.style.display = 'none';
- mask.style.display = 'none';
- break;
- case 'delete':
- dialog.style.display = 'none';
- mask.style.display = 'none';
- break;
- case 'filterNameSave':
- filterByName(para);
- database.dbUpdate('filterName',para);
- alert("已保存");
- break;
- case 'splitBoard':
- splitScreen(para[0],para[1]);
- break;
- default:
- break;
- }
- }
- show(){
- const dialog = document.getElementById('dialog');
- const mask = document.getElementById('mask');
- mask.style.display = 'block';
- dialog.style.display = 'flex';
+ open(){
+ this.mask.style.display = 'block';
+ this.dialog.style.display = 'flex';
this.isHide = false;
- let selectInput = document.getElementById('dialogSearchInput');
- selectInput.focus();
- $('#searchTip')[0].innerText = '本窗口打开:' + searchConfig.baseUrl;
- $('#splitUrl1')[0].value = location.href;
- $('#splitUrl2')[0].value = location.href;
}
close(){
- this.dialogBtnClick('close');
+ this.dialog.style.display = 'none';
+ this.mask.style.display = 'none';
+ this.isHide = true;
}
}
\ No newline at end of file
diff --git a/Chrome-tools-plugin/manifest.json b/Chrome-tools-plugin/manifest.json
index 8fa3a4266b455656a8f17671cd3f987a1fae72c6..21090e2c3b3bf1be1e294275d482ea5c0418cc1d 100644
--- a/Chrome-tools-plugin/manifest.json
+++ b/Chrome-tools-plugin/manifest.json
@@ -17,7 +17,10 @@
{
"matches": [""],
"css": ["mystyles.css"],
- "js": ["jquery-3.6.0.min.js","keyBoardKeyConfig.js","config.js","dataBase.js","localStorage.js","util.js","showProject.js"]
+ "js": ["jquery-3.6.0.min.js","keyBoardKeyConfig.js",
+ "config.js","dataBase.js","localStorage.js",
+ "util.js","dialogBase.js","panel.js",
+ "showProject.js"]
}
],
"permissions" : ["tabs", "activeTab"]
diff --git a/Chrome-tools-plugin/panel.js b/Chrome-tools-plugin/panel.js
index 1b3926d267f876b66776ae5dfd5dd461135ad3a0..7771ead3b9b110db048aa213d7cb47079652a332 100644
--- a/Chrome-tools-plugin/panel.js
+++ b/Chrome-tools-plugin/panel.js
@@ -1,39 +1,188 @@
let innerHtml = `
-
-
- x
-
-
Chrome便捷助手
`;
-function callBack(){
-
-}
\ No newline at end of file
+
+var panel = new Dialog(innerHtml);
+let panelDom = document.getElementById(panel.dialogId);
+let searchInput = panelDom.getElementsByClassName('dialogSearchInput')[0];
+let searchTip = panelDom.getElementsByClassName('searchTip')[0];
+
+panelDom.getElementsByClassName('dialogDeleteBtn')[0].onclick = ()=>{
+ panel.close();
+};
+panelDom.getElementsByClassName('dialogSetBtn')[0].onclick = ()=>{
+ panel.close();
+};
+panelDom.getElementsByClassName('filterNameSaveBtn')[0].onclick = ()=>{
+ const filterName = panelDom.getElementsByClassName('filterName')[0].value;
+ filterByName(filterName);
+ database.dbUpdate('filterName',filterName);
+ alert("已保存");
+};
+panelDom.getElementsByClassName('filterNameResetBtn')[0].onclick = ()=>{
+ panelDom.getElementsByClassName('filterName')[0].value = '';
+};
+panelDom.getElementsByClassName('splitBoard')[0].onclick = ()=>{
+ let url1 = panelDom.getElementsByClassName('splitUrl1')[0].value;
+ let url2 = panelDom.getElementsByClassName('splitUrl2')[0].value;
+ if(url1 != '' && url2 != ''){
+ document.write('');
+ }
+};
+//获取当前快捷键跳转地址
+searchInput.oninput = function(){
+ let val = replaceSpace2One(searchInput.value.trim());
+ let tip = '';
+ let append = '本窗口打开:';
+ if(val.length == 0) searchTip.innerText = searchConfig.baseUrl;
+ else{
+ val = val.split(' ');
+ }
+ if(val.length > 1){
+ if(val[1].length > 0){
+ append = "新窗口打开:";
+ }
+ }
+ tip = searchConfig[val[0]] || "";
+ if(tip !== "") tip = append + tip;
+ searchTip.innerText = tip;
+};
+
+//页面过滤
+function filterByName(filterName){
+ document.getElementsByClassName('projects-list')[0].innerHTML = originDomList;
+ filterName = filterName.split('、');
+ let domList = document.getElementsByClassName('project-row');
+ for(let i = 0;domList && i < domList.length; i++){
+ const item = domList[i];
+ const dom = item.getElementsByClassName('description');
+ const text = dom[0].innerText;
+ let flag = true;
+ for(let j = 0; j < filterName.length; j++){
+ const name = filterName[j];
+ if(text.indexOf(name) != -1){
+ flag = false;
+ break;
+ }
+ }
+ if(flag){
+ item.remove();
+ i--;
+ }
+ }
+}
+
+//数据库配置信息
+const dbConfig = {
+ dbName:'GitLabDb',
+ tableName:'GitLabTable'
+};
+var database = new DataBase(dbConfig);
+
+//是否在gitlab中
+if(window.location.href == searchConfig.baseUrl){
+ var inGitLab = true;
+ var originDomList = document.getElementsByClassName('projects-list')[0].innerHTML;
+ let dbOpen = database.openDB(dbConfig.dbName,dbConfig.tableName);
+ dbOpen.then(res => {
+ database.setDb(res);
+ initData();
+ }).catch(err => {
+ console.log('err',err);
+ })
+}
+keyDown();
+
+//初始化页面数据
+function initData() {
+ let filterName = database.dbGet('filterName');
+ filterName.then(res=>{
+ panelDom.getElementsByClassName('filterName')[0].value = res.data;
+ filterByName(res.data);
+ }).catch(err=>{
+ console.log(err);
+ })
+}
+//监听键盘事件
+function keyDown(){
+ panelDom.onkeydown = function(event){
+ if(event.keyCode==9){
+ for(let key in searchConfig){
+ if(key.length >= searchInput.value.length && searchInput.value == key.slice(0,searchInput.value.length)){
+ searchInput.value = key;
+ searchTip.innerText = '本窗口打开:' + searchConfig[key];
+ }
+ }
+ return false;
+ }else if(event.keyCode == 13){
+ if(!panel.isHide && event.target.id=='dialogSearchInput'){
+ dialogSearch(event.target.value);
+ }
+ }
+ };
+ $(document).keydown(function(event){
+ if(isOpenKey(event)){
+ openPanel();
+ }
+ });
+}
+function openPanel(){
+ if(panel.isHide) {
+ panel.open();
+ searchInput.focus();
+ let url1 = panelDom.getElementsByClassName('splitUrl1')[0];
+ let url2 = panelDom.getElementsByClassName('splitUrl2')[0];
+ searchTip.innerText = '本窗口打开:' + searchConfig.baseUrl;
+ url1.value = location.href;
+ url2.value = location.href;
+ }
+ else panel.close();
+}
+//判断是否打开面板快捷键
+function isOpenKey(e){
+ const openKey = shortcutsKeys.open;
+ for(let key in openKey){
+ if(e[key] != openKey[key]){
+ return false;
+ }
+ }
+ return true;
+}
+function dialogSearch(para){
+ para = para.trim().split(' ');
+ let target = para[0];
+ let type = "_self";
+ if(para.length > 1 && para[1].length > 0) type = '_blank';
+ if(target == '') target = 'baseUrl';
+ let tar = searchConfig[target] || '';
+ if(tar != ''){
+ if(tar !== 'null') window.open(tar,type);
+ }else{
+ alert("未定义该关键字");
+ }
+}
diff --git a/Chrome-tools-plugin/showProject.js b/Chrome-tools-plugin/showProject.js
index 8c7a1693394a7b198f917eb70593c3bd8a81e612..e69de29bb2d1d6434b8b29ae775ad8c2e48c5391 100644
--- a/Chrome-tools-plugin/showProject.js
+++ b/Chrome-tools-plugin/showProject.js
@@ -1,333 +0,0 @@
-//弹窗
-class Dialog {
- constructor(innerHTML){
- this.generatePreviewContent(innerHTML);
- this.isHide = true;
- }
- //创建弹窗
- generatePreviewContent(){
- let ghtml = document.getElementsByTagName('html')[0],
- mask = document.createElement('div'),
- dialog = document.createElement('div');
- mask.id = "mask";
- dialog.id = "dialog";
- let maskStyles = {
- position: "fixed",
- height: '100vh',
- width: '100vw',
- backgroundColor: 'grey',
- top: 0,
- opacity:0.8,
- zIndex:999,
- display:'none'
- };
- let dialogStyles = {
- position: "fixed",
- height: '70vh',
- width: '50vw',
- backgroundColor: 'white',
- top: "10vh",
- left: "25vw",
- zIndex:1000,
- display:"none",
- flexDirection: 'column',
- "background-image": 'url(' + pageConfig.backgroundImg + ')',
- "background-size": '100%',
- "background-repeat": 'no-repeat',
- opacity:0.7,
- }
- mask = tagConfingSet(mask,maskStyles);
- dialog = tagConfingSet(dialog,dialogStyles);
- dialog.innerHTML = `
-
-
- x
-
-
-
- Chrome便捷助手
-
-
-
-
-
-
- 项目关键字
-
-
-
清空
-
保存
-
-
-