Version 2.2.0 and/or hosting Simile timeline issues

[Warf]

I have been able to setup a timeline on my website (www3.telus.net/
warfsworld/html/travel/travel_timeline.htm) with relative ease
following the documentation provided and using <script src="http://
simile.mit.edu/timeline/api/timeline-api.js" type="text/javascript"></
script> to host it.

I would like to do some customization (not a programmer, just a
hacker)... and it seems there is a lot more flexibility to modify
elements such as bubble size much easier using version 2.0 with
themes.

I have tried both ways to access version 2, and both result in a blank
div box...
1) Allowing MIT or code.google to be the server..
<script src="http://simile-widgets.googlecode.com/svn/timeline/tags/
2.2.0/src/webapp/api/timeline-api.js" type="text/javascript"></script>
<script src="http://static.simile.mit.edu/timeline/api-2.0/timeline-
api.js" type="text/javascript"></script>

2) Using the timeline libraries for 2.2.0 with instructions by Larry
However, even after closely following the instructions in timeline-
api.js, I get the same result with a blank DIV box.
(www3.telus.net/warfsworld/html/travel/travel_timeline_host.htm)

===============================
I know I must have missed something. I have timeline_ajax/ and
timeline_js folders setup off the root directory on my website, should
their parent directories matter if it's defined in the webpage?
<script>
Timeline_ajax_url="http://www3.telus.net/warfsworld/
timeline_ajax/simile-ajax-api.js";
Timeline_urlPrefix='http://www3.telus.net/warfsworld/
timeline_js/';
Timeline_parameters='bundle=true';
Timeline_parameters='timeline-use-local-resources';
</script>
<script src="http://www3.telus.net/warfsworld/timeline_js/timeline-
api.js" type="text/javascript"></script>

[Larry Kluger]

Hi Warf,

Welcome to Timeline.

Since you posted your url, it was easy for me to spot the problem:

You're referencing
http://www3.telus.net/warfsworld/timeline_js/bundle.js

But nothing is there on your server. Or at least, nothing is being downloaded.

So either you didn't upload the bundle file correctly, or you referred to the wrong directory in your settings in your Timeline file.

I made a screencast that shows how to spot the problem using Firebug, the debugger for Firefox:
www.sandbox.kluger.com/timeline_firebug

Hope this helps.

Let us know when you get it working, and we'll add your page to the In the Wild list of Timeline users.


Thanks,

Larry

---

From: Warf <warfs...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>
Sent: Wednesday, December 17, 2008 7:18:55 PM
Subject: Version 2.2.0 and/or hosting Simile timeline issues

[Warf]

Thanks a lot Larry... your post and video were extremely helpful
I did also track it down last night to somehow referencing
bundle.js... however I can not find that reference anywhere in my
code/
files.
The only reference I have is to timeline-bundle.js and timeline-
bundle.css
Were those files referenced somewhere else, and I was supposed to
rename them?
I did try renaming and duplicating those files... and it moves me a
few steps closer.

I also found one BIG ERROR, where I accidentally included a second
call to the MIT server,
once I removed that it came down to 1 error left, and I cannot see
where it might be
wrong.

http://www3.telus.net/warfsworld/html/travel/travel_timeline_host.htm
(line 101)

bandInfos[1].eventPainter.setLayout(bandInfos[0].eventPainter.getLayout
());
<!-- Uncaught TypeError: Object [object Object] has no method
'getLayout' -->

tl = Timeline.create(document.getElementById("travel-timeline"),
bandInfos);
Timeline.loadXML("timeline.xml", function(xml, url)
{ eventSource.loadXML(xml, url); });
}
========================
In FIREBUG it also points at "tl is undefined"

var resizeTimerID = null;
function onResize() {
if (resizeTimerID == null) {
resizeTimerID = window.setTimeout(function() {
resizeTimerID = null;
tl.layout();
}, 500);

}
}

On Dec 17, 6:38 pm, Larry Kluger <wex...@kluger.com> wrote:
> Hi Warf,
>
> Welcome to Timeline.
>
> Since you posted your url, it was easy for me to spot the problem:
>

> You're referencinghttp://www3.telus.net/warfsworld/timeline_js/bundle.js

[Larry Kluger]

Hi Warf,

