W a] a a a= a>> a? a@ aB aR a a a a a a a aY a a a a# a6 an a* a a aB lk mkh nkk okbp pkv qk v v v v v v vu- v@k v v v v" v vt v !v v} vEP vIW vKf v3m vet v v> v v% v[ vl v v v, v v< v v v v| vH v] vO v_ vo v v vz v7 v vQ v? v v vp vF' r!
Accessibility
Accessibility
Global accessibility mode:
/*
* Copyright (c) 2013 The Chromium Authors. All rights reserved.
* Use of this source code is governed by a BSD-style license that can be
* found in the LICENSE file.
*/
body {
font-family: Arial, sans-serif;
font-size: 12px;
margin: 10px;
min-width: 47em;
padding-bottom: 65px;
}
img {
float: left;
height: 16px;
padding-right: 5px;
width: 16px;
}
.row {
border-bottom: 1px solid #A0A0A0;
padding: 5px;
}
.url {
color: #A0A0A0;
}
// Copyright (c) 2013 The Chromium Authors. All rights reserved.
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
cr.define('accessibility', function() {
'use strict';
// Keep in sync with view_message_enums.h
var AccessibilityModeFlag = {
Platform: 1 << 0,
FullTree: 1 << 1
}
var AccessibilityMode = {
Off: 0,
Complete:
AccessibilityModeFlag.Platform | AccessibilityModeFlag.FullTree,
EditableTextOnly: AccessibilityModeFlag.Platform,
TreeOnly: AccessibilityModeFlag.FullTree
}
function isAccessibilityComplete(mode) {
return ((mode & AccessibilityMode.Complete) == AccessibilityMode.Complete);
}
function requestData() {
var xhr = new XMLHttpRequest();
xhr.open('GET', 'targets-data.json', false);
xhr.send(null);
if (xhr.status === 200) {
console.log(xhr.responseText);
return JSON.parse(xhr.responseText);
}
return [];
}
// TODO(aboxhall): add a mechanism to request individual and global a11y
// mode, xhr them on toggle... or just re-requestData and be smarter about
// ID-ing rows?
function toggleAccessibility(data, element) {
chrome.send('toggleAccessibility',
[String(data.processId), String(data.routeId)]);
var a11y_was_on = (element.textContent.match(/on/) != null);
element.textContent = ' accessibility ' + (a11y_was_on ? ' off' : ' on');
var row = element.parentElement;
if (a11y_was_on) {
while (row.lastChild != element)
row.removeChild(row.lastChild);
} else {
row.appendChild(document.createTextNode(' | '));
row.appendChild(createShowAccessibilityTreeElement(data, row, false));
}
}
function requestAccessibilityTree(data, element) {
chrome.send('requestAccessibilityTree',
[String(data.processId), String(data.routeId)]);
}
function toggleGlobalAccessibility() {
chrome.send('toggleGlobalAccessibility');
document.location.reload(); // FIXME see TODO above
}
function initialize() {
console.log('initialize');
var data = requestData();
addGlobalAccessibilityModeToggle(data['global_a11y_mode']);
$('pages').textContent = '';
var list = data['list'];
for (var i = 0; i < list.length; i++) {
addToPagesList(list[i]);
}
}
function addGlobalAccessibilityModeToggle(global_a11y_mode) {
var full_a11y_on = isAccessibilityComplete(global_a11y_mode);
$('toggle_global').textContent = (full_a11y_on ? 'on' : 'off');
$('toggle_global').setAttribute('aria-pressed',
(full_a11y_on ? 'true' : 'false'));
$('toggle_global').addEventListener('click',
toggleGlobalAccessibility);
}
function addToPagesList(data) {
// TODO: iterate through data and pages rows instead
var id = data['processId'] + '.' + data['routeId'];
var row = document.createElement('div');
row.className = 'row';
row.id = id;
formatRow(row, data);
row.processId = data.processId;
row.routeId = data.routeId;
var list = $('pages');
list.appendChild(row);
}
function formatRow(row, data) {
if (!('url' in data)) {
if ('error' in data) {
row.appendChild(createErrorMessageElement(data, row));
return;
}
}
var properties = ['favicon_url', 'name', 'url'];
for (var j = 0; j < properties.length; j++)
row.appendChild(formatValue(data, properties[j]));
row.appendChild(createToggleAccessibilityElement(data));
if (isAccessibilityComplete(data['a11y_mode'])) {
row.appendChild(document.createTextNode(' | '));
if ('tree' in data) {
row.appendChild(createShowAccessibilityTreeElement(data, row, true));
row.appendChild(document.createTextNode(' | '));
row.appendChild(createHideAccessibilityTreeElement(row.id));
row.appendChild(createAccessibilityTreeElement(data));
}
else {
row.appendChild(createShowAccessibilityTreeElement(data, row, false));
if ('error' in data)
row.appendChild(createErrorMessageElement(data, row));
}
}
}
function formatValue(data, property) {
var value = data[property];
if (property == 'favicon_url') {
var faviconElement = document.createElement('img');
if (value)
faviconElement.src = value;
faviconElement.alt = "";
return faviconElement;
}
var text = value ? String(value) : '';
if (text.length > 100)
text = text.substring(0, 100) + '\u2026'; // ellipsis
var span = document.createElement('span');
span.textContent = ' ' + text + ' ';
span.className = property;
return span;
}
function createToggleAccessibilityElement(data) {
var link = document.createElement('a', 'action-link');
link.setAttribute('role', 'button');
var full_a11y_on = isAccessibilityComplete(data['a11y_mode']);
link.textContent = 'accessibility ' + (full_a11y_on ? 'on' : 'off');
link.setAttribute('aria-pressed', (full_a11y_on ? 'true' : 'false'));
link.addEventListener('click',
toggleAccessibility.bind(this, data, link));
return link;
}
function createShowAccessibilityTreeElement(data, row, opt_refresh) {
var link = document.createElement('a', 'action-link');
link.setAttribute('role', 'button');
if (opt_refresh)
link.textContent = 'refresh accessibility tree';
else
link.textContent = 'show accessibility tree';
link.id = row.id + ':showTree';
link.addEventListener('click',
requestAccessibilityTree.bind(this, data, link));
return link;
}
function createHideAccessibilityTreeElement(id) {
var link = document.createElement('a', 'action-link');
link.setAttribute('role', 'button');
link.textContent = 'hide accessibility tree';
link.addEventListener('click',
function() {
$(id + ':showTree').textContent = 'show accessibility tree';
var existingTreeElements = $(id).getElementsByTagName('pre');
for (var i = 0; i < existingTreeElements.length; i++)
$(id).removeChild(existingTreeElements[i]);
var row = $(id);
while (row.lastChild != $(id + ':showTree'))
row.removeChild(row.lastChild);
});
return link;
}
function createErrorMessageElement(data) {
var errorMessageElement = document.createElement('div');
var errorMessage = data.error;
errorMessageElement.innerHTML = errorMessage + ' ';
var closeLink = document.createElement('a');
closeLink.href='#';
closeLink.textContent = '[close]';
closeLink.addEventListener('click', function() {
var parentElement = errorMessageElement.parentElement;
parentElement.removeChild(errorMessageElement);
if (parentElement.childElementCount == 0)
parentElement.parentElement.removeChild(parentElement);
});
errorMessageElement.appendChild(closeLink);
return errorMessageElement;
}
function showTree(data) {
var id = data.processId + '.' + data.routeId;
var row = $(id);
if (!row)
return;
row.textContent = '';
formatRow(row, data);
}
function createAccessibilityTreeElement(data) {
var treeElement = document.createElement('pre');
var tree = data.tree;
treeElement.textContent = tree;
return treeElement;
}
return {
initialize: initialize,
showTree: showTree
};
});
document.addEventListener('DOMContentLoaded', accessibility.initialize);
PNG
IHDR a RIDATx^SA
07;:usKHjtAa%81d/T8|!姜?S: [ü IENDB`PNG
IHDR g PLTE lZ tRNS @f kIDATxM
#dFr