Repository: chukwa Updated Branches: refs/heads/master e0ff0ea8b -> 384e3a13a
CHUKWA-815. Refine add widget, and chart hovering interactions. (Eric Yang) Project: http://git-wip-us.apache.org/repos/asf/chukwa/repo Commit: http://git-wip-us.apache.org/repos/asf/chukwa/commit/384e3a13 Tree: http://git-wip-us.apache.org/repos/asf/chukwa/tree/384e3a13 Diff: http://git-wip-us.apache.org/repos/asf/chukwa/diff/384e3a13 Branch: refs/heads/master Commit: 384e3a13a82f37b26e9e6e8ff8c8f34d2acabe9e Parents: e0ff0ea Author: Eric Yang <[email protected]> Authored: Thu Nov 24 10:43:23 2016 -0800 Committer: Eric Yang <[email protected]> Committed: Thu Nov 24 10:43:23 2016 -0800 ---------------------------------------------------------------------- CHANGES.txt | 2 ++ src/main/web/hicc/WEB-INF/vm/chart.vm | 1 + src/main/web/hicc/home/index.html | 11 +++++++++-- src/main/web/hicc/js/flot.extend.js | 31 ++++++++---------------------- 4 files changed, 20 insertions(+), 25 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/chukwa/blob/384e3a13/CHANGES.txt ---------------------------------------------------------------------- diff --git a/CHANGES.txt b/CHANGES.txt index 8b3059d..3780ac6 100644 --- a/CHANGES.txt +++ b/CHANGES.txt @@ -7,6 +7,8 @@ Trunk (unreleased changes) IMPROVEMENTS CHUKWA-814. Update HBase and Solr support for Docker demo. (Eric Yang) + CHUKWA-815. Refine add widget, and chart hovering interactions. (Eric Yang) + BUGS CHUKWA-813. Fix logviewer for sorting log entries. (Eric Yang) http://git-wip-us.apache.org/repos/asf/chukwa/blob/384e3a13/src/main/web/hicc/WEB-INF/vm/chart.vm ---------------------------------------------------------------------- diff --git a/src/main/web/hicc/WEB-INF/vm/chart.vm b/src/main/web/hicc/WEB-INF/vm/chart.vm index 67d671c..3cea43c 100644 --- a/src/main/web/hicc/WEB-INF/vm/chart.vm +++ b/src/main/web/hicc/WEB-INF/vm/chart.vm @@ -73,6 +73,7 @@ var _options={ #if ( $chart.getYMax()!=0 ) max: $chart.getYMax(), #end + labelWidth: 60, tickFormatter: function(val, axis) { #if ( $chart.getYUnitType().equals('bytes') ) #parse("unit-bytes-binary.vm") http://git-wip-us.apache.org/repos/asf/chukwa/blob/384e3a13/src/main/web/hicc/home/index.html ---------------------------------------------------------------------- diff --git a/src/main/web/hicc/home/index.html b/src/main/web/hicc/home/index.html index 412a3ba..fa9f8bb 100755 --- a/src/main/web/hicc/home/index.html +++ b/src/main/web/hicc/home/index.html @@ -175,7 +175,7 @@ function load() { grid_data = data.grid; var options = { - cellHeight: 110, + cellHeight: 130, verticalMargin: 10, handle: '.widget-header' }; @@ -315,13 +315,20 @@ $(function(){ //DOM Ready event.preventDefault(); var title = $('#url').val(); if(title in widgetsToUrl) { + $("html, body").animate({ scrollTop: $(document).height() }, "slow"); var url = widgetsToUrl[title]; var gridstack = $(".grid-stack").data('gridstack'); - gridstack.addWidget(buildWidget(url), 0, 0, 1, 1); + gridstack.addWidget(buildWidget(url), 1, 100, 5, 3); } } }); + $( "#url" ).keyup(function( event ) { + if ( event.which == 13 ) { + $('#url').val(''); + } + }); + $.ajax({ url: '/hicc/v1/dashboard/whoami', cache: false http://git-wip-us.apache.org/repos/asf/chukwa/blob/384e3a13/src/main/web/hicc/js/flot.extend.js ---------------------------------------------------------------------- diff --git a/src/main/web/hicc/js/flot.extend.js b/src/main/web/hicc/js/flot.extend.js index af05d99..40feb1a 100644 --- a/src/main/web/hicc/js/flot.extend.js +++ b/src/main/web/hicc/js/flot.extend.js @@ -105,7 +105,7 @@ function calculateStatis() { */ function showTooltip(x, y, contents) { if(x>document.body.clientWidth*.6) { - x=x-200; + x=x-50; } if(y>document.body.clientHeight*.7) { y=y-40; @@ -116,7 +116,7 @@ function showTooltip(x, y, contents) { top: y + 5, left: x + 5, 'border-radius': '5px', - border: '2px solid #aaa', + border: '2px solid #496274', padding: '2px', 'color': '#fff', 'background-color': '#496274', @@ -154,7 +154,7 @@ options={ }, selection: { mode: "xy" }, grid: { - hoverable: false, + hoverable: true, clickable: true, tickColor: "#C0C0C0", backgroundColor:"#FFFFFF" @@ -166,36 +166,21 @@ options={ * bind the function for the hightlight the point in the chart. */ var previousPoint = null; -$("#placeholder").bind("plotclick", function (event, pos, item) { +$("#placeholder").bind("plothover", function (event, pos, item) { var leftPad = function(n) { n = "" + n; return n.length == 1 ? "0" + n : n; }; if (item) { + var contents = "<div style='width:14px;height:10px;background-color:"+item.series.color+";overflow:hidden;display:inline-block;'></div>"; if (previousPoint != item.datapoint) { previousPoint = item.datapoint; pause = true; $("#tooltip").remove(); - if(xLabels.length==0) { - var x = item.datapoint[0], - y = item.stackValue.toFixed(2); - var dnow=new Date(); - dnow.setTime(x); - var dita; - if(Cookies.get("tz")=="") { - dita=leftPad(dnow.getFullYear())+"/"+leftPad(dnow.getMonth()+1)+"/"+dnow.getDate()+" "+leftPad(dnow.getHours())+":"+leftPad(dnow.getMinutes())+":"+leftPad(dnow.getSeconds()); - } else { - dita=leftPad(dnow.getUTCFullYear())+"/"+leftPad(dnow.getUTCMonth()+1)+"/"+dnow.getUTCDate()+" "+leftPad(dnow.getUTCHours())+":"+leftPad(dnow.getUTCMinutes())+":"+leftPad(dnow.getUTCSeconds()); - } - showTooltip(item.pageX, item.pageY, - item.series.label + ": " + y + "<br>Time: " + dita); - } else { - var x = item.datapoint[0], + var x = item.datapoint[0], y = item.stackValue.toFixed(2); - xLabel = xLabels[x]; - showTooltip(item.pageX, item.pageY, - item.series.label + ": " + y + "<br>" + xLabel); - } + showTooltip(item.pageX, item.pageY, + contents + " " + y); } } else { $("#tooltip").remove();
