README.md in simple_calendar-1.1.3 vs README.md in simple_calendar-1.1.4

- old
+ new

@@ -1,9 +1,9 @@ Simple Calendar =============== -Simple Calendar is design to do one thing really really well: render a +Simple Calendar is designed to do one thing really really well: render a calendar. It lets you render a calendar of any size. Maybe you want a day view, a 4 day agenda, a week view, a month view, or a 6 week calendar. You can do all of that with the new gem, just give it a range of dates to render. @@ -95,11 +95,11 @@ @events = Event.all end ``` Then in your view, you can pass in the `events` option to render. The -events will automatically be filter out by day for you. +events will automatically be filtered out by day for you. ```erb <%= month_calendar events: @events do |date, events| %> <%= date %> @@ -143,27 +143,34 @@ def set_time_zone Time.zone = current_user.time_zone end end ``` +If you want to set the time zone globally, you can set the following in +`config/application.rb`: -You can also change the beginning day of the week. If you want to set -this globally, you can put this line in -`config/initializers/simple_calendar.rb`: +```ruby +config.time_zone = 'Central Time (US & Canada)' +``` +You can also change the beginning day of the week by setting +`Date.beginning_of_week` in a `before_filter` just like in the previous +example. If you want to set this globally, you can put this line in +`config/application.rb`: + ```ruby -Date.beginning_of_week = :sunday +config.beginning_of_week = :sunday ``` Setting classes on the table and elements are pretty easy. Each of the options are passed directly to the the `content_tag` method so each of them **must** be a hash. ```ruby -<%= calendar table: {class: "table table-bordered"}, tr: {class: "row"}, td: {class: "day"}, do |day| %> +<%= calendar table: {class: "table table-bordered"}, tr: {class: "calendar-row"}, td: {class: "day"}, do |date| %> <% end %> ``` This will set the class of `table table-bordered` on the `table` HTML element. @@ -205,11 +212,11 @@ </td> ``` Instead of writing the lambdas inline, a cleaner approach is to write a helper that returns a lambda. You can duplicate the following example by -adding this to your helpers +adding this to one of your helpers: ```ruby def month_calendar_td_options ->(start_date, current_calendar_date) { {class: "calendar-date", data: {day: current_calendar_date}} @@ -218,63 +225,77 @@ ``` And then your view would use `month_calendar_td_options` as the value. ```erb -<%= month_calendar td: month_calendar_td_options do |day| %> +<%= month_calendar td: month_calendar_td_options do |date| %> <% end %> ``` ### Custom Header Title And Links Each of the calendar methods will generate a header with links to the previous and next views. The `month_calendar` also includes a header with a title that tells you the current month and year that you are viewing. -To change these, you can pass in the `prev_link`, `title`, and +To change these, you can pass in the `previous_link`, `title`, and `next_link` options into the calendar methods. -The default `month_calendar` look like this: +**Use a method in your helpers to return a lambda instead of writing +them inline like these examples so your views are cleaner.** -```erb -<%= month_calendar prev_link: ->(range) { link_to raw("&laquo;"), param_name => range.first - 1.day }, - title: ->{ content_tag :span, "#{I18n.t("date.month_names")[start_date.month]} #{start_date.year}", class: "calendar-title" }, - next_link: ->(range) { link_to raw("&raquo;"), param_name => range.last + 1.day } do |day| %> +* `title` option is a lambda that shows at the top of the calendar. For +month calendars, this is the Month and Year (May 2014) +```erb +<%= calendar title: ->(start_date) { content_tag :span, "#{I18n.t("date.month_names")[start_date.month]} #{start_date.year}", class: "calendar-title" } do |date, events| %> <% end %> ``` -`title` option is a lambda that - -`prev_link` option is a standard `link_to` that is a left arrow and +* `previous_link` option is a standard `link_to` that is a left arrow and with the current url having `?start_date=2014-04-30` appended to it as a date in the previous view of the calendar. -`next_link` option is a standard `link_to` that is a right arrow and +```erb +<%= month_calendar previous_link: ->(param, date_range) { link_to raw("&laquo;"), {param => date_range.first - 1.day} } do |date, events| %> +<% end %> +``` + +* `next_link` option is a standard `link_to` that is a right arrow and with the current url having `?start_date=2014-06-01` appended to it as a date in the next view of the calendar. -`title` option is, by default, a simple span tag with the month and year -inside of it. +```erb +<%= calendar next_link: ->(param, date_range) { link_to raw("&raquo;"), {param => date_range.last + 1.day} } do |date, events| %> +<% end %> +``` -If you wish to add some styles to the header, you can use the `header` -option: +* `header` lets you add options to the header tag ```erb -<%= month_calendar header: {class: "calendar-header"} do |day| %> +<%= calendar header: {class: "calendar-header"} do |date, events| %> <% end %> ``` -The table header (thead) is the row of day names across the top. It -tells you which column is which day. For example `Sun Mon Tue Wed` +* `thead` allows you to customize the table headers. These are the + abbreviated day names by default (Sun Mon Tue Wed). +You can disable the `thead` line if you like by passing in `false`. + +```erb +<%= calendar thead: false do |date, events| %> +<% end %> +``` + +* `day_names` lets you customize the day names in the `thead` row. + If you want to use full day names instead of the abbreviated ones in the table header, you can pass in the `day_names` option which points to a validate I18n array. ```erb -<%= calendar day_names: "date.day_names" do |day, events| %> +<%= calendar day_names: "date.day_names" do |date, events| %> <% end %> ``` Which renders: @@ -291,11 +312,11 @@ By default we use the `date.abbr_day_names` translation to have shorter header names. ```erb -<%= calendar day_names: "date.abbr_day_names" do |day, events| %> +<%= calendar day_names: "date.abbr_day_names" do |date, events| %> <% end %> ``` This renders: @@ -308,16 +329,17 @@ <th>Wed</th> </tr> </thead> ``` -You can disable the `thead` line if you like by passing in `false`. +### AJAX Calendars -```erb -<%= month_calendar thead: false do |day| %> -<% end %> -``` +Rendering calendars that update with AJAX is pretty simple. You'll need +to wrap your calendar in a div, overwrite the `next_link` and `previous_link` options, and setup your +controller to respond to JS requests. The response can simply replace +the HTML of the div with the newly rendered calendar. +Take a look at **[excid3/simple_calendar-ajax-example](https://github.com/excid3/simple_calendar-ajax-example)** to see how it is done. ## TODO - Multi-day events?