Fix multiday events rendering bug

README.md

@@ -1,12 +1,13 @@
 react-big-calendar
 ========================
 
-An event Calendar component built for React.
+An events calendar component built for React.
 
-[__DEMO and Docs__](http://intljusticemission.github.io/react-big-calendar/examples/index.html).
-big calendar is built for modern browsers (read: ie10+) and uses flexbox over the classic tables-ception approach.
+[__DEMO and Docs__](http://intljusticemission.github.io/react-big-calendar/examples/index.html)
 
-To run the example locally, `git clone`, `npm install` and `npm run examples`, hosted at localhost:3000.
+`react-big-calendar` is built for modern browsers (read: IE10+) and uses flexbox over the classic tables-ception approach.
+
+To run the examples locally, run `npm install && npm run examples`, and open [localhost:3000/examples/index.html](http://localhost:3000/examples/index.html).
 
 Inspired by [Full Calendar](http://fullcalendar.io/).
 
@@ -19,9 +20,9 @@ Include `react-big-calendar/lib/css/react-big-calendar.css` for styles.
 ### Localization and Date Formatting
 
 `react-big-calendar` includes two options for handling the date formatting and culture localization, depending
-on your preference of DateTime libraries. You can use either the Moment.js or Globalize.js localizers.
+on your preference of DateTime libraries. You can use either the [Moment.js](http://momentjs.com/) or [Globalize.js](https://github.com/jquery/globalize) localizers.
 
-Regardless of your choice you __must__ choose a localizer to use react-big-calendar.
+Regardless of your choice, you __must__ choose a localizer to use this library:
 
 #### Moment.js
 

package.json

@@ -1,9 +1,9 @@
 {
   "name": "react-big-calendar",
-  "version": "0.9.8",
-  "description": "Calendar! with events",
+  "version": "0.9.9",
+  "description": "Google Calendar like React component, inspired by fullcalendar.io",
   "author": "Jason Quense <monastic.panic@gmail.com>",
-  "repository": "jquense/react-big-calendar",
+  "repository": "intljusticemission/react-big-calendar",
   "license": "MIT",
   "main": "lib/index.js",
   "files": [
@@ -25,7 +25,7 @@
     "clean:examples": "rimraf examples/static",
     "less": "lessc -x src/less/styles.less ./lib/css/react-big-calendar.css",
     "assets": "cpy src/less/* lib/less",
-    "build": "npm run clean && babel src --out-dir lib && npm run assets & npm run less",
+    "build": "npm run clean && babel src --out-dir lib && npm run assets && npm run less",
     "build:examples": "npm run clean:examples && webpack --config webpack/docs.config.es6.js",
     "build:visual-test": "webpack --config webpack/visual-test.es6.js",
     "examples": "npm run clean:examples && babel-node ./examples/server.js",

src/utils/eventLevels.js

@@ -2,19 +2,17 @@ import dates from './dates';
 import { accessor as get } from './accessors';
 
 export function eventSegments(event, first, last, { startAccessor, endAccessor, culture }){
-  let slots = dates.diff(first, last, 'day')
-  let start = dates.max(dates.startOf(get(event, startAccessor), 'day'), first);
-  let end = dates.min(dates.ceil(get(event, endAccessor), 'day'), dates.add(last, 1, 'day'))
+  const slots = Math.round(dates.diff(first, last, 'day')) + 1;
 
-  let span = dates.diff(start, end, 'day');
+  const start = dates.max(dates.startOf(get(event, startAccessor), 'day'), first);
+  const end = dates.min(dates.startOf(get(event, endAccessor), 'day'), last);
 
-  span = Math.floor(Math.max(Math.min(span, slots), 1));
-
-  let padding = Math.floor(dates.diff(first, start, 'day'));
+  const span = Math.round(dates.diff(start, end, 'day')) + 1;
+  const padding = Math.round(dates.diff(first, start, 'day'));
 
   return {
     event,
-    span,
+    span: Math.max(Math.min(span, slots), 1),
     left: padding + 1,
     right: Math.max(padding + span, 1)
   }