A reimplementation of Winamp 2.9 in HTML5 and JavaScript with full skin support

Overview

gzip size Tests Discord

Webamp

A reimplementation of Winamp 2.9 in HTML5 and JavaScript with full skin support. As seen on TechCrunch, Motherboard, Gizmodo, Hacker News (1, 2, 3, 4), and elsewhere.

Screenshot of Webamp

Check out this Twitter thread for an illustrated list of features. Works in modern versions of Edge, Firefox, Safari and Chrome. IE is not supported.

Add Webamp to Your Site

Here is the most minimal example of adding Webamp to a page:

<div id="app">div>
<script src="https://unpkg.com/webamp">script>
<script>new Webamp().renderWhenReady(app);script>

For more examples, including how to add audio files, check out examples/ directory and the API documentation.

About This Repository

Webamp uses a monorepo approach, so in addition to the Webamp NPM module, this repository contains code for a few closely related projects and some pieces of Webamp which are published as standalone modules:

Community

Join our community chat on Discord: https://discord.gg/fBTDMqR

Related communites:

In the Wild

An incomplete list of websites using Webamp:

Thanks

  • Butterchurn, the amazing Mikdrop 2 WebGL implementation. Built and integrated into Webamp by: jberg
  • Research and feature prototyping: @PAEz
  • Beta feedback, catching many small UI inconsistencies: LuigiHann
  • Beta feedback and insider answers to obscure Winamp questions: Darren Owen
  • Donating the webamp NPM module name: Dave Eddy

Thank you to Justin Frankel and everyone at Nullsoft for Winamp which inspired so many of us.

License

While the Winamp name, interface, and, sample audio file are surely property of Nullsoft, the code within this project is released under the MIT License. That being said, if you do anything interesting with this code, please let me know. I'd love to see it.

