Pencil 基于Electron的GUI原型工具之菜单三探 印象笔记同步
今天一鼓作气实现Pencil整合印象笔记同步的功能。
缘起,像Sketch或者Adobe XD等一些工具都开始陆续支持整合阿里巴巴的“语雀”云服务,将设计文档同步到云端,便于团队协作及实现其它一些目的。
原本也是想以实现语雀为目标的,后续一想不是其付费用户,自己的需求并不强烈,所以暂时作罢,转而实现更广泛使用的印象笔记同步。
目前已完成基于沙盒的测试。
PS:我只是一个伪装成程序员的产品经理。
先实现 单向同步;
涉及到的功能:
- 1、增加两个菜单,印象笔记授权/取消印象笔记授权、同步文档到印象笔记;
功能设计;
- 1、实现印象笔记用户授权
- 2、保存印象笔记授权信息到本地;
- 3、调用接口实现文档同步;ENML数据格式、附件;文档标题-文件名?文档内容-各个页面层级列表;文档附件-epgz文档;






知识点:
- 1、印象笔记,认证 token 是由印象笔记 API 在 OAuth 认证流程结束时生成的。对于大多数[1] 印象笔记应用而言,这些 token 会在一年之后过期;
- 2、Electron,
browserWindow.webContents.on("will-redirect", function(event, url, isInPlace) {});; - 3、缓存的授权信息通过Pencil的Config 来存取;
代码改动记录:
https://gitee.com/web3d/pencil/commit/eb16ff35488a40c2c7b81bfd133f329eefde7316
var note = new Evernote.Types.Note();
note.title = this.controller.getDocumentName();
var noteBody = 'Pencil Document Attachment<br />';
var resources = [{
mime: 'application/epgz',
data: {
// bodyHash: '',
// size: 0,
body: fs.readFileSync(this.controller.documentPath),
},
attributes: {
fileName: note.title + this.getActiveHandler().type,
attachment: true,
}
}];
note.resources = resources;
note.attributes = {
contentClass: 'vn.evolus.pencil',
};
var md5 = require('crypto').createHash('md5');
for (i in resources) {
md5.update(resources[i].data.body);
var hexhash = md5.digest('hex');
noteBody += "<en-media type=\"" + resources[i].mime + "\" hash=\"" + hexhash + "\" /><br />"
}
var nBody = "<?xml version=\"1.0\" encoding=\"UTF-8\"?>";
nBody += "<!DOCTYPE en-note SYSTEM \"http://xml.evernote.com/pub/enml2.dtd\">";
nBody += "<en-note>" + noteBody + "</en-note>";
note.content = nBody;
// note.notebookGuid = '';
var noteStore = authenticatedClient.getNoteStore();
noteStore.createNote(note).then(function (note) {
console.log(JSON.stringify(note));
ApplicationPane._instance.unbusy();
Dialog.alert("文档同步成功: " + note.guid);
// noteStore.getNote(note.guid, true, true, true, true).then(function (note) {
// console.log(JSON.stringify(note)); // the user's notebooks!
// });
});
后续读取参数放在 package.json 配置的。
https://gitee.com/web3d/pencil/commit/87bc4bc93c038290fd355e44f36afc24d7b6e8f3
Pencil 基于Electron的GUI原型工具之菜单三探 印象笔记同步的更多相关文章
- Pencil 基于Electron的GUI原型工具之菜单再探
为什么要重试呢? 主要是觉得Pencil这个工具还是比较有价值.就像Linus对Linux下分发版的态度"让用户有选择"一样,在现在这个Sass服务.Web服务化越来越普遍越便利的 ...
- 4款最受欢迎的Mac原型工具
原型工具中Wireframe, Mockup和prototype之间的有什么不同? 无论你是一名刚入行的UX/UI设计师,还是入行多年的老手,在制作原型的过程中一定接触或听说过其中很重要的三个原型术语 ...
- 基于 electron 实现简单易用的抓包、mock 工具
背景 经常我们要去看一些页面所发出的请求时,经常会用到 Charles 做为抓包工具来进行接口抓取,但一方面市面是很多抓包工具都是收费或者无法二次开发的.当前我们团队大多数用的也都是 Charles, ...
- MonjaDB —— 基于 Eclipse 的 MongoDB GUI 客户端工具(转载)
原文链接http://www.oschina.net/question/12_59707 MonjaDB 是一个 MongoDB 的 GUI 客户端工具,提供直观的 MongoDB 数据管理的功能,支 ...
- 30款基本UX工具 - 思维流程工具 & 原型工具
来源:GBin1.com 现在的开发人员在建造网站时,注重的是布局和技术特性,但是往往忽略了更重要的一点,那就是用户体验. 如 果用户在使用的时候,不能简单清楚的知道该要如何操作,那么他们一定会选择另 ...
- 使用Squirrel创建基于Electron开发的Windows 应用安装包
我们把自己开发的Electron应用发布之前,需要把app打包成简单的安装包,这样app更容易被获取,以此来发布我们的应用.我们可以参考Wix或其他的安装程序,但是对于Electron应用更好的打包程 ...
- 转载:开发者眼中最好的 22 款 GUI 测试工具
对于很多同学来说gui程序的测试是一个难点,所以我从网上转载了一篇关于gui测试的一篇文章,里面罗列的很多工具,大家可以尝试一下学习学习. 英文原文:22 best GUI testing tools ...
- 开发者眼中最好的 22 款 GUI 测试工具
1.Abbot - Java GUI 测试框架 Abbot是一个基于GUI的简单的Java测试框架,它能够帮助开发者测试Java用户界面. 它提供事件自动生成和验证Java GUI组件,使您能够轻松地 ...
- Pencil-一个开源免费的UI原型工具,自带ios和android模板
Pencil是一个开源免费的UI原型工具,自带ios和android模板,可以很方便的做mockup. 下图是一个官方展示的模板:
随机推荐
- React中useEffect使用
2019-08-24 07:00:00 文摘资讯 阅读数 1364 收藏 博文的原始地址 之前我们已经掌握了useState的使用,在 class 中,我们通过在构造函数中设置 this.s ...
- Unity Package包内插件解锁
起因: 新版的Unity将模块工具与游戏中的资源文件分开放置,但有一个问题,里边的插件都是只读的,无法添加内容,连创建都是灰色的orz: 要想给这些插件添加一些别的自定义功能,那基本等于做梦,而且插件 ...
- hive引擎的选择:tez和spark
背景 mr引擎在hive 2中将被弃用.官方推荐使用tez或spark等引擎. 选择 tez 使用有向无环图.内存式计算. spark 可以同时作为批式和流式的处理引擎,减少学习成本. 问题& ...
- 给HttpClient添加请求头(HttpClientFactory)
前言 在微服务的大环境下,会出现这个服务调用这个接口,那个接口的情况.假设出了问题,需要排查的时候,我们要怎么关联不同服务之间的调用情况呢?换句话就是说,这个请求的结果不对,看看是那里出了问题. 最简 ...
- Java电商项目-1.构建数据库,搭建项目环境
目录 到Github获取源码请点击此处 一. 数据库还原 二. Mybatis逆向生成工具的使用 三. 搭建项目环境 四. 在linux虚拟机上部署zookeeper, 搭建Dubbo服务. linu ...
- C# Newtonsoft.Json 读取文件,返回json字符串
第一种方法: public object getData2() { string content; using (StreamReader sr = new StreamReader(Server.M ...
- python基础教程:dir()和__dict__属性的区别
只要是有属性的数据对象(不一定是面向对象的对象实例,而是指具有数据类型的数据对象),都可以通过- ---- __dict__和dir()来显示数据对象的相关属性. __ dict__可以看作是数据对象 ...
- 高强度学习训练第九天总结:5道剑指offer的题目
实在不想看JVM了.刷几道剑指Offer的题,今天就水一水吧,脑子迷糊. 1.二维数组中的查找 在一个二维数组中(每个一维数组的长度相同),每一行都按照从左到右递增的顺序排序,每一列都按照从上到下递增 ...
- 采坑 - LODOP,打印预览
结合 layui.弹出框内容样式如下: 红框表示,左右的内边距. 图一 打印预览的样式如下:红框表示,左右的内边距. 图二 要根据图二的左右内边距,去修改图一的左右内边距.不然会影响正文内容高度的判断 ...
- opencv::基于颜色跟踪检测
基于颜色跟踪 inRange过滤 形态学操作提取 轮廓查找 外接矩形获取 位置标定