Skip to content

Commit 6f1d70c

Browse files
capripotcapripot
committed
first update for bootstrap
1 parent 4e7e996 commit 6f1d70c

File tree

3 files changed

+36
-33
lines changed

3 files changed

+36
-33
lines changed

‎Source/Picker.Date.js

Lines changed: 13 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -140,11 +140,11 @@ this.DatePicker = Picker.Date = new Class({
140140
this.parent();
141141

142142
if (!this.options.rtl){
143-
this.previous = new Element('div.previous[html=«]').inject(this.header);
144-
this.next = new Element('div.next[html=»]').inject(this.header);
143+
this.previous = new Element('div.previous.icon-chevron-left[html=«]').inject(this.header);
144+
this.next = new Element('div.next.icon-chevron-right[html=»]').inject(this.header);
145145
} else {
146-
this.next = new Element('div.previous[html=«]').inject(this.header);
147-
this.previous = new Element('div.next[html=»]').inject(this.header);
146+
this.next = new Element('div.previous.icon-chevron-right[html=«]').inject(this.header);
147+
this.previous = new Element('div.next.icon-chevron-left[html=»]').inject(this.header);
148148
}
149149
},
150150

@@ -474,7 +474,7 @@ var renderers = {
474474
todayString = new Date().toDateString(),
475475
currentString = currentDate.toDateString(),
476476
weeknumbers = options.weeknumbers,
477-
container = new Element('table.days' + (weeknumbers ? '.weeknumbers' : ''), {
477+
container = new Element('table.days.table-condensed' + (weeknumbers ? '.weeknumbers' : ''), {
478478
role: 'grid', 'aria-labelledby': this.titleID
479479
}),
480480
header = new Element('thead').inject(container),
@@ -522,14 +522,14 @@ var renderers = {
522522
},
523523

524524
time: function(options, date, fn){
525-
var container = new Element('div.time'),
525+
var container = new Element('div.time.form-inline.text-center'),
526526
// make sure that the minutes are timeWheelStep * k
527527
initMinutes = (date.get('minutes') / options.timeWheelStep).round() * options.timeWheelStep
528528

529529
if (initMinutes >= 60) initMinutes = 0;
530530
date.set('minutes', initMinutes);
531531

532-
var hoursInput = new Element('input.hour[type=text]', {
532+
var hoursInput = new Element('input.hour.input-mini[type=text]', {
533533
title: Locale.get('DatePicker.use_mouse_wheel'),
534534
value: date.format('%H'),
535535
events: {
@@ -550,7 +550,10 @@ var renderers = {
550550
maxlength: 2
551551
}).inject(container);
552552

553-
var minutesInput = new Element('input.minutes[type=text]', {
553+
554+
new Element('span.separator[text=:]').inject(container);
555+
556+
var minutesInput = new Element('input.minutes.input-mini[type=text]', {
554557
title: Locale.get('DatePicker.use_mouse_wheel'),
555558
value: date.format('%M'),
556559
events: {
@@ -572,10 +575,9 @@ var renderers = {
572575
maxlength: 2
573576
}).inject(container);
574577

575-
new Element('div.separator[text=:]').inject(container);
576578

577-
new Element('input.ok', {
578-
'type': 'input',
579+
new Element('input.ok.btn.btn-primary', {
580+
'type': 'button',
579581
value: Locale.get('DatePicker.time_confirm_button'),
580582
events: {click: function(event){
581583
event.stop();

‎Source/Picker.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ var Picker = new Class({
7171
'aria-atomic': 'true'
7272
}).inject(title);
7373

74-
this.closeButton = new Element('div.closeButton[text=x][role=button]')
74+
this.closeButton = new Element('div.closeButton.icon-remove[text=x][role=button]')
7575
.addEvent('click', this.close.pass(false, this))
7676
.inject(header);
7777

‎Test/full.html

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -9,17 +9,18 @@
99
<script src="../Source/Picker.js" type="text/javascript"></script>
1010
<script src="../Source/Picker.Attach.js" type="text/javascript"></script>
1111
<script src="../Source/Picker.Date.js" type="text/javascript"></script>
12+
13+
<link href="../Source/Bootstrap/bootstrap.css" rel="stylesheet" />
1214

13-
<link href="style.css" rel="stylesheet" />
14-
<link href="../Source/datepicker_dashboard/datepicker_dashboard.css" rel="stylesheet">
15+
<link href="../Source/datepicker_dashboard/datepicker_bootstrap.css" rel="stylesheet">
1516

1617
<script>
1718

1819
window.addEvent('domready', function(){
1920
new Picker.Date($$('input'), {
2021
timePicker: true,
2122
positionOffset: {x: 5, y: 0},
22-
pickerClass: 'datepicker_dashboard',
23+
pickerClass: 'datepicker dropdown-menu',
2324
useFadeInOut: !Browser.ie
2425
});
2526
});
@@ -29,23 +30,23 @@
2930
</head>
3031

3132
<body>
32-
<h1>Full Date and TimePicker</h1>
33-
34-
<p>
35-
This is a demo of a all the pickers, including years, months, days and time.<br />
36-
You should begin at the days view, but you can click the title to go up to months and years.<br />
37-
If you've selected a day, you should see the timepicker.
38-
</p>
39-
40-
<p>
41-
Inputs:<br>
42-
<input type="text" value="02/08/1991 11:05AM">
43-
</p>
44-
45-
<p>
46-
Empty default value:<br>
47-
<input type="text">
48-
</p>
49-
33+
<div class="container"><h1>Full Date and TimePicker</h1>
34+
35+
<p>
36+
This is a demo of a all the pickers, including years, months, days and time.<br />
37+
You should begin at the days view, but you can click the title to go up to months and years.<br />
38+
If you've selected a day, you should see the timepicker.
39+
</p>
40+
41+
<p>
42+
Inputs:<br>
43+
<input type="text" value="03/09/2013 11:05AM">
44+
</p>
45+
46+
<p>
47+
Empty default value:<br>
48+
<input type="text">
49+
</p>
50+
</div>
5051
</body>
5152
</html>

0 commit comments

Comments
 (0)