FELIX-1607 - First version of a timeline.
git-svn-id: https://svn.apache.org/repos/asf/felix/trunk@818495 13f79535-47bb-0310-9956-ffa450edef68
diff --git a/webconsole-plugins/event/src/main/resources/res/ui/events.js b/webconsole-plugins/event/src/main/resources/res/ui/events.js
index e3b8ef2..771451f 100644
--- a/webconsole-plugins/event/src/main/resources/res/ui/events.js
+++ b/webconsole-plugins/event/src/main/resources/res/ui/events.js
@@ -14,6 +14,8 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
+var view = 0;
+
function renderStatusLine() {
$("#plugin_content").append( "<div class='fullwidth'><div class='statusline'/></div>" );
}
@@ -43,6 +45,13 @@
entry( eventData.data[idx] );
}
$("#plugin_table").trigger("update");
+ if ( view == 1 ) {
+ $("#timeline").remove();
+ $("div.table").append( "<div id='timeline'></div>" );
+ for ( var idx in eventData.data ) {
+ entryTimeline( eventData.data[idx] );
+ }
+ }
}
function entry( /* Object */ dataEntry ) {
@@ -51,16 +60,23 @@
$("#plugin_table > tbody").append(trElement);
}
+function entryTimeline( /* Object */ dataEntry ) {
+ var txt = "<div class='event" + dataEntry.category + "' style='width:" + dataEntry.width + "%;'>";
+ txt = txt + "<b>" + dataEntry.topic + "</b> ";
+ if ( dataEntry.info ) {
+ txt = txt + dataEntry.info;
+ }
+ txt = txt + "</div>";
+ $("#timeline").append(txt);
+}
function entryInternal( /* Element */ parent, /* Object */ dataEntry ) {
var id = dataEntry.id;
var topic = dataEntry.topic;
var properties = dataEntry.properties;
- var styleClass = dataEntry.category;
- if ( styleClass.length == 0 ) styleClass = null; else styleClass = "event" + styleClass;
- parent.appendChild( td( styleClass, null, [ text( printDate(dataEntry.received) ) ] ) );
- parent.appendChild( td( styleClass, null, [ text( topic ) ] ) );
+ parent.appendChild( td( null, null, [ text( printDate(dataEntry.received) ) ] ) );
+ parent.appendChild( td( null, null, [ text( topic ) ] ) );
var propE;
if ( dataEntry.info ) {
@@ -71,10 +87,10 @@
tableE.appendChild(bodyE);
for( var p in dataEntry.properties ) {
- var c1 = td(styleClass, null, [text(p)]);
+ var c1 = td(null, null, [text(p)]);
$(c1).css("border", "0px none");
$(c1).css("padding", "0 4px 0 0");
- var c2 = td(styleClass, null, [text(dataEntry.properties[p])]);
+ var c2 = td(null, null, [text(dataEntry.properties[p])]);
$(c2).css("border", "0px none");
$(c2).css("padding", "0 0 0 4px");
bodyE.appendChild(tr(null, null, [ c1, c2 ]));
@@ -82,7 +98,7 @@
propE = tableE;
}
- parent.appendChild( td( styleClass, null, [propE] ) );
+ parent.appendChild( td( null, null, [propE] ) );
}
/* displays a date in the user's local timezone */
@@ -97,15 +113,32 @@
}, "json");
}
+function switchView() {
+ if ( view == 0 ) {
+ view = 1;
+ $("#plugin_table").hide();
+ $(".switchButton").empty();
+ $(".switchButton").append("List");
+ loadData();
+ } else {
+ view = 0;
+ $("#timeline").remove();
+ $("#plugin_table").show();
+ $(".switchButton").empty();
+ $(".switchButton").append("Timeline");
+ }
+}
function renderEvents() {
$(document).ready(function(){
renderView( ["Received", "Topic", "Properties"],
+ "<button class='switchButton' type='button' name='switch'>Timeline</button>" +
"<button class='clearButton' type='button' name='clear'>Clear List</button>" +
"<button class='reloadButton' type='button' name='reload'>Reload</button>");
loadData();
$("#plugin_table").tablesorter();
$(".reloadButton").click(loadData);
+ $(".switchButton").click(switchView);
$(".clearButton").click(function () {
$("#plugin_table > tbody > tr").remove();
$.post(pluginRoot, { "action":"clear" }, function(data) {