docs: function getWaterWavePath(radius, waterLevel, waveLength, phase, amplitude, cx, cy) {
    var curves = Math.ceil(2 * radius / waveLength * 4) * 2;
    var path = [];
  
    // map phase to [-Math.PI * 2, 0]
    while (phase < -Math.PI * 2) {
      phase += Math.PI * 2;
    }
    while (phase > 0) {
      phase -= Math.PI * 2;
    }
    phase = phase / Math.PI / 2 * waveLength;
  
    var left = cx - radius + phase - radius * 2;
    /**
     * top-left corner as start point
     *
     * draws this point
     *  |
     * \|/
     *  ~~~~~~~~
     *  |      |
     *  +------+
     */
    path.push(['M', left, waterLevel]);
  
    /**
     * top wave
     *
     * ~~~~~~~~ <- draws this sine wave
     * |      |
     * +------+
     */
    var waveRight = 0;
    for (var c = 0; c < curves; ++c) {
      var stage = c % 4;
      var pos = getWaterWavePositions(c * waveLength / 4, stage, waveLength, amplitude);
      path.push(['C', pos[0][0] + left, -pos[0][1] + waterLevel, pos[1][0] + left, -pos[1][1] + waterLevel, pos[2][0] + left, -pos[2][1] + waterLevel]);
  
      if (c === curves - 1) {
        waveRight = pos[2][0];
      }
    }
  
    /**
     * top-right corner
     *
     *                       ~~~~~~~~
     * 3. draws this line -> |      | <- 1. draws this line
     *                       +------+
     *                          ^
     *                          |
     *                  2. draws this line
     */
    path.push(['L', waveRight + left, cy + radius]);
    path.push(['L', left, cy + radius]);
    path.push(['L', left, waterLevel]);
    return path;
  }