结合timeline插件的妙用

[eryajf]

通过对模板稍作调整，然后生成的内容结合timeline插件，就能生成一个看剧历程的效果。

我的模板如下：

---
author: eryajf
doubanId: {{id}}
title: {{title}}
type: {{type}}
score: {{score}}
originalTitle: {{originalTitle}}
genre: {{genre}}
datePublished: {{datePublished}}
director: {{director}}
actor: {{actor}}
author: {{author}}
tags: {{type}}
url: {{url}}
createTime: {{currentDate}} {{currentTime}}
desc: {{desc}}
tags: timeline 看剧历程
---

![image]({{image}})


<span class='ob-timelines' data-date='{{currentDate}} {{currentTime}}' data-title='{{title}}' data-img='{{image}}' data-class = "customCardCSS">this_is_desc</span> 

这里是正文内容

然后单独创建一个文件，内容如下：

```timeline
看剧历程
```

呈现效果如下：

但现在有一个问题是，豆瓣那里拿到的图片地址，在这里无法直接渲染，需要单独放到图床才能使用。

不知道作者有没有办法拿到诸如jpg的图呢？

[Wanxp]

感觉你的点子很好, 结合timeline的效果确实很棒, 我这边可以帮助一起实现.
根据你的描述大概需要以下roadmap:

• 获取项目(书影音)的个人评分, 评价 和当时给予的标签, 以及个人评价的时间
• 缓存豆瓣的封面至本地附件目录(jpg/png?)
• 其它看有需要补充的不
• (终极目标): 同步个人在豆瓣的观影/读书/音乐等记录, 其次是对个人广播/日记的同步.

除了终极目标4比较复杂之外, 1-2是比较好实现的,最近应该会上线. 第3项你看是否有什么需要补充不.

ps: {currentDate}} {{currentTime}} 是创建的当前Note的时间, 如果这个替换成未来将要上线的评价的时间(collectionDate)可能会更接近观影/阅读结束日期

[eryajf]

除了终极目标4比较复杂之外, 1-2是比较好实现的,最近应该会上线. 第3项你看是否有什么需要补充不.

期待1,2的上线，当第二项满足之后，其实这个时间线的需求就基本已经完美了。其他方面因为我对豆瓣用的不算深入，所以目前没有太多想法。

关于日期的问题，我个人觉得还好，毕竟过去一二十年看过的东西，都已经随时间消逝，现在能通过这个插件，相对记录一下，已经是很美妙的事情了，所以我个人对这个时间的精度要求不算很高，比如以后回头看，能知道某年某月看了啥，就够了。

[Wanxp]

目前 最新版本 v1.6.2 已经支持了附件的本地化缓存以及个人状态的同步(记得在插件中登录豆瓣)

[Wanxp]

第四个目标的改动与 #13 相同

[Inna0915]

请问大佬，目前配置如下，为何没有生成时间线。

[eryajf]

你是不是没有安装这个插件，参考我这里的文档：https://wiki.eryajf.net/pages/6ed7fe/#timelines

[Inna0915]

插件是装了的，我先试试你给的demo看看是否能正常生效。

[Inna0915]

大佬，测试了一下你给的demo，依然是没法预览，是不是和其他插件会冲突

[Inna0915]

新建仓库测试，只安装timelines插件可以实现预览

[eryajf]

如果新建仓库没有问题，那可能就是某个插件影响的，你可以打开控制台看看有没有报错啥的

[Inna0915]

• -控制台之前也看了，没有发现报错信息，插件装的有点多，看样子只能一个一个禁用测试了

[Inna0915]

大佬，问题刚才摸鱼定位到了，现在版本的timelines好像不支持date+time的格式目前只保留了date可以正常展示。
但是有一个新的问题，span中间怎么抓取到当前页面元数据里的desc呢？

[Wanxp]

流程参考#19 (comment)
仅作稍微的模板优化。
建议模板内容进行以下优化

1. data-date='{{myCollectionDate}}'，使用这个myCollectionDate参数，就是在timeline中展现你的评价/评论日期
2. >{{myComment}} |简介:{{desc}} 这个myComment参数就是你的评论，desc 就是电影描述
   如:

<span class='ob-timelines' data-date='{{myCollectionDate}}' data-title='{{title}}' data-img='{{image}}' data-class='customCardCSS'>{{myComment}}  |简介: {{desc}}</span> 

效果以及解释:

模板参考:

---
doubanId: {{id}}
title: {{title}}
type: {{type}}
score: {{score}}
myRate: {{myRate}}
originalTitle: {{originalTitle}}
genre: {{genre}}
datePublished: {{datePublished}}
director: {{director}}
actor: {{actor}}
author: {{author}}
tags: {{type}}, 我看过的电影, {{myTags}}
state: {{myState}}
url: {{url}}
createTime: {{currentDate}} {{currentTime}}
collectionDate: {{myCollectionDate}}
desc: {{desc}}
---

![image]({{image}})

Comment: 
---
{{myComment}}


<span class='ob-timelines' data-date='{{myCollectionDate}}' data-title='{{title}}' data-img='{{image}}' data-class = "customCardCSS">{{myComment}} |简介: {{desc}}</span> 

新增一个笔记，内容为

```timeline
我看过的电影
```

就能实现观影 timeline（时间线）效果。