添加箭头,用于隐藏插件

scripts
王良 7 months ago
parent 3388811bbe
commit 66d7413848

@ -63,7 +63,7 @@
// 设置<style>元素的内容
let cssContent = `
.____ds-tampermonkey____{
.___ds-tampermonkey___{
position: fixed;
right: 11px;
top: 30%;
@ -76,10 +76,10 @@
background-size: cover;
background-image: url("data:image/png;base64,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");
}
.____ds-tampermonkey-hide____{
.___ds-tampermonkey-hide___{
width: 0;
}
.____ds-menus____ {
.___ds-menus___ {
display: none;
position: absolute;
right: 36px;
@ -92,10 +92,10 @@
border: 1px solid #52525E;
overflow: hidden;
}
.____ds-tampermonkey____:hover .____ds-menus____ {
.___ds-tampermonkey___:hover .___ds-menus___ {
display: block;
}
.____ds-menu____ {
.___ds-menu___ {
height: 35px;
line-height: 35px;
padding: 0 10px;
@ -104,31 +104,32 @@
cursor: pointer;
margin-left: 26px;
}
.____ds-menu____:hover {
.___ds-menu___:hover {
background-color: #855F16;
}
.____ds-menu0____ {
.___ds-menu0___ {
margin-left: 0;
font-size: 16px;
font-weight: bold;
}
.____ds-menu0____ img{
.___ds-menu0___ img{
width: 23px;
height: 23px;
vertical-align: middle;
margin: 0 8px 3px 8px;
}
.____ds-arrow____{
.___ds-arrow___{
width: 0;
height: 0;
position: absolute;
top: 10px;
left: 37px;
cursor: pointer;
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-left: 10px solid #665c5c;
}
.____ds-tampermonkey-hide____ .____ds-arrow____{
.___ds-tampermonkey-hide___ .___ds-arrow___{
border-top: 8px solid transparent;
border-bottom: 8px solid transparent;
border-right: 10px solid #665c5c;
@ -167,12 +168,15 @@
context.pluginElement = document.createElement('div');
context.pluginElement.id = PRE + "plugin";
context.pluginElement.title = "油猴脚本" + (options.name ? "" + options.name : "");
context.pluginElement.className = "____ds-tampermonkey____";
context.pluginElement.className = "___ds-tampermonkey___";
if (api.GM_getValue("ds_hide")) {
context.pluginElement.classList.add("___ds-tampermonkey-hide___");
}
// 创建菜单列表div
context.menusElement = document.createElement('div');
context.menusElement.id = PRE + "menus";
context.menusElement.className = "____ds-menus____";
context.menusElement.className = "___ds-menus___";
if (options.width > 0) {
context.menusElement.style['min-width'] = options.width + "px";
}
@ -184,7 +188,7 @@
const switchMenuElement = document.createElement('div');
const icon = (options.icon ? `<img alt="icon" src="${options.icon}"/>` : " ");
switchMenuElement.id = PRE + "menu-0";
switchMenuElement.className = "____ds-menu____ ____ds-menu0____";
switchMenuElement.className = "___ds-menu___ ___ds-menu0___";
switchMenuElement.innerHTML = (enabled ? "✅" : "❌") + icon + options.name;
switchMenuElement.title = `点击${enabled ? "关闭" : "开启"}此脚本功能`;
switchMenuElement.onclick = function () {
@ -210,7 +214,7 @@
// 创建用户菜单列表div
context.userMenusElement = document.createElement('div');
context.userMenusElement.id = PRE + "user-menus";
context.userMenusElement.className = "____ds-user-menus____";
context.userMenusElement.className = "___ds-user-menus___";
// 将用户菜单div添加到菜单div中
context.menusElement.append(context.userMenusElement);
@ -225,22 +229,48 @@
// 创建箭头元素
context.arrowElement = document.createElement('div');
context.arrowElement.id = PRE + "arrow";
context.arrowElement.className = "____ds-arrow____";
context.arrowElement.className = "___ds-arrow___";
// 初始化title
api.initArrowTitle();
// 绑定点击事件
context.arrowElement.onclick = () => {
if (__ds_global__.getContext().pluginElement.classList.contains("___ds-tampermonkey-hide___")) {
__ds_global__.getContext().pluginElement.classList.remove("___ds-tampermonkey-hide___");
api.initArrowTitle(false);
} else {
__ds_global__.getContext().pluginElement.classList.add("___ds-tampermonkey-hide___");
api.initArrowTitle(true);
}
}
// 将箭头元素添加到插件div中
context.pluginElement.append(context.arrowElement);
}
api.initArrowTitle = (isHidden) => {
if (isHidden == null) {
isHidden = context.pluginElement.classList.contains("___ds-tampermonkey-hide___");
}
if (isHidden) {
context.arrowElement.title = "点击展示";
} else {
context.arrowElement.title = "点击隐藏";
}
}
// 隐藏插件
api.hidePlugin = () => {
if (context.pluginElement) {
context.pluginElement.classList.add("____ds-tampermonkey-hide____");
context.pluginElement.classList.add("___ds-tampermonkey-hide___");
api.GM_setValue("ds_hide", true);
}
}
// 显示插件
api.showPlugin = () => {
if (context.pluginElement) {
context.pluginElement.classList.remove("____ds-tampermonkey-hide____");
context.pluginElement.classList.remove("___ds-tampermonkey-hide___");
api.GM_deleteValue("ds_hide");
}
}
@ -274,6 +304,8 @@
api.createPluginStyle(options);
// 创建插件div
api.createPluginDiv(options);
// 创建箭头
api.createArrow(options);
// 保存参数
context.pluginOptions = options;
@ -318,7 +350,7 @@
// 创建菜单元素
const menuElement = document.createElement('div');
menuElement.id = menuCmdId;
menuElement.className = "____ds-menu____";
menuElement.className = "___ds-menu___";
menuElement.innerHTML = name;
if (options.title) {
menuElement.title = typeof options.title === "function" ? options.title() : options.title;

Loading…
Cancel
Save