kylefang/angular-datepicker
1
0
Fork 0
mirror of https://github.com/HackPlan/angular-datepicker.git synced 2026-04-27 17:30:47 +08:00
Code Issues Packages Projects Releases Wiki Activity

bower build

Browse Source
This commit is contained in:
g00fy
2013-06-14 10:33:03 +02:00
parent 520930466f
commit dae310f665
20 changed files with 2 additions and 7616 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
.bowerrc
View File

@@ -1,3 +0,0 @@
{
"directory": "app/components"
}

21
.editorconfig
View File

@@ -1,21 +0,0 @@
# EditorConfig helps developers define and maintain consistent
# coding styles between different editors and IDEs
# editorconfig.org
root = true
[*]
# Change these settings to your own preference
indent_style = space
indent_size = 2
# We recommend you to keep these unchanged
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = true
insert_final_newline = true
[*.md]
trim_trailing_whitespace = false

1
.gitattributes vendored
View File

@@ -1 +0,0 @@
* text=auto

25
.jshintrc
View File

@@ -1,25 +0,0 @@
{
"node": true,
"browser": true,
"es5": true,
"esnext": true,
"bitwise": true,
"camelcase": true,
"curly": true,
"eqeqeq": true,
"immed": true,
"indent": 2,
"latedef": true,
"newcap": true,
"noarg": true,
"quotmark": "single",
"regexp": true,
"undef": true,
"unused": true,
"strict": true,
"trailing": true,
"smarttabs": true,
"globals": {
"angular": false
}
}

192
Gruntfile.js
View File

@@ -1,192 +0,0 @@
'use strict';
var lrSnippet = require('grunt-contrib-livereload/lib/utils').livereloadSnippet;
var mountFolder = function (connect, dir) {
return connect.static(require('path').resolve(dir));
};
module.exports = function (grunt) {
// load all grunt tasks
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
// configurable paths
var yeomanConfig = {
app : 'app',
dist: 'dist'
};
try {
yeomanConfig.app = require('./component.json').appPath || yeomanConfig.app;
} catch (e) {
}
grunt.initConfig({
yeoman : yeomanConfig,
watch : {
livereload: {
files: [
'<%= yeoman.app %>/{,*/}*.html',
'{.tmp,<%= yeoman.app %>}/styles/{,*/}*.css',
'{.tmp,<%= yeoman.app %>}/scripts/{,*/}*.js',
'<%= yeoman.app %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
],
tasks: ['livereload']
}
},
connect: {
options : {
port : 9000,
// Change this to '0.0.0.0' to access the server from outside.
hostname: 'localhost'
},
livereload: {
options: {
middleware: function (connect) {
return [
lrSnippet,
mountFolder(connect, '.tmp'),
mountFolder(connect, yeomanConfig.app)
];
}
}
},
test : {
options: {
middleware: function (connect) {
return [
mountFolder(connect, '.tmp'),
mountFolder(connect, 'test')
];
}
}
}
},
open : {
server: {
url: 'http://localhost:<%= connect.options.port %>'
}
},
clean : {
dist : {
files: [
{
dot: true,
src: [
'.tmp',
'<%= yeoman.dist %>'
]
}
]
},
server: '.tmp'
},
jshint : {
options: {
jshintrc: '.jshintrc'
},
all : [
'Gruntfile.js',
'<%= yeoman.app %>/scripts/{,*/}*.js'
]
},
karma : {
unit: {
configFile: 'karma.conf.js',
singleRun : true
}
},
cssmin : {
dist: {
expand: true,
cwd : '<%= yeoman.dist %>',
src : ['*.css', '!*.min.css'],
dest : '<%= yeoman.dist %>',
ext : '.min.css'
}
},
ngmin : {
dist: {
expand: true,
cwd : '<%= yeoman.dist %>',
src : ['*.js', '!*.min.js'],
dest : '<%= yeoman.dist %>',
ext : '.min.js'
}
},
uglify : {
dist: {
expand: true,
cwd : '<%= yeoman.dist %>',
src : ['*.min.js'],
dest : '<%= yeoman.dist %>',
ext : '.min.js'
}
},
copy : {
dist: {
files: [
{
expand : true,
flatten: true,
dot : true,
cwd : '<%= yeoman.app %>',
dest : '<%= yeoman.dist %>',
src : [
'styles/date.css'
]
}
]
}
},
ngtemplates: {
dist: {
options: {
base : '<%= yeoman.app %>',
module: 'dateInput'
},
src : '<%= yeoman.app %>/scripts/*.html',
dest : '.tmp/templates.js'
}
},
concat: {
options: {
separator: '\n'
},
js: {
src: ['<%= yeoman.app %>/scripts/module.js','.tmp/templates.js'],
dest: '<%= yeoman.dist %>/index.js'
},
css: {
src: ['<%= yeoman.app %>/styles/date.css'],
dest: '<%= yeoman.dist %>/index.css'
}
}
});
grunt.renameTask('regarde', 'watch');
grunt.registerTask('server', [
'clean:server',
'livereload-start',
'connect:livereload',
'open',
'watch'
]);
grunt.registerTask('test', [
'clean:server',
'connect:test',
'karma'
]);
grunt.registerTask('build', [
'clean:dist',
'jshint',
'ngtemplates',
'concat',
'cssmin',
'ngmin',
'uglify'
]);
grunt.registerTask('default', ['build']);
};

