waves.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. function Waves(options) {
  2. var defaults = {
  3. speed: 3,
  4. color: 100,
  5. intensity: 10,
  6. wavelen: 120,
  7. phase: 0,
  8. };
  9. var e = $.extend({}, defaults, options);
  10. for(x in e) this[x] = e[x];
  11. this.type = 'Waves';
  12. this.render = function(ctx) {
  13. var maxw = ctx.canvas.width;
  14. var cx, xy;
  15. ctx.save();
  16. ctx.translate(0, 50);
  17. ctx.beginPath();
  18. ctx.moveTo(0, 0);
  19. cy = Math.sin(this.phase) * this.intensity;
  20. for(var i = 0; i * this.wavelen <= 1000; i+=2) {
  21. //cy = 30;
  22. ctx.quadraticCurveTo(this.wavelen * i - (this.wavelen / 2), cy, this.wavelen * (i), 0);
  23. ctx.quadraticCurveTo(this.wavelen * i + (this.wavelen / 2), -cy, this.wavelen * (i + 1), 0);
  24. }
  25. ctx.lineWidth = 3;
  26. ctx.lineTo(1200, 0);
  27. ctx.lineTo(1200, 1200);
  28. ctx.lineTo(-200, 1200);
  29. ctx.lineTo(-200, 0);
  30. ctx.closePath();
  31. ctx.fillStyle = "#aabbff";
  32. ctx.fill();
  33. ctx.strokeStyle = '#112277';
  34. ctx.stroke();
  35. ctx.restore();
  36. };
  37. this.frameMove = function(te) {
  38. // this.
  39. //console.log(te);
  40. // console.log(this.phase);
  41. this.phase += 0.8 * te;
  42. this.phase = this.phase % (Math.PI * 2);
  43. };
  44. }