Character Counter & Reading Time Calculator

Preview:

Description:

A simple JavaScript-powered online tool that calculates and displays the estimated reading time (with character/word/space/vowel counters) for an article you provide.

How to use it:

1. Build the HTML for the Reading Time Calculator.

<!-- Paste your content in this textarea -->
<label for="reading-time-textarea"> </label>
<textarea
  id="reading-time-textarea"
  rows="10"
></textarea>

<!-- Adjust WPM here-->
<label for="average-words">Words per minute</label>
<input
  type="range"
  class="form-range"
  id="average-words"
  value="225"
  min="1"
  max="5000"
/>
<p><span id="count-wpm">225</span> wpm</p>

<!-- Statistics -->
<p>
  <strong>Reading time: </strong
  ><span id="estimate-reading-time">0</span> minute read
</p>
<p>
  <strong>Total Number of words: </strong
  ><span id="total-words">0</span>
</p>
<p>
  <strong>Total Characters: </strong
  ><span id="total-characters">0</span>
</p>
<p>
  <strong>Total Spaces: </strong
  ><span id="total-spaces">0</span>
</p>
<p>
  <strong>Total vowels: </strong
  ><span id="total-vowels">0</span>
</p>

<!-- Clear Button -->
<button
  type="button"
  id="clear-calculator"
  onclick="clearStatistics()"
>
  Clear
</button>
<!-- Calculate Button -->
<button
  type="button"
  id="reading-time-calculator"
  onclick="calculateReadingTime()"
>
  Calculate
</button>

2. Load the main script in the document. That’s it.

<script src="assets/js/reading-time-script.js"></script>