91
app/index.html
View File

@@ -1,91 +0,0 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<!-- build:css styles/main.css -->
<link rel="stylesheet" href="styles/bootstrap.css">
<link rel="stylesheet" href="styles/main.css">
<link rel="stylesheet" href="styles/date.css"/>
<!-- endbuild -->
</head>
<body ng-app="sample">
<div class="row-fluid">
<div class="span6">
<h2>Calendar</h2>
<h3>views</h3>
<h5>default</h5>
<pre>&lt;div date-picker="start"&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker"></div>
<h5>year</h5>
<pre>&lt;div date-picker="start" <strong>year</strong>&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker" year></div>
<h5>month</h5>
<pre>&lt;div date-picker="start <strong>month</strong>&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker" month></div>
<h5>date</h5>
<pre>&lt;div date-picker="start" <strong>date</strong>&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker" date></div>
<h5>hours</h5>
<pre>&lt;div date-picker="start" <strong>hours</strong>&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker" hours></div>
<h5>minutes</h5>
<pre>&lt;div date-picker="start" <strong>minutes</strong>&gt;&lt;/div&gt; </pre>
<div date-picker="start" class="datetimepicker" minutes></div>
</div>
<div class="span6">
<h3>Input</h3>
<h5>default</h5>
<pre>&lt;input type="datetime" <strong>ng-model="model" date-time</strong>&gt;&lt;/div&gt; </pre>
<input type="datetime" date-time ng-model="start">
<h5>Input format</h5>
<pre>&lt;input type="datetime" ng-model="model" date-time <strong>format="long"</strong>&gt;&lt;/div&gt; </pre>
<input type="datetime" date-time ng-model="end" hours format="short">
<h5>A button</h5>
<pre ng-non-bindable>&lt;div class=&quot;dropdown&quot;&gt;
&lt;a class=&quot;dropdown-toggle btn btn-danger&quot;&gt;
pick a date: {{(date|date)}}
&lt;/a&gt;
&lt;div class=&quot;dropdown-menu&quot; ng-click=&quot;$event.preventDefault();$event.stopPropagation()&quot;&gt;
&lt;div date-picker=&quot;date&quot; class=&quot;datetimepicker&quot;&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</pre>
<div class="dropdown">
<a class="dropdown-toggle btn btn-danger">
pick a date: {{(date|date)}}
</a>
<div class="dropdown-menu" ng-click="$event.preventDefault();$event.stopPropagation()">
<div date-picker="date" class="datetimepicker"></div>
</div>
</div>
<h5>Date range</h5>
<pre>&lt;div date-range start="start" end="end" &gt;&lt;/div&gt; </pre>
<div date-range start="a" end="b" style="position: relative; z-index:0"></div>
<h5>Date range button</h5>
<div class="dropdown">
<a class="dropdown-toggle btn btn-danger">
{{(a|date)||"pick start"}} - {{(b|date)||"pick end"}}
</a>
<div class="dropdown-menu" ng-click="$event.preventDefault();$event.stopPropagation()">
<div date-range start="a" end="b"></div>
</div>
</div>
</div>d
</div>
<script src="components/jquery/jquery.js"></script>
<script src="components/angular/angular.js"></script>
<script src="components/angular-bootstrap/ui-bootstrap.js"></script>
<!-- build:js module.min.js -->
<script src="scripts/module.js"></script>
<!-- endbuild -->
<script>
angular.module('sample',['dateInput','ui.bootstrap'])
</script>
</body>
</html>

448
app/scripts/module.js
View File

