timetable-f

The main purpose is to process text in timetable.

Table of Contents

1. Install
2. QuickStart
3. Introdaction
4. API
   • show()
   • moveLeft()
   • moveRight()
   • Customization

6. Contributing
7. Motivation

Install

npm i timetable-f

QuickStart

Example 1:

new Timetable('#root').show(' YOUR TEXT ');

Try it on CodePen

Example 2 timer.

  let timetable = new Timetable('#timer');
  let format = time => time < 10 ? '0' + time : time;

  setInterval(() => {
    let date = new Date();
    const HOURS = format(date.getHours());
    const MINUTES = format(date.getMinutes());
    const SECONDS = format(date.getSeconds());

    timetable.show(` ${HOURS}:${MINUTES}:${SECONDS}`);
  }, 1000);

Try it on CodePen

Introduction

From version 1.0.0 this package support next characters:

{
  ua: 'АБВГДЕЄЖЗИІЇЙКЛМНОПРСТУФХЦЧШЩЬЮЯ._-!:><=+/0123456789',
  eng: "ABCDEFGHIJKLMNOPQRSTUVWXYZ-.':?><+/=_!0123456789"
}

The main purpose is to process text in timetable.

You can find alphabet implementation here

# API

## show()

const table = new Timetable('.className');
table.show('your text');

We only show your text.

## moveLeft()

const table = new Timetable('.className');
table.moveLeft('your text');

In the above example text will move from right to left (by default one circle & with speed 500)

## moveRight()

const table = new Timetable('className');
table.moveRight('your text');

In the above example text will move from left to right (by default one circle & speed 500)

## Customization

Check default values:

Timetable.getDefault();

Set your custom values:

const options = {
  'languageKey': 'eng',
  // You can style your root through this field
  'rootHeight': 30,
  'rootWidth': 0,
  'rootBackground': '#16300b',
  'lampColorOn': '#9dd143',
  'lampColorOff': '#1d5110',
  'timeInterval': 500
};
const t = new Timetable('#root', options);

Change language to 'ua'

    const table = new Timetable('.className', {languageKey = 'ua'})

Change colors:

   const options = {
       rootBackground = 'black',
       lampColorOn = 'red',
       lampColorOff = 'blue',
   };
    
    const table = new Timetable('.className', options)
    table.show('your text');

If you want to change default parameters for moveLeft() or moveRight():

const timeToRepeat = 2; // optional =0
const timeout = 300; // optional =500

const table = new Timetable('.className');
table.moveLeft('your text', timeToRepeat, timeout);

You can clear it any time you want.

table.clear()

You click on table and see coordinates in console. Then copied into Character obj.

Contributing

Do you want to contribute to this module ? You are welcome!)

Motivation

I always loved timetable. Especially different colors with different data. That's some kind of magic)