Comments
  • Mp3 tags and info

    Mp3 tags and info

    First up that code I put up for reading header info failed on a couple of files, but pretty sure I know why and it will be fixed in the next couple of days. Plus Ill be extending it and making it do more like error checking (sooooooo boring). I wrote that just by looking at the specs and not other peoples code (except the lookup tables, im lazy) so as to avoid having to use their licences....plus it was a real fun challenge. But now Ill go and look around and see what else needs adding to make it more complete.

    At some point your going to need this stuff and was wondering if you still think.... https://github.com/aadsm/JavaScript-ID3-Reader ...is what you want to use? Ive been looking at it and its real good, but I cant test on other devices as I dont own any and so cant comment on that. The only real problem I saw for your needs was that it was using a string to hold its binary data and that meant youd have to first convert your mp3 to a string which is dumb considering your already have it as arraybuffer. So Ive patched it to be able to use an arraybuffer (Ill send them a pull request later), so now it doesnt have to reproduce the file once again, plus itll be quicker. On speed, Ive noticed a couple of things in that code that could be speed up and Ill prolly do them at some time. And if its going to use an arraybuffer I could add even more optimisations if they want. If this is the one you want to use then Ill get my info stuff more robust and then Ill see if/how they want to add it in.

    enhancement 
    opened by PAEz 18
  • Integration with music-metadata

    Integration with music-metadata

    Integeration with music-metadata:

    • [x] Read basic metadata:
      • artist
      • title
      • picture
    • Extract format information
      • [x] duration
      • bit-rate indicator for:
        • [x] MP3
        • [x] FLAC
      • [x] sample-rate
    • Integration requirements
      • Be able to read (convert to stream) data source 'formats'
        • [x] Blobs
        • [x] URLs
        • [x] Ensure size passed to stream parser.
        • [x] Be able to handle undefined or wrong MIME-type (Borewit/music-metadata#110)
        • [x] Be able to handle MIME-type with paramater (Borewit/music-metadata#114)
      • streaming API (I can't afford to download the entire file to get meta data)
        • [x] Partial read file though a stream
        • Descope: Support HTTP/XHR. using range requests.
          • Borewit/music-metadata#119
          • Borewit/strtok3#11
      • [x] Lazy loading of format specific metadata parser:
        • Issue: Borewit/music-metadata#117
        • Pull-request: Borewit/music-metadata#118

    I propose to finalize this pull request with:

    • [x] Create a flag to skip searching for an ID3v1 header (Borewit/music-metadata#121)
    • [x] Restore the [pre-cached metadata]

    Related to:

    • #114 Mp3 tags and info
    • #19 Populate meta data from media file
    opened by Borewit 17
  • MIME limitations

    MIME limitations

    Should probably implement MIME type/file extension limitations for opening. This can easily be done with <input type="file" accept="audio/*" />

    Not so sure how the drag and drop feature handles this.

    Also take into consideration Web Audio API limitations on what files it can natively open. Unless start finding libraries/codec for alternative file types such as FLAC/MIDI

    enhancement 
    opened by sethiroth66 17
  • Missing opcode 255?

    Missing opcode 255?

    https://archive.org/cors/winampskin_BLAKK/BLAKK.wal has a file boombox2.maki which seems to contain an opcode 255 which we've never seen before. It's possible that some other parsing error before that point is causing a bad reading.

    Modern 
    opened by captbaritone 16
  • Electron Windowing Challenges

    Electron Windowing Challenges

    Winamp consists of n windows. The three "main" windows which we already have, but also arbitrarily many additional menus as provided by plugins and other built in features like the browser. Windows in Electron have a number of limitations. Each one is a different HTML document, and they can only talk to each-other via a message protocol. The good news is that our Redux architecture is friendly to a messaging bus approach. However, I see a few real challenges which may make robust Electron support infeasible.

    Does anyone see other solutions to these problems?

    Visualizing audio in multiple windows

    The visualization data is only available in the same context (HTML document) as the actual audio element. For example, we could keep the audio source in the context of the main window, and that would make it easy to have the visualizations work in the main window. However, how would we also support other visualization windows like, the visualizer that can appear in the playlist if it's expanded and the main window is closed?

    screen shot 2018-02-17 at 9 58 06 pm

    How do we handle the AVS visualizer window (which I'm hoping we can get done eventually)?

    screen shot 2018-02-17 at 9 59 52 pm

    It's possible that we could broadcast the relevant audio data across the message bus, but the the serialization/deserialization requited, I'm skeptical that the latency will be acceptable. Maybe we should try this?

    Other challenges

    Here are some other challenges which I foresee which are probably possible to solve, but might require some somewhat crazy hacks.

    1. Winamp2-js depends upon a huge dynamically generated CSS stylesheet which is generated when the skin is parsed. Do we send this across the message bus and ensure that each window is listening? Possible I suppose.
    2. Selecting files from windows that don't own the audio source might be hard. We would have to find some way to serialize the selection, send it over the message bus and then load it from the window that actually owned the audio source.
    3. I don't see a solution to the rounded corners added on MacOS.
    Electron 
    opened by captbaritone 16
  • not playing anything on safari iphone

    not playing anything on safari iphone

    Hi, the player plays everything normal on the web, and was playing before on safari iphone, but today I checked and it doesn't ... Any leads on how to get it back to work on mobile?

    Thanks

    opened by itwjagbps 13
  • Open/Add to playlist api

    Open/Add to playlist api

    It would be nice if you could add to playlist or open file using File object (or url) and api instead only using drag & drop and dropdown menu, so you can get the file from server convert it to File object and then use that to play the song.

    I plan to create OS like app with terminal/file browser/internet browser and want to add media player (already have all the parts), it would be nice to have a way to open file from server side file browser using ajax or just url (but url may be not enough because the browser can open files not accessible from url only using ajax api).

    opened by jcubic 12
  • Store state in localStorage

    Store state in localStorage

    It would be great if the state of the entire app would be stored in localStorage (or IndexedDB), so the next time I visit the page everything is setup as before.

    What could be stored?

    • window size & position
    • playlist
    • equalizer setting
    • active Winamp skin / all uploaded Winamp skins
    • play position
    enhancement help wanted 
    opened by idleberg 11
  • [WIP] Extend drop target behaviour for objects

    [WIP] Extend drop target behaviour for objects

    Extends drop target behaviour for objects. Not ready yet, but this is a step towards making Webamp more flexible to accept external media classes.

    The current limitation is that the drop target only accepts dragged data stored in dataTransfer.files. This is impossible to generate within the browser, but we can enforce to pass data using setData("files") and retrieve/parse it in the drop target.

    I am also introducing a mediaType tag which can be used later on to decide which media class to use. (e.g. a Spotify media class)

    We can easily enforce the files object to have a specific shape in order to be recognized by Webamp, and reject them if they don't?

    {
      defaultName: string;
      duration: Number;
      type: string;
      metaData: {
          mediaType: string;
      }
    }
    

    winampifydrop

    opened by remigallego 10
  • Text is not correctly showed of unicode (Chinese)

    Text is not correctly showed of unicode (Chinese)

    image

    Windows 10 + Chrome 63

    Above Chinese Song names as below:

    李健 - 风吹麦浪.mp3
    林俊杰 - 不潮不用花钱.mp3
    罗凯楠 - 咱们屯里人 (粤语) (《夏洛特烦恼》电影插曲).mp3
    那英 - 梦一场 + 南山南 (Live).mp3
    宋冬野 - 斑马,斑马.mp3
    王心凌 - 当你.mp3
    庾澄庆 - 热情的沙漠 (Live).mp3
    岳云鹏 - 五环之歌 (《煎饼侠》电影推广曲).mp3
    张杰 - 闹啥子嘛闹 (Bouns Track).mp3
    张学友 - 每次都想呼喊你的名字.mp3
    张学友 - 想和你去吹吹风.mp3
    长宇 - See You Again (Live).mp3
    赵大格 - 我在人民广场吃炸鸡 (Live).mp3
    赵英俊 - 大王叫我来巡山 (《万万没想到》电影插曲).mp3
    周杰伦 - 青花瓷 (Live).mp3
    庄心妍 - 真的不容易.mp3
    크레용팝 (Crayon Pop) - 빠빠빠 (Bar Bar Bar).mp3
    
    opened by futurist 9
  • Replace loading.gif with text (maybe with css animation)

    Replace loading.gif with text (maybe with css animation)

    loading.gif is 23.5KB, which is 15% of our total payload. That seems kinda dumb. I think we load quickly enough that we should just have a text loading message.

    opened by captbaritone 9
  • Bump express from 4.17.1 to 4.17.3 in /packages/skin-database

    Bump express from 4.17.1 to 4.17.3 in /packages/skin-database

    Bumps express from 4.17.1 to 4.17.3.

    Release notes

    Sourced from express's releases.

    4.17.3

    4.17.2

    Changelog

    Sourced from express's changelog.

    4.17.3 / 2022-02-16

    4.17.2 / 2021-12-16

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Bump express from 4.17.1 to 4.17.3

    Bump express from 4.17.1 to 4.17.3

    Bumps express from 4.17.1 to 4.17.3.

    Release notes

    Sourced from express's releases.

    4.17.3

    4.17.2

    Changelog

    Sourced from express's changelog.

    4.17.3 / 2022-02-16

    4.17.2 / 2021-12-16

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Bump decode-uri-component from 0.2.0 to 0.2.2

    Bump decode-uri-component from 0.2.0 to 0.2.2

    Bumps decode-uri-component from 0.2.0 to 0.2.2.

    Release notes

    Sourced from decode-uri-component's releases.

    v0.2.2

    • Prevent overwriting previously decoded tokens 980e0bf

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.1...v0.2.2

    v0.2.1

    • Switch to GitHub workflows 76abc93
    • Fix issue where decode throws - fixes #6 746ca5d
    • Update license (#1) 486d7e2
    • Tidelift tasks a650457
    • Meta tweaks 66e1c28

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.0...v0.2.1

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Equalizer Window: ON Button has the wrong dimension (2 pixels too wide)

    Equalizer Window: ON Button has the wrong dimension (2 pixels too wide)

    Hello!

    So, I took the liberty of uploading this theme the other day...

    https://skins.webamp.org/skin/75a086cef75b26371b184d28b9150860/d11amp059_theme.wsz/

    Here, you will notice that the ON button is active, but at least one pixel of the AUTO button is illuminated as well. So, at first, I suspected the theme to have a bug, but when I loaded this theme

    https://skins.webamp.org/skin/47597ab8e5ffcd39686d455c10c3b436/Garfield.zip/

    I saw the same effect of the ON button bleeding over into the AUTO button. (Albeit only being visible with the pressed Button) I have not yet checked it against XMMS or WinAmp yet. Sorry.

    opened by dettus 3
  • Bump eventsource from 1.0.7 to 1.1.2

    Bump eventsource from 1.0.7 to 1.1.2

    Bumps eventsource from 1.0.7 to 1.1.2.

    Changelog

    Sourced from eventsource's changelog.

    1.1.2

    • Inline origin resolution, drops original dependency (#281 Espen Hovlandsdal)

    1.1.1

    • Do not include authorization and cookie headers on redirect to different origin (#273 Espen Hovlandsdal)

    1.1.0

    • Improve performance for large messages across many chunks (#130 Trent Willis)
    • Add createConnection option for http or https requests (#120 Vasily Lavrov)
    • Support HTTP 302 redirects (#116 Ryan Bonte)
    • Prevent sequential errors from attempting multiple reconnections (#125 David Patty)
    • Add new to correct test (#111 Stéphane Alnet)
    • Fix reconnections attempts now happen more than once (#136 Icy Fish)
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • Adding custom windows? (Visualizer, album art)

    Adding custom windows? (Visualizer, album art)

    Hi I was wondering if there's an example or if you have any recommendation on how to go about adding custom windows to the player?

    For instance, I'd like to add my own visualizer or display album art (something like #519, but with the ability to plug in any arbitrary div). Is this supported? My first thought is to hack it together by using some of the same css but hoping there might be a better way.

    Thank you! Absolutely loving webamp

    opened by tv3636 0
Owner
Jordan Eldredge
JavaScript dork.
Jordan Eldredge
HTML5

One file. Any browser. Same UI. Author: John Dyer http://j.hn/ Website: http://mediaelementjs.com/ License: MIT Meaning: Use everywhere, keep copyrigh

MediaElement.js 8k Jan 8, 2023
🟢 OneForAll Support Bot - Is a support bot for the discord server of OFA!

?? OneForAll Support Bot - Is a support bot for the discord server of OFA! Setup You can setup OneForAll Support Bot by simply opening your terminal/c

baby 3 Oct 15, 2022
A Javascript library for working with Audio. It provides a consistent API for loading and playing audio on different browsers and devices. Currently supports WebAudio, HTML5 Audio, Cordova / PhoneGap, and a Flash fallback.

SoundJS SoundJS is a library to make working with audio on the web easier. It provides a consistent API for playing audio in different browsers, inclu

CreateJS 4.3k Dec 31, 2022
Buzz, a Javascript HTML5 Audio library

Buzz is a small but powerful Javascript library that allows you to easily take advantage of the new HTML5 audio element. It tries to degrade silently on non-modern browsers.

Jay Salvat 1.2k Dec 10, 2022
A simple HTML5, YouTube and Vimeo player

Plyr is a simple, lightweight, accessible and customizable HTML5, YouTube and Vimeo media player that supports modern browsers. Checkout the demo - Do

Sam Potts 23.1k Jan 3, 2023
Flexible and easy Dash/HLS/DRM integration for HTML5 video.

This project is made possible with Plyr, Hls.js, Dash.js. Features ?? HLS and DASH playback ?? Multi quality supported ?? Drm with custom header suppo

Tuhin Kanti Pal 25 Nov 11, 2022
Movie focused HTML5 Player

Movie focused HTML5 Player

Bruno Vieira 1.6k Dec 29, 2022
The HTML5 video player for the web

Flowplayer website | demos | docs For the impatient Download Flowplayer Unzip Drop the folder under your server Minimal setup <!DOCTYPE html> <head>

Flowplayer 1.9k Dec 30, 2022
Video.js - open source HTML5 & Flash video player

Video.js - HTML5 Video Player Video.js is a web video player built from the ground up for an HTML5 world. It supports HTML5 video and Media Source Ext

Video.js 34.8k Jan 5, 2023
AmplitudeJS: Open Source HTML5 Web Audio Library. Design your web audio player, the way you want. No dependencies required.

Documentation • Examples • Tutorials • Support Us • Get Professional Help AmplitudeJS is a lightweight JavaScript library that allows you to control t

Server Side Up 3.9k Jan 2, 2023
A web video player built for the HTML5 world using React library.

video-react Video.React is a web video player built from the ground up for an HTML5 world using React library. Installation Install video-react and pe

null 2.4k Jan 6, 2023
jPlayer : HTML5 Audio & Video for jQuery

jPlayer : HTML5 Audio & Video for jQuery Gitter Support for Zepto 1.0+ compiled with the data module. What is jPlayer? jPlayer is a jQuery/Zepto plugi

jPlayer 4.6k Dec 27, 2022
Accessible HTML5 Video Player

Accessible HTML5 Video Player What is it? A lightweight HTML5 video player which includes support for captions and screen reader accessibility. For de

PayPal 2.4k Jan 5, 2023
HTML5 fmp4 live stream (ll-fmp4) player written in TypeScript

umataste HTML5 fmp4 live stream (ll-fmp4) player written in TypeScript Feature Playback for fmp4 stream Extremely low latency of less than 0.1 second

もにょ~ん 5 Oct 21, 2022
A lightweight web component helper for HTML5 videos.

Video Radio Star A lightweight web component helper for HTML5 videos. Intended for use with muted by default HTML5 videos. Demo Demo out of viewport u

Zach Leatherman 58 Dec 12, 2022
A simple library for using the JavaScript Full Screen API.

BigScreen A simple library for using the JavaScript Fullscreen API. Why should I use it? BigScreen makes it easy to use full screen on your site or in

Brad Dougherty 712 Dec 22, 2022
HLS.js is a JavaScript library that plays HLS in browsers with support for MSE.

HLS.js is a JavaScript library that implements an HTTP Live Streaming client. It relies on HTML5 video and MediaSource Extensions for playback. It wor

video-dev 12.3k Jan 2, 2023
a full functional discord bot to send MooMoo.io bots

MooMooBot a full functional discord bot to send moomoo.io bots commands !send <server> <name> ex: !send 8:0:0 Nuro !token (generates a token to test

null 1 Jan 7, 2022
Custom full screen video player

Video Player Native video player in html View Demo · Report Bug · Request Feature About The Project This is a custom video player for the web built on

Oscar Castaneda ⬢ 5 Feb 3, 2022