@@ -1,448 +0,0 @@
(function () {
'use strict';
var Module = angular.module('dateInput', []);
Module.directive('datePicker', function () {
var viewOptions = ['month', 'date', 'year', 'month', 'hours', 'minutes'];
function isValidDate(date) {
return date instanceof Date && !isNaN(date.getTime());
}
function getVisibleMinutes(date) {
console.time('getVisibleMinutes');
date = new Date(date || new Date());
date = new Date(date.getFullYear(), date.getMonth(), date.getDate(), date.getHours());
var minutes = [];
var step = 5;
var stop = date.getTime() + 60 * 60 * 1000;
while (date.getTime() < stop) {
minutes.push(date);
date = new Date(date.getTime() + step * 60 * 1000);
}
console.timeEnd('getVisibleMinutes');
return minutes;
}
function getVisibleWeeks(date) {
console.time('getVisibleWeeks');
date = new Date(date || new Date());
date.setDate(1);
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);
date.setMilliseconds(0);
if (date.getDay() === 0) {
date.setDate(-5);
} else {
date.setDate(date.getDate() - (date.getDay() - 1));
}
if (date.getDate() === 1) {
date.setDate(-6);
}
var weeks = [];
while (weeks.length < 6) {
var week = [];
for (var i = 0; i < 7; i++) {
week.push(new Date(date));
date.setDate(date.getDate() + 1);
}
weeks.push(week);
}
console.timeEnd('getVisibleWeeks');
return weeks;
}
function getVisibleYears(date) {
console.time('getVisibleYears');
var years = [];
date = new Date(date || new Date());
date.setFullYear(date.getFullYear() - (date.getFullYear() % 10));
for (var i = 0; i < 12; i++) {
years.push(new Date(date.getFullYear() + (i - 1), 0, 1));
}
console.timeEnd('getVisibleYears');
return years;
}
function getDaysOfWeek(date) {
console.time('getDaysOfWeek');
date = new Date(date || new Date());
date = new Date(date.getFullYear(), date.getMonth(), date.getDate());
date.setDate(date.getDate() - (date.getDay() - 1));
var days = [];
for (var i = 0; i < 7; i++) {
days.push(new Date(date));
date.setDate(date.getDate() + 1);
}
console.timeEnd('getDaysOfWeek');
return days;
}
function getVisibleMonths(date) {
console.time('getVisibleMonths');
date = new Date(date || new Date());
var year = date.getFullYear();
var months = [];
for (var month = 0; month < 12; month++) {
months.push(new Date(year, month, 1));
}
console.timeEnd('getVisibleMonths');
return months;
}
function getVisibleHours(date) {
console.time('getVisibleHours');
date = new Date(date || new Date());
date.setHours(0);
date.setMinutes(0);
date.setSeconds(0);
date.setMilliseconds(0);
var hours = [];
for (var i = 0; i < 24; i++) {
hours.push(date);
date = new Date(date.getTime() + 60 * 60 * 1000);
}
console.timeEnd('getVisibleHours');
return hours;
}
return {
scope : {
date : '=datePicker',
after : '=?',
before: '=?'
},
link : function (scope, element, attrs) {
scope.views = [];
for (var attr in attrs) { //noinspection JSUnfilteredForInLoop
if (viewOptions.indexOf(attr) !== -1) { //noinspection JSUnfilteredForInLoop
scope.views.push(attr);
}
}
if (!scope.views.length) {
scope.views = ['date', 'month', 'year', 'hours', 'minutes'];
}
scope.view = scope.views[0];
function hasView(view) {
return scope.views.indexOf(view) !== -1;
}
function ensureDate() {
// we need to return new instance as ngModel $watch watches only for identity - not for equality
if (!(isValidDate(scope.date))) {
scope.date = new Date(2000, 1, 1);
}
scope.date = new Date(scope.date);
}
function setYear(date) {
ensureDate();
scope.date.setFullYear(date.getFullYear());
}
function setMonth(date) {
setYear(date);
scope.date.setMonth(date.getMonth());
}
function setDate(date) {
setMonth(date);
scope.date.setDate(date.getDate());
}
function setHours(date) {
setDate(date);
scope.date.setHours(date.getHours());
}
function setMinutes(date) {
setHours(date);
scope.date.setMinutes(date.getMinutes());
}
scope.setYear = function (date) {
setYear(date);
scope.$emit('setYear', date);
};
scope.setMonth = function (date) {
setMonth(date);
scope.$emit('setMonth', date);
};
scope.setDate = function (date) {
setDate(date);
scope.$emit('setDate', date);
};
scope.setHours = function (date) {
setHours(date);
scope.$emit('setHours', date);
};
scope.setMinutes = function (date) {
setMinutes(date);
scope.$emit('setMinutes', date);
};
scope.setView = function setView(view) {
if (hasView(view)) {
scope.view = view;
switch (view) {
case 'minutes':
scope.minutes = getVisibleMinutes(scope.visibleDate);
break;
case 'hours' :
scope.hours = getVisibleHours(scope.visibleDate);
break;
case 'date' :
scope.weeks = getVisibleWeeks(scope.visibleDate);
break;
case 'month' :
scope.months = getVisibleMonths(scope.visibleDate);
break;
case 'year' :
scope.years = getVisibleYears(scope.visibleDate);
break;
}
}
};
scope.nextMonth = function (delta) {
scope.visibleDate.setMonth(scope.visibleDate.getMonth() + (delta || 1));
};
scope.prevMonth = function (delta) {
scope.nextMonth(-delta || -1);
};
scope.nextDay = function (delta) {
scope.visibleDate.setDate(scope.visibleDate.getDate() + (delta || 1));
};
scope.prevDay = function (delta) {
scope.nextDay(-delta || -1);
};
scope.nextHour = function (delta) {
scope.visibleDate.setHours(scope.visibleDate.getHours() + (delta || 1));
};
scope.prevHour = function (delta) {
scope.nextHour(-delta || -1);
};
scope.nextYear = function (delta) {
scope.visibleDate.setFullYear(scope.visibleDate.getFullYear() + (delta || 1));
};
scope.prevYear = function (delta) {
scope.nextYear(-delta || -1);
};
scope.visibleDate = new Date();
scope.$watch('date', function (date) {
if (date) {
scope.visibleDate = new Date(date);
}
});
scope.isAfter = function (date) {
return date >= scope.after;
};
scope.isBefore = function (date) {
return date <= scope.before;
};
function validDate() {
return scope.date instanceof Date;
}
scope.isSameMinutes = function (date) {
if (!validDate()){
return false;
}
var b = scope.date;
return (date.getTime() - date.getSeconds() * 1000 - date.getMilliseconds()) === (b.getTime() - b.getSeconds() * 1000 - b.getMilliseconds());
};
scope.isSameMonth = function (date) {
if (!validDate()){
return false;
}
return date.getFullYear() === scope.date.getFullYear() && date.getMonth() === scope.date.getMonth();
};
scope.isSameYear = function (date) {
if (!validDate()){
return false;
}
return date.getFullYear() === scope.date.getFullYear();
};
scope.isSameDate = function (date) {
if (!validDate()){
return false;
}
return scope.date.getDate() === date.getDate() && scope.isSameMonth(date);
};
scope.isSameHour = function (date) {
if (!validDate()){
return false;
}
return scope.date.getHours() === date.getHours() && scope.isSameDate(date);
};
scope.isOldMonth = function (date) {
return date
.getTime() < scope.visibleDate.getTime() && date.getMonth() !== scope.visibleDate.getMonth();
};
scope.isNewHour = function (date) {
return date.getTime() > scope.visibleDate.getTime() && date.getHours() !== scope.visibleDate.getHours();
};
scope.isOldHour = function (date) {
return date.getTime() < scope.visibleDate.getTime() && date.getHours() !== scope.visibleDate.getHours();
};
scope.isNewMonth = function (date) {
return date.getTime() > scope.visibleDate.getTime() && date.getMonth() !== scope.visibleDate.getMonth();
};
scope.$on('setDate', scope.setView.bind(null, 'hours'));
scope.$on('setMonth', scope.setView.bind(null, 'date'));
scope.$on('setHours', scope.setView.bind(null, 'minutes'));
scope.$on('setYear', scope.setView.bind(null, 'month'));
scope.$watch(function () {
return isValidDate(scope.visibleDate);
}, function (valid) {
if (!valid) {
scope.visibleDate = new Date();
}
});
//hours
scope.$watch('[visibleDate.getDate(),visibleDate.getHours()].join()', function () {
if (scope.view === 'hours') {
scope.hours = getVisibleHours(scope.visibleDate);
}
});
//date
scope.$watch('[visibleDate.getFullYear(),visibleDate.getMonth(),visibleDate.getDate()].join()', function () {
if (scope.view === 'date') {
scope.weeks = getVisibleWeeks(scope.visibleDate);
scope.weekdays = getDaysOfWeek(scope.visibleDate);
}
});
scope.$watch('[visibleDate.getFullYear(),visibleDate.getMonth()].join()', function () {
if (scope.view === 'month') {
scope.months = getVisibleMonths(scope.visibleDate);
}
});
scope.$watch('visibleDate.getYear()', function () {
if (scope.view === 'year') {
scope.years = getVisibleYears(scope.visibleDate);
}
});
scope.$watch('visibleDate.getTime()', function () {
if (scope.view === 'minutes') {
scope.minutes = getVisibleMinutes(scope.visibleDate);
}
});
},
transclude : true,
replace : true,
templateUrl: 'scripts/template.html'
};
});
Module.directive('dateTime', function ($compile, $document, $filter) {
var body = $document.find('body');
var dateFilter = $filter('date');
return {
require: 'ngModel',
link : function (scope, element, attrs, ngModel) {
var format = attrs.format || 'yyyy-MM-dd HH:mm';
var viewsOptions = ['date', 'year', 'month', 'hours', 'minutes', 'month'];
var views = [];
for (var attr in attrs) {
//noinspection JSUnfilteredForInLoop
if (viewsOptions.indexOf(attr) !== -1) { //noinspection JSUnfilteredForInLoop
views.push(attr);
}
}
function formatter(value) {
return dateFilter(value, format);
}
ngModel.$formatters = [formatter];
var picker = null;
var clear = angular.noop;
element.bind('focus', function () {
if (!picker) {
picker = $compile('<div date-picker="' + attrs.ngModel + '" class="datetimepicker datetimepicker-dropdown-bottom-left dropdown-menu" format="' + format + '" ' + views.join(' ') + '></div>')(scope);
body.append(picker);
scope.$digest();
var pos = angular.extend({}, element.position(), { height: element[0].offsetHeight });
picker.css({ top: pos.top + pos.height, left: pos.left, display: 'block', position: 'absolute'});
picker.bind('mousedown', function () {
return false;
});
}
return false;
});
element.bind('blur', function () {
clear();
clear = angular.noop;
if (picker){
picker.remove();
}
picker = null;
});
}
};
});
Module.directive('dateRange', function () {
return {
template: '<div>\n <table >\n <tr>\n <td valign="top"><div date-picker="start" class="datetimepicker" date after="start" before="end"></div></td>\n <td valign="top"><div date-picker="end" class="datetimepicker" date after="start" before="end"></div></td>\n </tr>\n </table>\n \n \n</div>',
scope : {
start: '=',
end : '='
},
link : function (scope) {
scope.$watch('start.getTime()', function (value) {
if (value && scope.end && value > scope.end.getTime()) {
scope.end = new Date(value);
}
});
scope.$watch('end.getTime()', function (value) {
if (value && scope.start && value < scope.start.getTime()) {
scope.start = new Date(value);
}
});
}
};
});
})();

