场景: 将有道云笔记迁移到思源笔记
需要逐个笔记进行拷贝粘贴, 万恶的有道云笔记不支持图片的拷贝(大图片),需要保存为本地图片在插入到思源笔记。
当前的问题: 思源笔记插入图片的菜单比较远,需要二级菜单才能点到对应的功能,操作起来耗时费力。
期望:
方案 1: 添加“插入图片”的快捷键
方案 2: 在工具栏添加“插入图片”按钮
场景: 将有道云笔记迁移到思源笔记
需要逐个笔记进行拷贝粘贴, 万恶的有道云笔记不支持图片的拷贝(大图片),需要保存为本地图片在插入到思源笔记。
当前的问题: 思源笔记插入图片的菜单比较远,需要二级菜单才能点到对应的功能,操作起来耗时费力。
期望:
方案 1: 添加“插入图片”的快捷键
方案 2: 在工具栏添加“插入图片”按钮
我简单写了一个 js 片段, 不知道能否符合你的要求
// 增加按钮&快捷键实现: 插入图片或文件
// 修改有标记的配置 "[可修改]"
(async () => {
/*******************************自定义配置**************************************/
// 按钮id
const btn_e = {
/***********左上角**********/
// 返回按钮(左箭头)
barBack : "barBack",
// 前进按钮(右箭头)
barForward : "barForward",
// 同步按钮
barSync : "barSync",
// 皇冠图标
toolbarVIP : "toolbarVIP",
// 日历热力图插件
heatmap : "plugin_Calendar-heatmap_0",
/***********右上角**********/
// 搜索按钮
barSearch : "barSearch",
// 插件按钮
barPlugins : "barPlugins",
// 命令面板按钮
barCommand : "barCommand",
/***********左下角**********/
// 底栏中的隐藏侧栏按钮
barDock : "barDock",
/***********右下角**********/
// 底栏帮助按钮
statusHelp : "statusHelp",
}
// 插入位置
const position_e = {
// 插入位置: 目标元素前面
before : "beforebegin",
// 插入位置: 目标元素后面
after : "afterend",
}
// [可修改] 触发快捷键
const hotkey = "ctrl+alt+g"
// [可修改] 按钮 插入的位置 跟 哪个元素 有关
const btn_basic_id = btn_e.barForward
// [可修改] 按钮 插入到 元素 的前面还是后面
const btn_post = position_e.after
// [可修改] 按钮 的悬浮显示内容
const btn_tips = "插入图片或文件"
/*******************************代码分割线**************************************/
const icon_e = {
// 设置
setting : "iconSettings",
// 代码
code : "iconCode",
// 刷新
refresh : "iconRefresh",
// 调试
debug : "iconBug",
// 下方
after : "iconAfter",
// 下载
download : "iconDownload",
}
// 快捷键监听
document.addEventListener('keydown', event => {
console.log("hotkey")
if (checkShortcut(hotkey, event)) {
// 阻止默认行为,比如浏览器的保存网页操作
// event.preventDefault();
quickInsertImgFunc()
}
});
/* 重新加载会有延时, 所以需要等待1s之后再添加按钮 */
setTimeout(() => {
// 目标元素id, 插入位置, 新元素id, 显示内容, 图标, 点击回调
addElement(btn_basic_id, btn_post, "custom_quick_inser_img", btn_tips, icon_e.download, quickInsertImgFunc);
}, 1000);
function checkShortcut(hostkey, event) {
const keys = hostkey.split("+");
const key = event.key.toLowerCase();
const isCtrl = event.ctrlKey ? "ctrl+" : "";
const isAlt = event.altKey ? "alt+" : "";
const isShift = event.shiftKey ? "shift+" : "";
const combination = isAlt + isCtrl + isShift + key;
// console.log(keys.sort().join("+"))
// console.log(combination)
return keys.sort().join("+") === combination;
}
// 目标元素id, 插入位置, 新元素id, 显示内容, 图标, 点击回调
function addElement(targetId, position, newElementId, displayContent, icon, clickCallback) {
let barMode = document.getElementById(targetId);
if (barMode === null) {
return ""
}
barMode.insertAdjacentHTML(
position,
`<div id="${newElementId}" class="toolbar__item ariaLabel" aria-label="${displayContent}"></div>`
);
let newBtn = document.getElementById(newElementId);
if (newBtn === null) {
return ""
}
newBtn.innerHTML = `<svg><use xlink:href="#${icon}"></use></svg>`;
newBtn.addEventListener("click", clickCallback);
return newElementId
}
function quickInsertImgFunc() {
const more_btn = document.querySelector('.layout__center [data-type="more"]:not([data-menu]');
if (more_btn) {
more_btn.click();
setTimeout(() => {
const insert_btn = document.querySelector('#commonMenu > div.b3-menu__items > button:nth-child(1) > span > input');
if (insert_btn) {
insert_btn.click();
}
}, 200);
}
}
})()
Mozilla Firefox 中文俗称“火狐”(正式缩写为 Fx 或 fx,非正式缩写为 FF),是一个开源的网页浏览器,使用 Gecko 排版引擎,支持多种操作系统,如 Windows、OSX 及 Linux 等。
前端技术一般分为前端设计和前端开发,前端设计可以理解为网站的视觉设计,前端开发则是网站的前台代码实现,包括 HTML、CSS 以及 JavaScript 等。
Markdown 是一种轻量级标记语言,用户可使用纯文本编辑器来排版文档,最终通过 Markdown 引擎将文档转换为所需格式(比如 HTML、PDF 等)。
用爱发电 (Programming With Love) 是一个以开源精神为核心的民间开源爱好者技术组织,“用爱发电”象征开源与贡献精神,加入组织,代表你将遵守组织的“个人开源爱好者”的各项条款。申请加入:用爱发电组织邀请帖。
用爱发电组织官网:https://programmingwithlove.stackoverflow.wiki/
Sublime Text 是一款可以用来写代码、写文章的文本编辑器。支持代码高亮、自动完成,还支持通过插件进行扩展。
星云链是一个开源公链,业内简单的将其称为区块链上的谷歌。其实它不仅仅是区块链搜索引擎,一个公链的所有功能,它基本都有,比如你可以用它来开发部署你的去中心化的 APP,你可以在上面编写智能合约,发送交易等等。3 分钟快速接入星云链 (NAS) 测试网
Spring 是一个开源框架,是于 2003 年兴起的一个轻量级的 Java 开发框架,由 Rod Johnson 在其著作《Expert One-On-One J2EE Development and Design》中阐述的部分理念和原型衍生而来。它是为了解决企业应用开发的复杂性而创建的。框架的主要优势之一就是其分层架构,分层架构允许使用者选择使用哪一个组件,同时为 JavaEE 应用程序开发提供集成的框架。
七牛云是国内领先的企业级公有云服务商,致力于打造以数据为核心的场景化 PaaS 服务。围绕富媒体场景,七牛先后推出了对象存储,融合 CDN 加速,数据通用处理,内容反垃圾服务,以及直播云服务等。
MyBatis 本是 Apache 软件基金会 的一个开源项目 iBatis,2010 年这个项目由 Apache 软件基金会迁移到了 google code,并且改名为 MyBatis ,2013 年 11 月再次迁移到了 GitHub。
Ruby 是一种开源的面向对象程序设计的服务器端脚本语言,在 20 世纪 90 年代中期由日本的松本行弘(まつもとゆきひろ/Yukihiro Matsumoto)设计并开发。在 Ruby 社区,松本也被称为马茨(Matz)。
JavaScript 一种动态类型、弱类型、基于原型的直译式脚本语言,内置支持类型。它的解释器被称为 JavaScript 引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在 HTML 网页上使用,用来给 HTML 网页增加动态功能。
上帝为你关上了一扇门,然后就去睡觉了....努力不一定能成功,但不努力一定很轻松 (° ー °〃)
面试造航母,上班拧螺丝。多面试,少加班。
有什么新发现就分享给大家吧!
Web Clipper 是一款浏览器剪藏扩展,它可以帮助你把网页内容剪藏到本地。
Log4j 是 Apache 开源的一款使用广泛的 Java 日志组件。
Java 是一种可以撰写跨平台应用软件的面向对象的程序设计语言,是由 Sun Microsystems 公司于 1995 年 5 月推出的。Java 技术具有卓越的通用性、高效性、平台移植性和安全性。
Gitea 是一个开源社区驱动的轻量级代码托管解决方案,后端采用 Go 编写,采用 MIT 许可证。
iOS 是由苹果公司开发的移动操作系统,最早于 2007 年 1 月 9 日的 Macworld 大会上公布这个系统,最初是设计给 iPhone 使用的,后来陆续套用到 iPod touch、iPad 以及 Apple TV 等产品上。iOS 与苹果的 Mac OS X 操作系统一样,属于类 Unix 的商业操作系统。
Hibernate 是一个开放源代码的对象关系映射框架,它对 JDBC 进行了非常轻量级的对象封装,使得 Java 程序员可以随心所欲的使用对象编程思维来操纵数据库。
Latke 是一款以 JSON 为主的 Java Web 框架。
C 语言是一门通用计算机编程语言,应用广泛。C 语言的设计目标是提供一种能以简易的方式编译、处理低级存储器、产生少量的机器码以及不需要任何运行环境支持便能运行的编程语言。
NGINX 是一个高性能的 HTTP 和反向代理服务器,也是一个 IMAP/POP3/SMTP 代理服务器。 NGINX 是由 Igor Sysoev 为俄罗斯访问量第二的 Rambler.ru 站点开发的,第一个公开版本 0.1.0 发布于 2004 年 10 月 4 日。
ZeroNet 是一个基于比特币加密技术和 BT 网络技术的去中心化的、开放开源的网络和交流系统。
webpack 是一个用于前端开发的模块加载器和打包工具,它能把各种资源,例如 JS、CSS(less/sass)、图片等都作为模块来使用和处理。
为成为自由职业者在家办公而努力吧!
欢迎来到这里!
我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。
注册 关于