Update public/AnimSys.js

public/AnimSys.js

@@ -14,35 +14,41 @@ class AnimSys {
       this.UI.id('ui-container');
       
       this.createFrame_btn = createButton('<i class="fa-solid fa-circle-plus"></i>');
-      this.createFrame_btn.mousePressed(this.create_new_frame.bind(this));
+      this.createFrame_btn.mousePressed(this.create_new_frame.bind(this))
+        .attribute('title', 'Create new virgin frame');
       //this.createFrame_btn.parent(this.UI);
       this.createFrame_btn.parent('right-panel');
       
       this.show_onion_btn = createButton('<span class="spec-onions"><i class="fa-regular fa-circle"></i><i class="fa-solid fa-circle"></i><span>');
-      this.show_onion_btn.mousePressed(this.switch_onions.bind(this));
+      this.show_onion_btn.mousePressed(this.switch_onions.bind(this))
+        .attribute('title', 'Show onions');
       //this.show_onion_btn.parent(this.UI);
       this.show_onion_btn.parent('right-panel');
       
       this.hide_onion_btn = createButton('<span class="spec-onions"><i class="fa-regular fa-circle"></i><i class="fa-solid fa-circle"></i><span>').hide();
       this.hide_onion_btn.id('hide-onion-btn');
-      this.hide_onion_btn.mousePressed(this.switch_onions.bind(this));
+      this.hide_onion_btn.mousePressed(this.switch_onions.bind(this))
+        .attribute('title', 'Hide onions');
       //this.hide_onion_btn.parent(this.UI);
       this.hide_onion_btn.parent('right-panel');
       
       this.clear_frame_btn = createButton('<i class="fa-solid fa-hand-sparkles"></i>');
-      this.clear_frame_btn.mousePressed(this.clear_frame.bind(this));
+      this.clear_frame_btn.mousePressed(this.clear_frame.bind(this))
+        .attribute('title', 'Clear the canvas');
       //this.clear_frame_btn.parent(this.UI);
       this.clear_frame_btn.parent('left-panel');   
       
       this.play_btn = createButton('<i class="fa-solid fa-play"></i>');
       this.play_btn.id('play-btn');
-      this.play_btn.mousePressed(this.play_anim.bind(this));
+      this.play_btn.mousePressed(this.play_anim.bind(this))
+        .attribute('title', 'Play animation');
       //this.play_btn.parent(this.UI);
       this.play_btn.parent('right-panel');
       
       this.stop_btn = createButton('<i class="fa-solid fa-pause"></i>').hide();
       this.stop_btn.id('stop-btn');
-      this.stop_btn.mousePressed(this.play_anim.bind(this));
+      this.stop_btn.mousePressed(this.play_anim.bind(this))
+        .attribute('title', 'Pause animation');
       //this.stop_btn.parent(this.UI);
       this.stop_btn.parent('right-panel');