# tomato-pie

**Repository Path**: mamh-mixed/tomato-pie

## Basic Information

- **Project Name**: tomato-pie
- **Description**: https://github.com/mamh-mixed/tomato-pie
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-05-14
- **Last Updated**: 2023-04-23

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README


<p align="center">
  <img height="230" src="https://raw.githubusercontent.com/timqian/images/master/tomatopie-header.gif">
</p>

[![Join us](https://badgen.net/badge/Join%20the%20community%20of%20t9t.io/Get%20in%20touch/green)](https://t9t.io/#contact)

# Tomato Pie

A new UI for [Pomodoro Technique](https://en.wikipedia.org/wiki/Pomodoro_Technique). Peek into your working status with ease.

## Install

From [Chrome Web Store](https://chrome.google.com/webstore/detail/gffgechdocgfajkbpinmjjjlkjfjampi) or [manually](https://github.com/t9tio/tomato-pie/releases)

## [Recent updates](./blog)

## Features

- start new pomodoro from TODO list
- red part: 25 minutes for one tomato
- green part: 5 minutes for rest
- show tomatoes of last 12 hours on clock
- view tomato history on calendar
- override default page for new tab
- indicate time on the extension icon
- get notifications when a tomato is finished

## Screenshots

### Editing Todo list

![](https://raw.githubusercontent.com/timqian/images/master/tomatopie-intro1.gif)

### Doing Pomodoro

![](https://raw.githubusercontent.com/timqian/images/master/tomatopie-intro2.gif)

## Develop

1. `npm i`
1. `npm start`
1. Navigate to `chrome://extensions/`
1. Click the `load unpacked` button and load `dist` folder

## Architecture

store ==> render function ==> view =update=> store

## Build and publish

```bash
# update verision in src/manifest.json
npm run build
# zip dist file and upload to chrome webstore
```

## Refs

- Clock styles: https://codepen.io/collection/moAia/2/

#### Similar tools

- https://chrome.google.com/webstore/detail/marinara-pomodoro%C2%AE-assist/lojgmehidjdhhbmpjfamhpkpodfcodef
- https://chrome.google.com/webstore/detail/task-timer/aomfjmibjhhfdenfkpaodhnlhkolngif
- https://chrome.google.com/webstore/detail/timer/hepmlgghomccjinhcnkkikjpgkjibglj
- https://chrome.google.com/webstore/detail/timer-25-the-minimalist-t/gmdbcklinofignhfmibchnmgjcocccbh
- https://chrome.google.com/webstore/detail/timecamp-timer/ohbkdjmhoegleofcohdjagmcnkimfdaa
- https://chrome.google.com/webstore/detail/timer-25-the-minimalist-t/gmdbcklinofignhfmibchnmgjcocccbh

## Tech notes

- Make background.js always running [ref](https://stackoverflow.com/questions/17119266/how-do-i-keep-my-app-from-going-inactive):
  1. in`manifest.json`, add  `background` in `permission` key
  2. in `manifest.json`, don't add `persistence: false` in `background` key
- clock animation: https://codepen.io/Alca/pen/ZeKjmB

## Thanks

- Layla and [Joshua](https://github.com/joshua7v) for meaningful discussions