remove /demos and /tests, update build script
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS ArrayEditable Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/arrayeditable.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,25 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
var items = [
|
||||
{editable: true, value: 'The firefox jumps over the lazy fox.'},
|
||||
{editable: true, value: 'The <b><i><u>lazy fox</u></i></b><br>\njumps over the<br><br><a href="http://mozilla.org">firefox</a>.'}
|
||||
],
|
||||
$box = Ox.Element()
|
||||
.css({width: '256px', height: '512px', padding: '8px', background: 'rgb(224, 224, 224)'})
|
||||
.appendTo(Ox.$body),
|
||||
$arrayEditableInput = Ox.ArrayEditable({
|
||||
items: items.map(function(item) {
|
||||
return {editable: item.editable, value: Ox.encodeHTML(item.value)};
|
||||
})
|
||||
})
|
||||
.css({background: 'rgb(240, 240, 240)', boxShadow: '0 0 1px black'})
|
||||
.appendTo($box),
|
||||
$arrayEditableTextarea = Ox.ArrayEditable({
|
||||
items: items,
|
||||
maxHeight: 256,
|
||||
type: 'textarea'
|
||||
})
|
||||
.css({marginTop: '8px', background: 'rgb(240, 240, 240)', boxShadow: '0 0 1px black'})
|
||||
.appendTo($box);
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS ArrayInput Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/arrayinput.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,33 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
var $arrayInput = Ox.ArrayInput({
|
||||
label: 'ArrayInput',
|
||||
max: 3,
|
||||
value: ['foo', 'bar']
|
||||
})
|
||||
.css({margin: '16px'})
|
||||
.appendTo(Ox.$body);
|
||||
|
||||
Ox.Button({
|
||||
title: 'Value'
|
||||
})
|
||||
.css({marginLeft: '16px'})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
Ox.print($arrayInput.options('value'));
|
||||
}
|
||||
})
|
||||
.appendTo(Ox.$body)
|
||||
|
||||
Ox.Button({
|
||||
title: 'Reset'
|
||||
})
|
||||
.css({marginLeft: '16px'})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$arrayInput.value(['foo', 'bar']);
|
||||
}
|
||||
})
|
||||
.appendTo(Ox.$body)
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Calendar Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/calendar.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,665 +0,0 @@
|
|||
console.log('calling Ox.UI()')
|
||||
//console.log('Ox =', Ox)
|
||||
//console.log('Ox.UI =', Ox.UI)
|
||||
|
||||
Ox.load('UI', {debug: true, hideScreen: true, showScreen: true, theme: 'modern'}, function() {
|
||||
|
||||
console.log('running Ox.UI()')
|
||||
//console.log('Ox =', Ox)
|
||||
|
||||
// Ox.theme('modern');
|
||||
|
||||
//Ox.print('$$$$', Ox.Calendar)
|
||||
|
||||
var $calendar = Ox.Calendar({
|
||||
date: new Date(0),
|
||||
events: [
|
||||
|
||||
{name: '13th Century', start: '1200', end: '1300', type: 'date'},
|
||||
{name: '14th Century', start: '1300', end: '1400', type: 'date'},
|
||||
{name: '15th Century', start: '1400', end: '1500', type: 'date'},
|
||||
{name: '16th Century', start: '1500', end: '1600', type: 'date'},
|
||||
{name: '17th Century', start: '1600', end: '1700', type: 'date'},
|
||||
{name: '18th Century', start: '1700', end: '1800', type: 'date'},
|
||||
{name: '19th Century', start: '1800', end: '1900', type: 'date'},
|
||||
{name: '1848', start: '1848', end: '1849', type: 'date'},
|
||||
{name: '20th Century', start: '1900', end: '2000', type: 'date'},
|
||||
{name: '1920s', start: '1920', end: '1930', type: 'date'},
|
||||
{name: '1930s', start: '1930', end: '1940', type: 'date'},
|
||||
{name: '1933', start: '1933', end: '1934', type: 'date'},
|
||||
{name: '1936', start: '1936', end: '1937', type: 'date'},
|
||||
{name: '1940s', start: '1940', end: '1950', type: 'date'},
|
||||
{name: '1940', start: '1940', end: '1941', type: 'date'},
|
||||
{name: '1941', start: '1941', end: '1942', type: 'date'},
|
||||
{name: '1942', start: '1942', end: '1943', type: 'date'},
|
||||
{name: '1943', start: '1943', end: '1944', type: 'date'},
|
||||
{name: '1944', start: '1944', end: '1945', type: 'date'},
|
||||
{name: '1945', start: '1945', end: '1946', type: 'date'},
|
||||
|
||||
{name: '1950s', start: '1950', end: '1960', type: 'date'},
|
||||
{name: '1960s', start: '1960', end: '1970', type: 'date'},
|
||||
{name: '1967', start: '1967', end: '1968', type: 'date'},
|
||||
{name: '1968', start: '1968', end: '1969', type: 'date'},
|
||||
{name: 'Spring 1968', start: '1968-03', end: '1968-06', type: 'date'},
|
||||
{name: 'May 1968', start: '1968-05', end: '1968-06', type: 'date'},
|
||||
{name: 'Summer 1968', start: '1968-06', end: '1968-09', type: 'date'},
|
||||
{name: '1969', start: '1969', end: '1970', type: 'date'},
|
||||
{name: '1970s', start: '1970', end: '1980', type: 'date'},
|
||||
{name: '1970', start: '1970', end: '1971', type: 'date'},
|
||||
{name: '1971', start: '1971', end: '1972', type: 'date'},
|
||||
{name: '1972', start: '1972', end: '1973', type: 'date'},
|
||||
{name: '1973', start: '1973', end: '1974', type: 'date'},
|
||||
{name: '1974', start: '1974', end: '1975', type: 'date'},
|
||||
{name: '1975', start: '1975', end: '1976', type: 'date'},
|
||||
{name: '1976', start: '1976', end: '1977', type: 'date'},
|
||||
{name: '1977', start: '1977', end: '1978', type: 'date'},
|
||||
{name: '1978', start: '1978', end: '1979', type: 'date'},
|
||||
{name: '1979', start: '1979', end: '1980', type: 'date'},
|
||||
{name: '1980s', start: '1980', end: '1990', type: 'date'},
|
||||
{name: '1989', start: '1989', end: '1990', type: 'date'},
|
||||
{name: '1990s', start: '1990', end: '2000', type: 'date'},
|
||||
{name: '1990', start: '1990', end: '1991', type: 'date'},
|
||||
{name: '3rd Millennium', start: '2000', end: '3000', type: 'date'},
|
||||
{name: '21st Century', start: '2000', end: '2100', type: 'date'},
|
||||
{name: '2000s', start: '2000', end: '2010', type: 'date'},
|
||||
{name: '2000', start: '2000', end: '2001', type: 'date'},
|
||||
{name: '2001', start: '2001', end: '2002', type: 'date'},
|
||||
{name: '2010s', start: '2010', end: '2020', type: 'date'},
|
||||
{name: '2020s', start: '2020', end: '2030', type: 'date'},
|
||||
|
||||
|
||||
{name: 'Ötzi', start: '-3300', end: '-3255', type: 'person'},
|
||||
{name: 'Imhotep', start: '-2655', end: '-2600', type: 'person'},
|
||||
{name: 'Hammurabi', start: '-1850', end: '-1750', type: 'person'},
|
||||
{name: 'Hatshepsut', start: '-1508', end: '-1458', type: 'person'},
|
||||
{name: 'Nefertiti', start: '-1370', end: '-1330', type: 'person'},
|
||||
{name: 'Tutankhamun', start: '-1341', end: '-1323', type: 'person'},
|
||||
{name: 'Ramesses', start: '-1300', end: '-1213', type: 'person'},
|
||||
{name: 'King Saul', start: '-1079', end: '-1007', type: 'person'},
|
||||
{name: 'King David', start: '-1040', end: '-970', type: 'person'},
|
||||
{name: 'King Solomon', start: '-1011', end: '-931', type: 'person'},
|
||||
{name: 'Homer', start: '-900', end: '-800', type: 'person'},
|
||||
{name: 'Nebuchadnezzar', start: '-634', end: '-562', type: 'person'},
|
||||
{name: 'Thales of Miletus', start: '-624', end: '-546', type: 'person'},
|
||||
{name: 'Cyrus the Great', start: '-600', end: '-530', type: 'person'},
|
||||
{name: 'Buddha', start: '-600', end: '-500', type: 'person'},
|
||||
{name: 'Pythagoras', start: '-570', end: '-495', type: 'person'},
|
||||
{name: 'Confucius', start: '-551-09-28', end: '-479', type: 'person'},
|
||||
{name: 'Darius the Great', start: '-550', end: '-486', type: 'person'},
|
||||
{name: 'Sun Tzu', start: '-544', end: '-496', type: 'person'},
|
||||
{name: 'Aeschylus', start: '-525', end: '-455', type: 'person'},
|
||||
{name: 'Sophocles', start: '-496', end: '-406', type: 'person'},
|
||||
{name: 'Pericles', start: '-495', end: '-429', type: 'person'},
|
||||
{name: 'Empedocles', start: '-490', end: '-430', type: 'person'},
|
||||
{name: 'Herodotus', start: '-484', end: '-425', type: 'person'},
|
||||
{name: 'Euripides', start: '-480', end: '-406', type: 'person'},
|
||||
{name: 'Socrates', start: '-469', end: '-399', type: 'person'},
|
||||
{name: 'Hippocrates', start: '-460', end: '-370', type: 'person'},
|
||||
{name: 'Aristophanes', start: '-446', end: '-386', type: 'person'},
|
||||
{name: 'Plato', start: '-428', end: '-348', type: 'person'},
|
||||
{name: 'Aristotle', start: '-384', end: '-322', type: 'person'},
|
||||
{name: 'Alexander the Great', start: '-356-07-20', end: '-323-06-10', type: 'person'},
|
||||
{name: 'Euclid', start: '-300', end: '-200', type: 'person'},
|
||||
{name: 'Archimedes', start: '-287', end: '-212', type: 'person'},
|
||||
{name: 'Eratosthenes', start: '-276', end: '-194', type: 'person'},
|
||||
{name: 'Hannibal', start: '-247', end: '-182', type: 'person'},
|
||||
{name: 'Spartacus', start: '-109', end: '-71', type: 'person'},
|
||||
{name: 'Cicero', start: '-106-01-03', end: '-43-12-07', type: 'person'},
|
||||
{name: 'Julius Caesar', start: '-100-07-13', end: '-44-03-15', type: 'person'},
|
||||
{name: 'Virgil', start: '-70-10-15', end: '-19-09-21', type: 'person'},
|
||||
{name: 'Cleopatra', start: '-69', end: '-30-08-12', type: 'person'},
|
||||
{name: 'Horatius', start: '-65-12-08', end: '-8-11-27', type: 'person'},
|
||||
{name: 'Augustus', start: '-63-09-23', end: '14-08-19', type: 'person'},
|
||||
{name: 'Ovid', start: '-43-03-20', end: '17', type: 'person'},
|
||||
{name: 'Jesus Christ', start: '-5', end: '33', type: 'person'},
|
||||
|
||||
{name: 'Caligula', start: '12-08-31', end: '41-01-24', type: 'person'},
|
||||
{name: 'Nero', start: '37-12-15', end: '68-06-09', type: 'person'},
|
||||
{name: 'Plutarch', start: '46', end: '120', type: 'person'},
|
||||
{name: 'Tacitus', start: '56', end: '117', type: 'person'},
|
||||
{name: 'Ptolemy', start: '90', end: '168', type: 'person'},
|
||||
{name: 'Augustine of Hippo', start: '354-11-13', end: '430-08-28', type: 'person'},
|
||||
{name: 'Muhammad', start: '570', end: '632-06-08', type: 'person'},
|
||||
{name: 'Charlemagne', start: '742-04-02', end: '814-01-28', type: 'person'},
|
||||
{name: 'Erik the Red', start: '950', end: '1003', type: 'person'},
|
||||
{name: 'William the Conqueror', start: '1027', end: '1087-09-09', type: 'person'},
|
||||
{name: 'Barbarossa', start: '1122', end: '1190-06-10', type: 'person'},
|
||||
{name: 'Saladin', start: '1138', end: '1193-03-04', type: 'person'},
|
||||
{name: 'Genghis Khan', start: '1162-05-31', end: '1227-08-25', type: 'person'},
|
||||
{name: 'Marco Polo', start: '1254', end: '1324-01-08', type: 'person'},
|
||||
{name: 'Dante Alighieri', start: '1265-06-01', end: '1321-09-14', type: 'person'},
|
||||
{name: 'Giotto di Bondone', start: '1267', end: '1337-01-08', type: 'person'},
|
||||
{name: 'Mansa Musa', start: '1280', end: '1337', type: 'person'},
|
||||
|
||||
{name: 'Jeanne d\'Arc', start: '1412', end: '1431-05-30', type: 'person'},
|
||||
{name: 'Christopher Columbus', start: '1451-08-22', end: '1506-05-20', type: 'person'},
|
||||
{name: 'Leonardo da Vinci', start: '1452-04-15', end: '1519-05-02', type: 'person'},
|
||||
{name: 'Vasco da Gama', start: '1460', end: '1524-12-24', type: 'person'},
|
||||
{name: 'Francisco Pizarro', start: '1471', end: '1541-06-26', type: 'person'},
|
||||
{name: 'Albrecht Dürer', start: '1471-05-21', end: '1528-04-06', type: 'person'},
|
||||
{name: 'Nicolaus Copernicus', start: '1473-02-19', end: '1543-05-24', type: 'person'},
|
||||
{name: 'Michelangelo', start: '1475-03-06', end: '1564-02-18', type: 'person'},
|
||||
{name: 'Raphael', start: '1483-03-28', end: '1520-04-06', type: 'person'},
|
||||
{name: 'Martin Luther', start: '1483-11-10', end: '1546-02-18', type: 'person'},
|
||||
{name: 'Hernán Cortés', start: '1485', end: '1547-12-02', type: 'person'},
|
||||
{name: 'Niccolò Machiavelli', start: '1469-05-03', end: '1527-06-21', type: 'person'},
|
||||
|
||||
{name: 'Nostradamus', start: '1503-12-14', end: '1566-07-02', type: 'person'},
|
||||
{name: 'Andreas Vesalius', start: '1514-12-31', end: '1564-10-15', type: 'person'},
|
||||
{name: 'Tintoretto', start: '1518-09-29', end: '1594-05-31', type: 'person'},
|
||||
{name: 'Pieter Bruegel', start: '1525', end: '1569-09-09', type: 'person'},
|
||||
{name: 'Ivan the Terrible', start: '1530-08-25', end: '1584-03-28', type: 'person'},
|
||||
{name: 'El Greco', start: '1541', end: '1614-04-07', type: 'person'},
|
||||
{name: 'Francis Drake', start: '1544', end: '1596-01-27', type: 'person'},
|
||||
{name: 'Miguel de Cervantes', start: '1547-10-09', end: '1616-04-23', type: 'person'},
|
||||
{name: 'Giordano Bruno', start: '1548', end: '1600-02-17', type: 'person'},
|
||||
{name: 'Francis Bacon', start: '1561-01-22', end: '1626-04-09', type: 'person'},
|
||||
{name: 'Galileo Galilei', start: '1564-02-15', end: '1642-01-08', type: 'person'},
|
||||
{name: 'William Shakespeare', start: '1564-04-26', end: '1616-04-23', type: 'person'},
|
||||
{name: 'Caravaggio', start: '1571-09-29', end: '1610-07-18', type: 'person'},
|
||||
{name: 'Johannes Kepler', start: '1571-12-27', end: '1630-11-15', type: 'person'},
|
||||
{name: 'Thomas Hobbes', start: '1588-04-05', end: '1679-12-04', type: 'person'},
|
||||
{name: 'Gérard Desargues', start: '1591-02-21', end: '1661-10', type: 'person'},
|
||||
{name: 'René Descartes', start: '1596-03-31', end: '1650-02-11', type: 'person'},
|
||||
{name: 'Oliver Cromwell', start: '1599-04-25', end: '1658-09-03', type: 'person'},
|
||||
{name: 'Diego Velázquez', start: '1599-06-06', end: '1660-08-06', type: 'person'},
|
||||
|
||||
{name: 'Pierre de Fermat', start: '1601-08-20', end: '1665-01-12', type: 'person'},
|
||||
{name: 'Rembrandt', start: '1606-07-15', end: '1669-10-04', type: 'person'},
|
||||
{name: 'Molière', start: '1622-01-15', end: '1673-02-17', type: 'person'},
|
||||
{name: 'Blaise Pascal', start: '1623-06-19', end: '1662-08-19', type: 'person'},
|
||||
{name: 'John Locke', start: '1632-08-29', end: '1704-10-28', type: 'person'},
|
||||
{name: 'Johannes Vermeer', start: '1632-10-31', end: '1675-12-15', type: 'person'},
|
||||
{name: 'Baruch 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: 'Isaac Newton', start: '1643-01-04', end: '1727-03-31', type: 'person'},
|
||||
{name: 'Gottfried Leibniz', start: '1646-07-01', end: '1716-11-14', type: 'person'},
|
||||
{name: 'Daniel Defoe', start: '1659', end: '1731-04-24', type: 'person'},
|
||||
{name: 'Peter the Great', start: '1672-06-09', end: '1725-02-08', type: 'person'},
|
||||
{name: 'Antonio Vivaldi', start: '1678-03-04', end: '1741-07-28', type: 'person'},
|
||||
{name: 'Blackbeard', start: '1680', end: '1718-11-22', type: 'person'},
|
||||
{name: 'Georg Friedrich Händel', start: '1685-02-23', end: '1759-04-14', type: 'person'},
|
||||
{name: 'Johann Sebastian Bach', start: '1685-03-21', end: '1750-07-28', type: 'person'},
|
||||
{name: 'Voltaire', start: '1694-11-21', end: '1778-05-30', type: 'person'},
|
||||
|
||||
{name: 'Leonhard Euler', start: '1707-04-15', end: '1783-09-18', type: 'person'},
|
||||
{name: 'Louis XV', start: '1710-02-15', end: '1774-05-10', type: 'person'},
|
||||
{name: 'David Hume', start: '1711-05-07', end: '1776-08-25', type: 'person'},
|
||||
{name: 'Frederick the Great', start: '1712-01-24', end: '1786-08-17', type: 'person'},
|
||||
{name: 'Jean-Jacques Rousseau', start: '1712-06-28', end: '1778-07-02', type: 'person'},
|
||||
{name: 'Denis Diderot', start: '1713-10-05', end: '1784-07-31', type: 'person'},
|
||||
{name: 'Adam Smith', start: '1723-06-05', end: '1790-07-17', type: 'person'},
|
||||
{name: 'Immanuel Kant', start: '1724-04-22', end: '1804-02-12', type: 'person'},
|
||||
{name: 'James Cook', start: '1728-11-07', end: '1779-02-14', type: 'person'},
|
||||
{name: 'Gotthold Ephraim Lessing', start: '1729-01-22', end: '1781-02-15', type: 'person'},
|
||||
{name: 'George Washington', start: '1732-02-22', end: '1799-12-14', type: 'person'},
|
||||
{name: 'Joseph Haydn', start: '1732-03-31', end: '1809-05-31', type: 'person'},
|
||||
{name: 'Marquis de Sade', start: '1740-06-02', end: '1814-12-02', type: 'person'},
|
||||
{name: 'Thomas Jefferson', start: '1743-04-13', end: '1826-07-04', type: 'person'},
|
||||
{name: 'Francisco Goya', start: '1746-03-30', end: '1828-04-16', type: 'person'},
|
||||
{name: 'Gaspard Monge', start: '1746-05-09', end: '1818-07-28', type: 'person'},
|
||||
{name: 'Adam Weishaupt', start: '1748-02-06', end: '1830-11-18', type: 'person'},
|
||||
{name: 'Johann Wolfgang von Goethe', start: '1749-08-28', end: '1832-03-22', type: 'person'},
|
||||
{name: 'Antonio Salieri', start: '1750-08-18', end: '1825-05-07', type: 'person'},
|
||||
{name: 'Lazare Carnot', start: '1753-05-13', end: '1823-08-02', type: 'person'},
|
||||
{name: 'Louis XVI', start: '1754-08-23', end: '1793-01-21', type: 'person'},
|
||||
{name: 'Marie Antoinette', start: '1755-11-01', end: '1793-10-16', type: 'person'},
|
||||
{name: 'Wolfgang Amadeus Mozart', start: '1756-01-27', end: '1791-12-05', type: 'person'},
|
||||
{name: 'Maximilien Robespierre', start: '1758-05-06', end: '1794-07-28', type: 'person'},
|
||||
{name: 'Friedrich Schiller', start: '1759-11-10', end: '1805-05-09', type: 'person'},
|
||||
{name: 'Nicéphore Niépce', start: '1765-03-07', end: '1833-07-05', type: 'person'},
|
||||
{name: 'Madame de Staël', start: '1766-04-22', end: '1817-07-14', type: 'person'},
|
||||
{name: 'Napoleon', start: '1769-08-15', end: '1821-05-05', type: 'person'},
|
||||
{name: 'Georg Wilhelm Friedrich Hegel', start: '1770-08-27', end: '1831-11-14', type: 'person'},
|
||||
{name: 'Ludwig van Beethoven', start: '1770-12-17', end: '1827-03-26', type: 'person'},
|
||||
{name: 'Caspar David Friedrich', start: '1774-09-05', end: '1840-05-07', type: 'person'},
|
||||
{name: 'Jane Austen', start: '1775-12-16', end: '1817-07-18', type: 'person'},
|
||||
{name: 'Carl Friedrich Gauss', start: '1777-04-30', end: '1855-02-23', type: 'person'},
|
||||
{name: 'Shaka', start: '1787', end: '1828-09-22', type: 'person'},
|
||||
{name: 'Arthur Schopenhauer', start: '1788-02-22', end: '1860-09-21', type: 'person'},
|
||||
{name: 'Jean-Victor Poncelet', start: '1788-07-01', end: '1867-12-22', type: 'person'},
|
||||
{name: 'Barthélemy Prosper Enfantin', start: '1796-02-08', end: '1864-09-01', type: 'person'},
|
||||
{name: 'Jean-Baptiste-Camille Corot', start: '1796-07-17', end: '1875-02-22', type: 'person'},
|
||||
{name: 'Franz Schubert', start: '1797-01-31', end: '1828-11-19', type: 'person'},
|
||||
{name: 'Heinrich Heine', start: '1797-12-13', end: '1856-02-17', type: 'person'},
|
||||
{name: 'Eugéne Delacroix', start: '1798-04-26', end: '1863-08-13', type: 'person'},
|
||||
{name: 'Giacomo Leopardi', start: '1798-06-29', end: '1837-06-14', type: 'person'},
|
||||
{name: 'Alexander Pushkin', start: '1799-06-06', end: '1837-02-10', type: 'person'},
|
||||
|
||||
{name: 'Honoré Daumier', start: '1808-02-26', end: '1879-02-10', type: 'person'},
|
||||
{name: 'Pierre-Joseph Proudhon', start: '1809-01-15', end: '1865-01-19', type: 'person'},
|
||||
{name: 'Edgar Allan Poe', start: '1809-01-19', end: '1849-10-07', type: 'person'},
|
||||
{name: 'Abraham Lincoln', start: '1809-02-12', end: '1865-04-15', type: 'person'},
|
||||
{name: 'Charles Darwin', start: '1809-02-12', end: '1882-04-19', type: 'person'},
|
||||
|
||||
{name: 'Frédéric Chopin', start: '1810-03-01', end: '1849-10-17', type: 'person'},
|
||||
{name: 'Robert Schumann', start: '1810-06-08', end: '1856-07-29', type: 'person'},
|
||||
{name: 'Charles Dickens', start: '1812-02-07', end: '1870-06-09', type: 'person'},
|
||||
{name: 'Søren Kierkegaard', start: '1813-05-05', end: '1855-11-11', type: 'person'},
|
||||
{name: 'Richard Wagner', start: '1813-05-22', end: '1883-02-13', type: 'person'},
|
||||
{name: 'Guiseppe Verdi', start: '1813-10-10', end: '1901-01-27', type: 'person'},
|
||||
{name: 'Mikhail Bakunin', start: '1814-05-30', end: '1876-07-01', type: 'person'},
|
||||
{name: 'Otto von Bismarck', start: '1815-04-01', end: '1898-07-30', type: 'person'},
|
||||
{name: 'Ada Lovelace', start: '1815-12-10', end: '1852-11-27', type: 'person'},
|
||||
{name: 'Karl Marx', start: '1818-05-05', end: '1883-03-14', type: 'person'},
|
||||
{name: 'Herman Melville', start: '1818-08-01', end: '1891-09-28', type: 'person'},
|
||||
|
||||
{name: 'Friedrich Engels', start: '1820-11-28', end: '1895-08-05', type: 'person'},
|
||||
{name: 'Lola Montez', start: '1821-02-17', end: '1861-01-17', type: 'person'},
|
||||
{name: 'Charles Baudelaire', start: '1821-04-09', end: '1867-08-31', type: 'person'},
|
||||
{name: 'Fyodor Dostoyevsky', start: '1821-11-11', end: '1881-02-09', type: 'person'},
|
||||
{name: 'Gustave Flaubert', start: '1821-12-12', end: '1880-05-08', type: 'person'},
|
||||
{name: 'Louis Pasteur', start: '1822-12-27', end: '1895-09-28', type: 'person'},
|
||||
{name: 'Jean-Martin Charcot', start: '1825-11-29', end: '1893-08-16', type: 'person'},
|
||||
{name: 'Jules Verne', start: '1828-02-08', end: '1905-03-24', type: 'person'},
|
||||
{name: 'Leo Tolstoy', start: '1828-09-09', end: '1910-11-20', type: 'person'},
|
||||
|
||||
{name: 'Étienne-Jules Marey', start: '1830-03-05', end: '1904-05-21', type: 'person'},
|
||||
{name: 'Camille Pissarro', start: '1830-07-10', end: '1903-11-13', type: 'person'},
|
||||
{name: 'Sitting Bull', start: '1831', end: '1890-12-15', type: 'person'},
|
||||
{name: 'Édouard Manet', start: '1832-01-23', end: '1883-04-30', type: 'person'},
|
||||
{name: 'Johannes Brahms', start: '1833-05-07', end: '1897-04-03', type: 'person'},
|
||||
{name: 'Alfred Nobel', start: '1833-10-21', end: '1896-12-10', type: 'person'},
|
||||
{name: 'Edgar Degas', start: '1834-07-19', end: '1917-09-27', type: 'person'},
|
||||
{name: 'Mark Twain', start: '1835-11-30', end: '1910-04-21', type: 'person'},
|
||||
{name: 'Leopold von Sacher-Masoch', start: '1836-01-27', end: '1895-03-09', type: 'person'},
|
||||
{name: 'Paul Cézanne', start: '1839-01-19', end: '1906-10-22', type: 'person'},
|
||||
{name: 'Modest Mussorgsky', start: '1839-03-21', end: '1881-03-28', type: 'person'},
|
||||
{name: 'John D. Rockefeller', start: '1839-07-08', end: '1937-05-23', type: 'person'},
|
||||
|
||||
{name: 'Crazy Horse', start: '1840', end: '1877-09-05', type: 'person'},
|
||||
{name: 'Émile Zola', start: '1840-04-02', end: '1902-09-29', type: 'person'},
|
||||
{name: 'Auguste Rodin', start: '1840-11-12', end: '1917-11-17', type: 'person'},
|
||||
{name: 'Claude Monet', start: '1840-11-14', end: '1926-12-05', type: 'person'},
|
||||
{name: 'Berthe Morisot', start: '1841-01-14', end: '1895-03-02', type: 'person'},
|
||||
{name: 'Pierre-Auguste Renoir', start: '1841-02-25', end: '1919-12-03', type: 'person'},
|
||||
{name: 'Paul Verlaine', start: '1844-03-30', end: '1896-01-08', type: 'person'},
|
||||
{name: 'Friedrich Wilhelm Nietzsche', start: '1844-10-15', end: '1900-08-25', type: 'person'},
|
||||
{name: 'Thomas Edison', start: '1847-02-11', end: '1931-10-18', type: 'person'},
|
||||
{name: 'Paul Gaugin', start: '1848-06-07', end: '1903-05-08', type: 'person'},
|
||||
|
||||
{name: 'Vincent van Gogh', start: '1853-03-30', end: '1890-07-29', type: 'person'},
|
||||
{name: 'Cecil Rhodes', start: '1853-07-05', end: '1902-03-26', type: 'person'},
|
||||
{name: 'Oscar Wilde', start: '1854-10-16', end: '1900-11-30', type: 'person'},
|
||||
{name: 'Arthur Rimbaud', start: '1854-10-20', end: '1891-11-10', type: 'person'},
|
||||
{name: 'Sigmund Freud', start: '1856-05-06', end: '1939-09-23', type: 'person'},
|
||||
{name: 'Nikola Tesla', start: '1856-07-10', end: '1943-01-07', type: 'person'},
|
||||
{name: 'Joseph Conrad', start: '1857-12-03', end: '1924-08-03', type: 'person'},
|
||||
{name: 'Max Planck', start: '1858-04-23', end: '1947-10-04', type: 'person'},
|
||||
{name: 'Arthur Conan Doyle', start: '1859-05-22', end: '1930-07-07', type: 'person'},
|
||||
{name: 'Henri Bergson', start: '1859-10-18', end: '1941-01-04', type: 'person'},
|
||||
{name: 'Georges Seurat', start: '1859-12-02', end: '1891-03-29', type: 'person'},
|
||||
|
||||
{name: 'Georges Méliès', start: '1861-12-08', end: '1938-01-21', type: 'person'},
|
||||
{name: 'Claude Debussy', start: '1862-08-22', end: '1918-03-25', type: 'person'},
|
||||
{name: 'Lumière Brothers', start: '1862-10-19', end: '1954-04-10', type: 'person'},
|
||||
{name: 'George Auriol', start: '1863-04-26', end: '1938-02', type: 'person'},
|
||||
{name: 'Henry Ford', start: '1863-07-30', end: '1947-04-07', type: 'person'},
|
||||
{name: 'Edvard Munch', start: '1863-12-12', end: '1944-01-23', type: 'person'},
|
||||
{name: 'Léon Gaumont', start: '1864-05-10', end: '1946-08-09', type: 'person'},
|
||||
{name: 'Henri de Toulouse-Lautrec', start: '1864-11-24', end: '1901-09-09', type: 'person'},
|
||||
{name: 'Wassily Kandinsky', start: '1866-12-16', end: '1944-12-13', type: 'person'},
|
||||
{name: 'Marie Curie', start: '1867-11-07', end: '1934-07-04', type: 'person'},
|
||||
{name: 'Mahatma Gandhi', start: '1869-10-02', end: '1948-01-30', type: 'person'},
|
||||
{name: 'André Gide', start: '1869-11-22', end: '1951-02-19', type: 'person'},
|
||||
{name: 'Henri Matisse', start: '1869-12-31', end: '1954-11-03', type: 'person'},
|
||||
|
||||
{name: 'Vladimir Lenin', start: '1870-04-22', end: '1924-01-21', type: 'person'},
|
||||
{name: 'Rosa Luxemburg', start: '1871-03-05', end: '1919-01-15', type: 'person'},
|
||||
{name: 'Marcel Proust', start: '1871-07-10', end: '1922-11-18', type: 'person'},
|
||||
{name: 'Karl Liebknecht', start: '1871-08-13', end: '1919-01-15', type: 'person'},
|
||||
{name: 'Charles Péguy', start: '1873-01-07', end: '1914-09-04', type: 'person'},
|
||||
{name: 'Arnold Schoenberg', start: '1874-09-13', end: '1951-07-13', type: 'person'},
|
||||
{name: 'Winston Churchill', start: '1874-11-30', end: '1965-01-24', type: 'person'},
|
||||
{name: 'Rainer Maria Rilke', start: '1875-12-04', end: '1926-12-29', type: 'person'},
|
||||
{name: 'Mata Hari', start: '1876-08-07', end: '1917-10-15', type: 'person'},
|
||||
{name: 'Lise Meitner', start: '1878-11-07', end: '1968-10-27', type: 'person'},
|
||||
{name: 'Josef Stalin', start: '1878-12-18', end: '1953-03-05', type: 'person'},
|
||||
{name: 'Kazimir Malevich', start: '1879-02-23', end: '1935-05-15', type: 'person'},
|
||||
{name: 'Albert Einstein', start: '1879-03-14', end: '1955-04-18', type: 'person'},
|
||||
|
||||
{name: 'Mack Sennett', start: '1880-01-17', end: '1960-11-05', type: 'person'},
|
||||
{name: 'Franz Marc', start: '1880-02-08', end: '1916-03-04', type: 'person'},
|
||||
{name: 'Robert Musil', start: '1880-11-06', end: '1942-04-15', type: 'person'},
|
||||
{name: 'Cecil B. DeMille', start: '1881-08-12', end: '1959-01-21', type: 'person'},
|
||||
{name: 'Pablo Picasso', start: '1881-10-25', end: '1973-04-08', type: 'person'},
|
||||
{name: 'Theodore Roosevelt', start: '1882-01-30', end: '1945-04-12', type: 'person'},
|
||||
{name: 'James Joyce', start: '1882-02-02', end: '1941-01-13', type: 'person'},
|
||||
{name: 'Emmy Noether', start: '1882-03-23', end: '1935-04-14', type: 'person'},
|
||||
{name: 'Franz Kafka', start: '1883-07-03', end: '1924-06-03', type: 'person'},
|
||||
{name: 'Robert J. Flaherty', start: '1884-02-16', end: '1951-07-23', type: 'person'},
|
||||
{name: 'Erich von Stroheim', start: '1885-09-22', end: '1957-05-12', type: 'person'},
|
||||
{name: 'Marc Chagall', start: '1887-06-24', end: '1985-03-28', type: 'person'},
|
||||
{name: 'Marcel Duchamp', start: '1887-07-28', end: '1968-10-02', type: 'person'},
|
||||
{name: 'Louis Jouvet', start: '1887-12-24', end: '1951-08-16', type: 'person'},
|
||||
{name: 'Friedrich Wilhelm Murnau', start: '1888-12-28', end: '1931-03-11', type: 'person'},
|
||||
{name: 'Carl Theodor Dreyer', start: '1889-02-03', end: '1968-03-20', type: 'person'},
|
||||
{name: 'Adolf Hitler', start: '1889-04-20', end: '1945-04-30', type: 'person'},
|
||||
{name: 'Jean Cocteau', start: '1889-06-05', end: '1963-10-11', type: 'person'},
|
||||
{name: 'Erich Pommer', start: '1889-07-20', end: '1966-05-08', type: 'person'},
|
||||
|
||||
{name: 'Karl Freund', start: '1890-01-16', end: '1969-05-03', type: 'person'},
|
||||
{name: 'Dwight D. Eisenhower', start: '1890-10-14', end: '1969-03-28', type: 'person'},
|
||||
{name: 'Charles de Gaulle', start: '1890-11-22', end: '1970-11-09', type: 'person'},
|
||||
{name: 'Fritz Lang', start: '1890-12-05', end: '1976-08-02', type: 'person'},
|
||||
{name: 'Osip Mandelstam', start: '1891-01-15', end: '1938-12-27', type: 'person'},
|
||||
{name: 'Ernst Lubitsch', start: '1892-01-28', end: '1947-11-20', type: 'person'},
|
||||
{name: 'Walter Benjamin', start: '1892-07-15', end: '1940-09-26', type: 'person'},
|
||||
{name: 'Hermann Göring', start: '1893-01-12', end: '1946-10-15', type: 'person'},
|
||||
{name: 'Lilian Gish', start: '1893-10-14', end: '1993-02-27', type: 'person'},
|
||||
{name: 'Mao Zedong', start: '1893-12-26', end: '1976-09-09', type: 'person'},
|
||||
{name: 'Louis-Ferdinand Céline', start: '1894-05-27', end: '1961-07-01', type: 'person'},
|
||||
{name: 'Aldous Huxley', start: '1894-07-26', end: '1963-11-22', type: 'person'},
|
||||
{name: 'Alexander Dovzhenko', start: '1894-09-10', end: '1956-11-25', type: 'person'},
|
||||
{name: 'Jean Renoir', start: '1894-09-15', end: '1979-02-12', type: 'person'},
|
||||
{name: 'Marcel Pagnol', start: '1895-02-28', end: '1974-04-18', type: 'person'},
|
||||
{name: 'Mary Duncan', start: '1895-08-13', end: '1993-05-09', type: 'person'},
|
||||
{name: 'Dziga Vertov', start: '1896-01-02', end: '1954-02-12', type: 'person'},
|
||||
{name: 'Lotte Eisner', start: '1896-03-05', end: '1983-11-25', type: 'person'},
|
||||
{name: 'Tristan Tzara', start: '1896-04-16', end: '1963-12-25', type: 'person'},
|
||||
{name: 'Howard Hawks', start: '1896-05-30', end: '1977-12-26', type: 'person'},
|
||||
{name: 'Antonin Artaud', start: '1896-09-04', end: '1948-03-04', type: 'person'},
|
||||
{name: 'F. Scott Fitzgerald', start: '1896-09-24', end: '1940-12-21', type: 'person'},
|
||||
{name: 'Jean Epstein', start: '1897-03-25', end: '1953-04-02', type: 'person'},
|
||||
{name: 'Frank Capra', start: '1897-05-18', end: '1991-09-03', type: 'person'},
|
||||
{name: 'William Faulkner', start: '1897-09-16', end: '1962-07-06', type: 'person'},
|
||||
{name: 'Georges Bataille', start: '1897-09-25', end: '1962-07-08', type: 'person'},
|
||||
{name: 'Joseph Goebbels', start: '1897-10-29', end: '1945-05-01', type: 'person'},
|
||||
{name: 'Gershom Scholem', start: '1897-12-05', end: '1982-02-21', type: 'person'},
|
||||
{name: 'Sergei Eisenstein', start: '1898-01-23', end: '1948-02-11', type: 'person'},
|
||||
{name: 'Bertolt Brecht', start: '1898-02-10', end: '1956-08-14', type: 'person'},
|
||||
{name: 'George Gershwin', start: '1898-09-26', end: '1937-07-11', type: 'person'},
|
||||
{name: 'Al Capone', start: '1899-01-17', end: '1947-01-25', type: 'person'},
|
||||
{name: 'Charlie Chaplin', start: '1899-04-16', end: '1977-12-25', type: 'person'},
|
||||
{name: 'Vladimir Nabokov', start: '1899-04-22', end: '1977-07-02', type: 'person'},
|
||||
{name: 'Irving Thalberg', start: '1899-05-30', end: '1936-09-14', type: 'person'},
|
||||
{name: 'Jean Moulin', start: '1899-06-20', end: '1943-07-08', type: 'person'},
|
||||
{name: 'Ernest Hemingway', start: '1899-07-21', end: '1961-07-02', type: 'person'},
|
||||
{name: 'Alfred Hitchcock', start: '1899-08-13', end: '1980-04-29', type: 'person'},
|
||||
{name: 'Jorge Luis Borges', start: '1899-08-24', end: '1986-06-14', type: 'person'},
|
||||
|
||||
{name: 'Luis Buñuel', start: '1900-02-22', end: '1983-07-29', type: 'person'},
|
||||
{name: 'Jan Oort', start: '1900-04-28', end: '1992-11-05', type: 'person'},
|
||||
{name: 'Catherine Hessling', start: '1900-06-22', end: '1979-09-28', type: 'person'},
|
||||
{name: 'Robert Siodmak', start: '1900-08-08', end: '1973-03-10', type: 'person'},
|
||||
{name: 'Jacques Lacan', start: '1901-04-13', end: '1981-09-09', type: 'person'},
|
||||
{name: 'André Malraux', start: '1901-12-05', end: '1976-11-23', type: 'person'},
|
||||
{name: 'Jean Mermoz', start: '1901-12-09', end: '1936-12-07', type: 'person'},
|
||||
{name: 'Marlene Dietrich', start: '1901-12-27', end: '1992-05-06', type: 'person'},
|
||||
{name: 'Werner Heisenberg', start: '1901-12-05', end: '1976-02-01', type: 'person'},
|
||||
{name: 'Max Ophüls', start: '1902-05-06', end: '1957-03-26', type: 'person'},
|
||||
{name: 'David O. Selznick', start: '1902-05-10', end: '1965-06-22', type: 'person'},
|
||||
{name: 'Fernand Braudel', start: '1902-08-24', end: '1985-11-27', type: 'person'},
|
||||
{name: 'George Orwell', start: '1903-06-25', end: '1950-01-21', type: 'person'},
|
||||
{name: 'Theodor W. Adorno', start: '1903-09-11', end: '1969-08-06', type: 'person'},
|
||||
{name: 'Salvador Dalí', start: '1904-05-11', end: '1989-01-23', type: 'person'},
|
||||
{name: 'Edgar G. Ulmer', start: '1904-09-17', end: '1972-09-30', type: 'person'},
|
||||
{name: 'George Stevens', start: '1904-12-18', end: '1975-03-08', type: 'person'},
|
||||
{name: 'Jean Vigo', start: '1905-04-26', end: '1934-10-05', type: 'person'},
|
||||
{name: 'Henry Fonda', start: '1905-05-16', end: '1982-08-12', type: 'person'},
|
||||
{name: 'Jean-Paul Sartre', start: '1905-06-21', end: '1980-04-15', type: 'person'},
|
||||
{name: 'Pierre Klossowski', start: '1905-08-09', end: '2001-08-12', type: 'person'},
|
||||
{name: 'Joel McCrea', start: '1905-11-05', end: '1990-10-20', type: 'person'},
|
||||
{name: 'Howard Hughes', start: '1905-12-24', end: '1976-04-05', type: 'person'},
|
||||
{name: 'Adolf Eichmann', start: '1906-03-19', end: '1962-05-31', type: 'person'},
|
||||
{name: 'Samuel Beckett', start: '1906-04-13', end: '1989-12-22', type: 'person'},
|
||||
{name: 'Kurt Gödel', start: '1906-04-28', end: '1978-01-14', type: 'person'},
|
||||
{name: 'Roberto Rossellini', start: '1906-05-08', end: '1977-06-03', type: 'person'},
|
||||
{name: 'Jacques Becker', start: '1906-09-15', end: '1960-02-21', type: 'person'},
|
||||
{name: 'Luchino Visconti', start: '1906-11-02', end: '1976-03-17', type: 'person'},
|
||||
{name: 'Grace Hopper', start: '1906-12-09', end: '1992-01-01', type: 'person'},
|
||||
{name: 'Frida Kahlo', start: '1907-07-06', end: '1954-07-13', type: 'person'},
|
||||
{name: 'Maurice Blanchot', start: '1907-09-22', end: '2003-02-20', type: 'person'},
|
||||
{name: 'Simone de Beauvoir', start: '1908-01-09', end: '1986-04-14', type: 'person'},
|
||||
{name: 'Salvador Allende', start: '1908-06-26', end: '1973-09-11', type: 'person'},
|
||||
{name: 'Madeleine Ozeray', start: '1908-09-13', end: '1989-03-28', type: 'person'},
|
||||
|
||||
{name: 'Jay Leyda', start: '1910-02-12', end: '1988-02-15', type: 'person'},
|
||||
{name: 'Josef Mengele', start: '1911-03-16', end: '1979-02-07', type: 'person'},
|
||||
{name: 'Emil Cioran', start: '1911-04-08', end: '1995-06-20', type: 'person'},
|
||||
{name: 'Georges Franju', start: '1912-04-12', end: '1987-11-05', type: 'person'},
|
||||
{name: 'Alan Turing', start: '1912-06-23', end: '1954-06-07', type: 'person'},
|
||||
{name: 'Michelangelo Antonioni', start: '1912-09-29', end: '2007-07-30', type: 'person'},
|
||||
{name: 'Richard Nixon', start: '1913-01-09', end: '1994-04-22', type: 'person'},
|
||||
{name: 'Albert Camus', start: '1913-11-07', end: '1960-01-04', type: 'person'},
|
||||
{name: 'William S. Burroughs', start: '1914-02-05', end: '1997-08-02', type: 'person'},
|
||||
{name: 'Henri Langlois', start: '1914-11-13', end: '1977-01-13', type: 'person'},
|
||||
{name: 'Orson Welles', start: '1915-05-06', end: '1985-10-10', type: 'person'},
|
||||
{name: 'Claude Roy', start: '1915-08-28', end: '1997-12-13', type: 'person'},
|
||||
{name: 'Ingrid Bergman', start: '1915-08-29', end: '1982-08-29', type: 'person'},
|
||||
{name: 'Roland Barthes', start: '1915-11-12', end: '1980-03-25', type: 'person'},
|
||||
{name: 'Yehudi Menuhin', start: '1916-04-22', end: '1999-03-12', type: 'person'},
|
||||
{name: 'François Mitterrand', start: '1916-10-26', end: '1996-01-08', type: 'person'},
|
||||
{name: 'John F. Kennedy', start: '1917-05-29', end: '1963-11-22', type: 'person'},
|
||||
{name: 'Jean-Pierre Melville', start: '1917-10-20', end: '1973-08-02', type: 'person'},
|
||||
{name: 'Joan Fontaine', start: '1917-10-22', end: '', type: 'person'},
|
||||
{name: 'Indira Gandhi', start: '1917-11-19', end: '1984-10-32', type: 'person'},
|
||||
{name: 'Teresa Wright', start: '1918-10-27', end: '2005-03-06', type: 'person'},
|
||||
|
||||
{name: 'Federico Fellini', start: '1920-01-20', end: '1993-10-31', type: 'person'},
|
||||
{name: 'Michèle Morgan', start: '1920-02-29', end: '', type: 'person'},
|
||||
{name: 'Montgomery Clift', start: '1920-10-17', end: '1966-07-23', type: 'person'},
|
||||
{name: 'Timothy Leary', start: '1920-10-22', end: '1996-05-31', type: 'person'},
|
||||
{name: 'Alexandre Astruc', start: '1923-07-13', end: '', type: 'person'},
|
||||
{name: 'Marlon Brando', start: '1924-04-03', end: '2004-07-01', type: 'person'},
|
||||
{name: 'Jean-François Lyotard', start: '1924-08-10', end: '1998-04-21', type: 'person'},
|
||||
{name: 'Gilles Deleuze', start: '1925-01-18', end: '1995-11-04', type: 'person'},
|
||||
{name: 'Isidore Isou', start: '1925-01-31', end: '2007-07-28', type: 'person'},
|
||||
{name: 'Pol Pot', start: '1925-05-19', end: '1998-04-15', type: 'person'},
|
||||
{name: 'Marylin Monroe', start: '1926-06-01', end: '1962-08-05', type: 'person'},
|
||||
{name: 'Michel Foucault', start: '1926-10-15', end: '1984-06-25', type: 'person'},
|
||||
{name: 'Janet Leight', start: '1927-07-06', end: '2004-10-03', type: 'person'},
|
||||
{name: 'Che Guevara', start: '1928-06-14', end: '1967-10-09', type: 'person'},
|
||||
{name: 'Andy Warhol', start: '1928-08-06', end: '1987-02-22', type: 'person'},
|
||||
{name: 'Martin Luther King', start: '1929-01-15', end: '1968-04-04', type: 'person'},
|
||||
{name: 'Jean Baudrillard', start: '1929-07-27', end: '2007-03-06', type: 'person'},
|
||||
|
||||
{name: 'Félix Guattari', start: '1930-04-30', end: '1992-08-29', type: 'person'},
|
||||
{name: 'Jacques Derrida', start: '1930-07-15', end: '2004-10-08', type: 'person'},
|
||||
{name: 'Jean-Luc Godard', start: '1930-12-03', end: '', type: 'person'},
|
||||
{name: 'James Dean', start: '1931-02-08', end: '1955-09-30', type: 'person'},
|
||||
{name: 'Jacques Demy', start: '1931-06-05', end: '1990-10-27', type: 'person'},
|
||||
{name: 'Guy Debord', start: '1931-12-28', end: '1994-11-30', type: 'person'},
|
||||
{name: 'François Truffaut', start: '1932-02-06', end: '1984-10-21', type: 'person'},
|
||||
{name: 'Elizabeth Taylor', start: '1932-02-27', end: '2011-03-23', type: 'person'},
|
||||
{name: 'Ivan Chtcheglov', start: '1933-01-16', end: '1998-04-21', type: 'person'},
|
||||
{name: 'Brigitte Bardot', start: '1934-09-28', end: '', type: 'person'},
|
||||
{name: 'Ulrike Meinhof', start: '1934-10-07', end: '1976-05-09', type: 'person'},
|
||||
{name: 'Saddam Hussein', start: '1937-04-28', end: '2006-12-30', type: 'person'},
|
||||
{name: 'Romy Schneider', start: '1938-09-23', end: '1982-05-29', type: 'person'},
|
||||
{name: 'Jean Seberg', start: '1938-11-13', end: '1979-08-30', type: 'person'},
|
||||
|
||||
{name: 'Gudrun Ensslin', start: '1940-08-15', end: '1977-10-18', type: 'person'},
|
||||
{name: 'John Lennon', start: '1940-10-09', end: '1980-12-08', type: 'person'},
|
||||
{name: 'Jimi Hendrix', start: '1942-11-27', end: '1970-09-18', type: 'person'},
|
||||
{name: 'Janis Joplin', start: '1943-01-19', end: '1970-10-04', type: 'person'},
|
||||
{name: 'Edie Sedgwick', start: '1943-04-20', end: '1971-11-16', type: 'person'},
|
||||
{name: 'Andreas Baader', start: '1943-05-06', end: '1977-10-18', type: 'person'},
|
||||
{name: 'Jim Morrison', start: '1943-12-08', end: '1971-06-03', type: 'person'},
|
||||
{name: 'Serge Daney', start: '1944-06-04', end: '1992-06-12', type: 'person'},
|
||||
{name: 'Bob Marley', start: '1945-02-06', end: '1981-05-11', type: 'person'},
|
||||
{name: 'Steven Spielberg', start: '1946-12-18', end: '', type: 'person'},
|
||||
{name: 'Fred Hampton', start: '1948-08-30', end: '1969-12-04', type: 'person'},
|
||||
|
||||
{name: 'Martin Kippenberger', start: '1953-02-25', end: '1997-03-07', type: 'person'},
|
||||
{name: 'Osama bin Laden', start: '1957-03-10', end: '2011-05-02', type: 'person'},
|
||||
{name: 'Michael Jackson', start: '1958-08-29', end: '2009-06-25', type: 'person'},
|
||||
|
||||
{name: 'Jean-Michel Basquiat', start: '1960-12-22', end: '1988-08-12', type: 'person'},
|
||||
{name: 'Lady Diana', start: '1961-07-01', end: '1997-08-31', type: 'person'},
|
||||
{name: 'Kurt Cobain', start: '1967-02-20', end: '1994-04-05', type: 'person'},
|
||||
|
||||
|
||||
{name: 'Xia Dynasty', start: '-2070', end: '-1600', type: 'place'},
|
||||
{name: 'Shang Dynasty', start: '-1760', end: '-1046', type: 'place'},
|
||||
{name: 'Zhou Dynasty', start: '-1046', end: '-256', type: 'place'},
|
||||
{name: 'Library of Alexandria', start: '-300', end: '-48', type: 'place'},
|
||||
{name: 'Qin Dynasty', start: '-221', end: '-206', type: 'place'},
|
||||
{name: 'Han Dynasty', start: '-206', end: '220', type: 'place'},
|
||||
{name: 'Roman Empire', start: '-27', end: '1453', type: 'place'},
|
||||
{name: 'Liang Dynasty', start: '502', end: '587', type: 'place'},
|
||||
{name: 'Chen Dynasty', start: '557', end: '589', type: 'place'},
|
||||
{name: 'Sui Dynasty', start: '581', end: '618', type: 'place'},
|
||||
{name: 'Tang Dynasty', start: '618', end: '907', type: 'place'},
|
||||
{name: 'Song Dynasty', start: '960', end: '1279', type: 'place'},
|
||||
{name: 'Holy Roman Empire', start: '962-02-02', end: '1806-08-06', type: 'place'},
|
||||
{name: 'Mongol Empire', start: '1206', end: '1368', type: 'place'},
|
||||
{name: 'Yuan Dynasty', start: '1271', end: '1368', type: 'place'},
|
||||
{name: 'Ottoman Empire', start: '1299-07-27', end: '1923-10-29', type: 'place'},
|
||||
{name: 'Ming Dynasty', start: '1368', end: '1644', type: 'place'},
|
||||
{name: 'Mughal Empire', start: '1526-04-21', end: '1858-06-20', type: 'place'},
|
||||
{name: 'Qing Dynasty', start: '1644', end: '1912', type: 'place'},
|
||||
{name: 'Austrian Empire', start: '1804-08-11', end: '1867-03-30', type: 'place'},
|
||||
{name: 'Japanese Empire', start: '1868-01-03', end: '1947-05-03', type: 'place'},
|
||||
{name: 'Congo Free State', start: '1885-07-11', end: '1908-11-15', type: 'place'},
|
||||
{name: 'Soviet Union', start: '1922-12-30', end: '1991-12-26', type: 'place'},
|
||||
{name: 'Weimar Republic', start: '1918-11-09', end: '1933-01-30', type: 'place'},
|
||||
{name: 'Third Reich', start: '1933-01-30', end: '1945-05-08', type: 'place'},
|
||||
{name: 'West Germany', start: '1949-05-23', end: '1990-10-03', type: 'place'},
|
||||
{name: 'East Germany', start: '1949-10-07', end: '1990-10-03', type: 'place'},
|
||||
{name: 'Berlin Wall', start: '1961-08-13', end: '1989-11-09', type: 'place'},
|
||||
{name: 'World Trade Center', start: '1973-04-04', end: '2001-09-11', type: 'place'},
|
||||
{name: 'European Union', start: '1993-11-01', end: '', type: 'place'},
|
||||
|
||||
|
||||
{name: 'Stone Age', start: '-10000', end: '-3000', type: 'other'},
|
||||
{name: 'Bronze Age', start: '-3000', end: '-1000', type: 'other'},
|
||||
{name: 'Iron Age', start: '-1000', end: '500', type: 'other'},
|
||||
{name: 'Pompeji', start: '79-08-24', end: '79-08-25', type: 'other'},
|
||||
{name: 'Middle Ages', start: '500', end: '1350', type: 'other'},
|
||||
{name: 'Battle of Hastings', start: '1066-10-14', end: '1066-10-15', type: 'other'},
|
||||
{name: 'Crusades', start: '1095', end: '1291', type: 'other'},
|
||||
{name: 'Hundred Years\' War', start: '1337', end: '1453', type: 'other'},
|
||||
{name: 'Great Plague', start: '1348', end: '1350', type: 'other'},
|
||||
{name: 'Renaissance', start: '1350', end: '1650', type: 'other'},
|
||||
{name: 'Fall of Constantinople', start: '1453-04-06', end: '1453-05-29', type: 'other'},
|
||||
{name: 'Spanish Inquisition', start: '1480-09-27', end: '1834-07-15', type: 'other'},
|
||||
{name: 'Discovery of America', start: '1492', end: '1493', type: 'other'},
|
||||
{name: 'Queen Mary', start: '1553-07-19', end: '1558-11-17', type: 'other'},
|
||||
{name: 'Queen Elizabeth', start: '1558-11-17', end: '1603-03-24', type: 'other'},
|
||||
{name: 'Gregorian Calendar', start: '1582-10-05', end: '1582-10-15', type: 'other'},
|
||||
{name: 'East India Company', start: '1600', end: '1874', type: 'other'},
|
||||
{name: 'Thirty Years\' War', start: '1618', end: '1648', type: 'other'},
|
||||
{name: 'Great Fire of London', start: '1666-09-02', end: '1666-09-05', type: 'other'},
|
||||
{name: 'Industrial Revolution', start: '1750', end: '1850', type: 'other'},
|
||||
{name: 'Lisbon Earthquake', start: '1755-11-01', end: '1755-11-02', type: 'other'},
|
||||
{name: 'Declaration of Independence', start: '1776-07-04', end: '1776-07-05', type: 'other'},
|
||||
{name: 'French Revolution', start: '1789', end: '1799', type: 'other'},
|
||||
{name: 'Storming of the Bastille', start: '1789-07-14', end: '1789-07-15', type: 'other'},
|
||||
{name: 'Napoleonic Era', start: '1799-11-09', end: '1815-06-28', type: 'other'},
|
||||
{name: 'Battle of Trafalgar', start: '1805-10-21', end: '1805-10-22', type: 'other'},
|
||||
{name: 'Battle of Borodino', start: '1812-09-07', end: '1812-09-08', type: 'other'},
|
||||
{name: 'Battle of Waterloo', start: '1815-06-18', end: '1815-06-19', type: 'other'},
|
||||
{name: 'The Year Without a Summer', start: '1816', end: '1817', type: 'other'},
|
||||
{name: 'Queen Isabella', start: '1833-09-29', end: '1868-09-30', type: 'other'},
|
||||
{name: 'Queen Victoria', start: '1837-06-20', end: '1901-01-22', type: 'other'},
|
||||
{name: 'Crimean War', start: '1853-10', end: '1856-02', type: 'other'},
|
||||
{name: 'American Civil War', start: '1861-04-12', end: '1865-04-09', type: 'other'},
|
||||
{name: 'Franco-Prussian War', start: '1870-07-19', end: '1871-05-10', type: 'other'},
|
||||
{name: 'Paris Commune', start: '1871-03-18', end: '1871-05-28', type: 'other'},
|
||||
{name: 'Haymarket', start: '1886-05-04', end: '1886-05-05', type: 'other'},
|
||||
{name: 'Titanic', start: '1912-04-15', end: '1912-04-16', type: 'other'},
|
||||
{name: 'World War One', start: '1914-07-28', end: '1918-11-11', type: 'other'},
|
||||
{name: 'Battle of Verdun', start: '1916-02-21', end: '1916-12-18', type: 'other'},
|
||||
{name: 'Russian Revolution', start: '1917', end: '1918', type: 'other'},
|
||||
{name: 'October Revolution', start: '1917-11-07', end: '1917-11-08', type: 'other'},
|
||||
{name: 'Spanish Flu', start: '1918', end: '1919', type: 'other'},
|
||||
{name: 'Treaty of Versailles', start: '1919-06-28', end: '1919-06-29', type: 'other'},
|
||||
{name: 'Spanish Civil War', start: '1936-07-17', end: '1939-04-01', type: 'other'},
|
||||
{name: '1936 Summer Olympics', start: '1936-08-01', end: '1936-08-16', type: 'other'},
|
||||
{name: 'Guernica', start: '1937-04-26', end: '1937-04-27', type: 'other'},
|
||||
{name: 'Hindenburg', start: '1937-05-06', end: '1937-05-07', type: 'other'},
|
||||
{name: 'World War Two', start: '1939-09-01', end: '1945-09-02', type: 'other'},
|
||||
{name: 'Pearl Harbour', start: '1941-12-07', end: '1941-12-08', type: 'other'},
|
||||
{name: 'Wannsee Conference', start: '1942-01-20', end: '1942-01-21', type: 'other'},
|
||||
{name: 'Battle of Stalingrad', start: '1942-08-23', end: '1943-02-02', type: 'other'},
|
||||
{name: 'D-Day', start: '1944-06-06', end: '1944-06-07', type: 'other'},
|
||||
{name: 'Liberation of Paris', start: '1944-08-19', end: '1944-08-25', type: 'other'},
|
||||
{name: 'Liberation of Auschwitz', start: '1945-01-27', end: '1945-01-28', type: 'other'},
|
||||
{name: 'Battle of Okinawa', start: '1945-04-01', end: '1945-06-22', type: 'other'},
|
||||
{name: 'Hiroshima', start: '1945-08-06', end: '1945-08-07', type: 'other'},
|
||||
{name: 'Nagasaki', start: '1945-08-09', end: '1945-08-10', type: 'other'},
|
||||
{name: 'Nuremburg Trials', start: '1945-11-20', end: '1946-10-01', type: 'other'},
|
||||
{name: 'Fourth Republic', start: '1946-10-14', end: '1958-10-04', type: 'other'},
|
||||
{name: 'Cold War', start: '1947', end: '1991', type: 'other'},
|
||||
{name: 'Korean War', start: '1950-06-25', end: '1953-07-27', type: 'other'},
|
||||
{name: 'Cuban Revolution', start: '1953-07-26', end: '1959-01-01', type: 'other'},
|
||||
{name: 'Algerian War', start: '1954-11-01', end: '1962-03-19', type: 'other'},
|
||||
{name: 'Vietnam War', start: '1955-11-01', end: '1975-04-30', type: 'other'},
|
||||
{name: 'Eichmann Trial', start: '1961-04-11', end: '1961-08-14', type: 'other'},
|
||||
{name: 'Bay of Pigs', start: '1961-04-17', end: '1961-04-19', type: 'other'},
|
||||
{name: 'Cuban Missile Crisis', start: '1962-10-14', end: '1962-11-20', type: 'other'},
|
||||
{name: 'Assassination of John F. Kennedy', start: '1963-11-22', end: '1963-11-23', type: 'other'},
|
||||
{name: 'Summer of Love', start: '1967-06', end: '1967-09', type: 'other'},
|
||||
{name: 'Sgt. Pepper', start: '1967-06-01', end: '1967-06-02', type: 'other'},
|
||||
{name: 'Assassination of Benno Ohnesorg', start: '1967-06-02', end: '1967-06-03', type: 'other'},
|
||||
{name: 'Six-Day War', start: '1967-06-05', end: '1967-06-11', type: 'other'},
|
||||
{name: 'My Lai', start: '1968-03-16', end: '1968-03-17', type: 'other'},
|
||||
{name: 'Assassination of Martin Luther King', start: '1968-04-04', end: '1968-04-05', type: 'other'},
|
||||
{name: 'Assassination of Rudi Dutschke', start: '1968-04-11', end: '1968-04-12', type: 'other'},
|
||||
{name: '1968 Cannes Film Festival', start: '1968-05-10', end: '1968-05-19', type: 'other'},
|
||||
{name: 'Valerie Solanas', start: '1968-06-03', end: '1968-06-04', type: 'other'},
|
||||
{name: 'Assassination of Robert F. Kennedy', start: '1968-06-05', end: '1968-06-06', type: 'other'},
|
||||
{name: '1968 Summer Olympics', start: '1968-10-12', end: '1968-10-27', type: 'other'},
|
||||
{name: 'Apollo 11', start: '1969-07-16', end: '1969-07-24', type: 'other'},
|
||||
{name: 'Moon Landing', start: '1969-07-20', end: '1969-07-21', type: 'other'},
|
||||
{name: 'Woodstock', start: '1969-08-15', end: '1969-08-18', type: 'other'},
|
||||
{name: 'The Epoch', start: '1970-01-01 00:00:00', end: '1970-01-01 00:00:01', type: 'other'},
|
||||
{name: '1972 Summer Olympics', start: '1972-08-26', end: '1972-09-10', type: 'other'},
|
||||
{name: 'Apollo 17', start: '1972-12-07', end: '1972-12-19', type: 'other'},
|
||||
{name: 'Indian Emergency', start: '1975-06-25', end: '1977-03-21', type: 'other'},
|
||||
{name: 'Iran-Iraq War', start: '1980-09-22', end: '1988-08-20', type: 'other'},
|
||||
{name: 'Reagan Administration', start: '1981-01-20', end: '1989-01-20', type: 'other'},
|
||||
{name: 'Tschernobyl', start: '1986-04-26', end: '1986-04-27', type: 'other'},
|
||||
{name: 'Fall of the Berlin Wall', start: '1989-11-09', end: '1989-11-10', type: 'other'},
|
||||
{name: 'Gulf War', start: '1990-08-02', end: '1991-02-28', type: 'other'},
|
||||
{name: 'German Reunification', start: '1990-10-03', end: '1990-10-04', type: 'other'},
|
||||
{name: 'Clinton Presidency', start: '1993-01-20', end: '2001-01-20', type: 'other'},
|
||||
{name: 'Battle of Seattle', start: '1999-11-30', end: '1999-12-01', type: 'other'},
|
||||
{name: 'George W. Bush Presidency', start: '2001-01-20', end: '2009-01-20', type: 'other'},
|
||||
{name: 'Carlo Giuliani', start: '2001-07-20', end: '2001-07-21', type: 'other'},
|
||||
{name: '9-11', start: '2001-09-11', end: '2001-09-12', type: 'other'},
|
||||
{name: 'Obama Presidency', start: '2009-01-20', end: '', type: 'other'},
|
||||
{name: 'Fukushima', start: '2011-03-11', end: '2011-03-12', type: 'other'}
|
||||
|
||||
],
|
||||
height: window.innerHeight,
|
||||
range: [-5000, 5000],
|
||||
width: window.innerWidth - 257,
|
||||
zoom: 2
|
||||
});
|
||||
|
||||
var $panel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $calendar
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element(),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo(Ox.UI.$body);
|
||||
|
||||
$calendar
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$calendar.options({width: window.innerWidth - $panel.getSize(1)});
|
||||
}
|
||||
})
|
||||
.gainFocus();
|
||||
|
||||
Ox.UI.$window.bind({
|
||||
resize: function(e) {
|
||||
$calendar.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth - $panel.getSize(1)
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Countries Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/countries.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,41 +0,0 @@
|
|||
Ox.load({UI: {theme: 'modern'}, Geo: {}}, function() {
|
||||
|
||||
var $list = Ox.IconList({
|
||||
//borderRadius: 32,
|
||||
item: function(data, sort, size) {
|
||||
return {
|
||||
height: size,
|
||||
id: data.code,
|
||||
info: data.region,
|
||||
title: data.name + ' (' + data.code + ')',
|
||||
url: Ox.getFlagByGeoname(data.name, 256),
|
||||
width: size
|
||||
}
|
||||
},
|
||||
items: Ox.COUNTRIES.sort(function(a, b) {
|
||||
return a.code < b.code ? -1 : a.code > b.code ? 1 : 0;
|
||||
}),
|
||||
sort: [{key: 'code', operator: '+'}]
|
||||
});
|
||||
|
||||
Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Bar(),
|
||||
size: 24
|
||||
},
|
||||
{
|
||||
element: $list
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
/*
|
||||
Ox.UI.$window.resize(function() {
|
||||
$list.size();
|
||||
});
|
||||
*/
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Dialog Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/dialog.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,276 +0,0 @@
|
|||
Ox.load('UI', {debug: true}, function() {
|
||||
|
||||
|
||||
|
||||
var $buttons = Ox.Bar({size: 24});
|
||||
|
||||
var $img, $previewDialog, preview = false;
|
||||
var $list = Ox.IconList({
|
||||
item: function(data, sort, size) {
|
||||
var ratio = data.width / data.height;
|
||||
size = size || 128;
|
||||
return {
|
||||
height: ratio <= 1 ? size : size / ratio,
|
||||
id: data.id,
|
||||
info: data.width + ' x ' + data.height + ' px',
|
||||
title: Ox.toTitleCase(data.id),
|
||||
url: 'png/' + data.id + '.png',
|
||||
width: ratio >= 1 ? size : size * ratio
|
||||
};
|
||||
},
|
||||
items: [
|
||||
{
|
||||
id: 'earth',
|
||||
width: 1024,
|
||||
height: 1024
|
||||
},
|
||||
{
|
||||
id: 'north',
|
||||
width: 1024,
|
||||
height: 512
|
||||
},
|
||||
{
|
||||
id: 'west',
|
||||
width: 512,
|
||||
height: 1024
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal',
|
||||
size: 128,
|
||||
sort: [{key: 'id', operator: '+'}],
|
||||
unique: 'id'
|
||||
}).bindEvent({
|
||||
closepreview: function() {
|
||||
$previewDialog.close();
|
||||
preview = false;
|
||||
},
|
||||
openpreview: function(event) {
|
||||
var data = Ox.getObjectById($list.options('items'), event.ids[0]),
|
||||
ratio = data.width / data.height,
|
||||
windowWidth = window.innerWidth * 0.8,
|
||||
windowHeight = window.innerHeight * 0.8,
|
||||
windowRatio = windowWidth / windowHeight,
|
||||
width = Math.round(ratio > windowRatio ? windowWidth : windowHeight * ratio),
|
||||
height = Math.round(ratio < windowRatio ? windowHeight : windowWidth / ratio);
|
||||
Ox.print('d/w/h', data, width, height)
|
||||
if (!preview) {
|
||||
if (!$previewDialog) {
|
||||
$previewDialog = Ox.Dialog({
|
||||
closeButton: true,
|
||||
content: $img = $('<img>')
|
||||
.attr({src: 'png/' + data.id + '.png'})
|
||||
.css({width: width + 'px', height: height + 'px'}),
|
||||
fixedRatio: true,
|
||||
focus: false,
|
||||
height: height,
|
||||
maximizeButton: true,
|
||||
title: Ox.toTitleCase(data.id),
|
||||
width: width
|
||||
})
|
||||
.bindEvent({
|
||||
close: function() {
|
||||
$list.closePreview();
|
||||
preview = false;
|
||||
},
|
||||
resize: function(event) {
|
||||
$img.css({
|
||||
width: event.width + 'px',
|
||||
height: event.height + 'px'
|
||||
});
|
||||
}
|
||||
}).open();
|
||||
} else {
|
||||
$previewDialog.options({
|
||||
content: $img = $('<img>')
|
||||
.attr({src: 'png/' + data.id + '.png'})
|
||||
.css({width: width + 'px', height: height + 'px'}),
|
||||
height: height,
|
||||
title: Ox.toTitleCase(data.id),
|
||||
width: width
|
||||
}).open();
|
||||
}
|
||||
preview = true;
|
||||
} else {
|
||||
$previewDialog.options({
|
||||
content: $img = $('<img>')
|
||||
.attr({src: 'png/' + data.id + '.png'})
|
||||
.css({width: width + 'px', height: height + 'px'}),
|
||||
title: Ox.toTitleCase(data.id),
|
||||
}).setSize(width, height);
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $buttons,
|
||||
size: 24
|
||||
},
|
||||
{
|
||||
element: $('<div>').css({background: 'rgb(128, 128, 128)'})
|
||||
},
|
||||
{
|
||||
element: $list,
|
||||
size: 208
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
}).appendTo(Ox.UI.$body);
|
||||
|
||||
Ox.UI.$body
|
||||
.css({
|
||||
padding: '4px',
|
||||
background: 'rgb(240, 240, 240)'
|
||||
});
|
||||
|
||||
var $dialog = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
title: 'Cancel'
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
}),
|
||||
Ox.Button({
|
||||
title: 'Close'
|
||||
}).bindEvent({
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
content: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element({id: 'foo'}).css({background: 'rgb(240, 240, 240)'}),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: Ox.Element({id: 'bar'}).css({background: 'rgb(240, 240, 240)'}),
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}),
|
||||
title: Ox.repeat('Foo bar. ', 10)
|
||||
});
|
||||
|
||||
var $dialogA = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({title: 'Foo'}),
|
||||
Ox.Button({title: 'Bar'}),
|
||||
{},
|
||||
Ox.Button({title: 'Baz'}),
|
||||
Ox.Button({title: 'Close'}).bindEvent({
|
||||
click: function() {
|
||||
$dialogA.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
content: $('<div>')
|
||||
.css({padding: '16px'})
|
||||
.html(Ox.repeat('Foo bar. ', 100)),
|
||||
title: Ox.repeat('Foo bar. ', 10)
|
||||
}).bindEvent({
|
||||
key_escape: function() {
|
||||
$dialogA.close();
|
||||
}
|
||||
});
|
||||
|
||||
var $img = $('<img>')
|
||||
.attr({src: 'png/earth.png'})
|
||||
.css({width: '256px', height: '256px'});
|
||||
var $dialogB = Ox.Dialog({
|
||||
closeButton: true,
|
||||
content: $img,
|
||||
fixedRatio: true,
|
||||
focus: false,
|
||||
height: 256,
|
||||
maximizeButton: true,
|
||||
width: 256,
|
||||
title: Ox.repeat('Foo bar. ', 10)
|
||||
}).bindEvent({
|
||||
resize: function(event) {
|
||||
$img.css({
|
||||
width: event.width + 'px',
|
||||
height: event.height + 'px'
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
var $dialogC = Ox.Dialog({
|
||||
closeButton: true,
|
||||
content: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element({id: 'foo'}).css({background: 'rgb(240, 240, 240)'}),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: Ox.Element({id: 'bar'}).css({background: 'rgb(240, 240, 240)'}),
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Bar({
|
||||
size: 16}
|
||||
).css({
|
||||
borderBottomLeftRadius: '8px',
|
||||
borderBottomRightRadius: '8px'
|
||||
}),
|
||||
size: 16
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
}),
|
||||
height: Math.round((window.innerHeight - 24) * 0.9),
|
||||
maximizeButton: true,
|
||||
title: Ox.repeat('Foo bar. ', 10),
|
||||
width: Math.round(window.innerWidth * 0.9)
|
||||
});
|
||||
|
||||
Ox.Button({
|
||||
title: 'Dialog'
|
||||
}).css({
|
||||
margin: '4px'
|
||||
}).bindEvent({
|
||||
click: $dialog.open
|
||||
}).appendTo($buttons);
|
||||
|
||||
Ox.Button({
|
||||
title: 'Dialog A'
|
||||
}).css({
|
||||
margin: '4px'
|
||||
}).bindEvent({
|
||||
click: $dialogA.open
|
||||
}).appendTo($buttons);
|
||||
|
||||
Ox.Button({
|
||||
title: 'Dialog B'
|
||||
}).css({
|
||||
margin: '4px'
|
||||
}).bindEvent({
|
||||
click: $dialogB.open
|
||||
}).appendTo($buttons);
|
||||
|
||||
Ox.Button({
|
||||
title: 'Dialog C'
|
||||
}).css({
|
||||
margin: '4px'
|
||||
}).bindEvent({
|
||||
click: $dialogC.open
|
||||
}).appendTo($buttons);
|
||||
|
||||
});
|
Before Width: | Height: | Size: 1.4 MiB |
Before Width: | Height: | Size: 897 KiB |
Before Width: | Height: | Size: 719 KiB |
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Doc Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/doc.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,28 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'classic'
|
||||
}, function() {
|
||||
Ox.Theme('classic');
|
||||
Ox.doc('../../build/Ox.js', function(items) {
|
||||
items.forEach(function(item) {
|
||||
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
|
||||
});
|
||||
});
|
||||
return;
|
||||
|
||||
Ox.get('../../build/Ox.js', function(source) {
|
||||
var doc = Ox.doc(source);
|
||||
doc.forEach(function(item) {
|
||||
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
|
||||
});
|
||||
// /*
|
||||
Ox.get('../../build/Ox.UI/js/Map/Ox.Map.js', function(source) {
|
||||
var doc = Ox.doc(source);
|
||||
doc.forEach(function(item) {
|
||||
Ox.DocPage({doc: item}).appendTo(Ox.UI.$body);
|
||||
});
|
||||
Ox.print('TEST', Ox.test(source))
|
||||
});
|
||||
// */
|
||||
});
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Doc Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/doc.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,46 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
theme: 'classic'
|
||||
}, function() {
|
||||
Ox.Theme('classic');
|
||||
Ox.getJSON(Ox.PATH + 'Ox/json/Ox.json', function(oxFiles) {
|
||||
Ox.getJSON(Ox.PATH + 'Ox.UI/json/Ox.UI.files.json', function(oxuiFiles) {
|
||||
doc = Ox.DocPanel({
|
||||
files: Ox.merge(
|
||||
Ox.flatten(oxFiles),
|
||||
oxuiFiles.filter(function(file) {
|
||||
return Ox.endsWith(file, '.js');
|
||||
}),
|
||||
[
|
||||
'Ox.Geo/Ox.Geo.js',
|
||||
'Ox.Image/Ox.Image.js',
|
||||
'Ox.Unicode/Ox.Unicode.js'
|
||||
]
|
||||
),
|
||||
getModule: function(item) {
|
||||
var file = item.file.replace(Ox.PATH, '');
|
||||
return file.split('/')[0];
|
||||
},
|
||||
getSection: function(item) {
|
||||
var file = item.file.replace(Ox.PATH, '');
|
||||
return item.section || file.split('/')[2].split('.')[0];
|
||||
},
|
||||
path: Ox.PATH
|
||||
}).bindEvent({
|
||||
load: function() {
|
||||
if (document.location.hash.substring(1)) {
|
||||
doc.selectItem(document.location.hash.substring(1));
|
||||
}
|
||||
},
|
||||
select: function(data) {
|
||||
if (data.id) {
|
||||
document.location.hash = data.id;
|
||||
}
|
||||
}
|
||||
});
|
||||
doc.appendTo(Ox.UI.$body);
|
||||
window.onhashchange = function() {
|
||||
doc.selectItem(document.location.hash.substring(1))
|
||||
};
|
||||
});
|
||||
});
|
||||
});
|
|
@ -1,12 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Editable Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/editable.css"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/editable.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,200 +0,0 @@
|
|||
Ox.load('UI', {debug: true}, function() {
|
||||
|
||||
var $box = Ox.Element()
|
||||
.css({width: '512px', height: '512px', margin: '8px'})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
/*
|
||||
$container.append(
|
||||
Ox.Input({
|
||||
height: 64,
|
||||
style: 'square',
|
||||
type: 'textarea',
|
||||
width: 256
|
||||
})
|
||||
);
|
||||
$container.append($('<br>'))
|
||||
*/
|
||||
|
||||
var data = {
|
||||
country: ['France'],
|
||||
director: ['Jean-Luc Godard'],
|
||||
language: ['French', 'English'],
|
||||
runtime: '90 min',
|
||||
title: 'Deux ou trois choses que je sais d\'elle',
|
||||
year: '1967'
|
||||
};
|
||||
|
||||
Ox.Editable({
|
||||
value: data.title
|
||||
})
|
||||
.css({
|
||||
height: '16px',
|
||||
fontWeight: 'bold',
|
||||
fontSize: '13px'
|
||||
})
|
||||
.appendTo($box);
|
||||
|
||||
Ox.Editable({
|
||||
format: function(value) {
|
||||
return value ? value.split(', ').map(function(value) {
|
||||
return '<a href="/?find=' + value + '">' + value + '</a>'
|
||||
}).join(', ') : 'Unknown Director'
|
||||
},
|
||||
value: data.director.join(', ')
|
||||
})
|
||||
.css({
|
||||
height: '16px',
|
||||
fontWeight: 'bold',
|
||||
fontSize: '13px'
|
||||
})
|
||||
.appendTo($box);
|
||||
|
||||
var $div = $('<div>').appendTo($box.$element);
|
||||
|
||||
['country', 'year', 'language', 'runtime'].forEach(function(key, i) {
|
||||
var $div_ = $('<div>')
|
||||
.css({float: 'left', margin: '1px 0 0 1px'})
|
||||
.append(
|
||||
$('<div>')
|
||||
.css({float: 'left', fontWeight: 'bold'})
|
||||
.html((i ? '; ' : '') + Ox.toTitleCase(key) + ': ')
|
||||
)
|
||||
.appendTo($div);
|
||||
Ox.Editable({
|
||||
format: function(value) {
|
||||
return (value ? (
|
||||
Ox.isArray(data[key]) ? value.split(', ').map(function(value) {
|
||||
return '<a href="/?find=' + value + '">' + value + '</a>'
|
||||
}).join(', ') : value
|
||||
) : 'unknown');// + (i == 3 ? '' : ';');
|
||||
},
|
||||
value: Ox.isArray(data[key]) ? data[key].join(', ') : data[key]
|
||||
})
|
||||
.css({
|
||||
float: 'left'
|
||||
})
|
||||
.appendTo($div_);
|
||||
});
|
||||
|
||||
|
||||
$div = $('<div>').css({clear: 'both', marginTop: '16px', textAlign: 'justify'}).appendTo($box.$element);
|
||||
Ox.Editable({
|
||||
format: function(value) {
|
||||
return '<span style="font-weight: bold">Keywords:</span> '
|
||||
+ value.split(', ').map(function(value) {
|
||||
return '<a href="/?find=' + value + '">' + value + '</a>'
|
||||
}).join(', ')
|
||||
},
|
||||
type: 'textarea',
|
||||
value: 'Sex, Crime, Car, Spoiler in Keywords, Genre in Keywords, Director Cameo, One Or More Meta Keywords',
|
||||
width: 512
|
||||
})
|
||||
.css({
|
||||
})
|
||||
.appendTo($div);
|
||||
|
||||
var $bar = Ox.Bar({
|
||||
size: 16
|
||||
})
|
||||
.css({
|
||||
width: '256px',
|
||||
marginTop: '4px'
|
||||
})
|
||||
.appendTo($box.$element);
|
||||
var $addButton = Ox.Button({
|
||||
style: 'symbol',
|
||||
title: 'add',
|
||||
tooltip: 'Add Keyword',
|
||||
type: 'image'
|
||||
})
|
||||
.css({
|
||||
float: 'right'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
//setTimeout(function() {
|
||||
values = Ox.map(values, function(value) {
|
||||
return value || null;
|
||||
});
|
||||
values.push('');
|
||||
renderEditables();
|
||||
Ox.last($editables).triggerEvent('doubleclick');
|
||||
//}, 25);
|
||||
}
|
||||
})
|
||||
.appendTo($bar);
|
||||
var $content = Ox.Element({
|
||||
tooltip: 'Doubleclick to add keyword'
|
||||
})
|
||||
.addClass('content')
|
||||
.css({
|
||||
display: 'table-cell',
|
||||
width: '246px',
|
||||
padding: '4px',
|
||||
border: '1px solid rgb(192, 192, 192)',
|
||||
marginTop: '8px'
|
||||
})
|
||||
.bindEvent({
|
||||
doubleclick: function(e) {
|
||||
$(e.target).is('.content') && $addButton.trigger('click');
|
||||
}
|
||||
})
|
||||
.appendTo($box.$element);
|
||||
var $editables = [],
|
||||
values = [
|
||||
'Sex', 'Crime', 'Car', 'Spoiler in Keywords',
|
||||
'Genre in Keywords', 'Director Cameo',
|
||||
'One Or More Meta Keywords'
|
||||
];
|
||||
renderEditables();
|
||||
function renderEditables() {
|
||||
$content.empty();
|
||||
Ox.print('VALUES:', values)
|
||||
values.forEach(function(value, i) {
|
||||
i && $('<div>')
|
||||
.css({float: 'left'})
|
||||
.html(', ')
|
||||
.appendTo($content);
|
||||
$editables[i] = Ox.Editable({
|
||||
format: function(value) {
|
||||
return value
|
||||
? value //'<a href="/?find=' + value + '">' + value + '</a>'
|
||||
: ' ';
|
||||
},
|
||||
tooltip: 'Click to select, doubleclick to edit',
|
||||
value: value
|
||||
})
|
||||
.css({float: 'left'})
|
||||
//.data({position: i})
|
||||
.bindEvent({
|
||||
anyclick: function() {
|
||||
$('.selected').removeClass('selected');
|
||||
$editables[i].addClass('selected');
|
||||
},
|
||||
cancel: function(data) {
|
||||
submit(i, data.value);
|
||||
},
|
||||
submit: function(data) {
|
||||
submit(i, data.value);
|
||||
}
|
||||
})
|
||||
.appendTo($content);
|
||||
});
|
||||
}
|
||||
function submit(i, value) {
|
||||
Ox.print('submit:', value)
|
||||
if (value === '') {
|
||||
values.splice(i, 1);
|
||||
} else {
|
||||
Array.prototype.splice.apply(values, Ox.merge(
|
||||
[i, 1],
|
||||
value.split(',').map(function(v) {
|
||||
return v.trim();
|
||||
})
|
||||
));
|
||||
}
|
||||
renderEditables();
|
||||
}
|
||||
|
||||
});
|
|
@ -1,38 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS ExamplePanel Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script>
|
||||
Ox.load('UI', function() {
|
||||
///*
|
||||
Ox.ExamplePanel({
|
||||
examples: ['cities'],
|
||||
keywords: /\b(Ox\.[\w]+)\b/g,
|
||||
path: Ox.PATH + '../examples/',
|
||||
replace: [[/\b(Ox[\.\w]+)\b/g, '<b>$1</b>']],
|
||||
selected: window.location.hash.substr(1)
|
||||
})
|
||||
.bindEvent({
|
||||
select: function(data) {
|
||||
window.location.hash = data.id;
|
||||
}
|
||||
})
|
||||
.appendTo(Ox.$body);
|
||||
//*/
|
||||
/*
|
||||
Ox.ExamplePage({
|
||||
height: window.innerHeight,
|
||||
html: Ox.PATH + '../examples/cities/index.html',
|
||||
js: Ox.PATH + '../examples/cities/js/example.js',
|
||||
title: 'Cities',
|
||||
width: window.innerWidth
|
||||
})
|
||||
.appendTo(Ox.$body);
|
||||
*/
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS FileInput Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/fileinput.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,143 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
var files,
|
||||
|
||||
$menu = Ox.MainMenu({
|
||||
menus: [
|
||||
{
|
||||
id: 'file', title: 'File', items: [
|
||||
{id: 'mount', title: 'Mount Volume...', icon: Ox.UI.getImageURL('symbolMount'), checked: true, disabled: true, keyboard: 'control m'},
|
||||
{id: 'select', title: 'Select Files...', icon: Ox.UI.getImageURL('symbolVolume'), file: {maxFiles: -1, maxSize: -1, width: 96}, keyboard: 'control f'},
|
||||
{id: 'unmount', title: 'Unmount Volume', icon: Ox.UI.getImageURL('symbolUnmount'), keyboard: 'control u'}
|
||||
]
|
||||
}
|
||||
]
|
||||
})
|
||||
.bindEvent({
|
||||
click: function(data) {
|
||||
if (data.id == 'select') {
|
||||
files = data.files;
|
||||
openDialog();
|
||||
}
|
||||
}
|
||||
}),
|
||||
|
||||
$main = Ox.Element()
|
||||
.append(
|
||||
Ox.FileButton({
|
||||
maxFiles: 1,
|
||||
title: 'Select File...',
|
||||
width: 128
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '16px',
|
||||
top: '16px'
|
||||
})
|
||||
)
|
||||
.append(
|
||||
Ox.FileButton({
|
||||
title: 'Select Files...',
|
||||
width: 128
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '16px',
|
||||
top: '48px'
|
||||
})
|
||||
)
|
||||
.append(
|
||||
Ox.FileInput({
|
||||
maxFiles: 1,
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '16px',
|
||||
top: '80px'
|
||||
})
|
||||
)
|
||||
.append(
|
||||
Ox.FileInput({
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '16px',
|
||||
top: '112px'
|
||||
})
|
||||
),
|
||||
|
||||
$panel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $menu,
|
||||
size: 20
|
||||
},
|
||||
{
|
||||
element: $main
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.appendTo(Ox.$body);
|
||||
|
||||
function openDialog() {
|
||||
|
||||
var $content,
|
||||
|
||||
$dialog = Ox.Dialog({
|
||||
buttons: [
|
||||
Ox.Button({
|
||||
id: 'cancel',
|
||||
title: 'Cancel'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
}),
|
||||
Ox.Button({
|
||||
id: 'upload',
|
||||
title: 'Upload'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$dialog.close();
|
||||
}
|
||||
})
|
||||
],
|
||||
content: $content = Ox.Element()
|
||||
.css(getContentCSS())
|
||||
.append(
|
||||
Ox.FileInput({
|
||||
value: files,
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '16px',
|
||||
top: '16px',
|
||||
marginBottom: '16px'
|
||||
})
|
||||
.bindEvent({
|
||||
change: function(data) {
|
||||
files = data.value;
|
||||
$content.css(getContentCSS())
|
||||
}
|
||||
})
|
||||
),
|
||||
keys: {enter: 'upload', escape: 'cancel'},
|
||||
title: 'Files',
|
||||
width: 288 + Ox.UI.SCROLLBAR_SIZE,
|
||||
height: 129
|
||||
})
|
||||
.open();
|
||||
|
||||
}
|
||||
|
||||
function getContentCSS() {
|
||||
return {height: 49 + files.length * 16 + 'px'}
|
||||
}
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Form Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/form.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,107 +0,0 @@
|
|||
Ox.load('UI', {debug: true}, function() {
|
||||
|
||||
var $items = [
|
||||
Ox.Input({
|
||||
id: 'name',
|
||||
label: 'Name',
|
||||
labelWidth: 64,
|
||||
width: 240
|
||||
}),
|
||||
Ox.Input({
|
||||
id: 'geoname',
|
||||
label: 'Geoname',
|
||||
labelWidth: 64,
|
||||
width: 240
|
||||
}),
|
||||
Ox.ArrayInput({
|
||||
id: 'alternativeNames',
|
||||
label: 'Alternative Names',
|
||||
max: 10,
|
||||
//sort: true,
|
||||
values: [],
|
||||
width: 240
|
||||
}),
|
||||
Ox.Input({
|
||||
decimals: 8,
|
||||
id: 'lat',
|
||||
label: 'Latitude',
|
||||
labelWidth: 80,
|
||||
max: Ox.MAX_LATITUDE,
|
||||
min: Ox.MIN_LATITUDE,
|
||||
type: 'float',
|
||||
width: 240
|
||||
}),
|
||||
Ox.Input({
|
||||
decimals: 8,
|
||||
id: 'lng',
|
||||
label: 'Longitude',
|
||||
labelWidth: 80,
|
||||
max: 180,
|
||||
min: -180,
|
||||
type: 'float',
|
||||
width: 240
|
||||
})
|
||||
],
|
||||
$bar = Ox.Bar({
|
||||
size: 24
|
||||
}),
|
||||
$button = Ox.Button({
|
||||
id: 'submit',
|
||||
title: 'check',
|
||||
type: 'image'
|
||||
})
|
||||
.css({
|
||||
float: 'right',
|
||||
margin: '4px'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$foo.html(JSON.stringify($form.values()))
|
||||
}
|
||||
})
|
||||
.appendTo($bar),
|
||||
$container = Ox.Container(),
|
||||
$foo = Ox.Element(),
|
||||
$form = Ox.Form({
|
||||
items: $items
|
||||
})
|
||||
.css({
|
||||
padding: '8px'
|
||||
})
|
||||
.appendTo($container);
|
||||
|
||||
Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $container
|
||||
},
|
||||
{
|
||||
element: $bar,
|
||||
size: 24
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$items.forEach(function($item) {
|
||||
$item.options({width: size - 16});
|
||||
});
|
||||
}
|
||||
}),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: $foo
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo(Ox.UI.$body);
|
||||
|
||||
});
|
|
@ -1,77 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>color</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="../../build/css/ox.ui.css"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/form.css"/>
|
||||
<script type="text/javascript" src="../../build/js/jquery-1.4.2.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.data.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.ui.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var $body = $("body"),
|
||||
$ranges = [],
|
||||
color = [255, 0, 0],
|
||||
rgb = ["red", "green", "blue"],
|
||||
$color = new Ox.Label({
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
height: "46px",
|
||||
background: getColor()
|
||||
})
|
||||
.appendTo($body);
|
||||
$.each(Ox.range(3), function(i) {
|
||||
var colors = getColors(i);
|
||||
$ranges[i] = new Ox.Range({
|
||||
arrows: true,
|
||||
changeOnDrag: true,
|
||||
id: rgb[i],
|
||||
max: 255,
|
||||
size: 256,
|
||||
thumbSize: 40,
|
||||
thumbValue: true,
|
||||
trackColors: colors,
|
||||
value: color[i]
|
||||
})
|
||||
.css({
|
||||
marginBottom: "-4px"
|
||||
})
|
||||
.bindEvent("change", function(event, data) {
|
||||
change(i, data.value);
|
||||
})
|
||||
.appendTo($body);
|
||||
});
|
||||
function change(index, value) {
|
||||
color[index] = value;
|
||||
$color.css({
|
||||
background: getColor()
|
||||
});
|
||||
$.each(Ox.range(3), function(i) {
|
||||
if (i != index) {
|
||||
$ranges[i].options({
|
||||
trackColors: getColors(i)
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
function getColor() {
|
||||
return "rgb(" + color.join(", ") + ")";
|
||||
}
|
||||
function getColors(index) {
|
||||
return [
|
||||
"rgb(" + $.map(Ox.range(3), function(v) {
|
||||
return v == index ? 0 : color[v];
|
||||
}).join(", ") + ")",
|
||||
"rgb(" + $.map(Ox.range(3), function(v) {
|
||||
return v == index ? 255 : color[v];
|
||||
}).join(", ") + ")"
|
||||
]
|
||||
}
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,17 +0,0 @@
|
|||
body {
|
||||
overflow: hidden;
|
||||
}
|
||||
#panel {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
padding: 4px;
|
||||
//background: rgb(240, 240, 240);
|
||||
overflow: auto;
|
||||
}
|
||||
.margin {
|
||||
float: left;
|
||||
margin: 4px;
|
||||
}
|
|
@ -1,44 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>test</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="../../build/css/ox.ui.css"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/form.css"/>
|
||||
<script type="text/javascript" src="../../build/js/jquery-1.4.2.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.data.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/ox.ui.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var fn = function() {
|
||||
alert("OK");
|
||||
},
|
||||
$button = new Ox.Button({id: "button", title: "Button"})
|
||||
.appendTo($("body")),
|
||||
$bind = new Ox.Button({id: "bind", title: "Bind"})
|
||||
.bindEvent("click", function() {
|
||||
Ox.print("Click Bind")
|
||||
Ox.Event.bind($button.options("id"), "click", fn);
|
||||
})
|
||||
.appendTo($("body")),
|
||||
$unbind = new Ox.Button({id: "unbind", title: "Unbind"})
|
||||
.bindEvent("click", function() {
|
||||
Ox.print("Click Unbind")
|
||||
Ox.Event.unbind($button.options("id"), "click", fn);
|
||||
})
|
||||
.appendTo($("body")),
|
||||
$change = new Ox.Button({id: "change", title: "Change ID"})
|
||||
.bindEvent("click", function() {
|
||||
Ox.print("Click Change ID")
|
||||
$button.options({
|
||||
id: "button2",
|
||||
title: "Button 2"
|
||||
});
|
||||
})
|
||||
.appendTo($("body"));
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>ox.js form demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/form.css"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/form.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
Before Width: | Height: | Size: 204 KiB |
Before Width: | Height: | Size: 200 KiB |
Before Width: | Height: | Size: 179 KiB |
Before Width: | Height: | Size: 220 KiB |
Before Width: | Height: | Size: 114 KiB |
Before Width: | Height: | Size: 92 KiB |
Before Width: | Height: | Size: 232 KiB |
Before Width: | Height: | Size: 196 KiB |
Before Width: | Height: | Size: 217 KiB |
Before Width: | Height: | Size: 225 KiB |
Before Width: | Height: | Size: 17 KiB |
|
@ -1,22 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
</head>
|
||||
<body>
|
||||
<div><label for="foo">Foo</label><input id="foo" type="text" onChange="alert('change')"/><label>Just a label</label></div>
|
||||
<div><label for="foobar">FooBar</label><input id="foobar" type="checkbox"/><label for="foobar">FooBar</label></div>
|
||||
<div><label for="bar">Bar</label><input id="bar" type="text"/></div>
|
||||
<fieldset>
|
||||
<legend>Legend</legend>
|
||||
<div><input id="one" name="name" type="radio" value="one"/><label for="one">one</label></div>
|
||||
<div><label for="foo">Foo</label><input id="foo" type="text"/><label>Just a label</label></div>
|
||||
<div><input id="two" name="name" type="radio" value="two"/><label for="two">two</label></div>
|
||||
</fieldset>
|
||||
<div><input type="range" max="10" min="0" step="1" value="5" tabindex="1"/></div>
|
||||
<div><input type="password" placeholder="password"/></div>
|
||||
<select>
|
||||
<option>one</option>
|
||||
<option>two</option>
|
||||
</select>
|
||||
</body>
|
||||
</html>
|
|
@ -1,191 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
overflow: hidden;
|
||||
-moz-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
}
|
||||
.map {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
width: 1024px;
|
||||
height: 640px;
|
||||
margin: auto;
|
||||
}
|
||||
.flag {
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
margin-left: -4px;
|
||||
margin-top: -4px;
|
||||
-moz-border-radius: 1px;
|
||||
-webkit-border-radius: 1px;
|
||||
-webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 128);
|
||||
}
|
||||
.flag.hover,
|
||||
.flag:hover {
|
||||
width: 16px;
|
||||
height: 15px;
|
||||
margin-left: -8px;
|
||||
margin-top: -8px;
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 128);
|
||||
z-index: 1000;
|
||||
}
|
||||
</style>
|
||||
<script src="../../build/js/jquery-1.3.2.js"></script>
|
||||
<script src="../../build/js/ox.js"></script>
|
||||
<script src="../../build/js/ox.data.js"></script>
|
||||
<script src="../../build/js/ox.geo.js"></script>
|
||||
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var $body = $("body"),
|
||||
places = Ox.getCountries(true);
|
||||
var $map = $("<img/>")
|
||||
.attr({
|
||||
src: "map.png"
|
||||
})
|
||||
.addClass("map")
|
||||
.appendTo("body")
|
||||
.click(function(e) {
|
||||
var offset = $(this).offset(),
|
||||
left = offset.left,
|
||||
top = offset.top,
|
||||
width = $(this).width(),
|
||||
height = $(this).height(),
|
||||
latLng = Ox.getLatLng((e.clientX - left) / width, (e.clientY - top) / height);
|
||||
Ox.getPlacemarks(latLng.lat, latLng.lng, function(data) {
|
||||
var length = data.results.length;
|
||||
Ox.print(data)
|
||||
if (length && data.results[length - 1].types[0] == "country") {
|
||||
var $img = $("#" + data.results[length - 1].address_components[0].short_name);
|
||||
if (!$img.length) {
|
||||
Ox.getPlacemarks(data.results[length - 1].formatted_address, function(data) {
|
||||
if (data.results.length) {
|
||||
var location = data.results[0].geometry.location,
|
||||
xy = Ox.getXY(location.lat(), location.lng());
|
||||
//Ox.print(+new Date, place.name, location, xy);
|
||||
var $img = $("<img/>")
|
||||
.attr({
|
||||
id: data.results[0].address_components[0].short_name,
|
||||
src: "../../tools/flags/png/square/" + data.results[0].address_components[0].short_name + ".png",
|
||||
title: data.results[0].formatted_address
|
||||
})
|
||||
.addClass("flag hover")
|
||||
.css({
|
||||
left: left + (xy.x * width) + "px",
|
||||
top: top + (xy.y * height) + "px"
|
||||
})
|
||||
.mouseenter(function() {
|
||||
$(this).css({
|
||||
zIndex: Ox.uid()
|
||||
});
|
||||
})
|
||||
.dblclick(function() {
|
||||
$(this).remove();
|
||||
})
|
||||
.appendTo($body);
|
||||
setTimeout(function() {
|
||||
$img.removeClass("hover");
|
||||
}, 1000);
|
||||
} else {
|
||||
//Ox.print("no results", place, data)
|
||||
}
|
||||
});
|
||||
} else {
|
||||
$img.addClass("hover");
|
||||
setTimeout(function() {
|
||||
$img.removeClass("hover");
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
// /*
|
||||
var aliases = {
|
||||
"Ascension Island": "Ascension Island, Saint Helena",
|
||||
"England": "England, United Kingdom",
|
||||
"Georgia": "Georgia, Europe",
|
||||
"Holy See": "Vatican City",
|
||||
"Palestine": "West Bank",
|
||||
"Saint Martin": "Sint Maarten",
|
||||
"Scotland": "Scotland, United Kingdom",
|
||||
"Svalbard and Jan Mayen": "Svalbard",
|
||||
"Wales": "Wales, United Kingdom",
|
||||
"Yugoslavia": "Serbia"
|
||||
};
|
||||
var json = [];
|
||||
setTimeout(function() {
|
||||
getPlacemarks(places);
|
||||
}, 1000);
|
||||
function getPlacemarks(places) {
|
||||
var place = places.shift();
|
||||
Ox.getPlacemarks(aliases[place.name] || place.name, function(data) {
|
||||
if (data.results.length) {
|
||||
var location = data.results[0].geometry.location,
|
||||
xy = Ox.getXY(location.lat(), location.lng()),
|
||||
offset = $map.offset(),
|
||||
left = offset.left,
|
||||
top = offset.top,
|
||||
width = $map.width(),
|
||||
height = $map.height();
|
||||
$("<img/>")
|
||||
.attr({
|
||||
src: "../../tools/flags/png/square/" + (place.flag.indexOf("-") == 2 ? place.flag.substr(0, 2) + "/" : "") + place.flag + ".png",
|
||||
title: place.code + " " + place.name
|
||||
})
|
||||
.addClass("flag")
|
||||
.css({
|
||||
left: left + (xy.x * width) + "px",
|
||||
top: top + (xy.y * height) + "px"
|
||||
})
|
||||
.mouseenter(function() {
|
||||
$(this).css({
|
||||
zIndex: Ox.uid()
|
||||
});
|
||||
})
|
||||
.appendTo($body);
|
||||
d = {
|
||||
name: data.results[0].formatted_address,
|
||||
center: {
|
||||
lat: data.results[0].geometry.viewport.getCenter().lat().toFixed(10),
|
||||
lng: data.results[0].geometry.viewport.getCenter().lng().toFixed(10)
|
||||
},
|
||||
southWest: {
|
||||
lat: data.results[0].geometry.viewport.getSouthWest().lat().toFixed(10),
|
||||
lng: data.results[0].geometry.viewport.getSouthWest().lng().toFixed(10)
|
||||
},
|
||||
northEast: {
|
||||
lat: data.results[0].geometry.viewport.getNorthEast().lat().toFixed(10),
|
||||
lng: data.results[0].geometry.viewport.getNorthEast().lng().toFixed(10)
|
||||
}
|
||||
};
|
||||
Ox.print(JSON.stringify(d))
|
||||
json.push(d);
|
||||
} else {
|
||||
Ox.print("no results", place, data)
|
||||
}
|
||||
});
|
||||
if (places.length) {
|
||||
setTimeout(function() {
|
||||
getPlacemarks(places);
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
$("body").append($("<div/>").html(JSON.stringify(json)));
|
||||
// */
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
Before Width: | Height: | Size: 1.4 MiB |
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Geo Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/geo.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,51 +0,0 @@
|
|||
Ox.documentReady(function() {
|
||||
var image = new Image();
|
||||
image.onload = function() {
|
||||
var c = Ox.canvas(image),
|
||||
point = {lat: 40.725342, lng: -73.996824}, // Broadway & Houston, NY
|
||||
circles = Ox.range(1, 16).map(function(i) {
|
||||
return Ox.getCircle(
|
||||
point,
|
||||
i * Ox.EARTH_CIRCUMFERENCE / 2 / 16,
|
||||
8
|
||||
);
|
||||
}),
|
||||
lines = Ox.range(16).map(function(i) {
|
||||
return Ox.getLine(
|
||||
point,
|
||||
Ox.getPoint(point, Ox.EARTH_CIRCUMFERENCE / 2 - 1000, i * 360 / 16),
|
||||
8
|
||||
);
|
||||
});
|
||||
function drawLine(pointA, pointB) {
|
||||
var xyA, xyB;
|
||||
if (Math.abs(pointA.lng - pointB.lng) < 180) {
|
||||
xyA = getXY(pointA);
|
||||
xyB = getXY(pointB);
|
||||
c.context.moveTo(xyA.x, xyA.y);
|
||||
c.context.lineTo(xyB.x, xyB.y);
|
||||
c.context.stroke();
|
||||
}
|
||||
}
|
||||
function drawPath(points, close) {
|
||||
points.forEach(function(point, i) {
|
||||
i && drawLine(points[i - 1], point);
|
||||
});
|
||||
close && drawLine(points[points.length - 1], points[0])
|
||||
}
|
||||
function getXY(point) {
|
||||
return Ox.map(Ox.getXYByLatLng(point), function(v) {
|
||||
return v * 1024;
|
||||
});
|
||||
}
|
||||
document.body.appendChild(c.canvas);
|
||||
c.context.strokeStyle = 'rgb(255, 0, 0)';
|
||||
circles.forEach(function(points) {
|
||||
drawPath(points, true);
|
||||
});
|
||||
lines.forEach(function(points) {
|
||||
drawPath(points);
|
||||
});
|
||||
}
|
||||
image.src = 'png/earth1024.png';
|
||||
});
|
Before Width: | Height: | Size: 1.5 MiB |
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>ox.js list demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/list.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,63 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
Ox.Theme('modern');
|
||||
|
||||
var $treeList = new Ox.TreeList({
|
||||
items: [
|
||||
{id: 'D', title: 'D', items: [
|
||||
{id: 'debord', title: 'Guy Debord', items: [
|
||||
{id: 'in_girum', title: 'In girum imus nocte et consumimur igni'}
|
||||
]}
|
||||
]},
|
||||
{id: 'G', title: 'G', expanded: true, items: [
|
||||
{id: 'godard', title: 'Jean-Luc Godard', expanded: true, items: [
|
||||
{id: 'allemagne_90', title: 'Allemagne 90 neuf zero'},
|
||||
{id: 'film_socialisme', title: 'Film socialisme'}
|
||||
]},
|
||||
{id: 'grandrieux', title: 'Philippe Grandrieux', items: [
|
||||
{id: 'sombre', title: 'Sombre'}
|
||||
]}
|
||||
]},
|
||||
{id: 'H', title: 'H', items: [
|
||||
{id: 'haynes', title: 'Todd Haynes', items: [
|
||||
{id: 'far_from_heaven', title: 'Far From Heaven'},
|
||||
{id: 'i_m_not_there', title: 'I\'m Not There'}
|
||||
]}
|
||||
]},
|
||||
{id: 'L', title: 'L', items: [
|
||||
{id: 'lynch', title: 'David Lynch', items: [
|
||||
{id: 'inland_empire', title: 'Inland Empire'}
|
||||
]}
|
||||
]},
|
||||
{id: 'S', title: 'S', items: [
|
||||
{id: 'scorsese', title: 'Martin Scorsese', items: [
|
||||
{id: 'casino', title: 'Casino'}
|
||||
]}
|
||||
]}
|
||||
]
|
||||
}),
|
||||
$debug = new Ox.Element('div'),
|
||||
$button = new Ox.Button({
|
||||
title: 'Debug'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$text.html(JSON.stringify($treeList.$element.options('items')));
|
||||
}
|
||||
})
|
||||
.appendTo($debug),
|
||||
$text = new Ox.Element('div').appendTo($debug),
|
||||
$splitPanel = new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $treeList,
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: $debug
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo($('body'));
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS ListMap Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/listmap.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,45 +0,0 @@
|
|||
Ox.load({UI: {}, Geo: {}}, function() {
|
||||
|
||||
$listmap = new Ox.ListMap({
|
||||
height: window.innerHeight,
|
||||
places: Ox.COUNTRIES.map(function(place) {
|
||||
return {
|
||||
alternativeNames: Ox.compact([place.google, place.imdb, place.wikipedia]),
|
||||
area: place.area,
|
||||
countryCode: place.code,
|
||||
editable: true,
|
||||
flag: place.code,
|
||||
geoname: place.name,
|
||||
id: place.code,
|
||||
markerColor: Ox.getGeoColor(place.region),
|
||||
name: place.name,
|
||||
type: 'country',
|
||||
lat: place.lat,
|
||||
lng: place.lng,
|
||||
south: place.south,
|
||||
west: place.west,
|
||||
north: place.north,
|
||||
east: place.east
|
||||
};
|
||||
}),
|
||||
width: window.innerWidth
|
||||
})
|
||||
.bindEvent({
|
||||
geocode: function(event, data) {
|
||||
Ox.print(event)
|
||||
Ox.print(JSON.stringify(data))
|
||||
}
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
$(window).resize(function() {
|
||||
Ox.print('RESIZE', window.innerHeight)
|
||||
$listmap.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth
|
||||
});
|
||||
});
|
||||
|
||||
window.$listmap = $listmap;
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS ListMap Demo (async)</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/listmap.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,207 +0,0 @@
|
|||
Ox.load({UI: {
|
||||
debug: true,
|
||||
hideScreen: true,
|
||||
showScreen: true,
|
||||
theme: 'modern'
|
||||
}, Geo: {}}, function() {
|
||||
|
||||
Ox.getJSON('json/cities50000.json', function(cities) {
|
||||
|
||||
var places = cities.map(function(city, i) {
|
||||
var area = Math.max(city.population, 1) * 100,
|
||||
geoname = city.name + ', ' + Ox.getCountryByCode(city.country_code).name,
|
||||
latSize = Math.sqrt(area) / Ox.EARTH_CIRCUMFERENCE * 360,
|
||||
lngSize = Math.sqrt(area) * Ox.getDegreesPerMeter(city.latitude),
|
||||
marker = city.population > 10000000 ? {size: 24, color: [255, 0, 0]}
|
||||
: city.population > 5000000 ? {size: 22, color: [255, 32, 0]}
|
||||
: city.population > 2000000 ? {size: 20, color: [255, 64, 0]}
|
||||
: city.population > 1000000 ? {size: 18, color: [255, 96, 0]}
|
||||
: city.population > 500000 ? {size: 16, color: [255, 128, 0]}
|
||||
: city.population > 200000 ? {size: 14, color: [255, 160, 0]}
|
||||
: city.population > 100000 ? {size: 12, color: [255, 192, 0]}
|
||||
: city.population > 50000 ? {size: 10, color: [255, 224, 0]}
|
||||
: {size: 8, color: [255, 255, 0]};
|
||||
return {
|
||||
alternativeNames: [],
|
||||
area: area,
|
||||
countryCode: city.country_code,
|
||||
editable: true,
|
||||
geoname: geoname,
|
||||
geonameSort: getGeonameSort(geoname),
|
||||
id: Ox.encodeBase32(Ox.uid()),
|
||||
markerColor: marker.color,
|
||||
markerSize: marker.size,
|
||||
name: city.name,
|
||||
type: 'city',
|
||||
lat: city.latitude,
|
||||
lng: city.longitude,
|
||||
south: city.latitude - latSize / 2,
|
||||
west: city.longitude - lngSize / 2,
|
||||
north: city.latitude + latSize / 2,
|
||||
east: city.longitude + lngSize / 2
|
||||
};
|
||||
});
|
||||
|
||||
var $listmap = new Ox.ListMap({
|
||||
addPlace: function(data, callback) {
|
||||
var id = Ox.encodeBase32(Ox.uid());
|
||||
Ox.print('addplace', getGeonameSort(data.geoname));
|
||||
places.push(Ox.extend(data, {
|
||||
geonameSort: getGeonameSort(data.geoname),
|
||||
id: id
|
||||
}));
|
||||
callback({
|
||||
data: {id: id},
|
||||
result: {code: 200, text: 'OK'}
|
||||
});
|
||||
},
|
||||
editPlace: function(data, callback) {
|
||||
var place = Ox.getObjectById(places, data.id);
|
||||
Ox.forEach(data, function(value, key) {
|
||||
place[key] = value;
|
||||
if (key == 'geoname') {
|
||||
place.geonameSort = getGeonameSort(place.geoname);
|
||||
}
|
||||
});
|
||||
callback({
|
||||
result: {code: 200, text: 'OK'}
|
||||
});
|
||||
},
|
||||
height: window.innerHeight,
|
||||
places: function(options, callback) {
|
||||
// this simulates a remote API
|
||||
Ox.print('OPTIONS', options)
|
||||
var data = {};
|
||||
// query, sort, range, area
|
||||
if (Ox.isEmpty(options)) {
|
||||
data = {
|
||||
area: {
|
||||
south: 90,
|
||||
west: 180,
|
||||
north: -90,
|
||||
east: -180
|
||||
},
|
||||
items: places.length
|
||||
};
|
||||
places.forEach(function(place) {
|
||||
['south', 'west', 'north', 'east'].forEach(function(v) {
|
||||
if (
|
||||
((v == 'south' || v == 'west') && place[v] < data[v])
|
||||
|| ((v == 'north' || v == 'east') && place[v] > data[v])
|
||||
) {
|
||||
data[v] = place[v];
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
data.items = places;
|
||||
if (options.query) {
|
||||
if (options.query.conditions[0].key == 'id') {
|
||||
data.items = data.items.filter(function(place) {
|
||||
return place.id == options.query.conditions[0].value;
|
||||
});
|
||||
} else {
|
||||
Ox.print('query', options)
|
||||
data.items = data.items.filter(function(place) {
|
||||
var ret = true;
|
||||
options.query.conditions.forEach(function(condition) {
|
||||
if (condition.operator == '-') {
|
||||
if (
|
||||
place[condition.key] < condition.value[0]
|
||||
|| place[condition.key] > condition.value[1]
|
||||
) {
|
||||
ret = false;
|
||||
}
|
||||
} else { // '!-'
|
||||
if (
|
||||
place[condition.key] > condition.value[0]
|
||||
&& place[condition.key] < condition.value[1]
|
||||
) {
|
||||
ret = false;
|
||||
}
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
return ret;
|
||||
});
|
||||
}
|
||||
}
|
||||
data.items.sort(function(a, b) {
|
||||
if (options.sort[0].key == 'geoname') {
|
||||
aValue = a.geonameSort;
|
||||
bValue = b.geonameSort;
|
||||
} else {
|
||||
aValue = a[options.sort[0].key];
|
||||
bValue = b[options.sort[0].key];
|
||||
}
|
||||
var ret = 0;
|
||||
if (
|
||||
(options.sort[0].operator == '+' && aValue < bValue)
|
||||
|| (options.sort[0].operator == '-' && aValue > bValue)
|
||||
) {
|
||||
ret = -1;
|
||||
} else if (
|
||||
(options.sort[0].operator == '+' && aValue > bValue)
|
||||
|| (options.sort[0].operator == '-' && aValue < bValue)
|
||||
) {
|
||||
ret = 1;
|
||||
}
|
||||
return ret;
|
||||
});
|
||||
if (options.ids) {
|
||||
data.positions = {};
|
||||
data.items.forEach(function(place, i) {
|
||||
if (options.ids.indexOf(place.id) > -1) {
|
||||
data.positions[place.id] = i;
|
||||
}
|
||||
});
|
||||
delete data.items;
|
||||
} else if (options.range) {
|
||||
data.items = data.items.filter(function(place, i) {
|
||||
return i >= options.range[0] && i < options.range[1];
|
||||
});
|
||||
}
|
||||
}
|
||||
Ox.print('DATA', data)
|
||||
callback({
|
||||
data: data,
|
||||
result: {code: 200, text: 'OK'}
|
||||
});
|
||||
},
|
||||
removePlace: function(data, callback) {
|
||||
var i = Ox.getPositionById(places, data.id);
|
||||
places.splice(i, 1);
|
||||
callback();
|
||||
},
|
||||
//showTypes: true,
|
||||
width: window.innerWidth
|
||||
})
|
||||
.bindEvent({
|
||||
geocode: function(event, data) {
|
||||
//Ox.print(data);
|
||||
Ox.print(JSON.stringify(data.results))
|
||||
}
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
$(window).resize(function() {
|
||||
Ox.print('RESIZE', window.innerHeight)
|
||||
$listmap.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth
|
||||
});
|
||||
});
|
||||
|
||||
window.$listmap = $listmap;
|
||||
|
||||
function getGeonameSort(geoname) {
|
||||
var names = geoname.split(', ');
|
||||
if (!Ox.getCountryByGeoname(names[names.length - 1])) {
|
||||
names.push('~');
|
||||
}
|
||||
return names.reverse().join(', ');
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>ox.js map demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/map.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,130 +0,0 @@
|
|||
Ox.load('UI', {debug: true}, function() {
|
||||
|
||||
Ox.load('Geo', function() {
|
||||
|
||||
var width = window.innerWidth - 256,
|
||||
height = window.innerHeight,
|
||||
map = new Ox.Map({
|
||||
clickable: true,
|
||||
editable: true,
|
||||
height: height,
|
||||
places: Ox.COUNTRIES.map(function(place) {
|
||||
return Ox.extend({
|
||||
countryCode: place.code,
|
||||
editable: true,
|
||||
flag: place.code,
|
||||
geoname: place.name,
|
||||
name: place.name,
|
||||
size: place.size,
|
||||
type: 'Country',
|
||||
lat: place.lat,
|
||||
lng: place.lng,
|
||||
south: place.south,
|
||||
west: place.west,
|
||||
north: place.north,
|
||||
east: place.east
|
||||
});
|
||||
}),
|
||||
/*
|
||||
[
|
||||
{
|
||||
editable: true,
|
||||
flag: 'UK',
|
||||
geoname: 'Westminster, London, UK',
|
||||
name: 'London',
|
||||
//lat: 51.5001524,
|
||||
lat: 51.52670875,
|
||||
lng: -0.1262362,
|
||||
south: 51.3493528,
|
||||
west: -0.378358,
|
||||
north: 51.7040647,
|
||||
east: 0.1502295
|
||||
},
|
||||
{
|
||||
editable: false,
|
||||
flag: 'FR',
|
||||
geoname: 'Paris, France',
|
||||
name: 'Paris',
|
||||
lat: 48.8566667,
|
||||
lng: 2.3509871,
|
||||
south: 48.8155414,
|
||||
west: 2.2241006,
|
||||
north: 48.9021461,
|
||||
east: 2.4699099,
|
||||
}
|
||||
],
|
||||
*/
|
||||
showLabels: true,
|
||||
statusbar: true,
|
||||
toolbar: true,
|
||||
width: width,
|
||||
zoombar: true
|
||||
})
|
||||
.bindEvent({
|
||||
resize: function(event, data) {
|
||||
map.resizeMap();
|
||||
},
|
||||
selectplace: function(event, data) {
|
||||
Ox.print('DATA', data)
|
||||
panel.replaceElement(1, list = new Ox.TreeList({
|
||||
data: Ox.isEmpty(data) ? [] : {
|
||||
area: data.area,
|
||||
components: data.components,
|
||||
countryCode: data.countryCode,
|
||||
crossesDateline: data.crossesDateline(),
|
||||
east: data.east,
|
||||
fullGeoname: data.fullGeoname,
|
||||
geoname: data.geoname,
|
||||
lat: data.lat,
|
||||
lng: data.lng,
|
||||
name: data.name,
|
||||
north: data.north,
|
||||
sizeEastWest: data.sizeEastWest,
|
||||
sizeNorthSouth: data.sizeNorthSouth,
|
||||
south: data.south,
|
||||
west: data.west,
|
||||
type: data.type
|
||||
}
|
||||
}));
|
||||
}
|
||||
});
|
||||
|
||||
list = new Ox.TreeList({
|
||||
data: [],
|
||||
width: 256
|
||||
})
|
||||
panel = new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: map
|
||||
},
|
||||
{
|
||||
element: list,
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
.appendTo($('body'));
|
||||
|
||||
|
||||
//setTimeout(function() {
|
||||
//map.appendTo($('body'));
|
||||
map.gainFocus();
|
||||
//}, 2000)
|
||||
|
||||
|
||||
/*
|
||||
$(window).resize(function() {
|
||||
map.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth - 256
|
||||
});
|
||||
});
|
||||
*/
|
||||
|
||||
});
|
||||
|
||||
});
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Map Demo (async)</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/map.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,117 +0,0 @@
|
|||
Ox.load('UI', {debug: true, theme: 'modern'}, function() {
|
||||
|
||||
Ox.load('Geo', function() {
|
||||
|
||||
Ox.getJSON('json/cities100000.json', function(cities) {
|
||||
|
||||
var places = cities.map(function(city, i) {
|
||||
var countryCode = city.country_code == 'XK' ? 'RS-KO' : city.country_code,
|
||||
marker = city.population > 20000000 ? {size: 24, color: [255, 0, 0]} :
|
||||
city.population > 10000000 ? {size: 22, color: [255, 32, 0]} :
|
||||
city.population > 5000000 ? {size: 20, color: [255, 64, 0]} :
|
||||
city.population > 2000000 ? {size: 18, color: [255, 96, 0]} :
|
||||
city.population > 1000000 ? {size: 16, color: [255, 128, 0]} :
|
||||
city.population > 500000 ? {size: 14, color: [255, 160, 0]} :
|
||||
city.population > 200000 ? {size: 12, color: [255, 192, 0]} :
|
||||
city.population > 100000 ? {size: 10, color: [255, 224, 0]} :
|
||||
{size: 8, color: [255, 255, 0]},
|
||||
area = Math.sqrt(city.population * 100),
|
||||
latSize = area / Ox.EARTH_CIRCUMFERENCE * 360,
|
||||
lngSize = area * Ox.getDegreesPerMeter(city.latitude);
|
||||
return {
|
||||
alternativeNames: [],
|
||||
area: city.population * 100,
|
||||
countryCode: countryCode,
|
||||
editable: true,
|
||||
flag: countryCode,
|
||||
geoname: city.name + ', ' + Ox.getCountryByCode(countryCode).name,
|
||||
id: Ox.encodeBase32(i),
|
||||
markerColor: marker.color,
|
||||
markerSize: marker.size,
|
||||
name: city.name,
|
||||
type: 'city',
|
||||
lat: city.latitude,
|
||||
lng: city.longitude,
|
||||
south: city.latitude - latSize / 2,
|
||||
west: city.longitude - lngSize / 2,
|
||||
north: city.latitude + latSize / 2,
|
||||
east: city.longitude + lngSize / 2
|
||||
};
|
||||
});
|
||||
|
||||
var $map = new Ox.Map({
|
||||
height: window.innerHeight,
|
||||
places: function(options, callback) {
|
||||
// this simulates a remote API
|
||||
Ox.print('OPTIONS', options)
|
||||
var data = {};
|
||||
// query, sort, range, area
|
||||
if (Ox.isEmpty(options)) {
|
||||
data = {
|
||||
items: places.length,
|
||||
south: 90,
|
||||
west: 180,
|
||||
north: -90,
|
||||
east: -180
|
||||
};
|
||||
places.forEach(function(place) {
|
||||
['south', 'west', 'north', 'east'].forEach(function(v) {
|
||||
if (
|
||||
((v == 'south' || v == 'west') && place[v] < data[v])
|
||||
|| ((v == 'north' || v == 'east') && place[v] > data[v])
|
||||
) {
|
||||
data[v] = place[v];
|
||||
}
|
||||
});
|
||||
});
|
||||
} else {
|
||||
data.items = places;
|
||||
if (options.query) {
|
||||
|
||||
}
|
||||
if (options.area) {
|
||||
data.items = data.items.filter(function(place) {
|
||||
// fixme: fails if crosses dateline
|
||||
return place.lat > options.area.south
|
||||
&& place.lat < options.area.north
|
||||
&& place.lng > options.area.west
|
||||
&& place.lng < options.area.east;
|
||||
});
|
||||
}
|
||||
if (options.sort[0].key == 'area') {
|
||||
data.items.sort(function(a, b) {
|
||||
return b.area - a.area;
|
||||
});
|
||||
}
|
||||
if (options.range) {
|
||||
data.items = data.items.filter(function(place, i) {
|
||||
return i >= options.range[0] && i < options.range[1];
|
||||
});
|
||||
}
|
||||
}
|
||||
Ox.print('DATA', data)
|
||||
callback({
|
||||
data: data,
|
||||
result: {code: 200, text: 'OK'}
|
||||
});
|
||||
},
|
||||
statusbar: true,
|
||||
toolbar: true,
|
||||
width: window.innerWidth
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
$(window).resize(function() {
|
||||
Ox.print('RESIZE', window.innerHeight)
|
||||
$map.options({
|
||||
height: window.innerHeight,
|
||||
width: window.innerWidth
|
||||
});
|
||||
});
|
||||
|
||||
window.$map = $map;
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
});
|
|
@ -1,22 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<style>
|
||||
</style>
|
||||
<script type="text/javascript" src="../../build/js/jquery.js"></script>
|
||||
<script type="text/javascript" src="../../build/js/Ox.js"></script>
|
||||
<script type="text/javascript" src="ox.png.js"></script>
|
||||
<script>
|
||||
$(function() {
|
||||
var png = new Ox.PNG("http://khm0.google.com/kh/v=46&x=0&y=0&z=0");
|
||||
png.load(function() {
|
||||
Ox.print(png.getChunks());
|
||||
Ox.print(png.getSize());
|
||||
png.appendTo("body")
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,125 +0,0 @@
|
|||
Ox = Ox || {};
|
||||
|
||||
(function() {
|
||||
|
||||
Ox.PNG = function(url) {
|
||||
var that = this,
|
||||
self = {};
|
||||
self.getCanvas = function() {
|
||||
var canvas = $("<canvas/>")
|
||||
.attr({
|
||||
width: that.width,
|
||||
height: that.height
|
||||
})[0],
|
||||
context = canvas.getContext("2d");
|
||||
context.drawImage(self.$png[0], 0, 0);
|
||||
return {
|
||||
canvas: canvas,
|
||||
context: context
|
||||
};
|
||||
};
|
||||
self.getChunks = function() {
|
||||
var data = self.getData().substr(8),
|
||||
length, chunks = [];
|
||||
while (data) {
|
||||
length = data.charCodeAt(1) << 16 |
|
||||
data.charCodeAt(2) << 8 |
|
||||
data.charCodeAt(3);
|
||||
chunks.push({
|
||||
length: length,
|
||||
type: data.substr(4, 4),
|
||||
data: data.substr(8, length),
|
||||
crc: data.substr(length + 8, 4)
|
||||
});
|
||||
data = data.substr(length + 12);
|
||||
}
|
||||
return chunks;
|
||||
}
|
||||
self.getData = function() {
|
||||
return atob(self.getURL().split(",")[1]);
|
||||
}
|
||||
self.getDimensions = function() {
|
||||
var dimensions;
|
||||
self.$png
|
||||
.hide()
|
||||
.appendTo($("body"));
|
||||
dimensions = {
|
||||
width: self.$png.width(),
|
||||
height: self.$png.height()
|
||||
}
|
||||
self.$png.remove();
|
||||
return dimensions;
|
||||
}
|
||||
self.getHeader = function() {
|
||||
return self.getData().substr(0, 8);
|
||||
}
|
||||
self.getURL = function() {
|
||||
return that.canvas.toDataURL();
|
||||
}
|
||||
self.onLoad = function($png, callback) {
|
||||
self.$png = $png;
|
||||
var dimensions = self.getDimensions();
|
||||
that.width = dimensions.width;
|
||||
that.height = dimensions.height;
|
||||
var canvas = self.getCanvas();
|
||||
that.context = canvas.context;
|
||||
that.canvas = canvas.canvas;
|
||||
Ox.print(self.getChunks())
|
||||
callback();
|
||||
};
|
||||
that.addChunk = function(options) {
|
||||
options = $.extend({
|
||||
data: "",
|
||||
type: "",
|
||||
position: -1
|
||||
}, options);
|
||||
var len = options.data.length,
|
||||
randomType = !options.type,
|
||||
chunks = self.getChunks();
|
||||
chunk = {
|
||||
length: 0,
|
||||
type: options.type || "",
|
||||
data: options.data,
|
||||
crc: ""
|
||||
},
|
||||
data = "";
|
||||
i;
|
||||
// 0 1 2 3 4 ... length: 6
|
||||
// IHDR IDAT IDAT IDAT ifOo IEND
|
||||
options.position = options.position < 0 ?
|
||||
Math.max(chunks.length - 1 - options.position, 0) :
|
||||
Math.min(options.position, chunks.length - 2);
|
||||
for (i = 0; i < 4; i++) {
|
||||
if (randomType) {
|
||||
// format abCd (ancillary, private, (reserved), safe-to-copy)
|
||||
chunk.type += String.fromCharCode((i == 2 ? 65 : 97) + Math.random() * 26);
|
||||
}
|
||||
chunk.length += String.fromCharCode(len >> ((3 - i) * 8) & 255);
|
||||
chunk.crc += String.fromCharCode(Math.random() * 256);
|
||||
}
|
||||
chunks.splice(position + 1, 0, chunk);
|
||||
// data = ...
|
||||
}
|
||||
that.appendTo = function(selector) {
|
||||
$("<img/>")
|
||||
.attr({
|
||||
src: self.getURL()
|
||||
})
|
||||
.appendTo(selector);
|
||||
}
|
||||
that.getSize = function() {
|
||||
return self.getData().length;
|
||||
}
|
||||
that.load = function(callback) {
|
||||
$("<img/>")
|
||||
.attr({
|
||||
src: url
|
||||
})
|
||||
.load(function() {
|
||||
self.onLoad($(this), callback);
|
||||
});
|
||||
}
|
||||
return that;
|
||||
};
|
||||
|
||||
})();
|
Before Width: | Height: | Size: 111 KiB |
|
@ -1,91 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>ox.js SplitPanel Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script>
|
||||
Ox.load('UI', {debug: true}, function() {
|
||||
new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element().options({id: 'top'}).css({background: 'yellow'}).html('top').bindEvent('resize', function() { Ox.print('resize top') }),
|
||||
resizable: true,
|
||||
resize: [64, 128, 192],
|
||||
size: 128
|
||||
},
|
||||
{
|
||||
element: new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element().options({id: 'leftleft'}).css({background: 'red'}),
|
||||
resizable: true,
|
||||
resize: [32, 64, 96],
|
||||
size: 64
|
||||
},
|
||||
{
|
||||
element: new Ox.Element().options({id: 'leftright'}).css({background: 'magenta'}),
|
||||
size: 'auto'
|
||||
}
|
||||
],
|
||||
id: 'right',
|
||||
orientation: 'horizontal'
|
||||
}),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: new Ox.Element().options({id: 'center'}).css({background: 'green', overflowY: 'auto'}).html(Ox.repeat('center<br/>', 100)),
|
||||
size: 'auto'
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: new Ox.Element().options({id: 'righttop'}).css({background: 'cyan'}),
|
||||
size: 'auto'
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element().options({id: 'rightbottom'}).css({background: 'blue'}),
|
||||
resizable: true,
|
||||
resize: [32, 64, 96],
|
||||
size: 64
|
||||
}
|
||||
],
|
||||
id: 'right',
|
||||
orientation: 'vertical'
|
||||
}),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
],
|
||||
id: 'middle',
|
||||
orientation: 'horizontal'
|
||||
}),
|
||||
size: 'auto'
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element().options({id: 'bottom'}).css({background: 'orange'}).html('bottom'),
|
||||
resizable: true,
|
||||
resize: [64, 128, 192],
|
||||
size: 128
|
||||
},
|
||||
],
|
||||
orientation: 'vertical'
|
||||
}).appendTo($('body'));
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,133 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS SplitPanel Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script>
|
||||
Ox.load('UI', {debug: true}, function() {
|
||||
function element(options, css) {
|
||||
return Ox.extend({
|
||||
element: Ox.Element().html(JSON.stringify(options))
|
||||
}, options);
|
||||
}
|
||||
new Ox.SplitPanel_({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(0, 0, 255)'})
|
||||
.html('{size: 16}'),
|
||||
size: 16
|
||||
},
|
||||
{
|
||||
element: new Ox.SplitPanel_({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element()
|
||||
.css({backgroundColor: 'rgb(0, 255, 0)'})
|
||||
.html('{collapsible: true, size: 128, resizable: true, resize:[64, 128, 192]}'),
|
||||
size: 128,
|
||||
resizable: true,
|
||||
resize: [64, 128, 192]
|
||||
},
|
||||
{
|
||||
element: new Ox.SplitPanel_({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(128, 128, 255)'})
|
||||
.html('{collapsible: true, size: "10%"}'),
|
||||
size: 24
|
||||
},
|
||||
{
|
||||
element: five = new Ox.SplitPanel_({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 64, 255)'})
|
||||
.bindEvent('anyclick', function() {
|
||||
five.resizeElement(0, '10%');
|
||||
}),
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 96, 255)'})
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 128, 255)'})
|
||||
.bindEvent('anyclick', function() {
|
||||
five.replaceElement(2, Ox.Element())
|
||||
})
|
||||
},
|
||||
{
|
||||
element: new Ox.TreeList({
|
||||
data: Ox.COUNTRIES
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({
|
||||
//position: 'absolute',
|
||||
//display: 'block',
|
||||
//top: 15,
|
||||
//bottom: 0,
|
||||
//height: '200px',
|
||||
overflowY: 'scroll'
|
||||
})
|
||||
.append(
|
||||
Ox.Element()
|
||||
.css({
|
||||
height: '1000px',
|
||||
backgroundColor: 'rgb(255, 192, 255)'
|
||||
})
|
||||
)
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 128, 128)'}),
|
||||
size: 24
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
},
|
||||
{
|
||||
collapsible: true,
|
||||
element: new Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 255, 0)'})
|
||||
.html('{collapsible: true, size: "10%", resizable: true, resize: ["5%", "10%", "15%"]}'),
|
||||
size: 256
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.css({backgroundColor: 'rgb(255, 0, 0)'}),
|
||||
size: 16
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 0,
|
||||
top: 0,
|
||||
right: 0,
|
||||
bottom: 0
|
||||
})
|
||||
.appendTo($('body'));
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Spreadsheet Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/spreadsheet.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,13 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
Ox.Spreadsheet({
|
||||
columnPlaceholder: 'Year',
|
||||
columns: [2009, 2010, 2011],
|
||||
rowPlaceholder: 'Item',
|
||||
rows: ['Foo', 'Bar', 'Baz'],
|
||||
title: 'Spreadsheet'
|
||||
})
|
||||
.css({margin: '16px'})
|
||||
.appendTo(Ox.$body);
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS SyntaxHighlighter Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/syntax.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,69 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'classic'
|
||||
}, function() {
|
||||
|
||||
var $button = Ox.Button({
|
||||
title: 'Run',
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
marginTop: '256px'
|
||||
})
|
||||
.click(function() {
|
||||
$syntaxHighlighter.options({
|
||||
source: $textarea.value()
|
||||
});
|
||||
}),
|
||||
$options = Ox.Element()
|
||||
.append(
|
||||
Ox.FormElementGroup({
|
||||
elements: [
|
||||
'showLineNumbers', 'showPage', 'showLinebreaks', 'showTabs', 'showWhitespace', 'stripComments'
|
||||
].map(function(v, i) {
|
||||
return Ox.Checkbox({
|
||||
overlap: 'right',
|
||||
title: Ox.toDashes(v).split('-').map(function(v) {
|
||||
return Ox.toTitleCase(v);
|
||||
}).join(' '),
|
||||
width: 144
|
||||
}).bindEvent({
|
||||
change: function(event) {
|
||||
v == 'showPage' ?
|
||||
$syntaxHighlighter.options({lineLength: event.checked ? 80 : 0}) :
|
||||
$syntaxHighlighter.options(v, event.checked);
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
),
|
||||
$syntaxHighlighter = Ox.SyntaxHighlighter(),
|
||||
$textarea = Ox.Input({
|
||||
height: 256,
|
||||
type: 'textarea',
|
||||
width: 256
|
||||
})
|
||||
.css({
|
||||
fontFamily: 'Menlo, Monaco, Courier, Courier New'
|
||||
});
|
||||
|
||||
Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element()
|
||||
.append($textarea)
|
||||
.append($button),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: Ox.Container()
|
||||
.append($options)
|
||||
.append($syntaxHighlighter)
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo(Ox.UI.$body)
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Test Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/test.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,112 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'classic'
|
||||
}, function() {
|
||||
Ox.load('Geo', function() {
|
||||
var $div = $('<div>')
|
||||
.css({
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight,
|
||||
overflowY: 'scroll'
|
||||
})
|
||||
.appendTo(Ox.UI.$body),
|
||||
colors = [
|
||||
[[255, 64, 64], [224, 32, 32]],
|
||||
[[64, 192, 64], [32, 160, 32]]
|
||||
],
|
||||
counter = 0,
|
||||
files = [
|
||||
Ox.PATH + 'Ox.js',
|
||||
Ox.PATH + 'Ox.Geo/Ox.Geo.js'
|
||||
],
|
||||
tests = [];
|
||||
files.forEach(function(file) {
|
||||
Ox.test(file, function(fileTests) {
|
||||
tests = Ox.merge(tests, fileTests);
|
||||
if (++counter == files.length) {
|
||||
renderTests();
|
||||
}
|
||||
});
|
||||
});
|
||||
function renderTests() {
|
||||
var total = tests.length,
|
||||
succeeded = tests.filter(function(test) {
|
||||
return test.success;
|
||||
}).length,
|
||||
failed = total - succeeded,
|
||||
names = Ox.unique(tests.map(function(test) {
|
||||
return test.name;
|
||||
})).sort();
|
||||
testsByName = {};
|
||||
tests.forEach(function(test) {
|
||||
if (!(test.name in testsByName)) {
|
||||
testsByName[test.name] = [];
|
||||
}
|
||||
testsByName[test.name].push(test);
|
||||
});
|
||||
getBar(total == succeeded)
|
||||
.html(
|
||||
'<b>' + total + ' tests, ' +
|
||||
succeeded + ' succeeded, ' + failed + ' failed</b>'
|
||||
)
|
||||
.appendTo($div);
|
||||
names.forEach(function(name) {
|
||||
var tests = testsByName[name],
|
||||
total = tests.length,
|
||||
succeeded = tests.filter(function(test) {
|
||||
return test.success;
|
||||
}).length,
|
||||
failed = total - succeeded,
|
||||
classname = name.replace('.', '');
|
||||
getBar(total == succeeded)
|
||||
.html(
|
||||
'<b>' + name + '</b> — ' + total +
|
||||
' test' + (total == 1 ? '' : 's') + ', ' +
|
||||
succeeded + ' succeeded, ' + failed + ' failed</b>'
|
||||
)
|
||||
.click(function() {
|
||||
$('.' + classname).toggle();
|
||||
})
|
||||
.appendTo($div);
|
||||
tests.forEach(function(test) {
|
||||
getBar(test.success, true)
|
||||
.addClass(classname)
|
||||
.html(
|
||||
Ox.repeat(' ', 4) +
|
||||
'<b>> ' + Ox.encodeHTML(test.statement) + ' </b> ==> ' +
|
||||
(test.success ? '' : Ox.encodeHTML(test.actual) + ' !=> ') +
|
||||
Ox.encodeHTML(test.expected)
|
||||
)
|
||||
.hide()
|
||||
.appendTo($div);
|
||||
});
|
||||
});
|
||||
}
|
||||
function getBar(success, darker) {
|
||||
var $div = $('<div>')
|
||||
.css({
|
||||
width: window.innerWidth - Ox.UI.SCROLLBAR_SIZE,
|
||||
height: '15px',
|
||||
padding: '4px 8px 4px 8px',
|
||||
fontFamily: 'Menlo, Monaco, Courier',
|
||||
fontSize: '12px',
|
||||
whiteSpace: 'nowrap',
|
||||
MozUserSelect: 'text',
|
||||
WebkitUserSelect: 'text'
|
||||
});
|
||||
['moz', 'webkit'].forEach(function(browser) {
|
||||
$div.css({
|
||||
background: '-' + browser + '-linear-gradient(top, rgb(' +
|
||||
getColor(success, 0) + '), rgb(' +
|
||||
getColor(success, 1) + '))'
|
||||
});
|
||||
});
|
||||
function getColor(success, i) {
|
||||
return colors[+success][i].map(function(color) {
|
||||
return color - (darker || 0) * 32;
|
||||
}).join(', ')
|
||||
}
|
||||
return $div;
|
||||
}
|
||||
});
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS TreeList Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/treelist.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,38 +0,0 @@
|
|||
Ox.load({UI: {debug: true}, Geo: {}}, function() {
|
||||
|
||||
var $treeList = new Ox.TreeList({
|
||||
data: {'Ox.COUNTRIES': Ox.COUNTRIES},
|
||||
width: 256 - Ox.UI.SCROLLBAR_SIZE
|
||||
})
|
||||
.bindEvent({
|
||||
resize: function(data) {
|
||||
$treeList.options({width: data.width - Ox.UI.SCROLLBAR_SIZE});
|
||||
}
|
||||
}),
|
||||
$debug = new Ox.Element('div'),
|
||||
$button = new Ox.Button({
|
||||
title: 'Debug'
|
||||
})
|
||||
.bindEvent({
|
||||
click: function() {
|
||||
$text.html(JSON.stringify($treeList.$element.options('items')))
|
||||
}
|
||||
})
|
||||
.appendTo($debug),
|
||||
$text = new Ox.Element('div').appendTo($debug),
|
||||
$splitPanel = new Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: $treeList,
|
||||
size: 256,
|
||||
resizable: true,
|
||||
resize: [128, 256, 384]
|
||||
},
|
||||
{
|
||||
element: $debug
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo($('body'));
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
td {
|
||||
font-family: Lucida Grande, Helvetica, Arial;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
td:first-child {
|
||||
padding-right: 16px;
|
||||
font-weight: bold;
|
||||
text-align: right;
|
||||
}
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Unicode Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/unicode.css"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/unicode.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,28 +0,0 @@
|
|||
Ox.load({UI: {}, Unicode: {}}, function() {
|
||||
|
||||
var ascii = {},
|
||||
$body = Ox.UI.$body.css({overflow: 'auto'}),
|
||||
$table = $('<table>').appendTo($body);
|
||||
|
||||
Ox.forEach(Ox.UNICODE_CHARACTERS, function(data, char) {
|
||||
if (data.ascii) {
|
||||
ascii[data.ascii] = ascii[data.ascii] || [];
|
||||
ascii[data.ascii].push({char: char, names: data.names});
|
||||
}
|
||||
});
|
||||
|
||||
Ox.print(ascii);
|
||||
|
||||
Ox.forEach(Object.keys(ascii).sort(function(a, b) {
|
||||
return a.length * 1000000 + a.charCodeAt(0)
|
||||
- b.length * 1000000 - b.charCodeAt(0);
|
||||
}), function(char) {
|
||||
var $tr = $('<tr>').appendTo($table);
|
||||
$('<td>').html(char).appendTo($tr)
|
||||
ascii[char].forEach(function(data) {
|
||||
$('<td>').attr({title: data.names.join('\n')})
|
||||
.html(data.char).appendTo($tr);
|
||||
});
|
||||
});
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Video Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/video.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,295 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'modern'
|
||||
}, function() {
|
||||
|
||||
var $foo, $bar;
|
||||
|
||||
var id = '0393109',
|
||||
poster = 'png/poster.png',
|
||||
results = [
|
||||
{'in': 190.335, out: 192.353},
|
||||
{'in': 1185.215, out: 1188.115},
|
||||
{'in': 1784.525, out: 1785.915},
|
||||
{'in': 1786.015, out: 1787.835},
|
||||
{'in': 3087.365, out: 3090.275},
|
||||
{'in': 3704.915, out: 3706.795},
|
||||
{'in': 3706.895, out: 3709.615},
|
||||
{'in': 4061.655, out: 4063.95},
|
||||
{'in': 4531.775, out: 4533.415},
|
||||
{'in': 4946.095, out: 4948.875},
|
||||
{'in': 5292.885, out: 5294.665},
|
||||
{'in': 5381.965, out: 5383.338},
|
||||
{'in': 5385.415, out: 5389.58},
|
||||
{'in': 5434.93, out: 5436.93},
|
||||
{'in': 5437.405, out: 5439.405},
|
||||
{'in': 5749.535, out: 5751.915},
|
||||
{'in': 5780.235, out: 5782.435},
|
||||
{'in': 5881.365, out: 5886.635}
|
||||
],
|
||||
timeline = 'png/timeline.16.png',
|
||||
url = 'http://next.0xdb.org/' + id + '/96p.webm',
|
||||
videoSize = getVideoSize(),
|
||||
$videos = [
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['play', 'volume', 'scale', 'timeline', 'position', 'resolution'],
|
||||
controlsTop: ['fullscreen', 'title', 'find'],
|
||||
enableFind: true,
|
||||
enableFullscreen: true,
|
||||
enableKeyboard: true,
|
||||
enableVolume: true,
|
||||
find: 'brick',
|
||||
focus: 'mouseenter',
|
||||
height: 192,
|
||||
'in': 3128.72,
|
||||
logoLink: 'http://next.0xdb.org/' + id,
|
||||
logoTitle: 'Watch on 0xdb',
|
||||
logo: 'png/logo.png',
|
||||
out: 3130.72,
|
||||
paused: true,
|
||||
poster: poster,
|
||||
posterFrame: 3168.04,
|
||||
//showIconOnLoad: true,
|
||||
showMarkers: true,
|
||||
subtitles: 'srt/' + id + '.srt',
|
||||
timeline: 'png/timeline.16.png',
|
||||
title: 'Brick - Rian Johnson - 2005',
|
||||
video: {
|
||||
96: url + '?' + + Ox.random(1000000),
|
||||
360: url + '?' + + Ox.random(1000000),
|
||||
1080: url + '?' + + Ox.random(1000000)
|
||||
},
|
||||
width: 360
|
||||
})
|
||||
.css({
|
||||
left: '16px',
|
||||
top: '16px'
|
||||
}),
|
||||
/*
|
||||
Ox.VideoPlayer({
|
||||
enableKeyboard: true,
|
||||
height: videoSize.height,
|
||||
'in': 3128.72,
|
||||
//keepIconVisible: true,
|
||||
out: 3130.72,
|
||||
paused: true,
|
||||
playInToOut: true,
|
||||
//preload: 'none',
|
||||
showIcon: true,
|
||||
timeline: timeline,
|
||||
video: url + '?' + + Ox.random(1000000),
|
||||
width: videoSize.width
|
||||
})
|
||||
.css({
|
||||
left: '16px',
|
||||
top: '16px'
|
||||
}),
|
||||
*/
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['goto', 'set', 'space', 'position'],
|
||||
externalControls: true,
|
||||
height: videoSize.height,
|
||||
position: 3128.72,
|
||||
showMarkers: true,
|
||||
showMilliseconds: 2,
|
||||
subtitles: 'srt/' + id + '.srt',
|
||||
type: 'in',
|
||||
video: function(position) {
|
||||
return 'png/poster.png'
|
||||
},
|
||||
width: videoSize.width
|
||||
})
|
||||
.css({
|
||||
left: '16px',
|
||||
top: '16px'
|
||||
}),
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['play', 'playInToOut', 'volume', 'size', 'space', 'position'],
|
||||
enableFind: true,
|
||||
enableFullscreen: true,
|
||||
enableVolume: true,
|
||||
externalControls: true,
|
||||
height: 192,
|
||||
'in': 3128.72,
|
||||
out: 3130.72,
|
||||
paused: true,
|
||||
position: 3168.04,
|
||||
posterFrame: 3168.04,
|
||||
showMarkers: true,
|
||||
showMilliseconds: 2,
|
||||
subtitles: 'srt/' + id + '.srt',
|
||||
title: 'Brick - Rian Johnson - 2005',
|
||||
video: url + '?' + + Ox.random(1000000),
|
||||
width: 360
|
||||
})
|
||||
.css({
|
||||
left: '16px',
|
||||
top: '16px'
|
||||
})
|
||||
.bindEvent({
|
||||
position: function(data) {
|
||||
$blockTimeline.options({
|
||||
position: data.position
|
||||
});
|
||||
}
|
||||
})
|
||||
];
|
||||
window.$videos = $videos
|
||||
Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element()
|
||||
.append($videos[0])
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$videos[0].options({height: size - 32});
|
||||
}
|
||||
}),
|
||||
size: 224,
|
||||
resizable: true,
|
||||
resize: [100, 400]
|
||||
},
|
||||
{
|
||||
element: $foo = Ox.Element()
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$videos[0].options({width: size - 32});
|
||||
$smallTimeline.options({width: size - 16});
|
||||
$playerTimeline.options({width: size - 16});
|
||||
}
|
||||
}),
|
||||
size: 392,
|
||||
resizable: true,
|
||||
resize: [200, 600]
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
.append($videos[1])
|
||||
.bindEvent({
|
||||
resize: resizeVideo
|
||||
})
|
||||
},
|
||||
{
|
||||
element: Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element()
|
||||
.append($videos[2])
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$videos[2].options({height: size - 48});
|
||||
}
|
||||
}),
|
||||
size: 240,
|
||||
resizable: true,
|
||||
resize: [100, 400]
|
||||
},
|
||||
{
|
||||
element: $bar = Ox.Element()
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$videos[2].options({width: size - 32});
|
||||
$blockTimeline.options({width: size - 16});
|
||||
}
|
||||
}),
|
||||
size: 392,
|
||||
resizable: true,
|
||||
resize: [200, 600]
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo(Ox.UI.$body);
|
||||
|
||||
function getVideoSize() {
|
||||
var size = {},
|
||||
widths = $videos ? $videos[0].options('width') + $videos[2].options('width') : 720
|
||||
size.width = window.innerWidth - widths - 98;
|
||||
size.height = Math.round(size.width / 180 * 96);
|
||||
return size;
|
||||
}
|
||||
function resizeVideo() {
|
||||
var size = getVideoSize();
|
||||
$videos[1].options({
|
||||
width: size.width,
|
||||
height: size.height
|
||||
});
|
||||
}
|
||||
|
||||
Ox.get('srt/0393109.srt', function(srt) {
|
||||
var subtitles = Ox.parseSRT(srt);
|
||||
$foo.append(
|
||||
$smallTimeline = Ox.SmallVideoTimeline({
|
||||
duration: 6336.08,
|
||||
find: 'brick',
|
||||
'in': 3128.725,
|
||||
out: 3130.725,
|
||||
results: results,
|
||||
subtitles: subtitles,
|
||||
timeline: 'png/timeline.16.png',
|
||||
type: 'editor',
|
||||
width: 376
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '4px',
|
||||
top: '4px'
|
||||
})
|
||||
);
|
||||
$foo.append(
|
||||
$playerTimeline = Ox.SmallVideoTimeline({
|
||||
duration: 6336.08,
|
||||
find: 'brick',
|
||||
'in': 3128.725,
|
||||
out: 3130.725,
|
||||
results: results,
|
||||
subtitles: subtitles,
|
||||
timeline: 'png/timeline.16.png',
|
||||
type: 'player',
|
||||
width: 376
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '4px',
|
||||
top: '32px'
|
||||
})
|
||||
);
|
||||
$bar.append(
|
||||
$blockTimeline = Ox.BlockVideoTimeline({
|
||||
duration: 6336.08,
|
||||
find: 'brick',
|
||||
getImageURL: function(i) {
|
||||
return 'png/timeline.16.' + i + '.png';
|
||||
},
|
||||
'in': 3128.725,
|
||||
out: 3130.725,
|
||||
results: results,
|
||||
showMilliseconds: 2,
|
||||
subtitles: subtitles,
|
||||
width: 376
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '4px',
|
||||
top: '4px'
|
||||
})
|
||||
.bindEvent('position', function(data) {
|
||||
$videos[2].options({
|
||||
position: data.position
|
||||
});
|
||||
})
|
||||
);
|
||||
})
|
||||
|
||||
|
||||
});
|
Before Width: | Height: | Size: 32 KiB |
Before Width: | Height: | Size: 24 KiB |
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Video Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/video.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,79 +0,0 @@
|
|||
$videos = []
|
||||
|
||||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'modern'
|
||||
}, function() {
|
||||
|
||||
Ox.UI.$body.css({background: 'rgb(32, 32, 32)'})
|
||||
|
||||
/*
|
||||
Ox.loop(1, 9, function(part) {
|
||||
$videos.push(
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['play', 'timeline', 'position'],
|
||||
controlsTop: ['title'],
|
||||
height: 96,
|
||||
paused: true,
|
||||
title: 'Part ' + part,
|
||||
video: 'http://next.0xdb.org/0090015/96p' + part + '.webm',
|
||||
width: 128
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: 8 + (part - 1) * 136 + 'px',
|
||||
top: '8px',
|
||||
border: '1px solid rgb(128, 128, 128)',
|
||||
})
|
||||
.appendTo(Ox.UI.$body)
|
||||
);
|
||||
});
|
||||
*/
|
||||
|
||||
var id = '0090015', parts = 8;
|
||||
|
||||
var id = '0070334', parts = 2;
|
||||
|
||||
var id = '0123755', parts = 2;
|
||||
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['play', 'scale', 'fullscreen', 'timeline', 'position'],
|
||||
controlsTop: ['title'],
|
||||
enableMouse: true,
|
||||
height: 384,
|
||||
paused: true,
|
||||
timeline: 'http://next.0xdb.org/' + id + '/timeline16p.png',
|
||||
title: 'Single-Part',
|
||||
video: 'http://next.0xdb.org/static/' + id + '_96p.webm',
|
||||
width: 512
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '8px',
|
||||
//top: '112px',
|
||||
top: '8px',
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
Ox.VideoPlayer({
|
||||
controlsBottom: ['play', 'scale', 'fullscreen', 'timeline', 'position'],
|
||||
controlsTop: ['title'],
|
||||
enableMouse: true,
|
||||
height: 384,
|
||||
paused: true,
|
||||
timeline: 'http://next.0xdb.org/' + id + '/timeline16p.png',
|
||||
title: 'Multi-Part',
|
||||
video: Ox.range(1, parts + 1).map(function(i) {
|
||||
return 'http://next.0xdb.org/' + id + '/96p' + i + '.webm';
|
||||
}),
|
||||
width: 512
|
||||
})
|
||||
.css({
|
||||
position: 'absolute',
|
||||
left: '528px',
|
||||
//top: '112px',
|
||||
top: '8px',
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
});
|
|
@ -1,10 +0,0 @@
|
|||
<!DOCTYPE HTML>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Video Editor Demo</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../build/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/videoeditor.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
|
@ -1,137 +0,0 @@
|
|||
Ox.load('UI', {
|
||||
debug: true,
|
||||
theme: 'modern'
|
||||
}, function() {
|
||||
|
||||
//var id = '0393109';
|
||||
var id = '0097514';
|
||||
|
||||
Ox.get('srt/' + id + '.srt', function(srt) {
|
||||
|
||||
var subtitles = Ox.parseSRT(srt/*, 25*/),
|
||||
layers = [
|
||||
{
|
||||
editable: true,
|
||||
id: 'privatenotes',
|
||||
items: [],
|
||||
title: 'Private Notes'
|
||||
},
|
||||
{
|
||||
editable: true,
|
||||
id: 'publicnotes',
|
||||
items: [],
|
||||
title: 'Public Notes'
|
||||
},
|
||||
{
|
||||
id: 'subtitles',
|
||||
items: subtitles.map(function(subtitle, i) {
|
||||
return {id: i, 'in': subtitle.in, out: subtitle.out, value: subtitle.text};
|
||||
}),
|
||||
title: 'Subtitles'
|
||||
}
|
||||
];
|
||||
|
||||
var $appPanel, $mainPanel;
|
||||
|
||||
var $videoEditor = Ox.VideoEditor({
|
||||
annotationsSize: 256,
|
||||
duration: 3029.96,
|
||||
find: 'dode',
|
||||
getFrameURL: function(position, width) {
|
||||
return 'http://next.0xdb.org/' + id + '/frame/' + width + '/' + position + '.jpg'
|
||||
},
|
||||
getLargeTimelineImageURL: function(i) {
|
||||
return 'http://next.0xdb.org/' + id + '/timelines/timeline.64.' + i + '.png';
|
||||
},
|
||||
getSmallTimelineImageURL: function(i) {
|
||||
return 'http://next.0xdb.org/' + id + '/timelines/timeline.16.' + i + '.png';
|
||||
},
|
||||
height: window.innerHeight - 129,
|
||||
'in': 0,
|
||||
layers: layers,
|
||||
out: 0,
|
||||
position: 0,
|
||||
posterFrame: 1515,
|
||||
showAnnotations: true,
|
||||
subtitles: subtitles,
|
||||
video: {
|
||||
96: 'http://next.0xdb.org/' + id + '/96p.webm',
|
||||
240: 'http://next.0xdb.org/' + id + '/96p.webm?240p',
|
||||
480: 'http://next.0xdb.org/' + id + '/96p.webm?480p'
|
||||
},
|
||||
videoHeight: 96,
|
||||
videoSize: 'small',
|
||||
videoWidth: 124,
|
||||
width: window.innerWidth - 257
|
||||
});
|
||||
|
||||
$appPanel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element(),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 256
|
||||
},
|
||||
{
|
||||
element: $mainPanel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
collapsible: true,
|
||||
element: Ox.Element(),
|
||||
resizable: true,
|
||||
resize: [64, 128, 192],
|
||||
size: 128
|
||||
},
|
||||
{
|
||||
element: $videoEditor
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
})
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
})
|
||||
.appendTo(Ox.UI.$body);
|
||||
|
||||
Ox.UI.$window.bind({
|
||||
resize: function() {
|
||||
$videoEditor.options({
|
||||
width: $appPanel.getSize(1),
|
||||
height: $mainPanel.getSize(1)
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$mainPanel.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
$videoEditor.options({
|
||||
width: size
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$videoEditor.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
Ox.print('RESIZING', size)
|
||||
$videoEditor.options({
|
||||
height: size
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$videoEditor.$element.bindEvent({
|
||||
resize: function(foo, size) {
|
||||
Ox.print('RESIZING', size)
|
||||
$videoEditor.options({
|
||||
height: size
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
});
|
||||
|
||||
});
|
Before Width: | Height: | Size: 24 KiB |
|
@ -1,710 +0,0 @@
|
|||
1
|
||||
00:00:00,680 --> 00:00:04,389
|
||||
Change nothing
|
||||
so that everything is different.
|
||||
|
||||
2
|
||||
00:00:24,560 --> 00:00:27,120
|
||||
Don't show every side of things.
|
||||
|
||||
3
|
||||
00:00:27,680 --> 00:00:30,672
|
||||
Allow yourself
|
||||
a margin of indefiniteness.
|
||||
|
||||
4
|
||||
00:05:11,960 --> 00:05:16,272
|
||||
Histories of cinema,
|
||||
in the plural.
|
||||
|
||||
5
|
||||
00:05:27,000 --> 00:05:29,719
|
||||
All the stories
|
||||
|
||||
6
|
||||
00:05:30,680 --> 00:05:33,240
|
||||
that will be
|
||||
|
||||
7
|
||||
00:05:34,560 --> 00:05:36,118
|
||||
that have been.
|
||||
|
||||
8
|
||||
00:09:06,760 --> 00:09:10,878
|
||||
To tell the story of the last tycoon
|
||||
|
||||
9
|
||||
00:09:12,480 --> 00:09:13,754
|
||||
Irving Thalberg.
|
||||
|
||||
10
|
||||
00:09:17,000 --> 00:09:21,835
|
||||
A TV executive has, at most,
|
||||
200 films a year in his head.
|
||||
|
||||
11
|
||||
00:09:23,160 --> 00:09:25,799
|
||||
Thalberg was the only person who,
|
||||
|
||||
12
|
||||
00:09:26,000 --> 00:09:28,958
|
||||
every day, had 52 films in his head.
|
||||
|
||||
13
|
||||
00:10:50,440 --> 00:10:51,839
|
||||
The foundation.
|
||||
|
||||
14
|
||||
00:10:52,880 --> 00:10:54,598
|
||||
The founding father.
|
||||
|
||||
15
|
||||
00:11:02,720 --> 00:11:04,119
|
||||
The only son.
|
||||
|
||||
16
|
||||
00:11:10,200 --> 00:11:12,839
|
||||
This story had to pass by this:
|
||||
|
||||
17
|
||||
00:11:14,960 --> 00:11:17,872
|
||||
A young body,
|
||||
fragile and beautiful,
|
||||
|
||||
18
|
||||
00:11:29,160 --> 00:11:31,674
|
||||
as described
|
||||
F. Scott Fitzgerald -
|
||||
|
||||
19
|
||||
00:11:32,000 --> 00:11:35,072
|
||||
so that this could exist:
|
||||
|
||||
20
|
||||
00:11:38,160 --> 00:11:39,752
|
||||
The power of Hollywood.
|
||||
|
||||
21
|
||||
00:13:22,800 --> 00:13:25,075
|
||||
The power of Babylon.
|
||||
|
||||
22
|
||||
00:13:38,480 --> 00:13:39,879
|
||||
A dream factory.
|
||||
|
||||
23
|
||||
00:13:43,320 --> 00:13:45,231
|
||||
History of cinema.
|
||||
|
||||
24
|
||||
00:13:48,080 --> 00:13:51,470
|
||||
Newness of history.
|
||||
History of news.
|
||||
|
||||
25
|
||||
00:15:59,920 --> 00:16:03,799
|
||||
What has gone through cinema
|
||||
and is still marked by it
|
||||
|
||||
26
|
||||
00:16:04,000 --> 00:16:06,150
|
||||
can no longer enter anywhere else.
|
||||
|
||||
27
|
||||
00:16:10,240 --> 00:16:12,196
|
||||
A dream factory.
|
||||
|
||||
28
|
||||
00:16:22,800 --> 00:16:27,112
|
||||
Communism wore itself out
|
||||
trying to dream up such factories.
|
||||
|
||||
29
|
||||
00:17:46,520 --> 00:17:50,638
|
||||
Married to one of
|
||||
the prettiest women alive.
|
||||
|
||||
30
|
||||
00:18:07,440 --> 00:18:10,034
|
||||
Or to tell the story of Howard Hughes.
|
||||
|
||||
31
|
||||
00:18:35,720 --> 00:18:37,517
|
||||
Braver than Mermoz,
|
||||
|
||||
32
|
||||
00:18:38,200 --> 00:18:39,792
|
||||
richer than Rockefeller.
|
||||
|
||||
33
|
||||
00:19:13,400 --> 00:19:16,790
|
||||
<i>Producer of Citizen Kane,
|
||||
president of TWA.</i>
|
||||
|
||||
34
|
||||
00:19:17,800 --> 00:19:21,270
|
||||
As if Meliès ran Gallimard
|
||||
and the SNCF.
|
||||
|
||||
35
|
||||
00:19:55,680 --> 00:19:57,398
|
||||
And before Hughes Aircraft
|
||||
|
||||
36
|
||||
00:19:57,600 --> 00:20:02,116
|
||||
began fishing up CIA submarines
|
||||
from the bottom of the Pacific,
|
||||
|
||||
37
|
||||
00:20:07,800 --> 00:20:11,793
|
||||
he forced RKO starlets
|
||||
to go on weekly limousine rides
|
||||
|
||||
38
|
||||
00:20:16,560 --> 00:20:18,039
|
||||
at one mile an hour
|
||||
|
||||
39
|
||||
00:20:22,640 --> 00:20:26,110
|
||||
so their breasts
|
||||
wouldn't bounce up and down.
|
||||
|
||||
40
|
||||
00:20:35,640 --> 00:20:38,598
|
||||
His death, worse than anything
|
||||
|
||||
41
|
||||
00:20:38,800 --> 00:20:41,519
|
||||
Defoe had imagined for Robinson.
|
||||
|
||||
42
|
||||
00:23:06,840 --> 00:23:11,277
|
||||
To tell the stories
|
||||
of all the films never made...
|
||||
|
||||
43
|
||||
00:24:08,240 --> 00:24:12,791
|
||||
To tell the stories
|
||||
of all the films never made...
|
||||
|
||||
44
|
||||
00:25:52,200 --> 00:25:55,875
|
||||
To tell the stories
|
||||
of all the films never made,
|
||||
|
||||
45
|
||||
00:26:02,360 --> 00:26:04,271
|
||||
rather than those that were.
|
||||
|
||||
46
|
||||
00:26:11,800 --> 00:26:14,268
|
||||
Those that were
|
||||
can be seen on TV.
|
||||
|
||||
47
|
||||
00:26:14,480 --> 00:26:16,675
|
||||
Let's not exaggerate:
|
||||
|
||||
48
|
||||
00:26:16,880 --> 00:26:19,997
|
||||
They're not even
|
||||
copies of reproductions.
|
||||
|
||||
49
|
||||
00:27:19,800 --> 00:27:23,679
|
||||
<i>1940. Geneva.
|
||||
L'Ecole des femmes. Max Ophuls.</i>
|
||||
|
||||
50
|
||||
00:27:55,080 --> 00:27:57,719
|
||||
He fell on Madeleine Ozeray's ass,
|
||||
|
||||
51
|
||||
00:27:57,920 --> 00:28:01,799
|
||||
while the Germans were taking
|
||||
the French from behind
|
||||
|
||||
52
|
||||
00:28:04,920 --> 00:28:07,718
|
||||
and while Louis Jouvet was giving up.
|
||||
|
||||
53
|
||||
00:29:28,280 --> 00:29:31,078
|
||||
Theater is something
|
||||
too much known.
|
||||
|
||||
54
|
||||
00:29:32,200 --> 00:29:34,839
|
||||
The cinématographe, too unknown...
|
||||
|
||||
55
|
||||
00:29:35,720 --> 00:29:36,675
|
||||
up to now.
|
||||
|
||||
56
|
||||
00:31:29,680 --> 00:31:33,514
|
||||
History of cinema
|
||||
newness of history.
|
||||
|
||||
57
|
||||
00:31:33,720 --> 00:31:35,438
|
||||
History of news.
|
||||
|
||||
58
|
||||
00:31:37,160 --> 00:31:40,914
|
||||
Histories of cinema, with "s".
|
||||
|
||||
59
|
||||
00:31:41,520 --> 00:31:43,033
|
||||
With SS.
|
||||
|
||||
60
|
||||
00:32:21,160 --> 00:32:23,310
|
||||
1939, 1940, 1941...
|
||||
|
||||
61
|
||||
00:32:23,720 --> 00:32:25,472
|
||||
Betrayal by radio,
|
||||
|
||||
62
|
||||
00:32:26,200 --> 00:32:27,872
|
||||
but cinema keeps its word.
|
||||
|
||||
63
|
||||
00:32:37,160 --> 00:32:41,358
|
||||
Because from Siegfried and M
|
||||
to the dictator and Lubitsch,
|
||||
|
||||
64
|
||||
00:32:42,520 --> 00:32:43,873
|
||||
films were made.
|
||||
|
||||
65
|
||||
00:32:48,960 --> 00:32:50,393
|
||||
1940, 1941.
|
||||
|
||||
66
|
||||
00:32:51,240 --> 00:32:55,552
|
||||
Even scratched to death,
|
||||
a simple 35-millimeter rectangle
|
||||
|
||||
67
|
||||
00:32:56,080 --> 00:32:58,640
|
||||
saves the honor of reality.
|
||||
|
||||
68
|
||||
00:33:00,160 --> 00:33:01,991
|
||||
1941, 1942.
|
||||
|
||||
69
|
||||
00:33:02,480 --> 00:33:05,517
|
||||
If poor images still strike
|
||||
|
||||
70
|
||||
00:33:05,920 --> 00:33:09,276
|
||||
without anger or hatred,
|
||||
like a butcher,
|
||||
|
||||
71
|
||||
00:33:10,280 --> 00:33:12,874
|
||||
it is because cinema is there:
|
||||
Silent film,
|
||||
|
||||
72
|
||||
00:33:13,080 --> 00:33:16,959
|
||||
with its humble and formidable
|
||||
power of transfiguration.
|
||||
|
||||
73
|
||||
00:33:19,080 --> 00:33:21,674
|
||||
1942, 1943, 1944.
|
||||
|
||||
74
|
||||
00:33:23,040 --> 00:33:24,758
|
||||
That which plunges into the night
|
||||
|
||||
75
|
||||
00:33:24,960 --> 00:33:27,793
|
||||
is the echo of what silence submerges.
|
||||
|
||||
76
|
||||
00:33:29,960 --> 00:33:31,871
|
||||
What silence submerges
|
||||
|
||||
77
|
||||
00:33:35,240 --> 00:33:38,915
|
||||
sustains in light
|
||||
that which plunges into the night.
|
||||
|
||||
78
|
||||
00:35:43,160 --> 00:35:44,991
|
||||
Images and sounds,
|
||||
|
||||
79
|
||||
00:35:54,320 --> 00:35:56,993
|
||||
like travelers whose paths cross
|
||||
|
||||
80
|
||||
00:35:57,200 --> 00:35:59,156
|
||||
and who can no longer part ways.
|
||||
|
||||
81
|
||||
00:36:35,240 --> 00:36:37,993
|
||||
To prove it, the masses like myths.
|
||||
|
||||
82
|
||||
00:36:38,200 --> 00:36:40,236
|
||||
Cinema speaks to the masses.
|
||||
|
||||
83
|
||||
00:36:41,400 --> 00:36:43,709
|
||||
But if the myth begins with Fantomas,
|
||||
|
||||
84
|
||||
00:36:43,920 --> 00:36:45,512
|
||||
it ends with Christ.
|
||||
|
||||
85
|
||||
00:36:46,520 --> 00:36:49,751
|
||||
What did those who listened
|
||||
to St. Bernard hear?
|
||||
|
||||
86
|
||||
00:36:49,960 --> 00:36:51,996
|
||||
Not what he was saying?
|
||||
|
||||
87
|
||||
00:36:52,200 --> 00:36:54,270
|
||||
Maybe. Probably.
|
||||
|
||||
88
|
||||
00:36:55,920 --> 00:36:58,559
|
||||
How can we neglect what we learn
|
||||
|
||||
89
|
||||
00:36:58,760 --> 00:37:02,548
|
||||
when that unknown voice
|
||||
plunges deep into our hearts?
|
||||
|
||||
90
|
||||
00:37:35,480 --> 00:37:37,914
|
||||
What the news can teach us:
|
||||
|
||||
91
|
||||
00:37:38,840 --> 00:37:41,673
|
||||
The birth of a nation,
|
||||
of hope,
|
||||
|
||||
92
|
||||
00:37:48,760 --> 00:37:50,352
|
||||
of Rome, Open City.
|
||||
|
||||
93
|
||||
00:37:50,560 --> 00:37:53,870
|
||||
The cinématographe
|
||||
never meant to create an event,
|
||||
|
||||
94
|
||||
00:37:54,080 --> 00:37:55,274
|
||||
but a vision.
|
||||
|
||||
95
|
||||
00:38:10,680 --> 00:38:12,272
|
||||
Because the screen
|
||||
|
||||
96
|
||||
00:38:12,480 --> 00:38:13,959
|
||||
is the same white canvas
|
||||
|
||||
97
|
||||
00:38:14,160 --> 00:38:16,151
|
||||
as the Samaritan's shirt.
|
||||
|
||||
98
|
||||
00:38:24,440 --> 00:38:28,149
|
||||
What Arnold and Richter's
|
||||
cameras preserve,
|
||||
|
||||
99
|
||||
00:38:28,840 --> 00:38:32,515
|
||||
so as not to be outdone
|
||||
by nightmares and dreams,
|
||||
|
||||
100
|
||||
00:38:33,080 --> 00:38:37,392
|
||||
will not be shown on a screen,
|
||||
but on a shroud.
|
||||
|
||||
101
|
||||
00:38:44,800 --> 00:38:47,109
|
||||
If the deaths of Puig and the Négus,
|
||||
|
||||
102
|
||||
00:38:47,320 --> 00:38:49,311
|
||||
of Captain Boïeldieu,
|
||||
|
||||
103
|
||||
00:38:49,760 --> 00:38:52,479
|
||||
and of the little bunny
|
||||
were inaudible,
|
||||
|
||||
104
|
||||
00:38:53,280 --> 00:38:56,955
|
||||
it is because life never rendered
|
||||
what it stole from film.
|
||||
|
||||
105
|
||||
00:38:58,360 --> 00:39:02,069
|
||||
Forgetting extermination
|
||||
is part of extermination.
|
||||
|
||||
106
|
||||
00:39:35,400 --> 00:39:36,879
|
||||
Histories of cinema,
|
||||
|
||||
107
|
||||
00:39:37,680 --> 00:39:39,910
|
||||
stories without speech,
|
||||
|
||||
108
|
||||
00:39:40,560 --> 00:39:42,710
|
||||
stories of the night.
|
||||
|
||||
109
|
||||
00:40:12,040 --> 00:40:14,474
|
||||
For nearly 50 years, in the dark,
|
||||
|
||||
110
|
||||
00:40:14,680 --> 00:40:19,151
|
||||
moviegoers burn imagination
|
||||
to heat up reality.
|
||||
|
||||
111
|
||||
00:40:19,760 --> 00:40:21,830
|
||||
Now reality is seeking revenge.
|
||||
|
||||
112
|
||||
00:40:22,040 --> 00:40:24,873
|
||||
It wants real tears, real blood.
|
||||
|
||||
113
|
||||
00:40:32,480 --> 00:40:33,674
|
||||
From Vienna to Madrid,
|
||||
|
||||
114
|
||||
00:40:33,880 --> 00:40:35,108
|
||||
from Siodmak to Capra,
|
||||
|
||||
115
|
||||
00:40:35,320 --> 00:40:37,675
|
||||
from Paris
|
||||
to Los Angeles and Moscow,
|
||||
|
||||
116
|
||||
00:40:37,880 --> 00:40:40,189
|
||||
from Renoir
|
||||
to Malraux and Dovjenko -
|
||||
|
||||
117
|
||||
00:40:40,400 --> 00:40:44,757
|
||||
great fiction directors
|
||||
couldn't control the vengeance
|
||||
|
||||
118
|
||||
00:40:45,520 --> 00:40:48,159
|
||||
which they had directed over and over.
|
||||
|
||||
119
|
||||
00:42:05,120 --> 00:42:07,076
|
||||
The poor cinema of news
|
||||
|
||||
120
|
||||
00:42:07,280 --> 00:42:10,431
|
||||
must clear the blood and tears
|
||||
of all suspicion
|
||||
|
||||
121
|
||||
00:42:10,640 --> 00:42:13,359
|
||||
as streets are cleaned too late,
|
||||
|
||||
122
|
||||
00:42:13,880 --> 00:42:16,519
|
||||
after the army
|
||||
has fired at the masses.
|
||||
|
||||
123
|
||||
00:42:34,320 --> 00:42:35,673
|
||||
What there is of cinema
|
||||
|
||||
124
|
||||
00:42:35,880 --> 00:42:38,678
|
||||
in wartime newsreels
|
||||
says nothing.
|
||||
|
||||
125
|
||||
00:42:38,880 --> 00:42:40,393
|
||||
It does not judge.
|
||||
|
||||
126
|
||||
00:42:53,520 --> 00:42:55,351
|
||||
No close-ups.
|
||||
|
||||
127
|
||||
00:42:55,560 --> 00:42:57,437
|
||||
Suffering is not a star.
|
||||
|
||||
128
|
||||
00:43:02,080 --> 00:43:06,392
|
||||
Nor is the burned-down church
|
||||
or the bombed-out countryside.
|
||||
|
||||
129
|
||||
00:44:02,600 --> 00:44:06,388
|
||||
The spirits of Flaherty and Epstein
|
||||
took over.
|
||||
|
||||
130
|
||||
00:44:06,600 --> 00:44:10,878
|
||||
Daumier and Rembrandt,
|
||||
with his terrifying black and white.
|
||||
|
||||
131
|
||||
00:44:52,600 --> 00:44:54,033
|
||||
A few pans,
|
||||
|
||||
132
|
||||
00:44:54,240 --> 00:44:59,075
|
||||
an occasional high angle, for a mother
|
||||
mourning her murdered child.
|
||||
|
||||
133
|
||||
00:45:45,400 --> 00:45:48,153
|
||||
It is because this time alone
|
||||
|
||||
134
|
||||
00:45:48,840 --> 00:45:53,197
|
||||
the only veritable popular art form
|
||||
rejoins painting,
|
||||
|
||||
135
|
||||
00:45:53,400 --> 00:45:55,118
|
||||
that is: Art.
|
||||
|
||||
136
|
||||
00:45:55,320 --> 00:45:58,392
|
||||
That is: What is reborn
|
||||
from what was burned.
|
||||
|
||||
137
|
||||
00:46:26,640 --> 00:46:30,474
|
||||
We've forgotten that village,
|
||||
its white walls and olive trees,
|
||||
|
||||
138
|
||||
00:46:30,680 --> 00:46:32,432
|
||||
but we remember Picasso,
|
||||
|
||||
139
|
||||
00:46:32,920 --> 00:46:34,558
|
||||
that is: Guernica.
|
||||
|
||||
140
|
||||
00:46:44,120 --> 00:46:48,511
|
||||
We've forgotten Valentin Feldman,
|
||||
killed in '43,
|
||||
|
||||
141
|
||||
00:46:49,320 --> 00:46:52,437
|
||||
but we remember
|
||||
at least one other prisoner,
|
||||
|
||||
142
|
||||
00:46:52,640 --> 00:46:54,119
|
||||
that is: Goya.
|
||||
|
||||
143
|
||||
00:46:55,160 --> 00:46:59,915
|
||||
And if George Stevens hadn't used
|
||||
the first 16-mm color film
|
||||
|
||||
144
|
||||
00:47:00,280 --> 00:47:02,396
|
||||
in Auschwitz and Ravensbruck,
|
||||
|
||||
145
|
||||
00:47:04,040 --> 00:47:08,192
|
||||
Elizabeth Taylor would never
|
||||
have found a place in the sun.
|
||||
|
||||
146
|
||||
00:47:18,920 --> 00:47:20,638
|
||||
1939, 1944.
|
||||
|
||||
147
|
||||
00:47:21,760 --> 00:47:24,832
|
||||
Martyrdom and resurrection
|
||||
of the documentary.
|
||||
|
||||
148
|
||||
00:47:28,600 --> 00:47:32,673
|
||||
How marvelous to be able to look at
|
||||
what we cannot see.
|
||||
|
||||
149
|
||||
00:47:33,040 --> 00:47:35,918
|
||||
What a miracle for our blind eyes.
|
||||
|
||||
150
|
||||
00:47:41,600 --> 00:47:42,749
|
||||
Besides that,
|
||||
|
||||
151
|
||||
00:47:42,960 --> 00:47:44,552
|
||||
cinema is an industry.
|
||||
|
||||
152
|
||||
00:47:45,000 --> 00:47:47,560
|
||||
And if World War I allowed
|
||||
|
||||
153
|
||||
00:47:47,760 --> 00:47:50,228
|
||||
American cinema
|
||||
to ruin French cinema,
|
||||
|
||||
154
|
||||
00:47:50,680 --> 00:47:52,352
|
||||
with the advent of television,
|
||||
|
||||
155
|
||||
00:47:52,560 --> 00:47:54,437
|
||||
World War II allowed it to finance,
|
||||
|
||||
156
|
||||
00:47:55,120 --> 00:47:57,395
|
||||
that is, to ruin, European cinema.
|
||||
|
||||
157
|
||||
00:48:15,200 --> 00:48:17,634
|
||||
"Do you have two hands?"
|
||||
Asks the blind man.
|
||||
|
||||
158
|
||||
00:48:28,320 --> 00:48:31,232
|
||||
But looking won't reassure me.
|
||||
|
||||
159
|
||||
00:48:31,960 --> 00:48:35,430
|
||||
Why trust my eyes, if I have doubts?
|
||||
|
||||
160
|
||||
00:48:36,120 --> 00:48:38,793
|
||||
Why check my eyes
|
||||
|
||||
161
|
||||
00:48:39,000 --> 00:48:41,355
|
||||
to see whether I see my hands?
|
||||
|
||||
162
|
||||
00:49:56,880 --> 00:49:58,518
|
||||
Help!
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Video Timeline Player Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/demo.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
|
@ -1,83 +0,0 @@
|
|||
Ox.load('UI', function() {
|
||||
|
||||
Ox.Theme('modern');
|
||||
|
||||
var $innerPanel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element(),
|
||||
resizable: true,
|
||||
resize: [64, 128, 192],
|
||||
size: 64
|
||||
},
|
||||
{
|
||||
element: Ox.Element()
|
||||
}
|
||||
],
|
||||
orientation: 'vertical'
|
||||
}),
|
||||
$outerPanel = Ox.SplitPanel({
|
||||
elements: [
|
||||
{
|
||||
element: Ox.Element(),
|
||||
resizable: true,
|
||||
resize: [128, 256, 384],
|
||||
size: 128
|
||||
},
|
||||
{
|
||||
element: $innerPanel
|
||||
}
|
||||
],
|
||||
orientation: 'horizontal'
|
||||
}).appendTo(Ox.$body);
|
||||
|
||||
Ox.get('srt/0097514.srt', function(srt) {
|
||||
|
||||
var id = '0097514',
|
||||
// var id = '0318034',
|
||||
|
||||
$videoTimelinePlayer = Ox.VideoTimelinePlayer({
|
||||
duration: 3029.96,
|
||||
//duration: 5956.24,
|
||||
getFrameURL: function(position) {
|
||||
return 'http://0xdb.org/' + id + '/64p' + position + '.jpg'
|
||||
},
|
||||
getImageURL: function(i) {
|
||||
return 'http://0xdb.org/' + id + '/timeline64p' + i + '.png'
|
||||
//return 'png/timelinecenter64p' + i + '.png'
|
||||
},
|
||||
height: window.innerHeight - 65,
|
||||
paused: true,
|
||||
position: 1000,
|
||||
subtitles: Ox.parseSRT(srt),
|
||||
timelineURL: 'http://0xdb.org/' + id + '/timeline16p.png',
|
||||
videoRatio: 1.291667,
|
||||
//videoRatio: 1.833333,
|
||||
videoURL: 'http://0xdb.org/' + id + '/96p.webm',
|
||||
width: window.innerWidth - 129
|
||||
})
|
||||
.bindEvent({
|
||||
resizeend: function(data) {
|
||||
Ox.print('RESIZE', data.size)
|
||||
$videoTimelinePlayer.options({
|
||||
height: data.size
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$innerPanel
|
||||
.replaceElement(1, $videoTimelinePlayer)
|
||||
.bindEvent({
|
||||
resize: function(data) {
|
||||
Ox.print('RESIZE', data.size)
|
||||
$videoTimelinePlayer.options({
|
||||
width: data.size
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
$videoTimelinePlayer.gainFocus();
|
||||
|
||||
});
|
||||
|
||||
});
|
|
@ -1,710 +0,0 @@
|
|||
1
|
||||
00:00:00,680 --> 00:00:04,389
|
||||
Change nothing
|
||||
so that everything is different.
|
||||
|
||||
2
|
||||
00:00:24,560 --> 00:00:27,120
|
||||
Don't show every side of things.
|
||||
|
||||
3
|
||||
00:00:27,680 --> 00:00:30,672
|
||||
Allow yourself
|
||||
a margin of indefiniteness.
|
||||
|
||||
4
|
||||
00:05:11,960 --> 00:05:16,272
|
||||
Histories of cinema,
|
||||
in the plural.
|
||||
|
||||
5
|
||||
00:05:27,000 --> 00:05:29,719
|
||||
All the stories
|
||||
|
||||
6
|
||||
00:05:30,680 --> 00:05:33,240
|
||||
that will be
|
||||
|
||||
7
|
||||
00:05:34,560 --> 00:05:36,118
|
||||
that have been.
|
||||
|
||||
8
|
||||
00:09:06,760 --> 00:09:10,878
|
||||
To tell the story of the last tycoon
|
||||
|
||||
9
|
||||
00:09:12,480 --> 00:09:13,754
|
||||
Irving Thalberg.
|
||||
|
||||
10
|
||||
00:09:17,000 --> 00:09:21,835
|
||||
A TV executive has, at most,
|
||||
200 films a year in his head.
|
||||
|
||||
11
|
||||
00:09:23,160 --> 00:09:25,799
|
||||
Thalberg was the only person who,
|
||||
|
||||
12
|
||||
00:09:26,000 --> 00:09:28,958
|
||||
every day, had 52 films in his head.
|
||||
|
||||
13
|
||||
00:10:50,440 --> 00:10:51,839
|
||||
The foundation.
|
||||
|
||||
14
|
||||
00:10:52,880 --> 00:10:54,598
|
||||
The founding father.
|
||||
|
||||
15
|
||||
00:11:02,720 --> 00:11:04,119
|
||||
The only son.
|
||||
|
||||
16
|
||||
00:11:10,200 --> 00:11:12,839
|
||||
This story had to pass by this:
|
||||
|
||||
17
|
||||
00:11:14,960 --> 00:11:17,872
|
||||
A young body,
|
||||
fragile and beautiful,
|
||||
|
||||
18
|
||||
00:11:29,160 --> 00:11:31,674
|
||||
as described
|
||||
F. Scott Fitzgerald -
|
||||
|
||||
19
|
||||
00:11:32,000 --> 00:11:35,072
|
||||
so that this could exist:
|
||||
|
||||
20
|
||||
00:11:38,160 --> 00:11:39,752
|
||||
The power of Hollywood.
|
||||
|
||||
21
|
||||
00:13:22,800 --> 00:13:25,075
|
||||
The power of Babylon.
|
||||
|
||||
22
|
||||
00:13:38,480 --> 00:13:39,879
|
||||
A dream factory.
|
||||
|
||||
23
|
||||
00:13:43,320 --> 00:13:45,231
|
||||
History of cinema.
|
||||
|
||||
24
|
||||
00:13:48,080 --> 00:13:51,470
|
||||
Newness of history.
|
||||
History of news.
|
||||
|
||||
25
|
||||
00:15:59,920 --> 00:16:03,799
|
||||
What has gone through cinema
|
||||
and is still marked by it
|
||||
|
||||
26
|
||||
00:16:04,000 --> 00:16:06,150
|
||||
can no longer enter anywhere else.
|
||||
|
||||
27
|
||||
00:16:10,240 --> 00:16:12,196
|
||||
A dream factory.
|
||||
|
||||
28
|
||||
00:16:22,800 --> 00:16:27,112
|
||||
Communism wore itself out
|
||||
trying to dream up such factories.
|
||||
|
||||
29
|
||||
00:17:46,520 --> 00:17:50,638
|
||||
Married to one of
|
||||
the prettiest women alive.
|
||||
|
||||
30
|
||||
00:18:07,440 --> 00:18:10,034
|
||||
Or to tell the story of Howard Hughes.
|
||||
|
||||
31
|
||||
00:18:35,720 --> 00:18:37,517
|
||||
Braver than Mermoz,
|
||||
|
||||
32
|
||||
00:18:38,200 --> 00:18:39,792
|
||||
richer than Rockefeller.
|
||||
|
||||
33
|
||||
00:19:13,400 --> 00:19:16,790
|
||||
<i>Producer of Citizen Kane,
|
||||
president of TWA.</i>
|
||||
|
||||
34
|
||||
00:19:17,800 --> 00:19:21,270
|
||||
As if Meliès ran Gallimard
|
||||
and the SNCF.
|
||||
|
||||
35
|
||||
00:19:55,680 --> 00:19:57,398
|
||||
And before Hughes Aircraft
|
||||
|
||||
36
|
||||
00:19:57,600 --> 00:20:02,116
|
||||
began fishing up CIA submarines
|
||||
from the bottom of the Pacific,
|
||||
|
||||
37
|
||||
00:20:07,800 --> 00:20:11,793
|
||||
he forced RKO starlets
|
||||
to go on weekly limousine rides
|
||||
|
||||
38
|
||||
00:20:16,560 --> 00:20:18,039
|
||||
at one mile an hour
|
||||
|
||||
39
|
||||
00:20:22,640 --> 00:20:26,110
|
||||
so their breasts
|
||||
wouldn't bounce up and down.
|
||||
|
||||
40
|
||||
00:20:35,640 --> 00:20:38,598
|
||||
His death, worse than anything
|
||||
|
||||
41
|
||||
00:20:38,800 --> 00:20:41,519
|
||||
Defoe had imagined for Robinson.
|
||||
|
||||
42
|
||||
00:23:06,840 --> 00:23:11,277
|
||||
To tell the stories
|
||||
of all the films never made...
|
||||
|
||||
43
|
||||
00:24:08,240 --> 00:24:12,791
|
||||
To tell the stories
|
||||
of all the films never made...
|
||||
|
||||
44
|
||||
00:25:52,200 --> 00:25:55,875
|
||||
To tell the stories
|
||||
of all the films never made,
|
||||
|
||||
45
|
||||
00:26:02,360 --> 00:26:04,271
|
||||
rather than those that were.
|
||||
|
||||
46
|
||||
00:26:11,800 --> 00:26:14,268
|
||||
Those that were
|
||||
can be seen on TV.
|
||||
|
||||
47
|
||||
00:26:14,480 --> 00:26:16,675
|
||||
Let's not exaggerate:
|
||||
|
||||
48
|
||||
00:26:16,880 --> 00:26:19,997
|
||||
They're not even
|
||||
copies of reproductions.
|
||||
|
||||
49
|
||||
00:27:19,800 --> 00:27:23,679
|
||||
<i>1940. Geneva.
|
||||
L'Ecole des femmes. Max Ophuls.</i>
|
||||
|
||||
50
|
||||
00:27:55,080 --> 00:27:57,719
|
||||
He fell on Madeleine Ozeray's ass,
|
||||
|
||||
51
|
||||
00:27:57,920 --> 00:28:01,799
|
||||
while the Germans were taking
|
||||
the French from behind
|
||||
|
||||
52
|
||||
00:28:04,920 --> 00:28:07,718
|
||||
and while Louis Jouvet was giving up.
|
||||
|
||||
53
|
||||
00:29:28,280 --> 00:29:31,078
|
||||
Theater is something
|
||||
too much known.
|
||||
|
||||
54
|
||||
00:29:32,200 --> 00:29:34,839
|
||||
The cinématographe, too unknown...
|
||||
|
||||
55
|
||||
00:29:35,720 --> 00:29:36,675
|
||||
up to now.
|
||||
|
||||
56
|
||||
00:31:29,680 --> 00:31:33,514
|
||||
History of cinema
|
||||
newness of history.
|
||||
|
||||
57
|
||||
00:31:33,720 --> 00:31:35,438
|
||||
History of news.
|
||||
|
||||
58
|
||||
00:31:37,160 --> 00:31:40,914
|
||||
Histories of cinema, with "s".
|
||||
|
||||
59
|
||||
00:31:41,520 --> 00:31:43,033
|
||||
With SS.
|
||||
|
||||
60
|
||||
00:32:21,160 --> 00:32:23,310
|
||||
1939, 1940, 1941...
|
||||
|
||||
61
|
||||
00:32:23,720 --> 00:32:25,472
|
||||
Betrayal by radio,
|
||||
|
||||
62
|
||||
00:32:26,200 --> 00:32:27,872
|
||||
but cinema keeps its word.
|
||||
|
||||
63
|
||||
00:32:37,160 --> 00:32:41,358
|
||||
Because from Siegfried and M
|
||||
to the dictator and Lubitsch,
|
||||
|
||||
64
|
||||
00:32:42,520 --> 00:32:43,873
|
||||
films were made.
|
||||
|
||||
65
|
||||
00:32:48,960 --> 00:32:50,393
|
||||
1940, 1941.
|
||||
|
||||
66
|
||||
00:32:51,240 --> 00:32:55,552
|
||||
Even scratched to death,
|
||||
a simple 35-millimeter rectangle
|
||||
|
||||
67
|
||||
00:32:56,080 --> 00:32:58,640
|
||||
saves the honor of reality.
|
||||
|
||||
68
|
||||
00:33:00,160 --> 00:33:01,991
|
||||
1941, 1942.
|
||||
|
||||
69
|
||||
00:33:02,480 --> 00:33:05,517
|
||||
If poor images still strike
|
||||
|
||||
70
|
||||
00:33:05,920 --> 00:33:09,276
|
||||
without anger or hatred,
|
||||
like a butcher,
|
||||
|
||||
71
|
||||
00:33:10,280 --> 00:33:12,874
|
||||
it is because cinema is there:
|
||||
Silent film,
|
||||
|
||||
72
|
||||
00:33:13,080 --> 00:33:16,959
|
||||
with its humble and formidable
|
||||
power of transfiguration.
|
||||
|
||||
73
|
||||
00:33:19,080 --> 00:33:21,674
|
||||
1942, 1943, 1944.
|
||||
|
||||
74
|
||||
00:33:23,040 --> 00:33:24,758
|
||||
That which plunges into the night
|
||||
|
||||
75
|
||||
00:33:24,960 --> 00:33:27,793
|
||||
is the echo of what silence submerges.
|
||||
|
||||
76
|
||||
00:33:29,960 --> 00:33:31,871
|
||||
What silence submerges
|
||||
|
||||
77
|
||||
00:33:35,240 --> 00:33:38,915
|
||||
sustains in light
|
||||
that which plunges into the night.
|
||||
|
||||
78
|
||||
00:35:43,160 --> 00:35:44,991
|
||||
Images and sounds,
|
||||
|
||||
79
|
||||
00:35:54,320 --> 00:35:56,993
|
||||
like travelers whose paths cross
|
||||
|
||||
80
|
||||
00:35:57,200 --> 00:35:59,156
|
||||
and who can no longer part ways.
|
||||
|
||||
81
|
||||
00:36:35,240 --> 00:36:37,993
|
||||
To prove it, the masses like myths.
|
||||
|
||||
82
|
||||
00:36:38,200 --> 00:36:40,236
|
||||
Cinema speaks to the masses.
|
||||
|
||||
83
|
||||
00:36:41,400 --> 00:36:43,709
|
||||
But if the myth begins with Fantomas,
|
||||
|
||||
84
|
||||
00:36:43,920 --> 00:36:45,512
|
||||
it ends with Christ.
|
||||
|
||||
85
|
||||
00:36:46,520 --> 00:36:49,751
|
||||
What did those who listened
|
||||
to St. Bernard hear?
|
||||
|
||||
86
|
||||
00:36:49,960 --> 00:36:51,996
|
||||
Not what he was saying?
|
||||
|
||||
87
|
||||
00:36:52,200 --> 00:36:54,270
|
||||
Maybe. Probably.
|
||||
|
||||
88
|
||||
00:36:55,920 --> 00:36:58,559
|
||||
How can we neglect what we learn
|
||||
|
||||
89
|
||||
00:36:58,760 --> 00:37:02,548
|
||||
when that unknown voice
|
||||
plunges deep into our hearts?
|
||||
|
||||
90
|
||||
00:37:35,480 --> 00:37:37,914
|
||||
What the news can teach us:
|
||||
|
||||
91
|
||||
00:37:38,840 --> 00:37:41,673
|
||||
The birth of a nation,
|
||||
of hope,
|
||||
|
||||
92
|
||||
00:37:48,760 --> 00:37:50,352
|
||||
of Rome, Open City.
|
||||
|
||||
93
|
||||
00:37:50,560 --> 00:37:53,870
|
||||
The cinématographe
|
||||
never meant to create an event,
|
||||
|
||||
94
|
||||
00:37:54,080 --> 00:37:55,274
|
||||
but a vision.
|
||||
|
||||
95
|
||||
00:38:10,680 --> 00:38:12,272
|
||||
Because the screen
|
||||
|
||||
96
|
||||
00:38:12,480 --> 00:38:13,959
|
||||
is the same white canvas
|
||||
|
||||
97
|
||||
00:38:14,160 --> 00:38:16,151
|
||||
as the Samaritan's shirt.
|
||||
|
||||
98
|
||||
00:38:24,440 --> 00:38:28,149
|
||||
What Arnold and Richter's
|
||||
cameras preserve,
|
||||
|
||||
99
|
||||
00:38:28,840 --> 00:38:32,515
|
||||
so as not to be outdone
|
||||
by nightmares and dreams,
|
||||
|
||||
100
|
||||
00:38:33,080 --> 00:38:37,392
|
||||
will not be shown on a screen,
|
||||
but on a shroud.
|
||||
|
||||
101
|
||||
00:38:44,800 --> 00:38:47,109
|
||||
If the deaths of Puig and the Négus,
|
||||
|
||||
102
|
||||
00:38:47,320 --> 00:38:49,311
|
||||
of Captain Boïeldieu,
|
||||
|
||||
103
|
||||
00:38:49,760 --> 00:38:52,479
|
||||
and of the little bunny
|
||||
were inaudible,
|
||||
|
||||
104
|
||||
00:38:53,280 --> 00:38:56,955
|
||||
it is because life never rendered
|
||||
what it stole from film.
|
||||
|
||||
105
|
||||
00:38:58,360 --> 00:39:02,069
|
||||
Forgetting extermination
|
||||
is part of extermination.
|
||||
|
||||
106
|
||||
00:39:35,400 --> 00:39:36,879
|
||||
Histories of cinema,
|
||||
|
||||
107
|
||||
00:39:37,680 --> 00:39:39,910
|
||||
stories without speech,
|
||||
|
||||
108
|
||||
00:39:40,560 --> 00:39:42,710
|
||||
stories of the night.
|
||||
|
||||
109
|
||||
00:40:12,040 --> 00:40:14,474
|
||||
For nearly 50 years, in the dark,
|
||||
|
||||
110
|
||||
00:40:14,680 --> 00:40:19,151
|
||||
moviegoers burn imagination
|
||||
to heat up reality.
|
||||
|
||||
111
|
||||
00:40:19,760 --> 00:40:21,830
|
||||
Now reality is seeking revenge.
|
||||
|
||||
112
|
||||
00:40:22,040 --> 00:40:24,873
|
||||
It wants real tears, real blood.
|
||||
|
||||
113
|
||||
00:40:32,480 --> 00:40:33,674
|
||||
From Vienna to Madrid,
|
||||
|
||||
114
|
||||
00:40:33,880 --> 00:40:35,108
|
||||
from Siodmak to Capra,
|
||||
|
||||
115
|
||||
00:40:35,320 --> 00:40:37,675
|
||||
from Paris
|
||||
to Los Angeles and Moscow,
|
||||
|
||||
116
|
||||
00:40:37,880 --> 00:40:40,189
|
||||
from Renoir
|
||||
to Malraux and Dovjenko -
|
||||
|
||||
117
|
||||
00:40:40,400 --> 00:40:44,757
|
||||
great fiction directors
|
||||
couldn't control the vengeance
|
||||
|
||||
118
|
||||
00:40:45,520 --> 00:40:48,159
|
||||
which they had directed over and over.
|
||||
|
||||
119
|
||||
00:42:05,120 --> 00:42:07,076
|
||||
The poor cinema of news
|
||||
|
||||
120
|
||||
00:42:07,280 --> 00:42:10,431
|
||||
must clear the blood and tears
|
||||
of all suspicion
|
||||
|
||||
121
|
||||
00:42:10,640 --> 00:42:13,359
|
||||
as streets are cleaned too late,
|
||||
|
||||
122
|
||||
00:42:13,880 --> 00:42:16,519
|
||||
after the army
|
||||
has fired at the masses.
|
||||
|
||||
123
|
||||
00:42:34,320 --> 00:42:35,673
|
||||
What there is of cinema
|
||||
|
||||
124
|
||||
00:42:35,880 --> 00:42:38,678
|
||||
in wartime newsreels
|
||||
says nothing.
|
||||
|
||||
125
|
||||
00:42:38,880 --> 00:42:40,393
|
||||
It does not judge.
|
||||
|
||||
126
|
||||
00:42:53,520 --> 00:42:55,351
|
||||
No close-ups.
|
||||
|
||||
127
|
||||
00:42:55,560 --> 00:42:57,437
|
||||
Suffering is not a star.
|
||||
|
||||
128
|
||||
00:43:02,080 --> 00:43:06,392
|
||||
Nor is the burned-down church
|
||||
or the bombed-out countryside.
|
||||
|
||||
129
|
||||
00:44:02,600 --> 00:44:06,388
|
||||
The spirits of Flaherty and Epstein
|
||||
took over.
|
||||
|
||||
130
|
||||
00:44:06,600 --> 00:44:10,878
|
||||
Daumier and Rembrandt,
|
||||
with his terrifying black and white.
|
||||
|
||||
131
|
||||
00:44:52,600 --> 00:44:54,033
|
||||
A few pans,
|
||||
|
||||
132
|
||||
00:44:54,240 --> 00:44:59,075
|
||||
an occasional high angle, for a mother
|
||||
mourning her murdered child.
|
||||
|
||||
133
|
||||
00:45:45,400 --> 00:45:48,153
|
||||
It is because this time alone
|
||||
|
||||
134
|
||||
00:45:48,840 --> 00:45:53,197
|
||||
the only veritable popular art form
|
||||
rejoins painting,
|
||||
|
||||
135
|
||||
00:45:53,400 --> 00:45:55,118
|
||||
that is: Art.
|
||||
|
||||
136
|
||||
00:45:55,320 --> 00:45:58,392
|
||||
That is: What is reborn
|
||||
from what was burned.
|
||||
|
||||
137
|
||||
00:46:26,640 --> 00:46:30,474
|
||||
We've forgotten that village,
|
||||
its white walls and olive trees,
|
||||
|
||||
138
|
||||
00:46:30,680 --> 00:46:32,432
|
||||
but we remember Picasso,
|
||||
|
||||
139
|
||||
00:46:32,920 --> 00:46:34,558
|
||||
that is: Guernica.
|
||||
|
||||
140
|
||||
00:46:44,120 --> 00:46:48,511
|
||||
We've forgotten Valentin Feldman,
|
||||
killed in '43,
|
||||
|
||||
141
|
||||
00:46:49,320 --> 00:46:52,437
|
||||
but we remember
|
||||
at least one other prisoner,
|
||||
|
||||
142
|
||||
00:46:52,640 --> 00:46:54,119
|
||||
that is: Goya.
|
||||
|
||||
143
|
||||
00:46:55,160 --> 00:46:59,915
|
||||
And if George Stevens hadn't used
|
||||
the first 16-mm color film
|
||||
|
||||
144
|
||||
00:47:00,280 --> 00:47:02,396
|
||||
in Auschwitz and Ravensbruck,
|
||||
|
||||
145
|
||||
00:47:04,040 --> 00:47:08,192
|
||||
Elizabeth Taylor would never
|
||||
have found a place in the sun.
|
||||
|
||||
146
|
||||
00:47:18,920 --> 00:47:20,638
|
||||
1939, 1944.
|
||||
|
||||
147
|
||||
00:47:21,760 --> 00:47:24,832
|
||||
Martyrdom and resurrection
|
||||
of the documentary.
|
||||
|
||||
148
|
||||
00:47:28,600 --> 00:47:32,673
|
||||
How marvelous to be able to look at
|
||||
what we cannot see.
|
||||
|
||||
149
|
||||
00:47:33,040 --> 00:47:35,918
|
||||
What a miracle for our blind eyes.
|
||||
|
||||
150
|
||||
00:47:41,600 --> 00:47:42,749
|
||||
Besides that,
|
||||
|
||||
151
|
||||
00:47:42,960 --> 00:47:44,552
|
||||
cinema is an industry.
|
||||
|
||||
152
|
||||
00:47:45,000 --> 00:47:47,560
|
||||
And if World War I allowed
|
||||
|
||||
153
|
||||
00:47:47,760 --> 00:47:50,228
|
||||
American cinema
|
||||
to ruin French cinema,
|
||||
|
||||
154
|
||||
00:47:50,680 --> 00:47:52,352
|
||||
with the advent of television,
|
||||
|
||||
155
|
||||
00:47:52,560 --> 00:47:54,437
|
||||
World War II allowed it to finance,
|
||||
|
||||
156
|
||||
00:47:55,120 --> 00:47:57,395
|
||||
that is, to ruin, European cinema.
|
||||
|
||||
157
|
||||
00:48:15,200 --> 00:48:17,634
|
||||
"Do you have two hands?"
|
||||
Asks the blind man.
|
||||
|
||||
158
|
||||
00:48:28,320 --> 00:48:31,232
|
||||
But looking won't reassure me.
|
||||
|
||||
159
|
||||
00:48:31,960 --> 00:48:35,430
|
||||
Why trust my eyes, if I have doubts?
|
||||
|
||||
160
|
||||
00:48:36,120 --> 00:48:38,793
|
||||
Why check my eyes
|
||||
|
||||
161
|
||||
00:48:39,000 --> 00:48:41,355
|
||||
to see whether I see my hands?
|
||||
|
||||
162
|
||||
00:49:56,880 --> 00:49:58,518
|
||||
Help!
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OxJS Video Timeline Player Demo</title
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<script type="text/javascript" src="../../dev/Ox.js"></script>
|
||||
<script type="text/javascript" src="js/demo.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
</body>
|
||||
</html>
|
Before Width: | Height: | Size: 4.2 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 11 KiB |
Before Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 14 KiB |