freeCodeCamp 番茄工作法计时器

目标: 在 CodePen.io 上做一个类似于 http://codepen.io/FreeCodeCamp/full/VemPZX 的 APP.
规则 #1: 代码是开源的，你可以借鉴，但请不要抄袭。
规则 #2: 可以使用你喜爱的任何库来定制属于你自己的风格，实现下面的功能.
功能: 可以启动一个 25 分钟的番茄钟, 计时器将在 25 分钟后停止.
功能: 可以重置番茄钟的状态以便启动下一次计时.
功能: 可以为每个番茄钟自定义时长.

在上不少关于干货的文章都有介绍过番茄工作法，即设定固定的学习时间，在这段时间内心无旁骛的学习，再休息相应的时间，休息时间结束后继续学习。这就是番茄工作法，劳逸结合。
这边用angularjs的方式实现番茄工作法计时器的小实例：

• session流逝的时间用绿颜色填充
• break流逝的时间用红色填充
• 单击计时器可以暂停计时器
• 暂停状态才可以修改session和break的值，否则不可以修改

    
    
    



    
FreeCodeCamp
    

        

            

                
                

                    
break length
                    -{{breakLength}}
                    +
                
                
                

                    
session length
                    -{{sessionLength}}
                    +
                
            
        
        

            

                
{{sessionName}}
                
{{timeLeft}}

            
        
    

session时间流逝.gif

break时间流逝.gif

代码github地址：https://github.com/Iris-mao/css-tricks/tree/master/Pomodoro-Clock