input_calendar 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. data/README.md +6 -0
  2. data/example.html +18 -1
  3. data/lib/input_calendar/version.rb +1 -1
  4. data/src/calendar.coffee +13 -3
  5. data/vendor/assets/javascripts/input_calendar.js +17 -3
  6. metadata +3 -3
data/README.md CHANGED
@@ -23,6 +23,12 @@ Or avoid the inline JS with some jQuery (coffeescript) somewhere:
23
23
 
24
24
  * class - custom CSS class (or multiple classes)
25
25
  * onchange - function that is called each time a date is selected
26
+ * footer - underscore.js style template string for the footer
27
+ * Supports: month (full name), day, year, day_of_week (full name)
28
+
29
+ Example of using footer:
30
+
31
+ Calendar.attach("event_date", {footer: "<strong>Due by:</strong> <%= month %> <%= day %>, <%= year %>"})
26
32
 
27
33
  ## Installing
28
34
 
data/example.html CHANGED
@@ -8,15 +8,32 @@
8
8
  <style>
9
9
  body
10
10
  {
11
+ padding:20px;
11
12
  font-family:'Lucida Grande', Helvetica, Arial, sans-serif;
12
13
  background:#eee;
13
14
  }
15
+ h1 { font-size:1.2em;}
16
+ div { float:left; width:225px;}
14
17
  </style>
15
18
  <body>
16
19
 
17
- <input type="text" value="2001-09-21" id="event_date">
20
+ <div>
21
+ <h1>Default</h1>
22
+ <input type="text" value="2001-09-21" id="event_date" readonly>
18
23
  <script>
19
24
  Calendar.attach("event_date")
20
25
  </script>
26
+ </div>
27
+
28
+ <div>
29
+ <h1>Custom text</h1>
30
+ <input type="text" value="2001-09-21" id="event2_date" readonly>
31
+ <script>
32
+ Calendar.attach("event2_date", {footer: "<strong>Due by:</strong> <%= month %> <%= day %>, <%= year %>"})
33
+ </script>
34
+ </div>
35
+
36
+
37
+
21
38
  </body>
22
39
  </html>
data/lib/input_calendar/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module InputCalendar
2
- VERSION = "0.0.3"
2
+ VERSION = "0.0.4"
3
3
  end
data/src/calendar.coffee CHANGED
@@ -10,6 +10,8 @@ class @Calendar
10
10
  @element=$("<div>").insertAfter(@field)
11
11
  @show()
12
12
  @options["class"] ?= "minicalendar"
13
+ if @options.footer
14
+ @footerTemplate = _.template @options.footer
13
15
  # default to today before we try and fetch from the field
14
16
  @date = new Date
15
17
  @getDateFromField()
@@ -111,8 +113,16 @@ class @Calendar
111
113
  @options.onchange(@field.val())
112
114
  false
113
115
 
114
- currentDateString: ->
115
- "<b>#{@DAYS[@date.getDay()]}</b><br />#{@MONTHS[@date.getMonth()].label} #{@date.getDate()}, #{@date.getFullYear()}"
116
+ generateFooter: ->
117
+ if @footerTemplate
118
+ params =
119
+ day: @date.getDate()
120
+ month: @MONTHS[@date.getMonth()].label
121
+ day_of_week: @DAYS[@date.getDay()]
122
+ year: @date.getFullYear()
123
+ @footerTemplate(params)
124
+ else
125
+ "<b>#{@DAYS[@date.getDay()]}</b><br />#{@MONTHS[@date.getMonth()].label} #{@date.getDate()}, #{@date.getFullYear()}"
116
126
 
117
127
  redraw: () ->
118
128
  html = """<table class="#{@options["class"]}" cellspacing="0">
@@ -124,7 +134,7 @@ class @Calendar
124
134
  </thead>
125
135
  <tbody>#{@buildDateCells()}</tbody>
126
136
  <tfoot>
127
- <tr><td colspan="7" class="selectedtext">#{@currentDateString()}</td></tr>
137
+ <tr><td colspan="7" class="selectedtext">#{@generateFooter()}</td></tr>
128
138
  </tfoot>
129
139
  </table>"""
130
140
  @element.html html
data/vendor/assets/javascripts/input_calendar.js CHANGED
@@ -20,6 +20,9 @@
20
20
  } else {
21
21
  _base["class"] = "minicalendar";
22
22
  };
23
+ if (this.options.footer) {
24
+ this.footerTemplate = _.template(this.options.footer);
25
+ }
23
26
  this.date = new Date;
24
27
  this.getDateFromField();
25
28
  this.pager_date = new Date(this.date);
@@ -175,12 +178,23 @@
175
178
  }
176
179
  return false;
177
180
  };
178
- Calendar.prototype.currentDateString = function() {
179
- return "<b>" + this.DAYS[this.date.getDay()] + "</b><br />" + this.MONTHS[this.date.getMonth()].label + " " + (this.date.getDate()) + ", " + (this.date.getFullYear());
181
+ Calendar.prototype.generateFooter = function() {
182
+ var params;
183
+ if (this.footerTemplate) {
184
+ params = {
185
+ day: this.date.getDate(),
186
+ month: this.MONTHS[this.date.getMonth()].label,
187
+ day_of_week: this.DAYS[this.date.getDay()],
188
+ year: this.date.getFullYear()
189
+ };
190
+ return this.footerTemplate(params);
191
+ } else {
192
+ return "<b>" + this.DAYS[this.date.getDay()] + "</b><br />" + this.MONTHS[this.date.getMonth()].label + " " + (this.date.getDate()) + ", " + (this.date.getFullYear());
193
+ }
180
194
  };
181
195
  Calendar.prototype.redraw = function() {
182
196
  var html;
183
- html = "<table class=\"" + this.options["class"] + "\" cellspacing=\"0\">\n<thead> \n <tr><th class=\"back\"><a href=\"#\">&larr;</a></th>\n <th colspan=\"5\" class=\"month_label\">" + (this.label()) + "</th>\n <th class=\"forward\"><a href=\"#\">&rarr;</a></th></tr>\n <tr class=\"day_header\">" + (this.dayRows()) + "</tr>\n </thead>\n <tbody>" + (this.buildDateCells()) + "</tbody>\n <tfoot>\n <tr><td colspan=\"7\" class=\"selectedtext\">" + (this.currentDateString()) + "</td></tr>\n </tfoot>\n </table>";
197
+ html = "<table class=\"" + this.options["class"] + "\" cellspacing=\"0\">\n<thead> \n <tr><th class=\"back\"><a href=\"#\">&larr;</a></th>\n <th colspan=\"5\" class=\"month_label\">" + (this.label()) + "</th>\n <th class=\"forward\"><a href=\"#\">&rarr;</a></th></tr>\n <tr class=\"day_header\">" + (this.dayRows()) + "</tr>\n </thead>\n <tbody>" + (this.buildDateCells()) + "</tbody>\n <tfoot>\n <tr><td colspan=\"7\" class=\"selectedtext\">" + (this.generateFooter()) + "</td></tr>\n </tfoot>\n </table>";
184
198
  this.element.html(html);
185
199
  this.element.find("th.back").click(__bind(function() {
186
200
  return this.back();
metadata CHANGED
@@ -1,13 +1,13 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: input_calendar
3
3
  version: !ruby/object:Gem::Version
4
- hash: 25
4
+ hash: 23
5
5
  prerelease:
6
6
  segments:
7
7
  - 0
8
8
  - 0
9
- - 3
10
- version: 0.0.3
9
+ - 4
10
+ version: 0.0.4
11
11
  platform: ruby
12
12
  authors:
13
13
  - Josh Goebel