boxtec
/
yacy_search_server
mirror of https://github.com/yacy/yacy_search_server
4
1
Fork 0
Code Issues Projects Releases Wiki Activity

Improved Index Browser accessibility with semantically richer html tags.

Browse Source 
Made use of ol, li, thead, th, tbody, h1 and h2 html tags.
Added aria-label attributes to provide alternative textual information
previously only conveyed by color cue.

Tested behavior with NVDA 2016.4 screen reader.
pull/105/head
luccioman 8 years ago
parent fc01b69eca
commit d0182e4797
1 changed files with 46 additions and 37 deletions
Show Stats Download Patch File Download Diff File

83
htroot/HostBrowser.html
Unescape View File

@ -41,14 +41,15 @@ function updatepage(str) {
if (totalResults > 0 && firstChannel.items.length > 0) {
var item;
html += "<table class=\"networkTable\" style=\"border-width:0; width:99%;\" cellpadding=\"2\" cellspacing=\"1\">";
html += "<tr class=\"TableHeader\" valign=\"bottom\">";
html += "<td>URL from index (total results = " + totalResults + ")<\/td>";
html += "<table class=\"networkTable\" style=\"border-width:0; width:99%; border-spacing:1px;\">";
html += "<thead><tr class=\"TableHeader\" style=\"vertical-align:bottom;\">";
html += "<th style=\"padding: 2px;\">URL from index (total results = " + totalResults + ")<\/th></tr></thead>";
html += "<tbody>";
for (var i = 0; i < firstChannel.items.length; i++) {
item = firstChannel.items[i];
html += "<tr class=\"TableCellLight\"><td align=\"left\"><a href=\"HostBrowser.html?admin=#[admin]#&pathsearch=&amp;path=" + item.link + "\">" + item.link + "<\/a><\/td>";
html += "<tr class=\"TableCellLight\"><td style=\"padding: 2px;text-align:left;\"><a href=\"HostBrowser.html?admin=#[admin]#&pathsearch=&amp;path=" + item.link + "\">" + item.link + "<\/a><\/td>";
}
html += "<\/table>";
html += "</tbody><\/table>";
}
document.getElementById("searchresults").innerHTML = html;
}
@ -75,14 +76,14 @@ function updatepage(str) {
#%env/templates/header.template%#
#%env/templates/submenuWebStructure.template%#
#(/topmenu)#
<h2>Index Browser</h2>
<h1>Index Browser</h1>
<p>Browse the index of #[ucount]# documents. Enter a host or an URL for a file list or view a list of <a href="HostBrowser.html?admin=#[admin]#&hosts=">all hosts</a>#(authorized)#::, <a href="HostBrowser.html?admin=#[admin]#&hosts=crawling">only hosts with urls pending in the crawler</a> or <a href="HostBrowser.html?admin=#[admin]#&hosts=error">only with load errors</a>#(/authorized)#.</p>
<form action="HostBrowser.html" id="searchform" method="get" onkeyup="xmlhttpPost(); return false;">
<form action="HostBrowser.html" id="searchform" method="get" role="search">
<fieldset class="yacys">
<input type="hidden" name="admin" id="admin" value="#[admin]#" />
<div class="input-group" style="width:600px;float:left;">
<span class="input-group-addon">Host/URL</span>
<input id="search" type="text" name="path" value="#[path]#" maxlength="250" class="form-control"/>
<label for="search" class="input-group-addon">Host/URL</label>
<input id="search" type="search" name="path" value="#[path]#" maxlength="250" class="form-control" onkeyup="xmlhttpPost(); return false;"/>
<div class="input-group-btn">
<button id="list" name="list" class="btn btn-primary">Browse Host</button>
</div>
@ -98,19 +99,21 @@ function updatepage(str) {
#(hosts)#::
<fieldset><legend>Host List</legend>
#{list}#
<div style="float:left; padding:1px 5px 1px 5px;">
<ol style="list-style-type : none; padding-left: 0px">
#{list}#
<li style="float:left; padding:1px 5px 1px 5px;">
<div style="width:180px; text-align:left; float: left; white-space:nowrap; overflow:hidden;"><div><img src="env/grafics/#(type)#invisible.png::burn-e.gif::construction.gif#(/type)#" alt="#(type)#::Host has load error(s)::Pending in Crawler#(/type)#" title="#(type)#::Host has load error(s)::Pending in Crawler#(/type)#" style="float:left" width="12" height="8">&nbsp;<a href="HostBrowser.html?admin=#[admin]#&path=#[host]#&facetcount=#[count]#">#[host]#</a></div></div>
<div style="width:120px; text-align:right; float: left; white-space:nowrap; overflow:hidden;"><span class="commit">#[count]#</span>#(crawler)#::/<span class="pending">#[pending]#</span>#(/crawler)##(errors)#::/<span class="info">#[exclcount]#</span>/<span class="error">#[failcount]#</span>#(/errors)# URLs</div>
</div>
#{/list}#
<div style="width:120px; text-align:right; float: left; white-space:nowrap; overflow:hidden;"><span class="commit" aria-label="#[count]# valid">#[count]#</span>#(crawler)#::/<span class="pending" aria-label="#[pending]# pending">#[pending]#</span>#(/crawler)##(errors)#::/<span class="info" aria-label="#[exclcount]# excluded">#[exclcount]#</span>/<span class="error" aria-label="#[failcount]# failed">#[failcount]#</span>#(/errors)# URLs</div>
</li>
#{/list}#
</ol>
<div style="clear:both; float:left; padding:10px 5px 1px 5px;">
<div style="float:left;clear:both;">Count Colors:</div>
<div class="commit" style="float:left;">&nbsp;&nbsp;&nbsp;Documents without Errors</div>
<span>Count Colors:</span>
<span class="commit">&nbsp;&nbsp;&nbsp;Documents without Errors</span>
#(authorized)#::
<div class="pending" style="float:left;">&nbsp;&nbsp;&nbsp;Pending in Crawler</div>
<div class="info" style="float:left;">&nbsp;&nbsp;&nbsp;Crawler Excludes</div>
<div class="error" style="float:left;">&nbsp;&nbsp;&nbsp;Load Errors</div>
<span class="pending">&nbsp;&nbsp;&nbsp;Pending in Crawler</span>
<span class="info">&nbsp;&nbsp;&nbsp;Crawler Excludes</span>
<span class="error">&nbsp;&nbsp;&nbsp;Load Errors</span>
#(/authorized)#
</div>
</fieldset>
@ -173,15 +176,17 @@ var solr= $.getJSON("solr/collection1/select?q=*:*&defType=edismax&start=0&rows=
<p>documents stored for host: #[hostsize]#; documents stored for subpath: #[subpathloadsize]#; unloaded documents detected in subpath: #[subpathdetectedsize]# <!-- #(complete)#;<a href="HostBrowser.html?admin=#[admin]#&complete=true&path=#[path]#">get complete list</a>::<a href="HostBrowser.html?admin=#[admin]#&path=#[path]#">directory view</a>#(/complete)#-->
</p>
<table class="sortable" style="float:left; border-width: 0">
<tr>
<th style="text-align:center; width:32"></th>
<th style="text-align:left; width: 600" class="listing">Path</th>
<td style="text-align:right" class="listingem">stored</td>
<td style="text-align:right" class="listingem">linked</td>
<td style="text-align:right" class="listingem">pending</td>
<td style="text-align:right" class="listingem">excluded</td>
<td style="text-align:right" class="listingem">failed</td>
</tr>
<thead>
<tr>
<th style="text-align:center; width:32"></th>
<th style="text-align:left; width: 600" class="listing">Path</th>
<th style="text-align:right; padding:2px;" class="listingem">stored</th>
<th style="text-align:right; padding:2px;" class="listingem">linked</th>
<th style="text-align:right; padding:2px;" class="listingem">pending</th>
<th style="text-align:right; padding:2px;" class="listingem">excluded</th>
<th style="text-align:right; padding:2px;" class="listingem">failed</th>
</tr>
</thead>
#(root)#
<tr class="TableCell#(dark)#Light::Dark::Summary#(/dark)#">
<td style="text-align:center"></td>
@ -227,12 +232,14 @@ var solr= $.getJSON("solr/collection1/select?q=*:*&defType=edismax&start=0&rows=
#(outbound)#::
<fieldset><legend>Outbound Links, outgoing from #[host]# - Host List</legend>
#{list}#
<div style="float:left; padding:1px 5px 1px 5px;">
<ol style="list-style-type : none; padding-left: 0px">
#{list}#
<li style="float:left; padding:1px 5px 1px 5px;">
<div style="width:160px; text-align:left; float: left; white-space:nowrap; overflow:hidden;"><div><a href="HostBrowser.html?admin=#[admin]#&path=#[link]#">#[host]#</a></div></div>
<div style="width:80px; text-align:right; float: left; white-space:nowrap; overflow:hidden;">#[count]# URLs</div>
</div>
#{/list}#
</li>
#{/list}#
</ol>
#(admin)#::
<p style="clear:both"><br/>
<img src="WebStructurePicture_p.png?host=#[host]#&depth=3&width=1024&height=576&nodes=200&time=1000&colortext=888888&colorback=FFFFFF&colordot0=1111BB&colordota=11BB11&colorline=222222&colorlineend=333333">
@ -243,12 +250,14 @@ var solr= $.getJSON("solr/collection1/select?q=*:*&defType=edismax&start=0&rows=
#(inbound)#::
<fieldset><legend>Inbound Links, incoming to #[host]# - Host List</legend>
#{list}#
<div style="float:left; padding:1px 5px 1px 5px;">
<div style="width:160px; text-align:left; float: left; white-space:nowrap; overflow:hidden;"><div><a href="HostBrowser.html?admin=#[admin]#&path=#[host]#">#[host]#</a></div></div>
<div style="width:80px; text-align:right; float: left; white-space:nowrap; overflow:hidden;">#[count]# URLs</div>
</div>
<ol style="list-style-type : none; padding-left: 0px">
#{list}#
<li style="float:left; padding:1px 5px 1px 5px;">
<div style="width:160px; text-align:left; float: left; white-space:nowrap; overflow:hidden;"><div><a href="HostBrowser.html?admin=#[admin]#&path=#[host]#">#[host]#</a></div></div>
<div style="width:80px; text-align:right; float: left; white-space:nowrap; overflow:hidden;">#[count]# URLs</div>
</li>
#{/list}#
</ol>
</fieldset>
#(/inbound)#

Write Preview
Loading…
Cancel
Save