search

padefla / simile-widgets

Automatically exported from code.google.com/p/simile-widgets
0 stars 0 forks source link

Timeline disappears on refresh of page #455

Open GoogleCodeExporter opened 8 years ago

GoogleCodeExporter commented 8 years ago 
What steps will reproduce the problem?
1. Refreshing the page
2.
3.

What is the expected output? What do you see instead? When I load the page 
initially the timeline works perfectly. When I refresh the page I get a 
'Timeline' is undefined error or a 'tl' is null or not an object error. 

What version of the product are you using? On what browser and what
operating system? I'm using the api-2.3.0 version. I used the tutorial on the 
google code site. I'm using IE and I think it is 9.

Please provide any additional information below. I've attached the .mht version 
of the file. Thank you so, so much for your help :)

Original issue reported on code.google.com by JasmineB...@gmail.com on 24 Oct 2011 at 5:37

GoogleCodeExporter commented 8 years ago 
Here is actually the code instead of the mht file:

<%@ Page Title="" Language="VB" 
MasterPageFile="~/Templates/Acctg_Template.master" AutoEventWireup="false" 
CodeFile="Slideshow.aspx.vb" Inherits="Test_Sites_Jasmine_Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="Title" Runat="Server">

<script>    Timeline_urlPrefix = 
"http://static.simile.mit.edu/timeline/api-2.3.0/"; ;</script>

<script 
src="http://static.simile.mit.edu/timeline/api-2.3.0/timeline-api.js?bundle=fals
e" type="text/javascript"></script> 

</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="PageContent" Runat="Server"> 

<script type="text/javascript">
    var tl;
    function onLoad() {
        var eventSource = new Timeline.DefaultEventSource();
        var bandInfos = [
 Timeline.createBandInfo({
     eventSource: eventSource,
     date: "Sep 18 2011 00:00:00 GMT",
     width: "80%",
     intervalUnit: SimileAjax.DateTime.WEEK,
     intervalPixels: 50
 }),
   Timeline.createBandInfo({
       overview: true,
       eventSource: eventSource,
       date: "Sep 18 2011 00:00:00 GMT",
       width: "20%",
       intervalUnit: SimileAjax.DateTime.MONTH,
       intervalPixels: 200
   })
   ];
        bandInfos[1].syncWith = 0;
        bandInfos[1].highlight = true;
        tl = Timeline.create(document.getElementById("my-timeline"), bandInfos);
        Timeline.loadXML("example1.xml", function (xml, url) { eventSource.loadXML(xml, url); });
    }
    var resizeTimerID = null;
    function onResize() {
        if (resizeTimerID == null) {
            resizeTimerID = window.setTimeout(function () {
                resizeTimerID = null;
                tl.layout();
            }, 500);
        }
    }

   </script> 

<style>
#orange
{
 position: absolute;
    left: 12px;
    top: 225px;
    z-index:1;    
}
#cal
{ 
    position: absolute;
    left: 280px;
    top: 300px;
    z-index:2;
}
#tab
{
    position: absolute;
    left:162px;
    top:191px;
    width:930px;
    height:34px;
    z-index:3;
}

#blue
{
    position: absolute;
    left: 12px;
    top: 160px;
    z-index:4;
}
#title 
{
    position: absolute;
    left: 130px;
    top: 190px;
    z-index:5;
}
h1 
{
    color:White;
}

</style>

 <!-- <body onload="onLoad();" onresize="onResize();">   -->
      <body onload="onLoad();" onresize="onResize();"> 

<div id="cal">
<div id="my-timeline" style="height: 300px; width: 800px; border: 1px solid 
#aaa"></div>
</div>

<div id="orange">
<img src="Images/Orange.png" width="1080" height="520" />
</div>

<div id="blue">
<img src="Images/blue.gif" />
</div>

<div id="tab">

<img src="Images/tab.gif" width="930" height="34"/>

</div>

<h1 id="title">ERP</h1>

<div>
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />
    <br />

    </div>

  </body>
  </asp:Content>

Original comment by JasmineB...@gmail.com on 24 Oct 2011 at 5:39