seasonstar / time-clock-for-love Goto Github PK

View Code? Open in Web Editor NEW

This project forked from hackerzhou/love

Shawn Tang and Sherry Sun一起的计时钟

CSS 5.46% HTML 50.46% JavaScript 44.08%

time-clock-for-love's Introduction

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

使用说明

git clone https://github.com/seasonstar/time-clock-for-love.git
打开画图工具 drawer.html
绘制你想要的图像。
点击“导出图像路径”，得到x坐标和y坐标的数据
将所得x坐标和y坐标分别保存到index.html的x_coords和y_coords列表中
刷新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/，就可以看到了。