/jbugel.xyz-focus

The Focus Project is a web-based productivity and focus application built using HTML, CSS, and JavaScript.

Primary LanguageHTMLOtherNOASSERTION

⚠️ This Repository is now archived because I will move it to my Website v2 Repository ⚠️

🎯 Focus Helper with Timer and Lo-Fi Music

This project is a simple focus helper that includes a timer ⏰ to help users stay productive and focused while working. The focus helper updates the title of the HTML document with the elapsed time and includes a lo-fi music video 🎵 on YouTube to help users stay focused.

Please note that the lo-fi music video player is intentionally made transparent to minimize distractions while using the focus helper. As a result, it is necessary to enable autoplay in your browser for the video to play automatically. You may need to adjust your browser settings to allow autoplay on this website.

Usage 🚀

To use the focus helper, simply open the index.html file in your web browser. The timer will start automatically and update the title of the HTML document with the elapsed time.

Users can easily customize the focus helper by modifying the HTML and CSS files and changing the YouTube video source.

File Structure 📁

This project includes the following files:

  • index.html: the main HTML file that includes the focus helper and the YouTube video
  • styles/style.css: the CSS file that styles the HTML document
  • scripts/clock.js: the JavaScript file that updates the clock display on the HTML document
  • scrips/antiDistraction.js: the JavaScript file that disables right-click and text selection on the entire page
  • scripts/timer.js: the JavaScript file that updates the title of the HTML document with the elapsed time

Preview 🔍

A live preview of the focus helper is available at jbugel.xyz/focus ↗.

License 📜

This project is licensed under the MIT License.