Handling Simile Timeline in GWT application.

During a project I had to use Simile Timeline with GXT. I handled mouse wheel zoomin, scrolling, event click handling, dynamically loading events as timeline scrolls etc in GWT-EXT application. I was difficult task and took lot of time to handle these things. Here I am pasting my code for some of the solutions.

How did I change the font size
timeline.css

.timeline-container {
position: relative;
overflow: hidden;
font-size:10;
font-color:red;
}

Added these two lines
font-size:10;
font-color:red;

This style is applied to the div element in which timeline is rendered.


How did I cleare the timeline events to re-render the events on prevously rendered dates.
$wnd.Timeline.timelines[0].getBand(0).getEventSource().clear();

If you want to clear band number 2 the it becomes
$wnd.Timeline.timelines[0].getBand(1).getEventSource().clear();

Handling scroll events

public native static void addScrollListener(int index,
CustomTimeLine timeLine)/*-{
timeLine.getBand(index).addOnScrollListener($wnd.bandScroll);
}-*/;

public static void bandScroll(double startDate, double endDate) {

MessageBox.alert("scroll Event recieved");

}



Handling zoom events

import com.google.gwt.core.client.JavaScriptObject;

public class ZoomStepOptions extends JavaScriptObject {
protected ZoomStepOptions() {
super();
}

public static ZoomStepOptions create() {
return ZoomStepOptionsImpl.create();
}

/**
* required, start date
*
* @param value
*/
public final void setPixelsPerInterval(int value) {
JavaScriptObjectHelper.setAttribute(this, "pixelsPerInterval", value);
}

/**
* required, Unit
*
* @param value
*/
// value =
// Timeline.DateTime.HOUR,Timeline.DateTime.DAY,Timeline.DateTime.MONTH
public final void setUnit(int value) {
JavaScriptObjectHelper.setAttribute(this, "unit", value);
}

}


class ZoomStepOptionsImpl {
public static native ZoomStepOptions create()/*-{
return new Object;
}-*/;
}


import java.util.List;

import com.google.gwt.core.client.JavaScriptObject;

class JavaScriptObjectHelper {

private JavaScriptObjectHelper() {

}

public static native String getAttribute(JavaScriptObject elem, String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : String(ret);
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
String value) /*-{
elem[attr] = value;
}-*/;

public static native JavaScriptObject getAttributeAsJavaScriptObject(
JavaScriptObject elem, String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : ret;
}-*/;

public static native JavaScriptObject[] getAttributeAsJavaScriptObjectArray(
JavaScriptObject elem, String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : ret;
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
JavaScriptObject[] value) /*-{
elem[attr] = value;
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
JavaScriptObject value) /*-{
elem[attr] = value;
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
int value) /*-{
elem[attr] = value;
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
boolean value) /*-{
elem[attr] = value;
}-*/;

public static native void setDateAttribute(JavaScriptObject elem,
String attr, String value) /*-{
var dateValue=new Date(value);
elem[attr] = dateValue;
alert("dateValue="+dateValue);
alert(elem.id + " " + elem.start);
}-*/;

public static native void setAttribute(JavaScriptObject elem, String attr,
float value) /*-{
elem[attr] = value;
}-*/;

public static native int getAttributeAsInt(JavaScriptObject elem,
String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : ret;
}-*/;

public static native float getAttributeAsFloat(JavaScriptObject elem,
String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : ret;
}-*/;

public static int[] getAttributeAsIntArray(JavaScriptObject elem,
String attr) {
int[] rtn = null;
JavaScriptObject hold = getAttributeAsJavaScriptObject(elem, attr);
if (hold != null) {
rtn = new int[getJavaScriptObjectArraySize(hold)];

for (int i = 0; i < rtn.length; i++) {
rtn[i] = getIntValueFromJavaScriptObjectArray(hold, i);
}
}

return rtn;
}

public static native int getJavaScriptObjectArraySize(JavaScriptObject elem) /*-{
if (elem) return elem.length;
return 0;
}-*/;

public static native int getIntValueFromJavaScriptObjectArray(
JavaScriptObject elem, int i) /*-{
return elem[i];
}-*/;

public static native void setAttributeAsIntArray(JavaScriptObject elem,
String attr, int[] value) /*-{
elem[attr] = value;
}-*/;

public static native boolean getAttributeAsBoolean(JavaScriptObject elem,
String attr) /*-{
var ret = elem[attr];
return (ret === undefined) ? null : ret;
}-*/;

/**
* Helper function to create [] array from List.
*
* @param list
*
* @return array of objects
*/
public static JavaScriptObject[] listToArray(List list) {
JavaScriptObject[] array = new JavaScriptObject[list.size()];

for (int i = 0; i < array.length; i++) {
array[i] = (JavaScriptObject) list.get(i);
}

return array;
}

public static JavaScriptObject arrayConvert(Object[] array) {
JavaScriptObject result = newJSArray(array.length);
for (int i = 0; i < array.length; i++) {
arraySet(result, i, array[i]);
}
return result;
}

public static JavaScriptObject arrayConvert(JavaScriptObject[] array) {
JavaScriptObject result = newJSArray(array.length);
for (int i = 0; i < array.length; i++) {
arraySet(result, i, array[i]);
}
return result;
}

private static native JavaScriptObject newJSArray(int length) /*-{
if (length < 0)
{
return new Array();
}
else
{
return new Array(length);
}
}-*/;

public static native int arrayLength(JavaScriptObject array) /*-{
return array.length;
}-*/;

public static native Object arrayGetObject(JavaScriptObject array, int index) /*-{
return array[index];
}-*/;

public static native void arraySet(JavaScriptObject array, int index,
Object value) /*-{
array[index] = value;
}-*/;

public static native void arraySet(JavaScriptObject array, int index,
JavaScriptObject value) /*-{
array[index] = value;
}-*/;
}