andydean565 / datereact

JavaScript plugin to change to change how your content will display based on the time/day/month or custom dates

dateReact

JavaScript plugin to change to change how your content will display based on the time/day/month or custom dates

attribute

span

the span attribute defines when you want something to change form the normal and you can put in time/day/month/date or a predefined variable date.

react-span="01-03"

type

the type attribute is what you want to happen if the current date is within the span which can be a simple as show or more complex like adding a task to change the look of your website.

below are the current types but any suggestions can be added easily.

• show
• hide
• class
• text

react-type="class"

data

the data attribute is only needs to be included for the class and text type and will define the class or text you want applied to the div.

react-data="active"

format

type	Time	Day	Month	date	predefined
between	"01-09"	"monday-wednesday"	"october-december"	"01/01/2017-02/04/2017"	"[october]"
all	"01|02|04|07"	"monday|thursday"	"july|april|november"	"01/03/2017|01/05/2017"	"[october]"

examples

this example will add the class active to the span element if the time is between 1am - 3am

<span react-span="01-03" react-type="class" react-data="active">1-3</span>

notes

the time is in 24 hour and is only in hours so you can display it any hour of the day

predefined variables will need to be included in the file so fork the plugin edit the debug with your desired predefined and use gulp to compile the min

the plugin will auto detect the span with you have entered but let me know if you're having issues with a date

future development

• shortened days and months formats
• allow users to put dates of the current month (can be done with predefined with some JS added)
• more complex types ⋅⋅* maybe change depending how long someone has been on your website