Giter Club home page Giter Club logo

bad-apple-browser-console's Introduction

bad-apple-browser-console

Watch the Bad Apple!! video through the browser console.

demo3.mp4

This project generates and repeatedly logs braille ascii art text through a timer into the browser console so that it looks like a video.

The braille art was generated using img2braille, which received video frame image files extracted from the original video with FFmpeg.

The timer used to properly sync the logging with the video was made by James Edwards in his article "Creating Accurate Timers in JavaScript".

Watch it!

Access https://g-otn.github.io/bad-apple-browser-console/ and follow the steps.

Watch it locally

You can watch it locally by downloading this repo and serving the public/ folder. If you have Node.js installed, you can simply do:

git clone https://github.com/g-otn/bad-apple-browser-console.git
cd bad-apple-browser-console
npx serve public/

And then access localhost:5000.

Generate new video

Requires: Node.js, FFmepg

Although this has not been tested, you could probably generate and play any video that isn't too long, too heavy and doesn't have a too big resolution. To do that, follow these steps:

  1. Clone the repository:
git clone https://github.com/g-otn/bad-apple-browser-console.git
cd bad-apple-browser-console
  1. Put the video file you want to use inside the video/ folder.
  2. Rename it to video.mp4.
  3. Start the npm scripts by running npm start
  4. After everything is done, you can access localhost:5000 and follow the steps to watch the video.

Note2: You can alter the code/scripts to generate a different resolution, which can also decrease the processing time. Take a look at the FFmpeg command in the extract-frames script in package.json and also in the asciiWidth variable in the generate-braille.js file.

bad-apple-browser-console's People

Contributors

g-otn avatar

Stargazers

 avatar  avatar

Watchers

 avatar

Forkers

anak-nolep

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.