livedate
Visual date picker script. Very compact at under 2KB minified and gzipped.
Demo: http://live627.github.io/livedate
Installation
Download node at nodejs.org and install it, if you haven't already.
npm install livedate --save
Usage
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>Livedate by live627</title>
<link rel="stylesheet" href="dateinput.css">
</head>
<body>
<input type="text" id="date">
<script src="dateinput.min.js"></script>
<script>
var
days = ['Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday'],
daysShort = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'],
months = ['January','February','March','April','May','June','July','August','September','October','November','December'],
monthsShort = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
new Livedate(document.getElementById('date'));
</script>
</body>
</html>
Tests
npm installnpm test
Build
npm install
to grab all the dependenceies
npm run build
uglify and minify JS, compile SASS into CSS and minify it
Dependencies
None
Goals
My goals with this script are:
- to keep it as lean and readable as possible
- to NOT have jQuery as a dependency
Dev Dependencies
- cssmin: A simple CSS minifier that uses a port of YUICompressor in JS
- less: Leaner CSS
- mkdirp: Recursively mkdir, like
mkdir -p
- node-sass: Wrapper around libsass
- uglify-js: JavaScript parser, mangler/compressor and beautifier toolkit
- watch: Utilities for watching file trees.
Sources
This work is based on jQuery Tools Dateinput.
TODO
- Use the scroll wheel to change months.
- Create public methods
- Build tests