diff --git a/README.md b/README.md
index 0b7f6575..334dce4e 100644
--- a/README.md
+++ b/README.md
@@ -1,10 +1,47 @@
MagicMirror
===========
+##Introduction
+
The super magic interface of my personal Magic Mirror. More information about this project can be found on my [blog](http://michaelteeuw.nl/tagged/magicmirror).
Runs as a php script on a web server with basically no external dependencies. Can use socket.io for XBEE integration, but isn't required for basic functionality.
+
+##Configuration
+
Modify js/config.js to change some general variables (language, wather location, compliments, news feed RSS) and calendar.php to add your own ICS calendar
To use the OpenWeatherMap API, you'll need a free API key. Checkout [this blogpost](http://michaelteeuw.nl/post/131504229357/what-happened-to-the-weather) for more information.
+
+##Code
+
+###[main.js](js/main.js)
+
+This file initiates the separate pieces of functionality that will appear in the view. It also includes various utility functions that are used to update what is visible.
+
+###[Calendar](js/calendar)
+
+Parsing functionality for the Calendar that retrieves and updates the calendar based on the interval set at the top of the [calendar.js](js/calendar/calendar.js) file. This was actually a straight pull from the original main.js file but the parsing code may deserve an upgrade.
+
+###[Compliments](js/compliments)
+
+Functionality related to inserting compliments into the view and rotating them based on a specific interval set at the top of the [compliments.js](js/compliments/compliments.js) file.
+
+###[News](js/news)
+
+Takes an array of news feeds (or a single string) from the config file and retrieves each one so that it can be displayed in a loop based on the interval set at the top of the [news.js](js/news/news.js) file.
+
+###[Time](js/time)
+
+Updates the time on the screen on one second interval.
+
+###[Version](js/version)
+
+Checks the git version and refreshes if a new version has been pulled.
+
+###[Weather](js/weather)
+
+Takes the user's inserted location, language, unit type, and OpenWeatherMap API key and grabs the five day weather forecast from OpenWeatherMap. You need to set the API key in the config for this to work. (See *configuration*.)
+
+
diff --git a/index.php b/index.php
index 9b53f5d5..5723f3a5 100644
--- a/index.php
+++ b/index.php
@@ -24,9 +24,15 @@
-
+
+
+
+
+
+
+
diff --git a/js/calendar/calendar.js b/js/calendar/calendar.js
new file mode 100644
index 00000000..de882928
--- /dev/null
+++ b/js/calendar/calendar.js
@@ -0,0 +1,132 @@
+var calendar = {
+ eventList: [],
+ calendarLocation: '.calendar',
+ updateInterval: 1000,
+ updateDataInterval: 60000,
+ fadeInterval: 1000,
+ intervalId: null,
+ dataIntervalId: null
+}
+
+calendar.updateData = function (callback) {
+
+ new ical_parser("calendar.php", function(cal) {
+ var events = cal.getEvents();
+ this.eventList = [];
+
+ for (var i in events) {
+ var e = events[i];
+ for (var key in e) {
+ var value = e[key];
+ var seperator = key.search(';');
+ if (seperator >= 0) {
+ var mainKey = key.substring(0,seperator);
+ var subKey = key.substring(seperator+1);
+
+ var dt;
+ if (subKey == 'VALUE=DATE') {
+ //date
+ dt = new Date(value.substring(0,4), value.substring(4,6) - 1, value.substring(6,8));
+ } else {
+ //time
+ dt = new Date(value.substring(0,4), value.substring(4,6) - 1, value.substring(6,8), value.substring(9,11), value.substring(11,13), value.substring(13,15));
+ }
+
+ if (mainKey == 'DTSTART') e.startDate = dt;
+ if (mainKey == 'DTEND') e.endDate = dt;
+ }
+ }
+
+ if (e.startDate == undefined){
+ //some old events in Gmail Calendar is "start_date"
+ //FIXME: problems with Gmail's TimeZone
+ var days = moment(e.DTSTART).diff(moment(), 'days');
+ var seconds = moment(e.DTSTART).diff(moment(), 'seconds');
+ var startDate = moment(e.DTSTART);
+ } else {
+ var days = moment(e.startDate).diff(moment(), 'days');
+ var seconds = moment(e.startDate).diff(moment(), 'seconds');
+ var startDate = moment(e.startDate);
+ }
+
+ //only add fututre events, days doesn't work, we need to check seconds
+ if (seconds >= 0) {
+ if (seconds <= 60*60*5 || seconds >= 60*60*24*2) {
+ var time_string = moment(startDate).fromNow();
+ }else {
+ var time_string = moment(startDate).calendar()
+ }
+ if (!e.RRULE) {
+ this.eventList.push({'description':e.SUMMARY,'seconds':seconds,'days':time_string});
+ }
+ e.seconds = seconds;
+ }
+
+ // Special handling for rrule events
+ if (e.RRULE) {
+ var options = new RRule.parseString(e.RRULE);
+ options.dtstart = e.startDate;
+ var rule = new RRule(options);
+
+ // TODO: don't use fixed end date here, use something like now() + 1 year
+ var dates = rule.between(new Date(), new Date(2016,11,31), true, function (date, i){return i < 10});
+ for (date in dates) {
+ var dt = new Date(dates[date]);
+ var days = moment(dt).diff(moment(), 'days');
+ var seconds = moment(dt).diff(moment(), 'seconds');
+ var startDate = moment(dt);
+ if (seconds >= 0) {
+ if (seconds <= 60*60*5 || seconds >= 60*60*24*2) {
+ var time_string = moment(dt).fromNow();
+ } else {
+ var time_string = moment(dt).calendar()
+ }
+ this.eventList.push({'description':e.SUMMARY,'seconds':seconds,'days':time_string});
+ }
+ }
+ }
+ };
+
+ this.eventList = this.eventList.sort(function(a,b){return a.seconds-b.seconds});
+
+ if (callback !== undefined && Object.prototype.toString.call(callback) === '[object Function]') {
+ callback(this.eventList);
+ }
+
+ }.bind(this));
+
+}
+
+calendar.updateCalendar = function (eventList) {
+
+ table = $('
').addClass('xsmall').addClass('calendar-table');
+ opacity = 1;
+
+ for (var i in eventList) {
+ var e = eventList[i];
+
+ var row = $('
').addClass('forecast-table');
- var opacity = 1;
- for (var i in forecastData) {
- var forecast = forecastData[i];
- var iconClass = iconTable[forecast.icon];
- var dt = new Date(forecast.timestamp);
- var row = $('