(An update about Teresa is below the technical stuff in this email)
So today I figured out and got to run javascript that has the timeline data in
the javascript code itself.
This solves 3 problems:
1) I dont have to cut a separate data (.XML) file on the server that the
javascript has to refer to in a second run at the server for every timeline.
2) I dont have to hit the server 2 times per timeline if I am getting the data
via "lazy load", which is retrieving data via a process that returns a result
while the timeline loads.
3) It makes it much easier to implement into Wikipedia, which is a very big
deal.
So it is all "one stop shopping" if the data AND the logic is all in one file
inserted into the clients (users) browser via jQuery.
This is a big win for our team, scroll down to take a look at what this looks
like in javascript (can you see where the timeline data starts and ends?).
********************* Teresa update *******************************
Ok, I must admit I had a blast today. When I used to live in Vegas I would take
Teresa and the her gypsy gang to the beauty parlor every Saturday morning to
have their hair and nails done. It was always a interesting experience and I
have very fond memories of this. Hanging out with a group of 20 something girls
at a beauty parlor is about as cool as it gets. Well today I took Teresa,
Esmeralda, Aishe and Sabrina to the local "hair and nail" place. And boy did we
have fun. It is like these girls are family to me. Teresa paid for the whole
thing, $150, so we are absolutely making progress here. And they all look
fantastic all cleaned up like that.
Teresa did a cockney accent all day, with "I got a hole in ME pocket" and "good
morning governor" being her more memorable utterances. Sabrina was doing a
southern accent, today, populated by references to "sweet potato pie" as she
pretends that "everybody lives in trailer parks & sleeps with everyone". This
is all very funny, as Teresa and Sabrina interact with each other (Teresa, in
cockney, questioning Sabrina's "chastity and dignity" is priceless) using their
various accents/identities. They are all fantastic linguistic chameleons and
they should have their own radio/TV show.
I feel complete when Teresa is around. She makes me want to be a better man.
Tonight it will be karaoke (Teresa sings Adele like you would not believe),
pizza and an all-night game of monopoly (I almost always win).
Tomorrow is church, as the girls all go to mass. They are all devote Christians.
It is so nice to have Teresa back from Greece, regardless of all of the
challenges she presents. It is nice when she is here and it is also nice when
she finally leaves (she always comes back). It is a nice balance over the last
5 years.
{song quote}
Mama told me there'd be days like this
But I ain't never ever think there'd be a day like this
Not now not ever, and now until forever you will never need another
{end song quote}
Here is the code:
**************************************************************************************************************************************************************************
jQuery(document).ready(function() {
jQuery('<div id="CONTEOI81A2X"><table cellpadding=0 border=1
width=100%><tr><td><table border=0 width=100%><tr><td width=33%><div
id="LEGENDTEOI81A2X"></div><!input type="text" id="CENTERTEOI81A2X" /></td><td
width=33%><center>History of the United States</center></td><td width=33%
valign=top align=right><table><tr><td><div id="RATINGSTEOI81A2X">Rating 3.07
Count 163 <nobr><a href="#xKS0Q8VK9" title="This timeline should be deleted"
onclick="showCustomer(\'todo=rating&rating=1&tl=TEOI81A2X\',\'RATINGSTEOI81A2X\')"
><img src="star.png" ></a><a href="#xKS0Q8VKA" title="This timeline needs some
work"
onclick="showCustomer(\'todo=rating&rating=2&tl=TEOI81A2X\',\'RATINGSTEOI81A2X\')"
><img src="star.png" ></a><a href="#xKS0Q8VKB" title="This is an average
timeline"
onclick="showCustomer(\'todo=rating&rating=3&tl=TEOI81A2X\',\'RATINGSTEOI81A2X\')"
><img src="star.png" ></a><a href="#xKS0Q8VKC" title="This is a good timeline"
onclick="showCustomer(\'todo=rating&rating=4&tl=TEOI81A2X\',\'RATINGSTEOI81A2X\')"
><img src="star.png" ></a><a href="#xKS0Q8VKD" title="This is a most excellent
timeline"
onclick="showCustomer(\'todo=rating&rating=5&tl=TEOI81A2X\',\'RATINGSTEOI81A2X\')"
><img src="star.png" ></a></nobr></div></td><td><div id="MENUTEOI81A2X"><input
type="button"
onclick="showCustomer(\'todo=showmenu&tl=TEOI81A2X\',\'MENUTEOI81A2X\')"
value="Menu"></div></td></tr></table></td><!td width=1% valign=top
align=right><!input type="image" src="close.jpg" title="Close this timeline"
value="close"
onclick="showCustomer(\'todo=closediv&tl=TEOI81A2X\',\'void\');"><!/td></tr><tr><td
valign=top colspan=4><table width=100% border=0><tr><td width=100%><div
id="container" style="position: relative;"><div class="sync" style="display:
block;"></div><div id="DIVTEOI81A2X" class="timeline-default" style="height:
850px; border-width: 2px; border-style: solid; border-color:
black; text-shadow:0 0 40px #F900F9;"></div></div><td valign=top><div
id="WORKTEOI81A2X"></div></td></td></tr></table></td></tr></table></td></tr></table></div>').insertBefore("#footer");
/**/
var event_data =
{
"dateTimeFormat": "iso8601",
'events' : [
{'start': '1924',
'title': 'Barfusserkirche',
'description': 'by Lyonel Feininger, American/German Painter,
1871-1956',
'image': 'http://images.allposters.com/images/AWI/NR096_b.jpg',
'link':
'http://www.allposters.com/-sp/Barfusserkirche-1924-Posters_i1116895_.htm'
},
{'start': '1913',
'end': '1929',
'title': 'Three Figures',
'description': 'by Kasimir Malevich, Ukrainian Painter, 1878-1935',
'image': 'http://images.allposters.com/images/BRGPOD/75857_b.jpg',
'link':
'http://www.allposters.com/-sp/Three-Figures-1913-28-Posters_i1349989_.htm'
},
{'start': '1881',
'end': '1953',
'title': 'Landschaft bei Montreuil',
'description': 'by Albert Gleizes, French Painter, 1881-1953',
'image': 'http://images.allposters.com/images/mer/1336_b.jpg',
'link':
'http://www.allposters.com/-sp/Landschaft-bei-Montreuil-Posters_i339007_.htm',
'isDuration' : true,
'icon' : "dark-red-circle.png",
'color' : 'red',
'textColor' : 'green'},
{'start': '1920',
'title': 'Femme au Miroir',
'description': 'by Fernand Leger, French Painter, 1881-1955',
'image': 'http://images.allposters.com/images/AWI/GMR117_b.jpg',
'link':
'http://www.allposters.com/-sp/Femme-au-Miroir-1920-Posters_i141266_.htm'
},
{'start': '1903',
'title': 'The Old Guitarist',
'description': 'by Pablo Picasso, Spanish Painter/Sculptor, 1881-1973',
'image': 'http://images.allposters.com/images/ESC/AP599_b.jpg',
'link':
'http://www.allposters.com/-sp/The-Old-Guitarist-c-1903-Posters_i328746_.htm'
},
{'start': '1882',
'end': '1964',
'title': 'Jour',
'description': 'by Georges Braque, French Painter, 1882-1963',
'image': 'http://images.allposters.com/images/SHD/S1041_b.jpg',
'link': 'http://www.allposters.com/-sp/Jour-Posters_i126663_.htm',
'color': 'green'
},
{'start': '1916',
'title': 'Still Life with a White Dish',
'description': 'by Gino Severini, Italian Painter, 1883-1966',
'image': 'http://images.allposters.com/images/MCG/FS1254_b.jpg',
'link':
'http://www.allposters.com/-sp/Still-Life-with-a-White-Dish-1916-Posters_i366823_.htm'
},
{'start': '1885',
'end': '1941',
'title': 'Rhythm, Joie de Vivre',
'description': 'by Robert Delaunay, French Painter, 1885-1941',
'image':
'http://imagecache2.allposters.com/images/pic/adc/10053983a_b~Rhythm-Joie-de-Vivre-Posters.jpg',
'link':
'http://www.allposters.com/-sp/Rhythm-Joie-de-Vivre-Posters_i1250641_.htm'
},
{'start': '1885',
'end': '1925',
'title': 'Castor Et Pollux',
'description': 'by Roger de la Fresnaye, French Painter, 1885-1925',
'image': 'http://images.allposters.com/images/CORPOD/IX001463_b.jpg',
'link':
'http://www.allposters.com/-sp/Castor-Et-Pollux-Posters_i831718_.htm',
'tapeImage': 'blue_stripes.png',
'tapeRepeat': 'repeat-x',
'caption': "This is the event's caption attribute.",
'classname': 'hot_event'
},
{'start': '1912',
'title': 'Portrait of Pablo Picasso',
'description': 'by Juan Gris, Spanish Painter/Sculptor, 1887-1927',
'image': 'http://images.allposters.com/images/BRGPOD/156514_b.jpg',
'link':
'http://www.allposters.com/-sp/Portrait-of-Pablo-Picasso-1881-1973-1912-Posters_i1344154_.htm'
},
{'start': '1891',
'end': '1915',
'title': 'Portrait of Horace Brodsky',
'description': 'by Henri Gaudier-Brzeska, French Sculptor, 1891-1915',
'image': 'http://imagecache2.allposters.com/images/BRGPOD/102770_b.jpg',
'link':
'http://www.allposters.com/-sp/Portrait-of-Horace-Brodsky-Posters_i1584413_.htm'
}
]
};
var TEOI81A2X;
var eventSourceDataTEOI81A2X = new Timeline.DefaultEventSource();
var eventSourcePicsTEOI81A2X = new Timeline.DefaultEventSource();
var themeTEOI81A2X = Timeline.ClassicTheme.create();
themeTEOI81A2X.event.bubble.width = 800;
themeTEOI81A2X.event.bubble.height = 0;
var dTEOI81A2X = "Jan 01 2012";
var bandInfosTEOI81A2X = [
Timeline.createHotZoneBandInfo({
zones: [
{ start: "Jan 01 1960 00:00:00 GMT-0500",
end: "Dec 31 2012 00:00:00 GMT-0500",
magnify: 5,
unit: Timeline.DateTime.DECADE},
{ start: "Jan 01 1775 00:00:00 GMT-0500",
end: "Dec 31 1795 00:00:00 GMT-0500",
magnify: 10,
unit: Timeline.DateTime.YEAR},
{ start: "Jan 01 1860 00:00:00 GMT-0500",
end: "Dec 31 1865 00:00:00 GMT-0500",
magnify: 10,
unit: Timeline.DateTime.YEAR},
{ start: "Jan 01 1940 00:00:00 GMT-0500",
end: "Dec 31 1945 00:00:00 GMT-0500",
magnify: 15,
unit: Timeline.DateTime.YEAR},
{ start: "Dec 31 1915 00:00:00 GMT-0500",
end: "Dec 31 1920 00:00:00 GMT-0500",
magnify: 10,
unit: Timeline.DateTime.YEAR}],
width: "62%",
date: dTEOI81A2X,
theme: themeTEOI81A2X,
layout: 'original',
eventSource: eventSourceDataTEOI81A2X,
intervalPixels: 50,
intervalUnit: Timeline.DateTime.DECADE}),
Timeline.createBandInfo({
width: "26%",
date: dTEOI81A2X,
theme: themeTEOI81A2X,
layout: 'pictures',
eventSource: eventSourcePicsTEOI81A2X,
intervalUnit: Timeline.DateTime.DECADE,
intervalPixels: 200
}),
Timeline.createBandInfo({
width: "12%",
intervalUnit: Timeline.DateTime.CENTURY,
intervalPixels: 200,
date: dTEOI81A2X,
theme: themeTEOI81A2X,
layout: 'overview',
eventSource: eventSourceDataTEOI81A2X
})];
bandInfosTEOI81A2X[1].syncWith = 0;
bandInfosTEOI81A2X[1].highlight = true;
bandInfosTEOI81A2X[2].syncWith = 1;
bandInfosTEOI81A2X[2].highlight = true;
for (var i = 0; i < bandInfosTEOI81A2X.length; i++) {
bandInfosTEOI81A2X[i].decorators = [
new Timeline.SpanHighlightDecorator({
startDate: "Tue Jan 20 1981",
endDate: "Fri Jan 1 1988",
color: "#DAA520",
opacity: 12,
theme: themeTEOI81A2X
}),
new Timeline.SpanHighlightDecorator({
startDate: "Wed Jan 1 1919",
endDate: "Sun Jan 1 1933",
color: "#48D1CC",
opacity: 25,
theme: themeTEOI81A2X
}),
new Timeline.SpanHighlightDecorator({
startDate: "Sun Jan 1 1939",
endDate: "Mon Jan 1 1945",
color: "#FF00FF",
opacity: 10,
theme: themeTEOI81A2X
}),
new Timeline.SpanHighlightDecorator({
startDate: "Tue Jul 28 1914",
endDate: "Mon Nov 11 1918",
color: "#FF0000",
opacity: 20,
theme: themeTEOI81A2X
}),
new Timeline.SpanHighlightDecorator({
startDate: "Fri Apr 12 1861",
endDate: "Sun Apr 9 1865",
color: "#DA70D6",
opacity: 20,
theme: themeTEOI81A2X
})
];
}
jQuery('#LEGENDTEOI81A2X').html('<table cellpadding="1" border=0><tr><td><div
style="position:relative;"><div style="position:relative; color:Black;
z-index:5;"><nobr> <a href="#ALV8Q0SK1"
onclick="showCustomer(\'tl=TEOI81A2X&id=AAAA71GG1&todo=gotocenter\',\'void\')"
>The Civil War</a> </nobr></div><div style="position:absolute; top:0px;
left:0px; width:100%; height:100%; background-color:#DA70D6; z-index:1;
-ms-filter:\'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)\'; filter:
alpha(opacity=20); opacity:0.2;"></div></div></td><td><div
style="position:relative;"><div style="position:relative; color:Black;
z-index:5;"><nobr> <a href="#BLV8Q0SK1"
onclick="showCustomer(\'tl=TEOI81A2X&id=AAAZ51GG1&todo=gotocenter\',\'void\')"
>Word War I</a> </nobr></div><div style="position:absolute; top:0px; left:0px;
width:100%; height:100%; background-color:#FF0000; z-index:1;
-ms-filter:\'progid:DXImageTransform.Microsoft.Alpha(Opacity=20)\'; filter:
alpha(opacity=20); opacity:0.2;"></div></div></td><td><div
style="position:relative;"><div style="position:relative; color:Black;
z-index:5;"><nobr> <a href="#CLV8Q0SK1"
onclick="showCustomer(\'tl=TEOI81A2X&id=XXXXXXXXX&todo=gotocenter\',\'void\')"
>Prohibition</a> </nobr></div><div style="position:absolute; top:0px;
left:0px; width:100%; height:100%; background-color:#48D1CC; z-index:1;
-ms-filter:\'progid:DXImageTransform.Microsoft.Alpha(Opacity=25)\'; filter:
alpha(opacity=25); opacity:0.3;"></div></div></td><td><div
style="position:relative;"><div style="position:relative; color:Black;
z-index:5;"><nobr> <a href="#DLV8Q0SK1"
onclick="showCustomer(\'tl=TEOI81A2X&id=YYYYYYYYY&todo=gotocenter\',\'void\')"
>World War II</a> </nobr></div><div style="position:absolute; top:0px;
left:0px; width:100%; height:100%; background-color:#FF00FF;
z-index:1; -ms-filter:\'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)\';
filter: alpha(opacity=10); opacity:0.1;"></div></div></td><td><div
style="position:relative;"><div style="position:relative; color:Black;
z-index:5;"><nobr> <a href="#ELV8Q0SK1"
onclick="showCustomer(\'tl=TEOI81A2X&id=FUY4N0DG1&todo=gotocenter\',\'void\')"
>Ronald Reagan Presidental Term</a> </nobr></div><div
style="position:absolute; top:0px; left:0px; width:100%; height:100%;
background-color:#DAA520; z-index:1;
-ms-filter:\'progid:DXImageTransform.Microsoft.Alpha(Opacity=12)\'; filter:
alpha(opacity=12); opacity:0.1;"></div></div></td></tr></table>');
TEOI81A2X = Timeline.create(document.getElementById("DIVTEOI81A2X"),
bandInfosTEOI81A2X, Timeline.HORIZONTAL);
eventSourceDataTEOI81A2X.loadJSON(event_data,'');
eventSourcePicsTEOI81A2X.loadJSON(event_data,'');
});
Thanks
Jeff Roehl
[email protected]
(818) 912-7530
--
You received this message because you are subscribed to the Google Groups
"SIMILE Widgets" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/simile-widgets?hl=en.