Well, I can see that the ref to bundle.js in your page is now gone. You can now see from firebug that you are no longer attempting to load it.

You should not be renaming any of the bundle files. You're correct that the file is timeline-bundle.js

Regarding your current problem:

My recommendation is that you first get a minimal timeline running, then add features to it.

Regarding your error
bandInfos[1].eventPainter.setLayout(bandInfos[0].eventPainter.getLayout());

what are you trying to do there?
Looks like something from ver 1. Just take it out.
There are no setLayout or getLayout methods in the current version of the timeline software, I just did a search for them.

Use one of the examples in the current trunk version as a guide for your software.

Regards,

Larry

---

From: Warf <warfs...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>

Sent: Thursday, December 18, 2008 1:58:01 PM
Subject: Re: Version 2.2.0 and/or hosting Simile timeline issues

[Warf]

Hi Larry, Once again, very helpful... it definitely does seem to be
legacy of going from a completely functioning version 1 to a new
version 2.

I removed the line as suggested and have been tracing the newest
errors, looked through the Monet and other examples to see where I
might be going wrong, and it seems to be right, however I am still
left with...

H is Null in /timeline-bundle.js

Timeline._Impl.prototype._initialize=function(){var
H=this._containerDiv;
var E=H.ownerDocument;
H.className=H.className.split(" ").concat("timeline-container").join("
");
var C=(this.isHorizontal())?"horizontal":"vertical";
H.className+=" timeline-"+C;
while(H.firstChild){H.removeChild(H.firstChild);
}

I think I had one blank band up for a few minutes, but I know I am
close!

Thanks again for all your assistance!

Warf

On Dec 18, 11:11 am, Larry Kluger <wex...@kluger.com> wrote:
> Hi Warf,
>

[Larry Kluger]

Hi Warf,

Congrats on your progress. Programming ain't easy.

Anyhow, if I were you, I'd be thinking about two different courses of action:

1) Stepwise refinement: delete lots of stuff from your file until it works. Then add things back until it doesn't. When you find what software stops the Timeline from working, investigate intensively to figure out the issue. Or ask on the mailing list. I've sometimes deleted 75% or more of a source file to figure out what is going on. Remember to use binary search: split the file in half, and figure out which half has the problem. (You now know which 50% of the software is good, and which 50% has the error within it.) Then split the problem half in half and try both ways. You're now down to which 25% of the file holds the problem, etc.

2) Diagnosing the problem. To do this, you will want to first use the unbundled, unminimized versions of the libraries. That way you can see what is actually happening. But to solve the problem you'll need to start understanding the inards of the Timeline library. Can be done, but usually method 1 will be a lot easier and faster.

Good luck,

Larry

---

From: Warf <warfs...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>

Sent: Friday, December 19, 2008 1:26:47 AM

Subject: Re: Version 2.2.0 and/or hosting Simile timeline issues

[Michael R. Nosal]

It's complaining that it cannot find your timeline div.

Looking at your source, you have <div id="travel-timeline"> but you call
tl = Timeline.create(document.getElementById("tl"),bandInfos,
Timeline.HORIZONTAL);

You need to pass it a valid id. Change "tl" to "travel-timeline" and
it should work.

--Mike

[Warf]

Thanks Michael, that was a recent change I made to try and match what
some of the examples were showing.

Looks like I have gotten closer by identifying an error in how I was
calling the themes.js which worked in version 1, but not 2, once I
returned to the default Classic theme, my timeline is now drawing,
with a couple errors.

drawBreadCrumb is not defined
Somewhere this code is being generated and making a call to an html
file that doesn't exist.
<iframe id="simile-ajax-history" style="position: absolute; width:
10px; height: 10px; top: 0px; left: 0px; visibility: hidden;"
src="__history__.html?0">

1) How do you not display text in a band...
showEventText: false, Does not seem to be working, unless it is
being stomped by the _history_.html issue

so close... as always your advise has been much appreciated.

[Warf]

I have commented out a line in timeline-ajax-bundle.js, and the error
has gone away, not sure what side effects that might have
//A.src=SimileAjax.History.historyFile+"?0";

I also found how to not display text in a band, Simile version 1's
(showEventText: false), by replacing it with (overview: "true",)
Answer was hidden in someone else's message and not in the
documentation.