125
app/scripts/template.html
View File

@@ -1,125 +0,0 @@
<div ng-transclude ng-switch="view">
<div class="datetimepicker-days" ng-switch-when="date">
<table class=" table-condensed">
<thead>
<tr>
<th class="prev" style="visibility: visible;" ng-click="prevMonth()">‹</th>
<th colspan="5" class="switch" ng-click="setView('month')">{{visibleDate|date:"yyyy MMMM"}}</th>
<th class="next" style="visibility: visible;" ng-click="nextMonth()">›</i></th>
</tr>
<tr>
<th class="dow" ng-repeat="day in weekdays">{{ day|date:"EEE"}}</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="week in weeks">
<td class="day" ng-repeat="day in week"
ng-class="{'active':isSameDate(day),'old':isOldMonth(day),'new':isNewMonth(day),'after':isAfter(day),'before':isBefore(day)}"
ng-click="setDate(day)">{{ day.getDate() }}
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="7" class="today" style="display: none;">Today</th>
</tr>
</tfoot>
</table>
</div>
<div class="datetimepicker-years" ng-switch-when="year">
<table class="table-condensed">
<thead>
<tr>
<th class="prev" style="visibility: visible;" ng-click="prevYear(10)">‹</th>
<th colspan="5" class="switch">{{years[0].getFullYear()}}-{{years[years.length-1].getFullYear()}}</th>
<th class="next" style="visibility: visible;" ng-click="nextYear(10)">›</i></th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="7">
<span class="year" ng-repeat="year in years" ng-class="{'active':isSameYear(year)}"
ng-click="setYear(year)">{{year.getFullYear()}}</span>
</td>
</tr>
</tbody>
</table>
</div>
<div class="datetimepicker-months" ng-switch-when="month">
<table class="table-condensed">
<thead>
<tr>
<th class="prev" style="visibility: visible;" ng-click="prevYear()">‹</th>
<th colspan="5" class="switch" ng-click="setView('year')">{{ visibleDate|date:"yyyy" }}</th>
<th class="next" style="visibility: visible;" ng-click="nextYear()">›</i></th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="7">
<span class="month" ng-repeat="month in months"
ng-class="{'active':isSameMonth(month),'after':isAfter(month),'before':isBefore(month)}"
ng-click="setMonth(month)">{{month|date:'MMM'}}</span>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="7" class="today" style="display: none;">Today</th>
</tr>
</tfoot>
</table>
</div>
<div class="datetimepicker-hours" ng-switch-when="hours">
<table class=" table-condensed">
<thead>
<tr>
<th class="prev" style="visibility: visible;" ng-click="prevDay()">‹</th>
<th colspan="5" class="switch" ng-click="setView('date')">{{ visibleDate|date:"dd MMMM yyyy" }}</th>
<th class="next" style="visibility: visible;" ng-click="nextDay()">›</i></th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="7">
<span class="hour" ng-repeat="hour in hours"
ng-class="{'old':isOldHour(hour),'new':isNewHour(hour),'active':isSameHour(hour)}"
ng-click="setHours(hour)">{{hour|date:"HH:mm"}}</span>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="7" class="today" style="display: none;">Today</th>
</tr>
</tfoot>
</table>
</div>
<div class="datetimepicker-minutes" ng-switch-when="minutes">
<table class=" table-condensed">
<thead>
<tr>
<th class="prev" style="visibility: visible;" ng-click="prevHour()">‹</th>
<th colspan="5" class="switch" ng-click="setView('hours')">{{ visibleDate|date:"dd MMMM yyyy HH:mm" }}
</th>
<th class="next" style="visibility: visible;" ng-click="nextHour()">›</i></th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="7">
<span class="minute" ng-repeat="minute in minutes" ng-class="{active:isSameMinutes(minute)}"
ng-click="setMinutes(minute)">{{minute|date:"HH:mm"}}</span>
</td>
</tr>
</tbody>
<tfoot>
<tr>
<th colspan="7" class="today" style="display: none;">Today</th>
</tr>
</tfoot>
</table>
</div>
</div>

