calendar improvements (api, css, utc)
This commit is contained in:
rolux
parent
fda007f00d
commit
b18500d133
5 changed files with 253 additions and 194 deletions
|
|
@ -13,128 +13,131 @@ Ox.load('UI', {debug: true, hideScreen: true, showScreen: true, theme: 'modern'}
|
|||
|
||||
Ox.Calendar({
|
||||
date: new Date(0),
|
||||
dates: [
|
||||
{name: 'Genghis Khan', start: '1162', stop: '1228', type: 'Person'},
|
||||
{name: 'Marco Polo', start: '1254', stop: '1324-01-08', type: 'Person'},
|
||||
{name: 'Columbus', start: '1451-08-22', stop: '1506-05-20', type: 'Person'},
|
||||
{name: 'Da Vinci', start: '1452-04-15', stop: '1519-05-02', type: 'Person'},
|
||||
{name: 'Michelangelo', start: '1475-03-06', stop: '1564-02-18', type: 'Person'},
|
||||
{name: 'Bruegel', start: '1525', stop: '1569-09-09', type: 'Person'},
|
||||
{name: 'Galilei', start: '1564-02-15', stop: '1642-01-08', type: 'Person'},
|
||||
{name: 'Shakespeare', start: '1564-04-26', stop: '1616-04-23', type: 'Person'},
|
||||
{name: 'Descartes', start: '1596-03-31', stop: '1650-02-11', type: 'Person'},
|
||||
{name: 'Velazquez', start: '1599-06-06', stop: '1660-08-06', type: 'Person'},
|
||||
{name: 'Vermeer', start: '1632-10-31', stop: '1675-12-15', type: 'Person'},
|
||||
{name: 'Spinoza', start: '1632-11-24', stop: '1677-02-21', type: 'Person'},
|
||||
{name: 'Louix XIV', start: '1638-09-05', stop: '1715-09-01', type: 'Person'},
|
||||
{name: 'Newton', start: '1643-01-04', stop: '1727-03-31', type: 'Person'},
|
||||
{name: 'Leibniz', start: '1646-07-01', stop: '1716-11-14', type: 'Person'},
|
||||
{name: 'Kant', start: '1724-04-22', stop: '1804-02-12', type: 'Person'},
|
||||
{name: 'Napoleon', start: '1769-08-15', stop: '1821-05-05', type: 'Person'},
|
||||
{name: 'Hegel', start: '1770-08-27', stop: '1831-11-14', type: 'Person'},
|
||||
{name: 'Darwin', start: '1809-02-12', stop: '1882-04-19', type: 'Person'},
|
||||
{name: 'Marx', start: '1818-05-05', stop: '1883-03-14', type: 'Person'},
|
||||
events: [
|
||||
{name: 'The Epoch', start: '1970-01-01 00:00:00', end: '1970-01-01 00:00:01'},
|
||||
|
||||
|
||||
{name: 'Genghis Khan', start: '1162', end: '1228', type: 'Person'},
|
||||
{name: 'Marco Polo', start: '1254', end: '1324-01-08', type: 'Person'},
|
||||
{name: 'Columbus', start: '1451-08-22', end: '1506-05-20', type: 'Person'},
|
||||
{name: 'Da Vinci', start: '1452-04-15', end: '1519-05-02', type: 'Person'},
|
||||
{name: 'Michelangelo', start: '1475-03-06', end: '1564-02-18', type: 'Person'},
|
||||
{name: 'Bruegel', start: '1525', end: '1569-09-09', type: 'Person'},
|
||||
{name: 'Galilei', start: '1564-02-15', end: '1642-01-08', type: 'Person'},
|
||||
{name: 'Shakespeare', start: '1564-04-26', end: '1616-04-23', type: 'Person'},
|
||||
{name: 'Descartes', start: '1596-03-31', end: '1650-02-11', type: 'Person'},
|
||||
{name: 'Velazquez', start: '1599-06-06', end: '1660-08-06', type: 'Person'},
|
||||
{name: 'Vermeer', start: '1632-10-31', end: '1675-12-15', type: 'Person'},
|
||||
{name: 'Spinoza', start: '1632-11-24', end: '1677-02-21', type: 'Person'},
|
||||
{name: 'Louix XIV', start: '1638-09-05', end: '1715-09-01', type: 'Person'},
|
||||
{name: 'Newton', start: '1643-01-04', end: '1727-03-31', type: 'Person'},
|
||||
{name: 'Leibniz', start: '1646-07-01', end: '1716-11-14', type: 'Person'},
|
||||
{name: 'Kant', start: '1724-04-22', end: '1804-02-12', type: 'Person'},
|
||||
{name: 'Napoleon', start: '1769-08-15', end: '1821-05-05', type: 'Person'},
|
||||
{name: 'Hegel', start: '1770-08-27', end: '1831-11-14', type: 'Person'},
|
||||
{name: 'Darwin', start: '1809-02-12', end: '1882-04-19', type: 'Person'},
|
||||
{name: 'Marx', start: '1818-05-05', end: '1883-03-14', type: 'Person'},
|
||||
///*
|
||||
{name: 'Gandhi', start: '1869-10-02', stop: '1948-01-30', type: 'Person'},
|
||||
{name: 'Lenin', start: '1870-04-22', stop: '1924-01-21', type: 'Person'},
|
||||
{name: 'Stalin', start: '1878-12-18', stop: '1953-03-05', type: 'Person'},
|
||||
{name: 'Einstein', start: '1879-03-14', stop: '1955-04-18', type: 'Person'},
|
||||
{name: 'Picasso', start: '1881-10-25', stop: '1973-04-08', type: 'Person'},
|
||||
{name: 'Roosevelt', start: '1882-01-30', stop: '1945-04-12', type: 'Person'},
|
||||
{name: 'Hitler', start: '1889-04-20', stop: '1945-04-30', type: 'Person'},
|
||||
{name: 'Hitchcock', start: '1899-08-13', stop: '1980-04-29', type: 'Person'},
|
||||
{name: 'Turing', start: '1912-06-23', stop: '1954-06-07', type: 'Person'},
|
||||
{name: 'Kennedy', start: '1917-05-29', stop: '1963-11-22', type: 'Person'},
|
||||
{name: 'Deleuze', start: '1925-01-18', stop: '1995-11-04', type: 'Person'},
|
||||
{name: 'Warhol', start: '1928-08-06', stop: '1987-02-22', type: 'Person'},
|
||||
{name: 'Debord', start: '1931-12-28', stop: '1994-11-30', type: 'Person'},
|
||||
{name: 'Gandhi', start: '1869-10-02', end: '1948-01-30', type: 'Person'},
|
||||
{name: 'Lenin', start: '1870-04-22', end: '1924-01-21', type: 'Person'},
|
||||
{name: 'Stalin', start: '1878-12-18', end: '1953-03-05', type: 'Person'},
|
||||
{name: 'Einstein', start: '1879-03-14', end: '1955-04-18', type: 'Person'},
|
||||
{name: 'Picasso', start: '1881-10-25', end: '1973-04-08', type: 'Person'},
|
||||
{name: 'Roosevelt', start: '1882-01-30', end: '1945-04-12', type: 'Person'},
|
||||
{name: 'Hitler', start: '1889-04-20', end: '1945-04-30', type: 'Person'},
|
||||
{name: 'Hitchcock', start: '1899-08-13', end: '1980-04-29', type: 'Person'},
|
||||
{name: 'Turing', start: '1912-06-23', end: '1954-06-07', type: 'Person'},
|
||||
{name: 'Kennedy', start: '1917-05-29', end: '1963-11-22', type: 'Person'},
|
||||
{name: 'Deleuze', start: '1925-01-18', end: '1995-11-04', type: 'Person'},
|
||||
{name: 'Warhol', start: '1928-08-06', end: '1987-02-22', type: 'Person'},
|
||||
{name: 'Debord', start: '1931-12-28', end: '1994-11-30', type: 'Person'},
|
||||
//*/
|
||||
/*
|
||||
{name: 'Test', start: new Date('1970-01-01'), stop: new Date('1970-01-02')},
|
||||
{name: 'Battle of Hastings', start: new Date('1066-10-14'), stop: new Date('1066-10-15')},
|
||||
{name: 'Renaissance', start: new Date('1300'), stop: new Date('1700')},
|
||||
{name: 'Spanish Inquisition', start: new Date('1480-09-27'), stop: new Date('1820-03-10')},
|
||||
{name: 'Discovery of America', start: new Date('1492'), stop: new Date('1493')},
|
||||
{name: 'East India Company', start: new Date('1600'), stop: new Date('1874')},
|
||||
{name: 'Thirty Years\' War', start: new Date('1618'), stop: new Date('1649')},
|
||||
{name: 'Declaration of Independence', start: new Date('1776-07-04'), stop: new Date('1776-07-05')},
|
||||
{name: 'French Revolution', start: new Date('1789'), stop: new Date('1800')},
|
||||
{name: 'Storming of the Bastille', start: new Date('1789-07-14'), stop: new Date('1789-07-15')},
|
||||
{name: 'Napoleonic Era', start: new Date('1799-11-09'), stop: new Date('1815-06-29')},
|
||||
{name: 'The Year Without a Summer', start: new Date('1816'), stop: new Date('1817')},
|
||||
{name: 'Queen Victoria', start: new Date('1837-06-20'), stop: new Date('1901-01-23')},
|
||||
{name: 'Crimean War', start: new Date('1853-10'), stop: new Date('1856-03')},
|
||||
{name: 'American Civil War', start: new Date('1861-04-12'), stop: new Date('1865-04-10')},
|
||||
{name: 'Franco-Prussian War', start: new Date('1870-07-19'), stop: new Date('1871-05-11')},
|
||||
{name: 'Paris Commune', start: new Date('1871-03-18'), stop: new Date('1871-05-29')},
|
||||
{name: 'Congo Free State', start: new Date('1885-07-11'), stop: new Date('1908-11-16')},
|
||||
{name: '20th century', start: new Date('1900'), stop: new Date('2000')},
|
||||
{name: 'Titanic', start: new Date('1912-04-15'), stop: new Date('1912-04-16')},
|
||||
{name: 'World War One', start: new Date('1914-07-28'), stop: new Date('1918-11-12')},
|
||||
{name: 'Battle of Verdun', start: new Date('1916-02-21'), stop: new Date('1916-12-19')},
|
||||
{name: 'Russian Revolution', start: new Date('1917'), stop: new Date('1918')},
|
||||
{name: 'October Revolution', start: new Date('1917-11-07'), stop: new Date('1917-11-09')},
|
||||
{name: 'Spanish Flu', start: new Date('1918'), stop: new Date('1919')},
|
||||
{name: 'Weimar Republic', start: new Date('1918-11-09'), stop: new Date('1933-01-30')},
|
||||
{name: 'Treaty of Versailles', start: new Date('1919-06-28'), stop: new Date('1919-06-29')},
|
||||
{name: '1920s', start: new Date('1920'), stop: new Date('1930')},
|
||||
{name: 'Soviet Union', start: new Date('1922-12-30'), stop: new Date('1991-12-27')},
|
||||
{name: 'The Third Reich', start: new Date('1933-01-30'), stop: new Date('1945-05-09')},
|
||||
{name: 'Spanish Civil War', start: new Date('1936-07-17'), stop: new Date('1939-04-02')},
|
||||
{name: '1936 Summer Olympics', start: new Date('1936-08-01'), stop: new Date('1936-08-17')},
|
||||
{name: 'Hindenburg', start: new Date('1937-05-06'), stop: new Date('1937-05-07')},
|
||||
{name: 'World War Two', start: new Date('1939-09-01'), stop: new Date('1945-09-03')},
|
||||
{name: 'Pearl Harbour', start: new Date('1941-12-07'), stop: new Date('1941-12-08')},
|
||||
{name: 'Wannsee Conference', start: new Date('1942-01-20'), stop: new Date('1942-01-21')},
|
||||
{name: 'Battle of Stalingrad', start: new Date('1942-08-23'), stop: new Date('1943-02-03')},
|
||||
{name: 'D-Day', start: new Date('1944-06-06'), stop: new Date('1944-06-07')},
|
||||
{name: 'Liberation of Auschwitz', start: new Date('1945-01-27'), stop: new Date('1945-01-28')},
|
||||
{name: 'Hiroshima', start: new Date('1945-08-06'), stop: new Date('1945-08-07')},
|
||||
{name: 'Nagasaki', start: new Date('1945-08-09'), stop: new Date('1945-08-10')},
|
||||
{name: 'Nuremburg Trials', start: new Date('1945-11-20'), stop: new Date('1946-10-02')},
|
||||
{name: 'Fourth Republic', start: new Date('1946-10-14'), stop: new Date('1958-10-05')},
|
||||
{name: 'West Germany', start: new Date('1949-05-23'), stop: new Date('1990-10-03')},
|
||||
{name: 'Korean War', start: new Date('1950-06-25'), stop: new Date('1953-07-28')},
|
||||
{name: 'Cuban Revolution', start: new Date('1953-07-26'), stop: new Date('1959-01-02')},
|
||||
{name: 'Algerian War', start: new Date('1954-11-01'), stop: new Date('1962-03-20')},
|
||||
{name: 'Vietnam War', start: new Date('1955-11-01'), stop: new Date('1975-05-01')},
|
||||
{name: '1960s', start: new Date('1960-01-01'), stop: new Date('1970-01-01')},
|
||||
{name: 'Eichmann Trial', start: new Date('1961-04-11'), stop: new Date('1961-08-15')},
|
||||
{name: 'Bay of Pigs', start: new Date('1961-04-17'), stop: new Date('1961-04-20')},
|
||||
{name: 'Berlin Wall', start: new Date('1961-08-13'), stop: new Date('1989-11-09')},
|
||||
{name: 'Cuban Missile Crisis', start: new Date('1962-10'), stop: new Date('1962-12')},
|
||||
{name: 'Assassination of John F. Kennedy', start: new Date('1963-11-22'), stop: new Date('1963-11-23')},
|
||||
{name: 'Sgt. Pepper', start: new Date('1967-06-01'), stop: new Date('1967-06-02')},
|
||||
{name: 'Assassination of Benno Ohnesorg', start: new Date('1967-06-02'), stop: new Date('1967-06-03')},
|
||||
{name: 'Six-Day War', start: new Date('1967-06-05'), stop: new Date('1967-06-11')},
|
||||
{name: '1968', start: new Date('1968-01-01'), stop: new Date('1969-01-01')},
|
||||
{name: 'My Lai', start: new Date('1968-03-16'), stop: new Date('1968-03-17')},
|
||||
{name: 'Assassination of Martin Luther King', start: new Date('1968-04-04'), stop: new Date('1968-04-05')},
|
||||
{name: 'Assassination of Rudi Dutschke', start: new Date('1968-04-11'), stop: new Date('1968-04-12')},
|
||||
{name: 'May 1968', start: new Date('1968-05-01'), stop: new Date('1968-06-01')},
|
||||
{name: '1968 Cannes Film Festival', start: new Date('1968-05-10'), stop: new Date('1968-05-20')},
|
||||
{name: 'Valerie Solanas', start: new Date('1968-06-03'), stop: new Date('1968-06-04')},
|
||||
{name: 'Assassination of Robert F. Kennedy', start: new Date('1968-06-05'), stop: new Date('1968-06-06')},
|
||||
{name: '1968 Summer Olympics', start: new Date('1968-10-12'), stop: new Date('1968-10-28')},
|
||||
{name: 'Apollo 11', start: new Date('1969-07-16'), stop: new Date('1969-07-25')},
|
||||
{name: 'Moon Landing', start: new Date('1969-07-20'), stop: new Date('1969-07-21')},
|
||||
{name: 'The Epoch', start: new Date('1970-01-01 00:00:00'), stop: new Date('1970-01-01 00:00:01')},
|
||||
{name: '1970s', start: new Date('1970-01-01'), stop: new Date('1980-01-01')},
|
||||
{name: '1972 Summer Olympics', start: new Date('1972-08-26'), stop: new Date('1972-09-11')},
|
||||
{name: 'Apollo 17', start: new Date('1972-12-07'), stop: new Date('1972-12-20')},
|
||||
{name: 'World Trade Center', start: new Date('1973-04-04'), stop: new Date('2001-09-11')},
|
||||
{name: '1980s', start: new Date('1980-01-01'), stop: new Date('1990-01-01')},
|
||||
{name: 'Iran-Iraq War', start: new Date('1980-09-22'), stop: new Date('1988-08-21')},
|
||||
{name: 'Tschernobyl', start: new Date('1986-04-26'), stop: new Date('1986-04-27')},
|
||||
{name: 'Fall of the Berlin Wall', start: new Date('1989-11-09'), stop: new Date('1989-11-10')},
|
||||
{name: 'Gulf War', start: new Date('1990-08-02'), stop: new Date('1991-03-01')},
|
||||
{name: 'Clinton Presidency', start: new Date('1993-01-20'), stop: new Date('2001-01-20')},
|
||||
{name: 'German Reunification', start: new Date('1990-10-03'), stop: new Date('1990-10-04')},
|
||||
{name: 'The Battle of Seattle', start: new Date('1999-11-30'), stop: new Date('1999-12-01')},
|
||||
{name: 'George W. Bush', start: new Date('2001-01-20'), stop: new Date('2009-01-20')},
|
||||
{name: 'Carlo Giuliani', start: new Date('2001-07-20'), stop: new Date('2001-07-21')},
|
||||
{name: '9-11', start: new Date('2001-09-11'), stop: new Date('2001-09-12')},
|
||||
{name: 'Fukushima', start: new Date('2011-03-11'), stop: new Date('2011-03-12')}
|
||||
{name: 'Test', start: new Date('1970-01-01'), end: new Date('1970-01-02')},
|
||||
{name: 'Battle of Hastings', start: new Date('1066-10-14'), end: new Date('1066-10-15')},
|
||||
{name: 'Renaissance', start: new Date('1300'), end: new Date('1700')},
|
||||
{name: 'Spanish Inquisition', start: new Date('1480-09-27'), end: new Date('1820-03-10')},
|
||||
{name: 'Discovery of America', start: new Date('1492'), end: new Date('1493')},
|
||||
{name: 'East India Company', start: new Date('1600'), end: new Date('1874')},
|
||||
{name: 'Thirty Years\' War', start: new Date('1618'), end: new Date('1649')},
|
||||
{name: 'Declaration of Independence', start: new Date('1776-07-04'), end: new Date('1776-07-05')},
|
||||
{name: 'French Revolution', start: new Date('1789'), end: new Date('1800')},
|
||||
{name: 'Storming of the Bastille', start: new Date('1789-07-14'), end: new Date('1789-07-15')},
|
||||
{name: 'Napoleonic Era', start: new Date('1799-11-09'), end: new Date('1815-06-29')},
|
||||
{name: 'The Year Without a Summer', start: new Date('1816'), end: new Date('1817')},
|
||||
{name: 'Queen Victoria', start: new Date('1837-06-20'), end: new Date('1901-01-23')},
|
||||
{name: 'Crimean War', start: new Date('1853-10'), end: new Date('1856-03')},
|
||||
{name: 'American Civil War', start: new Date('1861-04-12'), end: new Date('1865-04-10')},
|
||||
{name: 'Franco-Prussian War', start: new Date('1870-07-19'), end: new Date('1871-05-11')},
|
||||
{name: 'Paris Commune', start: new Date('1871-03-18'), end: new Date('1871-05-29')},
|
||||
{name: 'Congo Free State', start: new Date('1885-07-11'), end: new Date('1908-11-16')},
|
||||
{name: '20th century', start: new Date('1900'), end: new Date('2000')},
|
||||
{name: 'Titanic', start: new Date('1912-04-15'), end: new Date('1912-04-16')},
|
||||
{name: 'World War One', start: new Date('1914-07-28'), end: new Date('1918-11-12')},
|
||||
{name: 'Battle of Verdun', start: new Date('1916-02-21'), end: new Date('1916-12-19')},
|
||||
{name: 'Russian Revolution', start: new Date('1917'), end: new Date('1918')},
|
||||
{name: 'October Revolution', start: new Date('1917-11-07'), end: new Date('1917-11-09')},
|
||||
{name: 'Spanish Flu', start: new Date('1918'), end: new Date('1919')},
|
||||
{name: 'Weimar Republic', start: new Date('1918-11-09'), end: new Date('1933-01-30')},
|
||||
{name: 'Treaty of Versailles', start: new Date('1919-06-28'), end: new Date('1919-06-29')},
|
||||
{name: '1920s', start: new Date('1920'), end: new Date('1930')},
|
||||
{name: 'Soviet Union', start: new Date('1922-12-30'), end: new Date('1991-12-27')},
|
||||
{name: 'The Third Reich', start: new Date('1933-01-30'), end: new Date('1945-05-09')},
|
||||
{name: 'Spanish Civil War', start: new Date('1936-07-17'), end: new Date('1939-04-02')},
|
||||
{name: '1936 Summer Olympics', start: new Date('1936-08-01'), end: new Date('1936-08-17')},
|
||||
{name: 'Hindenburg', start: new Date('1937-05-06'), end: new Date('1937-05-07')},
|
||||
{name: 'World War Two', start: new Date('1939-09-01'), end: new Date('1945-09-03')},
|
||||
{name: 'Pearl Harbour', start: new Date('1941-12-07'), end: new Date('1941-12-08')},
|
||||
{name: 'Wannsee Conference', start: new Date('1942-01-20'), end: new Date('1942-01-21')},
|
||||
{name: 'Battle of Stalingrad', start: new Date('1942-08-23'), end: new Date('1943-02-03')},
|
||||
{name: 'D-Day', start: new Date('1944-06-06'), end: new Date('1944-06-07')},
|
||||
{name: 'Liberation of Auschwitz', start: new Date('1945-01-27'), end: new Date('1945-01-28')},
|
||||
{name: 'Hiroshima', start: new Date('1945-08-06'), end: new Date('1945-08-07')},
|
||||
{name: 'Nagasaki', start: new Date('1945-08-09'), end: new Date('1945-08-10')},
|
||||
{name: 'Nuremburg Trials', start: new Date('1945-11-20'), end: new Date('1946-10-02')},
|
||||
{name: 'Fourth Republic', start: new Date('1946-10-14'), end: new Date('1958-10-05')},
|
||||
{name: 'West Germany', start: new Date('1949-05-23'), end: new Date('1990-10-03')},
|
||||
{name: 'Korean War', start: new Date('1950-06-25'), end: new Date('1953-07-28')},
|
||||
{name: 'Cuban Revolution', start: new Date('1953-07-26'), end: new Date('1959-01-02')},
|
||||
{name: 'Algerian War', start: new Date('1954-11-01'), end: new Date('1962-03-20')},
|
||||
{name: 'Vietnam War', start: new Date('1955-11-01'), end: new Date('1975-05-01')},
|
||||
{name: '1960s', start: new Date('1960-01-01'), end: new Date('1970-01-01')},
|
||||
{name: 'Eichmann Trial', start: new Date('1961-04-11'), end: new Date('1961-08-15')},
|
||||
{name: 'Bay of Pigs', start: new Date('1961-04-17'), end: new Date('1961-04-20')},
|
||||
{name: 'Berlin Wall', start: new Date('1961-08-13'), end: new Date('1989-11-09')},
|
||||
{name: 'Cuban Missile Crisis', start: new Date('1962-10'), end: new Date('1962-12')},
|
||||
{name: 'Assassination of John F. Kennedy', start: new Date('1963-11-22'), end: new Date('1963-11-23')},
|
||||
{name: 'Sgt. Pepper', start: new Date('1967-06-01'), end: new Date('1967-06-02')},
|
||||
{name: 'Assassination of Benno Ohnesorg', start: new Date('1967-06-02'), end: new Date('1967-06-03')},
|
||||
{name: 'Six-Day War', start: new Date('1967-06-05'), end: new Date('1967-06-11')},
|
||||
{name: '1968', start: new Date('1968-01-01'), end: new Date('1969-01-01')},
|
||||
{name: 'My Lai', start: new Date('1968-03-16'), end: new Date('1968-03-17')},
|
||||
{name: 'Assassination of Martin Luther King', start: new Date('1968-04-04'), end: new Date('1968-04-05')},
|
||||
{name: 'Assassination of Rudi Dutschke', start: new Date('1968-04-11'), end: new Date('1968-04-12')},
|
||||
{name: 'May 1968', start: new Date('1968-05-01'), end: new Date('1968-06-01')},
|
||||
{name: '1968 Cannes Film Festival', start: new Date('1968-05-10'), end: new Date('1968-05-20')},
|
||||
{name: 'Valerie Solanas', start: new Date('1968-06-03'), end: new Date('1968-06-04')},
|
||||
{name: 'Assassination of Robert F. Kennedy', start: new Date('1968-06-05'), end: new Date('1968-06-06')},
|
||||
{name: '1968 Summer Olympics', start: new Date('1968-10-12'), end: new Date('1968-10-28')},
|
||||
{name: 'Apollo 11', start: new Date('1969-07-16'), end: new Date('1969-07-25')},
|
||||
{name: 'Moon Landing', start: new Date('1969-07-20'), end: new Date('1969-07-21')},
|
||||
{name: 'The Epoch', start: new Date('1970-01-01 00:00:00'), end: new Date('1970-01-01 00:00:01')},
|
||||
{name: '1970s', start: new Date('1970-01-01'), end: new Date('1980-01-01')},
|
||||
{name: '1972 Summer Olympics', start: new Date('1972-08-26'), end: new Date('1972-09-11')},
|
||||
{name: 'Apollo 17', start: new Date('1972-12-07'), end: new Date('1972-12-20')},
|
||||
{name: 'World Trade Center', start: new Date('1973-04-04'), end: new Date('2001-09-11')},
|
||||
{name: '1980s', start: new Date('1980-01-01'), end: new Date('1990-01-01')},
|
||||
{name: 'Iran-Iraq War', start: new Date('1980-09-22'), end: new Date('1988-08-21')},
|
||||
{name: 'Tschernobyl', start: new Date('1986-04-26'), end: new Date('1986-04-27')},
|
||||
{name: 'Fall of the Berlin Wall', start: new Date('1989-11-09'), end: new Date('1989-11-10')},
|
||||
{name: 'Gulf War', start: new Date('1990-08-02'), end: new Date('1991-03-01')},
|
||||
{name: 'Clinton Presidency', start: new Date('1993-01-20'), end: new Date('2001-01-20')},
|
||||
{name: 'German Reunification', start: new Date('1990-10-03'), end: new Date('1990-10-04')},
|
||||
{name: 'The Battle of Seattle', start: new Date('1999-11-30'), end: new Date('1999-12-01')},
|
||||
{name: 'George W. Bush', start: new Date('2001-01-20'), end: new Date('2009-01-20')},
|
||||
{name: 'Carlo Giuliani', start: new Date('2001-07-20'), end: new Date('2001-07-21')},
|
||||
{name: '9-11', start: new Date('2001-09-11'), end: new Date('2001-09-12')},
|
||||
{name: 'Fukushima', start: new Date('2011-03-11'), end: new Date('2011-03-12')}
|
||||
*/
|
||||
],
|
||||
height: window.innerHeight,
|
||||
|
|
|
|||
|
|
@ -133,7 +133,7 @@ Calendar
|
|||
position: absolute;
|
||||
}
|
||||
|
||||
.OxCalendar .OxDate {
|
||||
.OxCalendar .OxEvent {
|
||||
position: absolute;
|
||||
height: 16px;
|
||||
text-overflow: ellipsis;
|
||||
|
|
@ -141,9 +141,15 @@ Calendar
|
|||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
}
|
||||
.OxCalendar .OxLine > .OxDate {
|
||||
background: -moz-linear-gradient(top, rgba(255, 64, 64, 0.75), rgba(255, 0, 0, 0.75));
|
||||
background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 32, 32, 1)), to(rgba(224, 0, 0, 1)));
|
||||
.OxCalendar .OxLine > .OxEvent {
|
||||
border-radius: 2px;
|
||||
background: -moz-linear-gradient(top, rgba(255, 32, 32, 0.9), rgba(224, 0, 0, 0.9));
|
||||
background: -webkit-linear-gradient(top, rgba(255, 32, 32, 0.9), rgba(224, 0, 0, 0.9));
|
||||
color: rgb(255, 255, 255);
|
||||
}
|
||||
.OxCalendar .OxLine > .OxEvent.OxSelected {
|
||||
background: -moz-linear-gradient(top, rgba(128, 128, 255, 0.9), rgba(112, 112, 224, 0.9));
|
||||
background: -webkit-linear-gradient(top, rgba(128, 128, 255, 0.9), rgba(112, 112, 224, 0.9));
|
||||
}
|
||||
|
||||
.OxCalendar .OxTimeline {
|
||||
|
|
@ -152,7 +158,7 @@ Calendar
|
|||
//overflow: hidden;
|
||||
}
|
||||
|
||||
.OxCalendar .OxTimeline .OxDate {
|
||||
.OxCalendar .OxTimeline .OxEvent {
|
||||
position: absolute;
|
||||
border-radius: 0;
|
||||
cursor: ew-resize;
|
||||
|
|
|
|||
|
|
@ -7,21 +7,23 @@ Ox.Calendar <f:Ox.Element> Basic calendar object
|
|||
(options, self) -> <f> Calendar object
|
||||
options <o> Options object
|
||||
date <d|new Date()> UTC Date on which the calendar is centered
|
||||
dates <[o]|[]> Date objects to be displayed
|
||||
end <s> End of the event (UTC Date, as string)
|
||||
name <s> Name of the event
|
||||
start <s> Start of the event (UTC Date, as string)
|
||||
type <s> Type of the event (like "person")
|
||||
events <[o]|[]> Event objects to be displayed
|
||||
alternativeNames <[s]> Array of alternative names
|
||||
end <s> End of the event (UTC Date, as string)
|
||||
id <s> Id of the event
|
||||
name <s> Name of the event
|
||||
start <s> Start of the event (UTC Date, as string)
|
||||
type <s> Type of the event (like "person")
|
||||
height <n|256> Height in px
|
||||
range <[n]|[100, 5101]> Start and end year of the calendar
|
||||
selected <s|''> Id of the selected event
|
||||
width <n|256> Width in px
|
||||
zoom <n|8> Initial zoom level
|
||||
self <o> Shared private variable
|
||||
@*/
|
||||
|
||||
// Fixme: switch to UTC
|
||||
// Fixme: in options.dates, replace "stop" with "end"
|
||||
// Fixme: create a variable-resolution date type (with end that is _inclusive_)
|
||||
// Fixme: create a variable-resolution event type (with end that is _inclusive_)
|
||||
|
||||
Ox.Calendar = function(options, self) {
|
||||
|
||||
|
|
@ -29,9 +31,10 @@ Ox.Calendar = function(options, self) {
|
|||
var that = new Ox.Element({}, self)
|
||||
.defaults({
|
||||
date: new Date(),
|
||||
dates: [],
|
||||
events: [],
|
||||
height: 256,
|
||||
range: [1000, 3000],
|
||||
selected: '',
|
||||
width: 256,
|
||||
zoom: 8
|
||||
})
|
||||
|
|
@ -42,6 +45,12 @@ Ox.Calendar = function(options, self) {
|
|||
height: self.options.height + 'px'
|
||||
});
|
||||
|
||||
self.options.events.forEach(function(event) {
|
||||
event.id = Ox.isUndefined(event.id) ? Ox.uid() : event.id;
|
||||
event.start = Ox.parseDate(event.start, true);
|
||||
event.end = Ox.parseDate(event.end, true);
|
||||
});
|
||||
|
||||
self.maxZoom = 32;
|
||||
self.minLabelWidth = 80;
|
||||
self.overlayWidths = [Math.round(self.options.width / 16)];
|
||||
|
|
@ -346,7 +355,7 @@ Ox.Calendar = function(options, self) {
|
|||
}
|
||||
|
||||
function doubleclick(event, e) {
|
||||
if ($(e.target).is(':not(.OxLine > .OxDate)')) {
|
||||
if ($(e.target).is(':not(.OxLine > .OxEvent)')) {
|
||||
if (self.options.zoom < self.maxZoom) {
|
||||
self.options.date = new Date(
|
||||
(+self.options.date + +getMouseDate(e)) / 2
|
||||
|
|
@ -358,7 +367,7 @@ Ox.Calendar = function(options, self) {
|
|||
}
|
||||
|
||||
function dragstart(event, e) {
|
||||
if ($(e.target).is(':not(.OxLine > .OxDate)')) {
|
||||
if ($(e.target).is(':not(.OxLine > .OxEvent)')) {
|
||||
self.drag = {x: e.clientX};
|
||||
}
|
||||
}
|
||||
|
|
@ -446,61 +455,67 @@ Ox.Calendar = function(options, self) {
|
|||
renderCalendar();
|
||||
}
|
||||
|
||||
function formatDate(date) {
|
||||
var isFullDays = Ox.formatDate(date.start, '%H:%M:%S') == '00:00:00' &&
|
||||
Ox.formatDate(date.stop, '%H:%M:%S') == '00:00:00',
|
||||
isOneDay = isFullDays && date.stop - date.start == 86400000, // fixme: wrong, DST
|
||||
isSameDay = Ox.formatDate(date.start, '%Y-%m-%d') ==
|
||||
Ox.formatDate(date.stop, '%Y-%m-%d'),
|
||||
isSameYear = date.start.getFullYear() == date.stop.getFullYear(),
|
||||
function formatEvent(event) {
|
||||
var isFullDays = Ox.formatDate(event.start, '%H:%M:%S', true) == '00:00:00' &&
|
||||
Ox.formatDate(event.end, '%H:%M:%S', true) == '00:00:00',
|
||||
isOneDay = isFullDays && event.end - event.start == 86400000, // fixme: wrong, DST
|
||||
isSameDay = Ox.formatDate(event.start, '%Y-%m-%d', true) ==
|
||||
Ox.formatDate(event.end, '%Y-%m-%d', true),
|
||||
isSameYear = event.start.getUTCFullYear() == event.end.getUTCFullYear(),
|
||||
timeFormat = isFullDays ? '' : ', %H:%M:%S',
|
||||
str = Ox.formatDate(date.start, '%a, %b %e');
|
||||
str = Ox.formatDate(event.start, '%a, %b %e', true);
|
||||
if (isOneDay || isSameDay || !isSameYear) {
|
||||
str += Ox.formatDate(date.start, ', %Y' + timeFormat);
|
||||
str += Ox.formatDate(event.start, ', %Y' + timeFormat, true);
|
||||
}
|
||||
if (!isOneDay && !isSameDay) {
|
||||
str += Ox.formatDate(date.stop, ' - %a, %b %e, %Y' + timeFormat);
|
||||
str += Ox.formatDate(event.end, ' - %a, %b %e, %Y' + timeFormat, true);
|
||||
}
|
||||
if (isSameDay) {
|
||||
str += Ox.formatDate(date.stop, ' - ' + timeFormat.replace(', ', ''));
|
||||
str += Ox.formatDate(event.end, ' - ' + timeFormat.replace(', ', ''), true);
|
||||
}
|
||||
return str;
|
||||
}
|
||||
|
||||
function getCalendarDate() {
|
||||
function getCalendarEvent() {
|
||||
var ms = self.options.width * getSecondsPerPixel() * 1000;
|
||||
return {
|
||||
start: new Date(+self.options.date - ms / 2),
|
||||
stop: new Date(+self.options.date + ms / 2)
|
||||
end: new Date(+self.options.date + ms / 2)
|
||||
};
|
||||
}
|
||||
|
||||
function getDateByName(name) {
|
||||
var date = {};
|
||||
Ox.forEach(self.options.dates, function(v) {
|
||||
if (v.name == name) {
|
||||
date = v;
|
||||
function getEventById(id) {
|
||||
var event = null;
|
||||
Ox.forEach(self.options.events, function(v) {
|
||||
if (v.id == id) {
|
||||
event = v;
|
||||
return false;
|
||||
}
|
||||
});
|
||||
return date;
|
||||
return event;
|
||||
}
|
||||
|
||||
function getDateElement(date, zoom) {
|
||||
var left = getPosition(date.start, zoom),
|
||||
width = Math.max(getPosition(date.stop, zoom) - left, 1);
|
||||
function getEventElement(event, zoom) {
|
||||
var left = getPosition(event.start, zoom),
|
||||
width = Math.max(getPosition(event.end, zoom) - left, 1);
|
||||
return new Ox.Element()
|
||||
.addClass('OxDate')
|
||||
.addClass('OxEvent' + (
|
||||
event.id == self.options.selected ? ' OxSelected' : ''
|
||||
))
|
||||
.css({
|
||||
left: left + 'px',
|
||||
width: width + 'px'
|
||||
})
|
||||
.data({
|
||||
name: date.name
|
||||
id: event.id
|
||||
})
|
||||
.html(' ' + date.name);
|
||||
.html(' ' + event.name);
|
||||
}
|
||||
|
||||
function getEventElementById(id) {
|
||||
|
||||
};
|
||||
|
||||
function getMouseDate(e) {
|
||||
return new Date(+self.options.date + (
|
||||
e.clientX - that.offset().left - self.options.width / 2 - 1
|
||||
|
|
@ -557,10 +572,10 @@ Ox.Calendar = function(options, self) {
|
|||
n = Math.ceil(self.options.width * 1.5/* * 16*/ / width);
|
||||
Ox.loop(-n, n + 1, function(i) {
|
||||
$elements.push(
|
||||
getDateElement({
|
||||
getEventElement({
|
||||
name: unit.name(value + i),
|
||||
start: new Date(unit.date(value + i)),
|
||||
stop: new Date(unit.date(value + i + 1))
|
||||
end: new Date(unit.date(value + i + 1))
|
||||
}, zoom)
|
||||
.addClass(Ox.mod(value + i, 2) == 0 ? 'even' : 'odd')
|
||||
);
|
||||
|
|
@ -592,11 +607,11 @@ Ox.Calendar = function(options, self) {
|
|||
|
||||
function mousemove(e) {
|
||||
var $target = $(e.target),
|
||||
date, title;
|
||||
if ($target.is('.OxLine > .OxDate')) {
|
||||
date = getDateByName($target.data('name'));
|
||||
title = '<span class="OxBright">' + date.name + '</span><br/>' +
|
||||
formatDate(date);
|
||||
event, title;
|
||||
if ($target.is('.OxLine > .OxEvent')) {
|
||||
event = getEventById($target.data('id'));
|
||||
title = '<span class="OxBright">' + event.name + '</span><br/>' +
|
||||
formatEvent(event);
|
||||
} else {
|
||||
title = Ox.formatDate(getMouseDate(e), '%a, %b %e, %Y, %H:%M:%S');
|
||||
}
|
||||
|
|
@ -630,20 +645,20 @@ Ox.Calendar = function(options, self) {
|
|||
}, 250);
|
||||
}
|
||||
|
||||
function overlaps(date0, date1) {
|
||||
function overlaps(eventA, eventB) {
|
||||
return (
|
||||
date0.start >= date1.start && date0.start < date1.stop
|
||||
eventA.start >= eventB.start && eventA.start < eventB.end
|
||||
) || (
|
||||
date1.start >= date0.start && date1.start < date0.stop
|
||||
eventB.start >= eventA.start && eventB.start < eventA.end
|
||||
);
|
||||
}
|
||||
|
||||
function renderCalendar() {
|
||||
$('.OxBackground').empty();
|
||||
$('.OxDate').remove();
|
||||
$('.OxEvent').remove();
|
||||
renderBackground();
|
||||
renderTimelines();
|
||||
renderDates();
|
||||
renderEvents();
|
||||
self.$statusbar.html(
|
||||
Ox.formatDate(self.options.date, '%a, %b %e, %Y, %H:%M:%S (%s)', true)
|
||||
);
|
||||
|
|
@ -655,24 +670,24 @@ Ox.Calendar = function(options, self) {
|
|||
});
|
||||
}
|
||||
|
||||
function renderDates() {
|
||||
var calendarDate = getCalendarDate();
|
||||
lineDates = [];
|
||||
self.options.dates.filter(function(date) {
|
||||
// filter out dates outside the visible area
|
||||
return overlaps(date, calendarDate);
|
||||
function renderEvents() {
|
||||
var calendarEvent = getCalendarEvent();
|
||||
lineEvents = [];
|
||||
self.options.events.filter(function(event) {
|
||||
// filter out events outside the visible area
|
||||
return overlaps(event, calendarEvent);
|
||||
}).sort(function(a, b) {
|
||||
// sort dates by duration, descending
|
||||
return (b.stop - b.start) - (a.stop - a.start);
|
||||
}).forEach(function(date, i) {
|
||||
var line = lineDates.length;
|
||||
// sort events by duration, descending
|
||||
return (b.end - b.start) - (a.end - a.start);
|
||||
}).forEach(function(event, i) {
|
||||
var line = lineEvents.length;
|
||||
// traverse lines
|
||||
Ox.forEach(lineDates, function(dates, line_) {
|
||||
Ox.forEach(lineEvents, function(events, line_) {
|
||||
var fits = true;
|
||||
// traverse dates in line
|
||||
Ox.forEach(dates, function(date_) {
|
||||
// traverse events in line
|
||||
Ox.forEach(events, function(event_) {
|
||||
// if overlaps, check next line
|
||||
if (overlaps(date, date_)) {
|
||||
if (overlaps(event, event_)) {
|
||||
fits = false;
|
||||
return false;
|
||||
}
|
||||
|
|
@ -682,24 +697,24 @@ Ox.Calendar = function(options, self) {
|
|||
return false;
|
||||
}
|
||||
});
|
||||
if (line == lineDates.length) {
|
||||
lineDates[line] = [];
|
||||
if (line == lineEvents.length) {
|
||||
lineEvents[line] = [];
|
||||
}
|
||||
lineDates[line].push(date);
|
||||
lineEvents[line].push(event);
|
||||
});
|
||||
$('.OxLine').remove();
|
||||
lineDates.forEach(function(dates, line) {
|
||||
lineEvents.forEach(function(events, line) {
|
||||
var $line = new Ox.Element()
|
||||
.addClass('OxLine')
|
||||
.css({
|
||||
top: ((line + 1) * 16) + 'px'
|
||||
})
|
||||
.appendTo(self.$content);
|
||||
dates.sort(function(a, b) {
|
||||
// sort dates by start, ascending
|
||||
events.sort(function(a, b) {
|
||||
// sort events by start, ascending
|
||||
return a.start - b.start;
|
||||
}).forEach(function(date) {
|
||||
getDateElement(date).appendTo($line);
|
||||
}).forEach(function(event) {
|
||||
getEventElement(event).appendTo($line);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
|
@ -714,8 +729,21 @@ Ox.Calendar = function(options, self) {
|
|||
});
|
||||
}
|
||||
|
||||
function selectEvent(id) {
|
||||
}
|
||||
|
||||
function singleclick(event, e) {
|
||||
if ($(e.target).is(':not(.OxLine > .OxDate)')) {
|
||||
var $target = $(e.target),
|
||||
id = $target.data('id');
|
||||
if ($target.is('.OxLine > .OxEvent')) {
|
||||
self.options.selected = id;
|
||||
self.$content.find('.OxSelected').removeClass('OxSelected');
|
||||
$target.addClass('OxSelected');
|
||||
// fixme: map event should also be 'select', not 'selectplace'
|
||||
that.triggerEvent('select', {
|
||||
id: id
|
||||
});
|
||||
} else {
|
||||
self.options.date = getMouseDate(e);
|
||||
renderCalendar();
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ Ox.CalendarDate <f> CalendarDate
|
|||
start <d> start date
|
||||
stop <d> stop date
|
||||
@*/
|
||||
// fixme: unused
|
||||
Ox.CalendarDate = function(options) {
|
||||
|
||||
var self = {},
|
||||
|
|
|
|||
21
source/Ox.js
21
source/Ox.js
|
|
@ -1445,6 +1445,27 @@ Ox.makeYear = function(date, utc) {
|
|||
return Ox.isDate(date) ? Ox.getFullYear(date, utc) : parseInt(date);
|
||||
};
|
||||
|
||||
|
||||
/*@
|
||||
Ox.parseDate(f) Takes a string ('YYYY-MM-DD HH:MM:SS') and returns a date
|
||||
str <s> string
|
||||
utc <b|false> If true, Date is UTC
|
||||
> +Ox.parseDate('1970', true)
|
||||
0
|
||||
@*/
|
||||
Ox.parseDate = function(str, utc) {
|
||||
var def = [, 1, 1, 0, 0, 0];
|
||||
val = /(\d+)-?(\d+)?-?(\d+)? ?(\d+)?:?(\d+)?:?(\d+)?/(str);
|
||||
val.shift();
|
||||
val = val.map(function(v, i) {
|
||||
return v || def[i];
|
||||
});
|
||||
val[1]--;
|
||||
return utc
|
||||
? new Date(Date.UTC(val[0], val[1], val[2], val[3], val[4], val[5]))
|
||||
: new Date(val[0], val[1], val[2], val[3], val[4], val[5])
|
||||
};
|
||||
|
||||
//@ Ox.setDate <f> Set the day of a date, optionally UTC
|
||||
// see Ox.setSeconds for source code
|
||||
//@ Ox.setDay <f> Set the weekday of a date, optionally UTC
|
||||
|
|
|
|||
Loading…
Reference in a new issue