Add minimal read-only timeline widget with playback playhead

[DhyaniKavya]

issue: #5097

Problem:-
Music Blocks plays music correctly, but users cannot see when notes happen in time.
All notes appear only as stacked blocks, which makes it hard for beginners to understand rhythm, timing, and how notes line up during playback.
There is currently no visual timeline to help users connect what they hear with when it happens.

Solution:-
This PR introduces a minimal, read-only timeline widget that visually shows playback timing using a moving playhead.
The timeline does not change how music is played or how blocks work.
It only reads existing timing data and displays it visually.

What Was Added:-
-A new timeline widget built using a canvas
-A simple horizontal timeline with a moving playhead
-The playhead stays in sync with music playback
-The widget follows existing widget patterns used in Music Blocks
-This is a first, intentionally simple version:

->No note visualization yet
->No interaction
->No UI menu entry (opened via console for testing)

Why This Approach?
The goal is to introduce the concept of a timeline without affecting existing behavior.
Keeping it minimal makes the change easy to review and provides a solid base for future improvements.

Files Changed:-
->New: js/widgets/timeline.js
->New: js/widgets/TIMELINE_TESTING.md
->Updated: js/activity.js
->Updated: js/logo.js

Only minimal integration changes were made.

How to Test?
-Run Music Blocks locally
-Open the browser console

Run:-
globalActivity.logo.timeline = new Timeline();
globalActivity.logo.timeline.init(globalActivity);

-Press Play and observe the moving playhead
-Music playback should behave exactly as before.

What This Does Not Change?
-No playback logic
-No block behavior
-No UI layout
-No music engine code

[github-actions]

❌ Some Jest tests failed. Please check the logs and fix the issues before merging.

Failed Tests:

status.test.js

[github-actions]

✅ All Jest tests passed! This PR is ready to merge.