本專案有兩大目的：

1. 學習 Vue.js
2. 填以前挖的坑

一直以來 macOS 都沒有一個足夠好用的 Plurk App，用慣了 macOS 下優質 App 的我想當然爾應當貢獻一下。雖然截止目前並不是一個十分活躍的噗浪使用者，希望做完之後除了變腦粉外，也能順便推廣 Plurk。附帶一題，最終的 App 會是全平臺的，順便連 Windows App 都給他上架一下 😈

目前專案在做完「Basic Layout #4 」和「Basic API Usage #5 」之後，整體的樣貌就慢慢可以想像了。因為 Plurk API 實在有些歷史，近年來的改動也不多，API 的部分只要隨著 UI 的演進慢慢擴增即可 🎉

以下是 v1.0 需完成事項：

📓 架構、套件

• 導入 vue-router #7
• 導入 vuex #15
• Plurks poling 實作 #24
• 導入 vuex-persistedstate
• 導入 vue-keep-scroll 需要自己改寫才能相容 vue 2
• Notification

🎁 UI

• THE 河道 #8
  • timeline day tag #14
  • other details polishment
• Plurk show 頁面 #10
• 個人頁面 Profile #12
  • THE 視差滾動 #16
  • Slider dot & animation
  • 追蹤、加朋友功能
• CRUD 剩餘項目
• Replurk 0cb5c2a
• Every programmer needs a DARK MODE #17
• 發文界面，希望是獨立 Pop out #18
• 回覆 Plurk 界面
• Top Plurks
• 收藏頁面
• THE 貼圖 emoticons
• 設定頁面
• Scroll to refresh

📜 雜項

• 完成過場動畫，無限逼近原生 App
• App theming，噗浪令人最喜愛的地方就是能用 css 自訂個人頁面，如果 App 也能達成就太好了。
  • themed scrollbar 如果改顏色主題，預設的看起來就不太和諧 http://www.hesido.com/web.php?page=customscrollbar #19
• config: always on top mainWindow.isAlwaysOnTop()、mainWindow.setAlwaysOnTop(true)
• 多帳號支援
• 用 BrowserWindow setBounds 的 API 做個漂亮的 Image viewer
• webpack resolve path，import 的更漂亮一點 3da1e67
• plurk content DOM event inject 7f92e41
  • image opener。對所有 image 註冊事件，按了之後開 BrowserWindow。不知道 Vue 裡面能不能直接幫 dom 加 listener，還是要直接加 jquery 咧 XD e1e0a7c
  • handle external link 7f92e41
• open external link in browser or customized BrowserWindow
• electron devtools

修正一下 merge 的方式，來個深層 merge

在 about 的 update() 塞個檢查 callback，沒有這個 user 就 fetch，應該就可以了

對啦 QQ 沒時間玩惹 QQ

才剛串完就知道有很多可以改善的地方 😅

可以參考 https://github.com/shockry/electron-oauth1 的一些做法。

導入 View Library 之後，external auth window 也可以整合到 electron 的 webview component 裡面，直接用一堆流程引導。

如 Screenshot，現在是用負的 margin 推出來的，需要修正

electron-builder 封裝成 asar 檔，然後 asar 就只是個壓縮檔，config.js 裡面的 key 就一起包進去啦。

雖然說 OAuth 的流程就是讓使用者知道誰拿的你資料，不過之後要想辦法改善。

現在的問題挺多 😓

TypeError: The header content contains invalid characters
    at ClientRequest.OutgoingMessage.setHeader (_http_outgoing.js:346:11)
    at new ClientRequest (_http_client.js:85:14)
    at Object.exports.request (http.js:31:10)

WTF 系列，OAuth 都設定好了，只差呼叫 API endpoint，卻又出這種問題 = =，找找看要怎麼修，如果無法就又要重刻 OAuth 了 Zzz

ipcActions:22

export const refreshTimeline = (plurkId) => {
  mainWindow().webContents.send('vuex:action', {
    action: 'fetchTimelinePlurks'
  });
};

不過倒也還好，因為本來就有 Timeline polling，等一下也會重刷到

在 Yukaii/cafenomad-app#11 終於千呼萬喚始出來的 Logo 倒也看起來不錯，這邊的進度也該繼續跑跑啦 😆

沒意外的話就是 Vue.js 了。

原本想玩玩 Aurelia，但一打開 skeleton 就是基八一大包，想直接腦內客製導入也麻煩。看到 vuejs 的模板專案 webpack-simple 的確非常 simple，導入時遇到 npm package dependency 的問題，rm -rf node_modules 之後重裝就沒事了。

https://github.com/taion/scroll-behavior

因為目前在 render plurk-card 元件時有傳遞下 userList 這個 Object，但有時 userList 卻是從 response API 拿到的，所以 user 會少原始噗主的。

把兩次 API 的使用者列表拿出來就解決了，之後 User 存到 vuex store 甚至做 cache 之後應該寫起來會更精簡。