diff --git a/README.md b/README.md index 46267cf..2195ceb 100644 --- a/README.md +++ b/README.md @@ -74,6 +74,7 @@ Datetime "syntax" - `2001-2005`, `10/2001-02/03/2005` - event that happen within the two dates - `~2005` - event that happen around the time in that year - `2005-~` - event that happen from that year and beyond (now). +- `01/2001-06/2001,09/2001-01/2002` - event that was interrupted. Use any of the above syntax separated by commas, in chronological order. Other people's Lives -------------------- diff --git a/index.html b/index.html index 900adb9..4d7d2f0 100644 --- a/index.html +++ b/index.html @@ -81,13 +81,16 @@ font-weight: normal; color: rgba(255,255,255,.5); } +#life .event .times{ + display: inline-block; + margin-right: 10px; +} #life .event .time{ display: inline-block; overflow: hidden; height: 0; border: 4px solid #fff; border-radius: 4px; - margin-right: 10px; opacity: .3; position: relative; left: -2px; @@ -168,7 +171,7 @@

Life

var list = response.match(/\-\s+[^\n\r]+/ig); var data = []; list.forEach(function(l){ - var matches = l.match(/\-\s+([\d\/\-\~]+)\s(.*)/i); + var matches = l.match(/\-\s+([\d\/\-\~,]+)\s(.*)/i); var time = matches[1]; var text = matches[2]; data.push({ @@ -200,6 +203,26 @@

Life

data[point + 'Date'] = parseInt(t[0], 10); data[point + 'Month'] = parseInt(t[1], 10); data[point + 'Year'] = parseInt(t[2], 10); + } else if (/\d,/.test(time)){ // TIME-TIME,TIME-TIME + var strs = time.split(','); + var times = new Array(strs.length); + strs.forEach(function(str, i){ + times[i] = life.parseTime(str); + }); + data.intervals = times; + // Copy first and last. + var startTime = times[0]; + var endTime = times[times.length - 1]; + for (var k in startTime) { data[k] = startTime[k] } + if (endTime.endYear != null){ + data.endDate = endTime.endDate; + data.endMonth = endTime.endMonth; + data.endYear = endTime.endYear; + } else { + data.endDate = endTime.startDate; + data.endMonth = endTime.startMonth; + data.endYear = endTime.startYear; + } } else if (/\d\-/.test(time)){ // TIME-TIME var splitTime = time.split('-'); var startTime = life.parseTime(splitTime[0]); @@ -212,17 +235,16 @@

Life

data.endMonth = now.getMonth()+1; data.endDate = now.getDate(); } - data.title = time; + data.title = time.replace(/,/, ', '); return data; }, firstYear: null, - renderEvent: function(d){ + measureEventLine: function(time){ var firstYear = life.firstYear; var yearLength = life.config.yearLength; var monthLength = yearLength/12; var dayLength = monthLength/30; - var time = d.time; var estimate = time.estimate; var startYear = time.startYear; var startMonth = time.startMonth; @@ -232,12 +254,6 @@

Life

var endDate = time.endDate; var width = 0; - // Calculate offset - var startTime = new Date(firstYear, 0, 1); - var endTime = new Date(startYear, startMonth ? startMonth-1 : 0, startDate || 1); - var daysDiff = (endTime - startTime)/(24*60*60*1000); - offset = daysDiff*dayLength; - // Calculate width if (endYear){ var _endMonth = endMonth ? endMonth-1 : 11; @@ -256,6 +272,51 @@

Life

} } + return width; + }, + renderEventLines: function(d, buffer, totalLeftOffset){ + var intervals = d.time.intervals || [d.time]; + buffer = buffer || []; + totalLeftOffset = totalLeftOffset || 0; + buffer.push('
'); + intervals.forEach(function(time){ + var width = life.measureEventLine(time); + var offset = life.measureTimeOffset(time); + var marginLeft = offset - totalLeftOffset; + buffer.push('
'); + + // Add twice the border width. + var outerWidth = width + 2 * 4; + totalLeftOffset += outerWidth + marginLeft; + }); + buffer.push('
'); + return buffer; + }, + measureTimeOffset: function(time){ + var firstYear = life.firstYear; + var yearLength = life.config.yearLength; + var monthLength = yearLength/12; + var dayLength = monthLength/30; + + var startYear = time.startYear; + var startMonth = time.startMonth; + var startDate = time.startDate; + + var startTime = new Date(firstYear, 0, 1); + var endTime = new Date(startYear, startMonth ? startMonth-1 : 0, startDate || 1); + var daysDiff = (endTime - startTime)/(24*60*60*1000); + return daysDiff*dayLength; + }, + renderEvent: function(d){ + var time = d.time; + + // Calculate offset + var offset = life.measureTimeOffset(time); + // Parse Markdown links in the text // credit: http://stackoverflow.com/a/9268827 var link = null; @@ -267,11 +328,13 @@

Life

d.text = d.text.replace(link[0], "" + link[1] + ""); } - return '
' - + '
' - + '' + d.time.title + ' ' + d.text + '  ' - + '
'; - return ''; + // Use a buffer and join only once to reduce string concat memory waste. + var buffer = []; + buffer.push('
'); + life.renderEventLines(d, buffer, offset); + buffer.push('' + d.time.title + ' ' + d.text + '  '); + buffer.push('
'); + return buffer.join(''); }, renderYears: function(firstYear, lastYear){ var dayLength = life.config.yearLength/12/30;