Time clock for love

Shawn Tang and Mary Zhang 一起的计时器

A HTML5 page using codes to express a programmer's romance for his girl.

用以表达程序员的浪漫，给你身边的女生惊喜。

设计了画图工具，希望能让非程序员也能玩起来。

Demo

Screenshot

使用说明

0. git clone https://github.com/seasonstar/time-clock-for-love.git

1. 打开 画图工具 drawer.html

2. 绘制你想要的图像。

3. 点击“导出图像路径”，得到x坐标和y坐标的数据

4. 将所得x坐标和y坐标 分别保存到index.html的x_coords和y_coords列表中

5. 刷新index.html页面。

Flower Effect

flower效果在js/garden.js上设置.

    Garden.options = {
        petalCount: {   // 花瓣数
            min: 8,
            max: 15
        },
        petalStretch: { // 花瓣伸展度
            min: 0.1,
            max: 3
        },
        growFactor: {   // 生长因素
            min: 0.1,
            max: 1
        },
        bloomRadius: {  // 绽开半径
            min: 5,
            max: 8
        },
        density: 10,    // 密度
        growSpeed: 1000 / 60,    // 绽开速度
        color: {        // RGBA颜色
            rmin: 128,
            rmax: 255,
            gmin: 0,
            gmax: 128,
            bmin: 0,
            bmax: 128,
            opacity: 0.1
        },
    };

Drawer 画图工具

drawer.html 可帮助你绘制想要的图案

将绘制得到的x坐标和y坐标的数据，分别保存到index.html的x_coords和y_coords列表中

deploy

部署到你个人的github上

git clone https://github.com/seasonstar/time-clock-for-love.git

cd time-clock-for-love

git branch gh-pages

git checkout gh-pages

git push origin gh-pages

然后打开http://<自己的账号名>.github.io/time-clock-for-love/，就可以看到了。

End

你可以画生日蛋糕，爱心，画任何你想表达的东西。 预祝您成功撩妹。