今天一鼓作气实现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原型工具之菜单三探 印象笔记同步的更多相关文章

  1. Pencil 基于Electron的GUI原型工具之菜单再探

    为什么要重试呢? 主要是觉得Pencil这个工具还是比较有价值.就像Linus对Linux下分发版的态度"让用户有选择"一样,在现在这个Sass服务.Web服务化越来越普遍越便利的 ...

  2. 4款最受欢迎的Mac原型工具

    原型工具中Wireframe, Mockup和prototype之间的有什么不同? 无论你是一名刚入行的UX/UI设计师,还是入行多年的老手,在制作原型的过程中一定接触或听说过其中很重要的三个原型术语 ...

  3. 基于 electron 实现简单易用的抓包、mock 工具

    背景 经常我们要去看一些页面所发出的请求时,经常会用到 Charles 做为抓包工具来进行接口抓取,但一方面市面是很多抓包工具都是收费或者无法二次开发的.当前我们团队大多数用的也都是 Charles, ...

  4. MonjaDB —— 基于 Eclipse 的 MongoDB GUI 客户端工具(转载)

    原文链接http://www.oschina.net/question/12_59707 MonjaDB 是一个 MongoDB 的 GUI 客户端工具,提供直观的 MongoDB 数据管理的功能,支 ...

  5. 30款基本UX工具 - 思维流程工具 & 原型工具

    来源:GBin1.com 现在的开发人员在建造网站时,注重的是布局和技术特性,但是往往忽略了更重要的一点,那就是用户体验. 如 果用户在使用的时候,不能简单清楚的知道该要如何操作,那么他们一定会选择另 ...

  6. 使用Squirrel创建基于Electron开发的Windows 应用安装包

    我们把自己开发的Electron应用发布之前,需要把app打包成简单的安装包,这样app更容易被获取,以此来发布我们的应用.我们可以参考Wix或其他的安装程序,但是对于Electron应用更好的打包程 ...

  7. 转载:开发者眼中最好的 22 款 GUI 测试工具

    对于很多同学来说gui程序的测试是一个难点,所以我从网上转载了一篇关于gui测试的一篇文章,里面罗列的很多工具,大家可以尝试一下学习学习. 英文原文:22 best GUI testing tools ...

  8. 开发者眼中最好的 22 款 GUI 测试工具

    1.Abbot - Java GUI 测试框架 Abbot是一个基于GUI的简单的Java测试框架,它能够帮助开发者测试Java用户界面. 它提供事件自动生成和验证Java GUI组件,使您能够轻松地 ...

  9. Pencil-一个开源免费的UI原型工具,自带ios和android模板

    Pencil是一个开源免费的UI原型工具,自带ios和android模板,可以很方便的做mockup. 下图是一个官方展示的模板:         

随机推荐

  1. 如何使用PHP的生成器yield处理大量数据业务

    官方解释yield yield生成器是php5.5之后出现的,官方文档这样解释:yield提供了一种更容易的方法来实现简单的迭代对象,相比较定义类实现 Iterator 接口的方式,性能开销和复杂性大 ...

  2. 我说精通字符串,面试官竟然问我 Java 中的 String 有没有长度限制?

    String 是 Java 中很重要的一个数据类型,除了基本数据类型以外,String 是被使用的最广泛的了,但是,关于 String,其实还是有很多东西容易被忽略的. 就如本文我们要讨论的问题:Ja ...

  3. sed命令:删除匹配行和替换

    删除以a开头的行 sed -i '/^a.*/d' tmp.txt -i 表示操作在源文件上生效.否则操作内存中数据,并不写入文件中.在分号内的/d表示删除匹配的行 替换匹配行: sed -i 's/ ...

  4. centos7开启,关闭防火墙

    1.查看防火墙状态 firewall-cmd --state 2.停止防火墙 systemctl stop firewalld.service 3.禁止防火墙开机启动 systemctl disabl ...

  5. 【数字图像分析】基于Python实现 Canny Edge Detection(Canny 边缘检测算法)

    Canny 边缘检测算法 Steps: 高斯滤波平滑 计算梯度大小和方向 非极大值抑制 双阈值检测和连接 代码结构: Canny Edge Detection | Gaussian_Smoothing ...

  6. CSS animation 属性

    定义和用法 animation属性是下列属性的一个缩写属性: animation-name animation-duration animation-timing-function animation ...

  7. iOS----------苹果警告

    Dear Developer, We identified one or more issues with a recent delivery for your app, "私募排排网-连接 ...

  8. Firebase-config 在android中的使用

    说明 firebase-config提供远程配置方案,可以通过远程控制app的基本配置方案更换工作.如在特定时间更换不同的App基础配色反感,更换基础显示图标等. firebase-config fi ...

  9. 每天一点产品思考(5):Web端链接跳转在当前页面刷新还是新标签页打开?

    一.与交互设计师的突然撕逼         今天阿白在验收产品的时候,在博客首页打开一篇博文,是在原先的页面进行刷新,而不是新开一个标签页打开.阿白让开发改成在新标签页中打开,但是开发说这是设计师设计 ...

  10. Element-ui中为上传组件添加表单校验

    vue所依赖的Element的UI库在使用其中的upload组件时,可能很大几率会遇到这个题,需要给upload组件添加表单校验 大家这里直接看代码就可以 <el-form-item class ...