前端小專題: 來顆番茄鐘 (網頁倒數計時器)

功能

• 在倒數結束時發出桌面通知與音樂提醒使用者.
• 使用者可自訂工作/長休息/短休息三種不同模式的時間.
• 預設提供三種音樂讓使用者自訂提示鈴聲.
• 除基本的網頁對話框提示, 也提供桌面通知功能.
• 視窗列動態提供目前倒數時間
• 網頁背景輪播
• 設定是否自動循環計時(四段工作後一個長休息)
• 鈴聲音量調整
• 問題回報: Google表單

運用技術:

1. HTML5&CSS3
2. Bootstrap 3.3.7
3. JavaScript
4. jQuery

畫面截圖:

實際畫面	說明
	主畫面
	設定對話盒
	桌面通知
	視窗列時間顯示

參考資料來源:

• Tomato-Timer
• 番茄鐘工作法： 25 分鐘改變效率的 10 個番茄鐘工具
• 維基百科: 番茄鐘工作法
• Notification API