waves

this.context.scale(DPR*this.width/414, DPR*this.height/736)

maxY += 100

var waves = [];

    for (var i = 0; i < 4; ++i) {

        var wave = new Wave();

        waves.push(wave);

        wave.obj.visible = false;

        scene.add(wave.obj);

    }

    activeWaves(waves, 2)

}

function Wave() {

    var geometry = new THREE.RingGeometry(2.2, 3, 25);

    var material = new THREE.MeshBasicMaterial({ color: 0xffffff, transparent: true });

    this.obj = new THREE.Mesh(geometry, material);

    // this.obj.rotation.x = -Math.PI / 2;

    this.reset = function () {

        this.obj.scale.set(1, 1, 1);

        this.obj.material.opacity = 1;

        this.obj.visible = false;

    }

};

function activeWaves(waves, amount) {

    var that = this;

    for (var i = 0; i < amount; ++i) {

        new TWEEN.Tween(waves[i].obj.scale).to({ x: 4, y: 4, z: 4 }, 2000 / (i / 2.5 + 2)).delay(i*200).start()

                .onStart( function () {

                    this.visible = true;

                    }.bind(waves[i].obj));

        new TWEEN.Tween(waves[i].obj.material).to({opacity: 0}, 2000 / (i / 2.5 + 2)).delay(i*200).start()

                .onComplete( function () {

                    waves[i].reset();

        });

    }

}