Still would love to find a way to turn of the time feature in the
bubble... I haven't been able to figure that out yet.

My webpage for this timeline now lives at
http://www3.telus.net/warfsworld/html/travel/travel_timeline.htm

Thanks Larry and Michael for your assistance

[Larry Kluger]

Hi Warf,

Sorry for the less-than-stellar docs. I have updated the getting started wiki page to refer to
overview:        true,

Note that there should not be quotations around true. It will work with them, but you're better off without.

Also, on your Timeline web page you have a note at the bottom that Java must be installed on the viewer's computer. That is not correct, Timeline does not require Java. It does require Javascript, but since Javascript is included with all browsers and is turned on by default, I don't advise mentioning it.

If you think that you'll have people trying to use your web page without Javascript enabled, include the following in your page:

<noscript>
This page uses Javascript to show you a Timeline. Please enable Javascript in your browser to see the full page. Thank you.
</noscript>

Regards,

Larry
ps. would you like your world travels timeline to be referenced by our "in the wild" wiki page? If so, write back with the correct url.

---

From: Warf <warfs...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>

Sent: Saturday, December 20, 2008 12:07:55 AM
Subject: Re: Version 2.2.0 and/or hosting Simile timeline issues


Fixed this one with parameter ---> overview:        "true",
Doesn't seem to be documented anywhere

[Magic]

Hi Larry,

I have the same problem with Warf.
I also have line "bandInfos[1].eventPainter.setLayout(bandInfos
[0].eventPainter.getLayout());" in my page because it comes from "How
to create Timelines" document.
The sample works when my page refer to "simile.mit.edu" but not work
when it refer to my local files (v2.2.0)
bundle.js from "simile.mit.edu" is 114k but my local timeline-
bundle.js is 89k only.
Why? What is the version of online Timeline library on "timeline-
bundle.js"?

Magic

On 12月22日, 上午12時34分, Larry Kluger <wex...@kluger.com> wrote:
> Hi Warf,
>
> Sorry for the less-than-stellar docs. I have updated the getting started wiki page to refer to
> overview: true,
>
> Note that there should not be quotations around true. It will work with them, but you're better off without.
>
> Also, on your Timeline web page you have a note at the bottom that Java must be installed on the viewer's computer. That is not correct, Timeline does not require Java. It does require Javascript, but since Javascript is included with all browsers and is turned on by default, I don't advise mentioning it.
>
> If you think that you'll have people trying to use your web page without Javascript enabled, include the following in your page:
>
> <noscript>
> This page uses Javascript to show you a Timeline. Please enable Javascript in your browser to see the full page. Thank you.
> </noscript>
>
> Regards,
>
> Larry
> ps. would you like your world travels timeline to be referenced by our "in the wild" wiki page? If so, write back with the correct url.
>
> ________________________________

> From: Warf <warfswo...@gmail.com>

[Larry Kluger]

Hi Magic,

I revised the page on
http://code.google.com/p/simile-widgets/wiki/Timeline_GettingStarted

several days ago.

It no longer includes the line:

bandInfos[1].eventPainter.setLayout(bandInfos[0].eventPainter.getLayout());

... and your ver 2.2.0 file shouldn't include it either.

Re: Versions:
The MIT server is serving up several versions.
See http://static.simile.mit.edu/timeline/

You should be using
http://static.simile.mit.edu/timeline/api-2.2.0

If you downloaded the software to your own server then the version is which ever you downloaded. I recommend the trunk version which has a number of great features in it beyond the 2.2.0 features. I need to spend the time to revise it to the new site/example dir layout and then release it as 2.3.0. I'm sorry that I haven't had the time, I'm currently way over committed.

I think the other important task is to completely re-write the getting started wiki page. (And test it too.)

Re: difference in bundle sizes. I haven't investigated that issue. From your email, it sounds like the newer version is smaller than the older version. I'm not surprised, David H re-wrote major chunks of Timeline based on his experiences with the prior version and on Exhibit. Re-writes and re-factoring typically lead to smaller code bases.

Regards,

Larry

---

From: Magic <magi...@gmail.com>
To: SIMILE Widgets <simile-...@googlegroups.com>
Cc: Magic <magi...@gmail.com>
Sent: Monday, December 29, 2008 11:35:11 AM