dayparting

v0.2.0

Published

4 years ago

A Dayparting micro library to present time of day in Dayparts.

Downloads

0High
0Medium
0Low

kushalpandya

javascript js dayparting date time

Dayparting

A Dayparting micro library to present time of day in Dayparts.

i.e. 8:00 AM => Early Morning

It follows standard dayparting conventions (read more about Dayparting on Wikipedia).

###Example Example Results

###Configure

####In web browser Include dayparting.js like your any other JS file using script tag in your page <head>.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
	<title>My Webpage</title>
	...
	...
	<script type="text/javascript" src="js/dayparting.js"></script>
</head>

####In Node Environment Install dayparting using npm

npm install dayparting --save-dev

Use require to load Dayparting module.

var dayparting = require('dayparting');

###Use

####Basic Usage

Initialize: Instantiate the dayparting with a locale configuration.

var myDaypart = daypart({
	locale: 'en-US',
	localeJSON: {
		"en-US": {
	        "earlyMorning": "Early Morning",
	        "lateMorning": "Late Morning",
	        "afternoon": "Afternoon",
	        "earlyFringe": "Early Fringe",
	        "lateFringe": "Late Fringe",
	        "lateNight": "Late Night",
	        "overnight": "Overnight",
	        "primeAccess": "Prime Access",
	        "primeTime": "Prime Time"
	    }
	}
});

This will set en-US as default locale for myDaypart and use given localeJSON, note that structure of localeJSON follows ICU Message Syntax where keynames have to be same as given in the example. You can have strings for multiple locales within same localeJSON like (and thus load external JSON file containing strings for multiple locales);

{
	"en-US": {
        "earlyMorning": "Early Morning",
        "lateMorning": "Late Morning",
        ...
        ...
        "primeTime": "Prime Time"
    },
    "fr_FR": {
	    "earlyMorning": "Tôt le matin",
        "lateMorning": "Tard dans la matinée",
        ...
        ...
        "primeTime": "Prime Time"
    }
}

Call: Daypart provides a method for() which accepts date object as a parameter, and returns string representation for the time within that date object.

var date = new Date();

date.setHours(13);
date.setMinutes(15);

myDatepart.for(date); // returns 'Afternoon'

Use with Databinding

Initialize During initialization, along with locale and localeJSON, you can provide binding to enable data-binding on elements, it is false by default.

var myDaypart = daypart({
	locale: 'en-US',
	localeJSON: {
		"en-US": {
	        "earlyMorning": "Early Morning",
	        ....
	        "primeTime": "Prime Time"
	    }
	},
	binding: true
});

Attaching Elements Once myDaypart is initialized and you have DOM with existing elements as follows;

<div class="container">
	Will be aired at tomorrow 7:06 PM <label id="showTime"></label>
</div>

Use attach() to add elements which will be bound to Daypart.

myDaypart.attach(new Date(2015, 12, 24, 19, 06), document.getElementById('showTime'));

This will automatically set string for 7:06 PM in the label with en-US locale.

Switch Locales Once elements are attached with daypart object, simply call setLocale on the object and contents of all the attached elements will be updated automatically.

myDaypart.setLocale('fr-FR');

###Version Information

0.2.0 - Added support for one-way data-binding to enable live locale switch, bug fixes.
0.1.1 - Minor refactoring, README updated.
0.1.0 - First Release.

###Author

Kushal Pandya

Published

Vulnerabilities

Links

Maintainers

Keywords