Visual Time Displays With Emojis – Time-moji

Preview:

Description:

Time-moji is a tiny JavaScript library that converts a DateTime object into Clock or Landscape emojis.

The Clock Emojis are perfect for websites or applications that require displaying the current time, such as clocks, timers, or scheduling tools. The Landscape Emojis are useful for those who need to convey the time of day visually. For instance, a weather application could display a sunrise emoji in the morning, a sunny landscape during the day, and a starry night scene in the evening.

How to use it:

1. Install & download the Time-moji with NPM.

# NPM
$ npm install time-moji

2. Include the Time-Moji script in your HTML file.

<script src="dist/time-moji.min.js"></script>

3. Create some div elements where you want the emojis to appear. You can have one for the clock emoji and another for the landscape emoji:

<div class="emoji"></div>
<div class="landscape"></div>

4. Use the Tmj.getTimeMoji() function to convert a Datetime into emojis. You can choose either ‘clock’ or ‘landscape’ mode.

// Clock Emoji
const emoji = document.querySelector('.emoji');
emoji.textContent = Tmj.getTimeMoji(new Date(), 'clock');
// Landscape Emoji
const landscape = document.querySelector('.landscape');
landscape.textContent = Tmj.getTimeMoji(new Date(), 'landscape');