Анимация огня и воды JavaScript

ТЗНужно сделать анимацию разгорающегося огня и водыЕсть картинка огня/водыОна должна быть анимирована по принципу стакана воды/огня. Стакан может быть пуст, а может быть полонПример http://bl.ocks.org/brattonc/5e5ce9beee483220e2f6В анимацию через Javascript будет подаваться число от 0. Где 0 - пусто, 300 и выше - заполненный объектПримеры в зависимости от цифры0 - картинка огня базовая100 - картинка огня и заполнение на 33%300 - картинка огня и заполнение на 100%500,600 и тд - картинка огня и заполнение на 100% (тоже самое что при 300)В момент когда у нас 100% заполнение, нужно как то сделать анимацию ярче, сочнее, объемнее. Можно добавить цвета, чуть увеличить в размерах возможно, сделать более контрастными цветаЛогика будет такая, что каждые 10 секунд через Javascript на анимацию будут подаваться значения для обновления состояния анимации. В идеале сделать плавный переход от прошлого состояния к текущему, как в примере на сайте (при загрузке страницы и ее обновлении выполняется переход от состояния 0 к новому)