Add swing offset and wave degrees to default balloon options close #251

src/balloons/default.ts

@@ -31,6 +31,16 @@ export type BalloonOptions = {
    * If not provided, the default sound will be used.
    */
   popSoundUrl: string;
+  /**
+   * The amount of pixels the balloon should wave back and forth.
+   *
+   * First `waveDegrees` to the right, return back to the center, then `waveDegrees` to the left.
+   */
+  swingOffset: number;
+  /**
+   * The degrees the balloon will tilt when back ant forth.
+   */
+  waveDegrees: number;
 };
 
 export default class Default extends Balloon {
@@ -40,6 +50,8 @@ export default class Default extends Balloon {
     dir_name: this.name,
     imageUrl: '/icon.png',
     popSoundUrl: '/pop.mp3',
+    swingOffset: 15,
+    waveDegrees: 8,
   };
 
   /**
@@ -109,6 +121,14 @@ export default class Default extends Balloon {
 
     // Set css variables
     this.element.style.setProperty('--rise-to', -size + 'px');
+    this.element.style.setProperty(
+      '--swing-offset',
+      this.options.swingOffset + 'px'
+    );
+    this.element.style.setProperty(
+      '--wave-deg',
+      this.options.waveDegrees + 'deg'
+    );
 
     // Set the balloon's width and height
     this.element.style.width = size + 'px';