You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@edgent.apache.org by ho...@apache.org on 2016/07/13 18:38:56 UTC
[1/2] incubator-quarks git commit: QUARKS-201 screen reader text
Repository: incubator-quarks
Updated Branches:
refs/heads/master 312c6c83d -> 38cfca78f
QUARKS-201 screen reader text
Project: http://git-wip-us.apache.org/repos/asf/incubator-quarks/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-quarks/commit/eb417e87
Tree: http://git-wip-us.apache.org/repos/asf/incubator-quarks/tree/eb417e87
Diff: http://git-wip-us.apache.org/repos/asf/incubator-quarks/diff/eb417e87
Branch: refs/heads/master
Commit: eb417e8744a3cfadade326576fe6f301d1658ceb
Parents: 6afa62e
Author: Susan L. Cline <ho...@apache.org>
Authored: Wed Jul 13 11:26:24 2016 -0700
Committer: Susan L. Cline <ho...@apache.org>
Committed: Wed Jul 13 11:26:24 2016 -0700
----------------------------------------------------------------------
console/servlets/webapp_content/html/index.html | 20 +++----
console/servlets/webapp_content/js/index.js | 59 ++++++++++++++++----
.../webapp_content/resources/css/main.css | 9 +++
3 files changed, 66 insertions(+), 22 deletions(-)
----------------------------------------------------------------------
http://git-wip-us.apache.org/repos/asf/incubator-quarks/blob/eb417e87/console/servlets/webapp_content/html/index.html
----------------------------------------------------------------------
diff --git a/console/servlets/webapp_content/html/index.html b/console/servlets/webapp_content/html/index.html
index 3122ae5..fdea9da 100644
--- a/console/servlets/webapp_content/html/index.html
+++ b/console/servlets/webapp_content/html/index.html
@@ -24,8 +24,9 @@
<label for="jobs" class="jobsLabel">Job:</label>
<select id="jobs"></select>
</div>
-<div style="float:left;">
-<img id="stateImg" width="28" height="28" style="display:none;" tabindex=0 alt="Job state" src="resources/images/state.png"/>
+<div id='stateImg' tabindex=0 style="float:left; display:none; margin-top: 10px; margin-left: 5px; margin-right: 10px;">
+<div class="hidden">Job state, press the Enter key to display the job state information in a table</div>
+<img width="28" height="28" alt="job state" src="resources/images/state.png"/>
</div>
<div class="topControls">
<label for="layers" class="layersLabel">View by:</label>
@@ -36,8 +37,6 @@
</select>
<div id="tagsDiv" style="visibility:hidden;margin-top: 5px;">
-
-
<input type='checkbox' id='showTags' checked/>
<label for='showTags'>Show tags:</label>
<div>
@@ -53,10 +52,10 @@
</div>
</div>
<div class="topControls">
-<label for="refreshInterval" class="refreshLabel">Refresh interval:</label>
-<input id="refreshInterval" style='width: 40px;' type="number" min="3" max="20" step="1" value="5"/>
-<label title="seconds" style='margin-left: 5px; margin-right: 10px;'>seconds</label>
-<button id="toggleTimer" type="button">Pause graph</button>
+<label class="refreshLabel" tabindex=0>Refresh interval:</span>
+<input aria-label='Refresh interval' name='refreshInterval' id="refreshInterval" style='width: 40px;' type="number" min="3" max="20" step="1" value="5"/>
+<label title="seconds" tabindex=0 style='margin-left: 5px; margin-right: 10px;'>seconds</label>
+<button id="toggleTimer" title='Pause graph' type="button">Pause graph</button>
</div>
<div style='width: 300px; margin-left: 30px; clear:both;'>
@@ -90,8 +89,9 @@
<div class="metricsControls">
<span id="noLineChartWarning" style="visibility:hidden;" class="warningLabel">*Line charts are not available when you select a metric containing multiple oplets</span>
</div>
-<div style='clear:left; padding-top: 10px; width: 140px;'>
-<img id="showMetricsTable" width="150" height="38" tabindex=0 alt="Show metrics table" src="resources/images/show_metrics_in_table.png"/>
+<div id="showMetricsTable" tabindex=0 style='clear:left; padding-top: 10px; width: 150px;'>
+<div class='hidden'>Show metrics in table. Press the Enter key to display available metrics in a table. To close the dialog once it is open, press the Escape key.</div>
+<img width="150" height="38" alt='show table metrics' src="resources/images/show_metrics_in_table.png"/>
</div>
<div id="metricsChart" style="clear:left;"></div>
http://git-wip-us.apache.org/repos/asf/incubator-quarks/blob/eb417e87/console/servlets/webapp_content/js/index.js
----------------------------------------------------------------------
diff --git a/console/servlets/webapp_content/js/index.js b/console/servlets/webapp_content/js/index.js
index 263bcdf..33ebac7 100644
--- a/console/servlets/webapp_content/js/index.js
+++ b/console/servlets/webapp_content/js/index.js
@@ -139,12 +139,14 @@ d3.select("#toggleTimer")
stopTimer = true;
d3.select(this).text("Resume graph");
d3.select(this)
- .attr("class", "start");
+ .attr("class", "start")
+ .attr("title", "Resume graph")
} else {
stopTimer = false;
d3.select(this).text("Pause graph");
d3.select(this)
- .attr("class", "stop");
+ .attr("class", "stop")
+ .attr("title", "Pause graph");
}
});
@@ -318,7 +320,7 @@ var showMetricsTooltip = function(event) {
});
var rowIdx = 0;
- content += "<table><tr><th tabindex=0>Operator name</th><th tabindex=0>Counter value</th></tr>";
+ content += "<table role='presentation'><caption>Counter oplet values</caption><tr><th tabindex=0>Operator name</th><th tabindex=0>Counter value</th></tr>";
var sortFunc = function(objA, objB) {
var a = objA.opId;
@@ -356,7 +358,7 @@ var showMetricsTooltip = function(event) {
if (rateArr.length > 0) {
rateArr.sort(sortFunc);
- content += "<table><tr><th tabindex=0>Operator name</th><th tabindex=0>Rate type</th><th tabindex=0>Rate value</th></tr>";
+ content += "<table role='presentation'><caption>Rate meter oplet values</caption><tr><th tabindex=0>Operator name</th><th tabindex=0>Rate type</th><th tabindex=0>Rate value</th></tr>";
rateArr.forEach(function(rate) {
rowIdx++;
@@ -374,9 +376,20 @@ var showMetricsTooltip = function(event) {
}
}
- var evtX = evt.srcElement.x;
- var evtY = evt.srcElement.y;
content += "</div>";
+
+ var evtX;
+ var evtY;
+ var target = evt.target;
+ if (target) {
+ if (target.x && target.y) {
+ evtX = target.x;
+ evtY = target.y;
+ } else if (target.offsetLeft && target.offsetTop) {
+ evtX = target.offsetLeft;
+ evtY = target.offsetTop;
+ }
+ }
metricsTooltip
.html(content)
@@ -509,10 +522,11 @@ var displayRowsTooltip = function(newRequest) {
if (newRequest) {
var htmlStr = "<html><head><title>Oplet properties</title><link rel='stylesheet' type='text/css' href='resources/css/main.css'></head>" +
"<body>";
- var buttonStr = '<button id="pauseTableRefresh" type="button">Pause table refresh</button>';
- var tableHdr = "<table id='allPropsTable' tabindex=0 style='width: 675px;margin: 10px;table-layout:fixed;word-wrap: break-word;'>";
+ var buttonStr = '<button title="Pause table refresh" id="pauseTableRefresh" type="button">Pause table refresh</button>';
+ var closeWinStr = '<button title="Close window" id="closeTablePropsWindow" type="button">Close window</button>';
+ var tableHdr = "<table id='allPropsTable' tabindex=0 style='width: 675px;margin: 10px;table-layout:fixed;word-wrap: break-word;'><caption>Oplet properties</caption>";
- var str = htmlStr + buttonStr + tableHdr + headerStr + content + "</table></body><html>";
+ var str = htmlStr + buttonStr + closeWinStr + tableHdr + headerStr + content + "</table></body><html>";
propWindow = window.open("", "Properties", "width=825,height=500,scrollbars=yes,dependent=yes");
propWindow.document.body.innerHTML = "";
propWindow.document.write(str);
@@ -531,12 +545,22 @@ var displayRowsTooltip = function(newRequest) {
function() {
if (this.innerHTML === "Pause table refresh") {
this.innerHTML = "Resume table refresh";
+ this.title = "Resume table refresh";
refreshTable = false;
} else {
this.innerHTML = "Pause table refresh";
+ this.title = "Pause table refresh";
refreshTable = true;
}
};
+
+ var closeBtn = propWindow.document.getElementById("closeTablePropsWindow");
+ closeBtn.onclick =
+ function() {
+ if (propWindow) {
+ propWindow.close();
+ }
+ };
} else {
if (refreshTable) {
if (typeof(propWindow) === "object") {
@@ -554,7 +578,7 @@ var showStateTooltip = function(event) {
}
var jobId = d3.select("#jobs").node().value;
var jobObj = jobMap[jobId];
- var content = "<div style='margin:10px'><table>";
+ var content = "<div style='margin:10px'><table><caption>Job State</caption>";
var rowPfx = "stateData";
var startTd = "<td align='center' tabindex=0>";
@@ -596,8 +620,19 @@ var showStateTooltip = function(event) {
}
- var evtX = d3.event.srcElement.x;
- var evtY = d3.event.srcElement.y;
+ var evtX;
+ var evtY;
+ var target = d3.event.target;
+ if (target) {
+ if (target.x && target.y) {
+ evtX = target.x;
+ evtY = target.y;
+ } else if (target.offsetLeft && target.offsetTop) {
+ evtX = target.offsetLeft;
+ evtY = target.offsetTop;
+ }
+ }
+
content += "</div>";
stateTooltip
http://git-wip-us.apache.org/repos/asf/incubator-quarks/blob/eb417e87/console/servlets/webapp_content/resources/css/main.css
----------------------------------------------------------------------
diff --git a/console/servlets/webapp_content/resources/css/main.css b/console/servlets/webapp_content/resources/css/main.css
index 222b7ab..4f7d34d 100644
--- a/console/servlets/webapp_content/resources/css/main.css
+++ b/console/servlets/webapp_content/resources/css/main.css
@@ -240,3 +240,12 @@ td.center100 {
caption {
font-weight: bold;
}
+
+.hidden {
+ position:absolute;
+ left:-10000px;
+ top:auto;
+ width:1px;
+ height:1px;
+ overflow:hidden;
+}
\ No newline at end of file
[2/2] incubator-quarks git commit: Merge branch 'pr-166'
Posted by ho...@apache.org.
Merge branch 'pr-166'
Project: http://git-wip-us.apache.org/repos/asf/incubator-quarks/repo
Commit: http://git-wip-us.apache.org/repos/asf/incubator-quarks/commit/38cfca78
Tree: http://git-wip-us.apache.org/repos/asf/incubator-quarks/tree/38cfca78
Diff: http://git-wip-us.apache.org/repos/asf/incubator-quarks/diff/38cfca78
Branch: refs/heads/master
Commit: 38cfca78fdeb83610e027d5545d57ee1dde45369
Parents: 312c6c8 eb417e8
Author: Susan L. Cline <ho...@apache.org>
Authored: Wed Jul 13 11:38:30 2016 -0700
Committer: Susan L. Cline <ho...@apache.org>
Committed: Wed Jul 13 11:38:30 2016 -0700
----------------------------------------------------------------------
console/servlets/webapp_content/html/index.html | 20 +++----
console/servlets/webapp_content/js/index.js | 59 ++++++++++++++++----
.../webapp_content/resources/css/main.css | 9 +++
3 files changed, 66 insertions(+), 22 deletions(-)
----------------------------------------------------------------------