# reveal-elapsed-time-bar

> A Reveal.js plugin adding progress bar of elapsed time.

Latest version **0.1.3** (published 2019-05-04) · MIT license · 0 weekly downloads

## Install

```sh
npm install reveal-elapsed-time-bar
pnpm add reveal-elapsed-time-bar
yarn add reveal-elapsed-time-bar
bun add reveal-elapsed-time-bar
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.1.3 |
| Published | 2019-05-04 |
| First published | 2019-05-04 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 7.4 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| GitHub stars | 20 |
| Maintainers | curtisy1 |

## Links

- npm: https://www.npmjs.com/package/reveal-elapsed-time-bar
- Repository: https://github.com/tkrkt/reveal.js-elapsed-time-bar
- Issues: https://github.com/tkrkt/reveal.js-elapsed-time-bar/issues
- npm.io page: https://npm.io/package/reveal-elapsed-time-bar

## Dependencies (1)

- [reveal.js](https://npm.io/package/reveal.js.md) ^3.8.0

## Recent versions

- 0.1.3 (latest) — 2019-05-04
- 0.1.2 — 2019-05-04
- 0.1.1 — 2019-05-04
- 0.1.0 — 2019-05-04

## README

# reveal.js Elapsed-Time-Bar Plugin

A [reveal.js](https://github.com/hakimel/reveal.js) plugin adding progress bar of elapsed time,
inspired by [rabbit](https://github.com/rabbit-shocker/rabbit).

Keeping to time in presentations!

[Check out the live demo](https://tkrkt.github.com/reveal.js-elapsed-time-bar/)

## Installation 

Copy the folder ``plugin/elapsed-time-bar`` into plugin folder of your reveal.js project.

Add the plugins to the dependencies and set ``allottedTime`` property, like this:

```js
Reveal.initialize({
  // ...
  
  // your allotted time for presentation
  allottedTime: 3 * 60 * 1000, // 3 minutes
  
  dependencies: [
    // ...

    { src: 'plugin/elapsed-time-bar/elapsed-time-bar.js'}
  ]
});
```


## Configurations

```js
Reveal.initialize({
  // ...

  // - (required) your allotted time for presentation
  allottedTime: 3 * 60 * 1000, // 3 minutes

  // - (optional) height of page/time progress bar
  progressBarHeight: 3,

  // - (optional) bar color
  barColor: 'rgb(200,0,0)',

  // - (optional) bar color when timer is paused
  pausedBarColor: 'rgba(200,0,0,.6)',
});
```


## API

You can use APIs from global ``ElapsedTimeBar`` object.

|property|description|
|---|---|
|isPaused|true if timer is paused|
|isFinished|true when you run out of your allotted time|
|start(allottedTime [,elapsedTime=0])|start timer with new allotted time|
|reset()|reset timer|
|pause()|pause timer|
|resume()|resume timer|


## Keyboard binding example

```js
Reveal.initialize({
  // ...

  keyboard: {
    // pause/resume time when Enter is pressed
    13: () => {
      ElapsedTimeBar.isPaused ? ElapsedTimeBar.resume() : ElapsedTimeBar.pause();
    },
    // reset timer when 'r' is pressed
    82: () => {
      ElapsedTimeBar.reset();
    }
  }
});
```


# License

MIT

---
_Source: https://npm.io/package/reveal-elapsed-time-bar · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._