6167
app/styles/bootstrap.css vendored
View File

File diff suppressed because it is too large Load Diff

378
app/styles/date.css
View File

@@ -1,378 +0,0 @@
/*!
* Datetimepicker for Bootstrap
*
* Copyright 2012 Stefan Petre
* Improvements by Andrew Rowls
* Licensed under the Apache License v2.0
* http://www.apache.org/licenses/LICENSE-2.0
*
*/
.before.after:not(.active){
background: #2f96b4 linear-gradient(to bottom, #5bc0de, #2f96b4) repeat-x;
}
.next, .prev{
font-size: 21px;
}
.datetimepicker table{
table-layout: fixed;
}
.datetimepicker {
padding: 4px;
margin-top: 1px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
direction: ltr;
/*.dow {
border-top: 1px solid #ddd !important;
}*/
}
.datetimepicker-inline {
width: 220px;
}
.datetimepicker.datetimepicker-rtl {
direction: rtl;
}
.datetimepicker.datetimepicker-rtl table tr td span {
float: right;
}
.datetimepicker-dropdown, .datetimepicker-dropdown-left {
top: 0;
left: 0;
}
[class*=" datetimepicker-dropdown"]:before {
content: '';
display: inline-block;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-bottom: 7px solid #ccc;
border-bottom-color: rgba(0, 0, 0, 0.2);
position: absolute;
}
[class*=" datetimepicker-dropdown"]:after {
content: '';
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-bottom: 6px solid #ffffff;
position: absolute;
}
[class*=" datetimepicker-dropdown-top"]:before {
content: '';
display: inline-block;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
border-top: 7px solid #ccc;
border-top-color: rgba(0, 0, 0, 0.2);
border-bottom: 0;
}
[class*=" datetimepicker-dropdown-top"]:after {
content: '';
display: inline-block;
border-left: 6px solid transparent;
border-right: 6px solid transparent;
border-top: 6px solid #ffffff;
border-bottom: 0;
}
.datetimepicker-dropdown-bottom-right:before {
top: -7px;
right: 6px;
}
.datetimepicker-dropdown-bottom-right:after {
top: -6px;
right: 7px;
}
.datetimepicker-dropdown-bottom-left:before {
top: -7px;
left: 6px;
}
.datetimepicker-dropdown-bottom-left:after {
top: -6px;
left: 7px;
}
.datetimepicker-dropdown-top-right:before {
bottom: -7px;
right: 6px;
}
.datetimepicker-dropdown-top-right:after {
bottom: -6px;
right: 7px;
}
.datetimepicker-dropdown-top-left:before {
bottom: -7px;
left: 6px;
}
.datetimepicker-dropdown-top-left:after {
bottom: -6px;
left: 7px;
}
/*.datetimepicker > div {*/
/*display: none;*/
/*}*/
.datetimepicker.minutes div.datetimepicker-minutes {
display: block;
}
.datetimepicker.hours div.datetimepicker-hours {
display: block;
}
.datetimepicker.days div.datetimepicker-days {
display: block;
}
.datetimepicker.months div.datetimepicker-months {
display: block;
}
.datetimepicker.years div.datetimepicker-years {
display: block;
}
.datetimepicker table {
margin: 0;
}
.datetimepicker td,
.datetimepicker th {
text-align: center;
width: 20px;
height: 20px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
border: none;
}
.table-striped .datetimepicker table tr td,
.table-striped .datetimepicker table tr th {
background-color: transparent;
}
.datetimepicker table tr td.minute:hover {
background: #eeeeee;
cursor: pointer;
}
.datetimepicker table tr td.hour:hover {
background: #eeeeee;
cursor: pointer;
}
.datetimepicker table tr td.day:hover {
background: #eeeeee;
cursor: pointer;
}
.datetimepicker table tr td.old,
.datetimepicker table tr td.new {
color: #999999;
}
.datetimepicker table tr td.disabled,
.datetimepicker table tr td.disabled:hover {
background: none;
color: #999999;
cursor: default;
}
.datetimepicker table tr td.today,
.datetimepicker table tr td.today:hover,
.datetimepicker table tr td.today.disabled,
.datetimepicker table tr td.today.disabled:hover {
background-color: #fde19a;
background-image: -moz-linear-gradient(top, #fdd49a, #fdf59a);
background-image: -ms-linear-gradient(top, #fdd49a, #fdf59a);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#fdd49a), to(#fdf59a));
background-image: -webkit-linear-gradient(top, #fdd49a, #fdf59a);
background-image: -o-linear-gradient(top, #fdd49a, #fdf59a);
background-image: linear-gradient(top, #fdd49a, #fdf59a);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fdd49a', endColorstr='#fdf59a', GradientType=0);
border-color: #fdf59a #fdf59a #fbed50;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
}
.datetimepicker table tr td.today:hover,
.datetimepicker table tr td.today:hover:hover,
.datetimepicker table tr td.today.disabled:hover,
.datetimepicker table tr td.today.disabled:hover:hover,
.datetimepicker table tr td.today:active,
.datetimepicker table tr td.today:hover:active,
.datetimepicker table tr td.today.disabled:active,
.datetimepicker table tr td.today.disabled:hover:active,
.datetimepicker table tr td.today.active,
.datetimepicker table tr td.today:hover.active,
.datetimepicker table tr td.today.disabled.active,
.datetimepicker table tr td.today.disabled:hover.active,
.datetimepicker table tr td.today.disabled,
.datetimepicker table tr td.today:hover.disabled,
.datetimepicker table tr td.today.disabled.disabled,
.datetimepicker table tr td.today.disabled:hover.disabled,
.datetimepicker table tr td.today[disabled],
.datetimepicker table tr td.today:hover[disabled],
.datetimepicker table tr td.today.disabled[disabled],
.datetimepicker table tr td.today.disabled:hover[disabled] {
background-color: #fdf59a;
}
.datetimepicker table tr td.today:active,
.datetimepicker table tr td.today:hover:active,
.datetimepicker table tr td.today.disabled:active,
.datetimepicker table tr td.today.disabled:hover:active,
.datetimepicker table tr td.today.active,
.datetimepicker table tr td.today:hover.active,
.datetimepicker table tr td.today.disabled.active,
.datetimepicker table tr td.today.disabled:hover.active {
background-color: #fbf069 \9;
}
.datetimepicker table tr td.active,
.datetimepicker table tr td.active:hover,
.datetimepicker table tr td.active.disabled,
.datetimepicker table tr td.active.disabled:hover {
background-color: #006dcc;
background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
background-image: -o-linear-gradient(top, #0088cc, #0044cc);
background-image: linear-gradient(top, #0088cc, #0044cc);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
border-color: #0044cc #0044cc #002a80;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.datetimepicker table tr td.active:hover,
.datetimepicker table tr td.active:hover:hover,
.datetimepicker table tr td.active.disabled:hover,
.datetimepicker table tr td.active.disabled:hover:hover,
.datetimepicker table tr td.active:active,
.datetimepicker table tr td.active:hover:active,
.datetimepicker table tr td.active.disabled:active,
.datetimepicker table tr td.active.disabled:hover:active,
.datetimepicker table tr td.active.active,
.datetimepicker table tr td.active:hover.active,
.datetimepicker table tr td.active.disabled.active,
.datetimepicker table tr td.active.disabled:hover.active,
.datetimepicker table tr td.active.disabled,
.datetimepicker table tr td.active:hover.disabled,
.datetimepicker table tr td.active.disabled.disabled,
.datetimepicker table tr td.active.disabled:hover.disabled,
.datetimepicker table tr td.active[disabled],
.datetimepicker table tr td.active:hover[disabled],
.datetimepicker table tr td.active.disabled[disabled],
.datetimepicker table tr td.active.disabled:hover[disabled] {
background-color: #0044cc;
}
.datetimepicker table tr td.active:active,
.datetimepicker table tr td.active:hover:active,
.datetimepicker table tr td.active.disabled:active,
.datetimepicker table tr td.active.disabled:hover:active,
.datetimepicker table tr td.active.active,
.datetimepicker table tr td.active:hover.active,
.datetimepicker table tr td.active.disabled.active,
.datetimepicker table tr td.active.disabled:hover.active {
background-color: #003399 \9;
}
.datetimepicker table tr td span {
display: block;
width: 23%;
height: 54px;
line-height: 54px;
float: left;
margin: 1%;
cursor: pointer;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
}
.datetimepicker .datetimepicker-hours span {
height: 26px;
line-height: 26px;
}
.datetimepicker .datetimepicker-hours table tr td span.hour_am,
.datetimepicker .datetimepicker-hours table tr td span.hour_pm {
width: 14.6%;
}
.datetimepicker .datetimepicker-hours fieldset legend,
.datetimepicker .datetimepicker-minutes fieldset legend {
margin-bottom: inherit;
line-height: 30px;
}
.datetimepicker .datetimepicker-minutes span {
height: 26px;
line-height: 26px;
}
.datetimepicker table tr td span:hover {
background: #eeeeee;
}
.datetimepicker table tr td span.disabled,
.datetimepicker table tr td span.disabled:hover {
background: none;
color: #999999;
cursor: default;
}
.datetimepicker table tr td span.active,
.datetimepicker table tr td span.active:hover,
.datetimepicker table tr td span.active.disabled,
.datetimepicker table tr td span.active.disabled:hover {
background-color: #006dcc;
background-image: -moz-linear-gradient(top, #0088cc, #0044cc);
background-image: -ms-linear-gradient(top, #0088cc, #0044cc);
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0088cc), to(#0044cc));
background-image: -webkit-linear-gradient(top, #0088cc, #0044cc);
background-image: -o-linear-gradient(top, #0088cc, #0044cc);
background-image: linear-gradient(top, #0088cc, #0044cc);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088cc', endColorstr='#0044cc', GradientType=0);
border-color: #0044cc #0044cc #002a80;
border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}
.datetimepicker table tr td span.active:hover,
.datetimepicker table tr td span.active:hover:hover,
.datetimepicker table tr td span.active.disabled:hover,
.datetimepicker table tr td span.active.disabled:hover:hover,
.datetimepicker table tr td span.active:active,
.datetimepicker table tr td span.active:hover:active,
.datetimepicker table tr td span.active.disabled:active,
.datetimepicker table tr td span.active.disabled:hover:active,
.datetimepicker table tr td span.active.active,
.datetimepicker table tr td span.active:hover.active,
.datetimepicker table tr td span.active.disabled.active,
.datetimepicker table tr td span.active.disabled:hover.active,
.datetimepicker table tr td span.active.disabled,
.datetimepicker table tr td span.active:hover.disabled,
.datetimepicker table tr td span.active.disabled.disabled,
.datetimepicker table tr td span.active.disabled:hover.disabled,
.datetimepicker table tr td span.active[disabled],
.datetimepicker table tr td span.active:hover[disabled],
.datetimepicker table tr td span.active.disabled[disabled],
.datetimepicker table tr td span.active.disabled:hover[disabled] {
background-color: #0044cc;
}
.datetimepicker table tr td span.active:active,
.datetimepicker table tr td span.active:hover:active,
.datetimepicker table tr td span.active.disabled:active,
.datetimepicker table tr td span.active.disabled:hover:active,
.datetimepicker table tr td span.active.active,
.datetimepicker table tr td span.active:hover.active,
.datetimepicker table tr td span.active.disabled.active,
.datetimepicker table tr td span.active.disabled:hover.active {
background-color: #003399 \9;
}
.datetimepicker table tr td span.old {
color: #999999;
}
.datetimepicker th.switch {
width: 145px;
}
.datetimepicker thead tr:first-child th,
.datetimepicker tfoot tr:first-child th {
cursor: pointer;
}
.datetimepicker thead tr:first-child th:hover,
.datetimepicker tfoot tr:first-child th:hover {
background: #eeeeee;
}
.input-append.date .add-on i,
.input-prepend.date .add-on i {
cursor: pointer;
width: 14px;
height: 14px;
}

4
bower.json
View File

@@ -1,10 +1,10 @@
{
"name": "angular-datepicker",
"main": ["dist/module.min.js","dist/date.min.css"],
"main": ["module.min.js","date.min.css"],
"license": "MIT",
"version": "0.0.1",
"ignore": [
"**/.*"
".gitignore","README.md"
],
"dependencies": {},
"devDependencies": {

13
component.json
View File

@@ -1,13 +0,0 @@
{
"name": "dateInput",
"version": "0.0.0",
"dependencies": {
"angular": "~1.0.5",
"json3": "~3.2.4",
"es5-shim": "~2.0.8"
},
"devDependencies": {
"angular-mocks": "~1.0.5",
"angular-scenario": "~1.0.5"
}
}

0
dist/index.css → index.css
View File

0
dist/index.js → index.js
View File

0
dist/index.min.css → index.min.css vendored
View File

0
dist/index.min.js → index.min.js vendored
View File

51
karma-e2e.conf.js
View File

@@ -1,51 +0,0 @@
// Karma E2E configuration
// base path, that will be used to resolve files and exclude
basePath = '';
// list of files / patterns to load in the browser
files = [
ANGULAR_SCENARIO,
ANGULAR_SCENARIO_ADAPTER,
'test/e2e/**/*.js'
];
// list of files to exclude
exclude = [];
// test results reporter to use
// possible values: dots || progress || growl
reporters = ['progress'];
// web server port
port = 8080;
// cli runner port
runnerPort = 9100;
// enable / disable colors in the output (reporters and logs)
colors = true;
// level of logging
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
logLevel = LOG_INFO;
// enable / disable watching file and executing tests whenever any file changes
autoWatch = false;
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
browsers = ['Chrome'];
// If browser does not capture in given timeout [ms], kill it
captureTimeout = 5000;
// Continuous Integration mode
// if true, it capture browsers, run tests and exit
singleRun = false;

56
karma.conf.js
View File

@@ -1,56 +0,0 @@
// Karma configuration
// base path, that will be used to resolve files and exclude
basePath = '';
// list of files / patterns to load in the browser
files = [
JASMINE,
JASMINE_ADAPTER,
'app/components/angular/angular.js',
'app/components/angular-mocks/angular-mocks.js',
'app/scripts/*.js',
'app/scripts/**/*.js',
'test/mock/**/*.js',
'test/spec/**/*.js'
];
// list of files to exclude
exclude = [];
// test results reporter to use
// possible values: dots || progress || growl
reporters = ['progress'];
// web server port
port = 8080;
// cli runner port
runnerPort = 9100;
// enable / disable colors in the output (reporters and logs)
colors = true;
// level of logging
// possible values: LOG_DISABLE || LOG_ERROR || LOG_WARN || LOG_INFO || LOG_DEBUG
logLevel = LOG_INFO;
// enable / disable watching file and executing tests whenever any file changes
autoWatch = false;
// Start these browsers, currently available:
// - Chrome
// - ChromeCanary
// - Firefox
// - Opera
// - Safari (only Mac)
// - PhantomJS
// - IE (only Windows)
browsers = ['ChromeCanary'];
// If browser does not capture in given timeout [ms], kill it
captureTimeout = 5000;
// Continuous Integration mode
// if true, it capture browsers, run tests and exit
singleRun = false;

33
package.json
View File

@@ -1,33 +0,0 @@
{
"name": "angular-datepicker",
"version": "0.0.0",
"dependencies": {},
"devDependencies": {
"grunt": "~0.4.1",
"grunt-contrib-copy": "~0.4.0",
"grunt-contrib-concat": "~0.1.3",
"grunt-contrib-coffee": "~0.6.4",
"grunt-contrib-uglify": "~0.2.0",
"grunt-contrib-compass": "~0.1.3",
"grunt-contrib-jshint": "~0.3.0",
"grunt-contrib-cssmin": "~0.5.0",
"grunt-contrib-connect": "~0.2.0",
"grunt-contrib-clean": "~0.4.0",
"grunt-contrib-htmlmin": "~0.1.1",
"grunt-contrib-imagemin": "~0.1.2",
"grunt-contrib-livereload": "~0.1.2",
"grunt-bower-requirejs": "~0.4.1",
"grunt-usemin": "~0.1.10",
"grunt-regarde": "~0.1.1",
"grunt-rev": "~0.1.0",
"grunt-karma": "~0.3.0",
"grunt-open": "~0.2.0",
"matchdep": "~0.1.1",
"grunt-google-cdn": "~0.1.1",
"grunt-ngmin": "~0.0.2",
"grunt-angular-templates": "~0.3.8"
},
"engines": {
"node": ">=0.8.0"
}
}

10
test/runner.html
View File

@@ -1,10 +0,0 @@
<!doctype html>
<html lang="en">
<head>
<title>End2end Test Runner</title>
<script src="vendor/angular-scenario.js" ng-autotest></script>
<script src="scenarios.js"></script>
</head>
<body>
</body>
</html>