WebCGM 2.1 - Appendixes

In addition to the listed editors of this specification, the following individuals have contributed significantly to the present WebCGM 2.1 specification:

Additionally, the following individuals made signficant contributions to predecessor versions, WebCGM 2.0 and WebCGM 1.0:

B. What's new in WebCGM 2.1

C. Glossary

D. Change log

Note: The following subsections list all significant changes applied to the WebCGM 2.0 specification to derive this draft of the WebCGM 2.1 specification.

D.1 Changes from CD01 to CD02 of WebCGM 2.1

D.2 Changes from WebCGM 2.0 to CD01 of WebCGM 2.1

E. WebCGM accessibility

E.1 Introduction

Topics such as internationalization and accessibility have been addressed by W3C in other Recommendations available on the Technical Reports page. The relationship between the specifications of technology modules, such as this one, and those cross-cutting recommendations is discussed in the Specification Guidelines. As suggested in the Specification Guidelines, this section identifies some relationships between the capabilities afforded by WebCGM features and accessibility requirements established by other Recommendations.

Although a WebCGM metafile is a binary file format, it has systematic grouping and annotation features that foster accessibility of WebCGM metafile content. For example, graphical text is ideally stored as Unicode text strings within the metafile, but to handle cases where graphical text images are actually the result of other vector (e.g. stroking) or raster (e.g., bitmaps) graphics in the metafile, WebCGM has the attribute 'content' on the para and subpara objects, that gives the text-string equivalent of the rendered graphical text.

Features that are in the binary metafile itself will, unlike clear-text formats such as HTML, XML, and SVG, require the cooperation and intervention of the WebCGM authoring tools and viewers. As described in [Essential Components of Web Accessibility], several components such as authoring tools, media viewers and developers, have to work together to improve Web accessibility. Therefore, the discussions in the following sections are recommendations to content developers, and builders of authoring tools and viewers.

E.2 Navigation

By Guideline 9 "Provide navigation mechanisms" of [UAAG10] a WebCGM viewer is expected to let users interact with 'enabled' and significant objects in the image. 'Enabled' objects are those which accept user input, such as on screen buttons. By the structure of WebCGM, each APS should be treated as a significant object and be reachable by navigation techniques. By Guideline 1 "Support input and output device independence" the reach of keyboard-actuated navigation should cover this whole set of navigation destinations.

Some notion of forward and backward motion among peer nodes in the WebCGM image should be provided. This should by default move among paragraphs and sub-paragraphs in the order in which they appear in the metafile. The creators of WebCGM instances should ensure that this results in a sensible reading order. However, efficient motion as called for in [UAAG10] Checkpoint 9.9, is not likely to result from one global list or loop of all the plausible navigation destinations. Exploiting the structure of the metafile, structured navigation could take hierarchical or categorical forms. In hierarchical navigation, forward and back motion moves among peer nodes at the same level in the layers-and-objects nesting tree. In categorical navigation, the sequential navigation could exhibit navigation modes which visit only 'grobject' nodes, or only the 'gropbject' nodes with a common 'name.' An example of hierarchical navigation is provided by the player behavior for the [DAISY] standard digital talking book. An example of categorical structured navigation is provided by the diverse navigation modes of the Opera browser. The creators of WebCGM instances should ensure that the layers-and-objects nesting forms a plausible table of contents as annotated with the textual properties (see E.3 below) of the affected nodes, and that collecting nodes of like 'name' forms meaningful slices of what is in the scene.

In this version of WebCGM, there are no intra-metafile controls to alter the navigation graph. In a scenario where such capability is desired, the private-namespace extension feature of the XCF can be used to introduce further intelligence associated with the contents of the metafile proper.

E.3 Required text content

Web Content Accessibility Guidelines such as [WCAG10] require that essential information be available in text form. Some key examples are:

WebCGM contains attributes that associate text with things in the depicted scene, and can be used to meet these requirements.

This essential content, if not always presented to the user, must be considered 'conditional content' in the sense of [UAAG10], Checkpoint 2.3. That checkpoint gives some latitude to the viewer as to whether to present these attributes globally through view-mode controls or locally in response to focus and inspect actions of the user.

WebCGM viewers should also make this textual information available to assistive technology through the accessibility API appropriate to the programming platform, following [UAAG10], Guideline 6.

Note. It might be thought that the 'name' APS attribute could or should be used in a manner like 'alt' on 'img' in HTML. This is not the design intent of the 'name' attribute. It has well-defined category, not instance, semantics and associated categorical navigation behavior.

E.4 Styling

WebCGM versions 2.0 and higher support transient, display-time control of a number of display properties of objects. These can be manipulated via the WebCGM DOM, and are also available via the XCF mechanism. Although WebCGM does not support conventional styling, an (external) XCF can function similarly to an external style sheet. For improved accessibility, WebCGM viewers should provide some user control of rendering. Use of these mechanisms partially supports the recommendations of [WCAG10], Checkpoint 3.3 and [UAAG10], Guideline 4.

E.5 Visibility and navigation

By default, WebCGM viewers allow the user to navigate to and interact with only enabled elements (i.e. element whose 'visibility' attribute is 'on'). Objects which are not visible do not display tooltips (the 'screentip' APS attribute), may not be highlighted without making them visible, and may not be navigated to via the picture behaviors (whether in picture fragments or DOM src parameter).

In addition, WebCGM viewers can offer a mode where, at user option, the 'visibility' attribute is ignored, for accessibility or debugging support. It meets a requirement of [UAAG10], CheckPoint 9.3.

F. Regex search

The advanced example in this section shows how the functionality of the WebCGMAppStructure interface can be used to build useful convenience functions, in this case a function to search a WebCGM instance for all APS that contain an APS Attribute of a given type, whose value matches a given regular expression (regex).

EXAMPLE:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
  <title>WebCGM 2.0 regex example</title>
  <script type="text/ecmascript">
    var cgm;
    var pic;
    var mydiv;
    var o;
    var nl; 
    var res;

    function loadCGM(fname) {
      try {
	var obj = document.getElementById('image');
	obj.innerHTML = "<object id='cgm' type='image/cgm;Version=4;ProfileId=WebCGM' width='400' height='300' src='"+fname+"'>";
	document.getElementById('cgm').getWebCGMDocument().src = fname;
	cgm = document.getElementById('cgm').getWebCGMDocument();
	pic = cgm.firstPicture;
	mydiv = '<h2>Looking at file '+fname+'</h2>\n';
	mydiv += '<p>Enter an attribute and regular expression then click the Submit button.</p>\n';
        mydiv += '<form name="myform">\n';
          mydiv += '<select name="attr">\n';
            mydiv += '<option value="content">content</option>\n';
            mydiv += '<option value="interactivity">interactivity</option>\n';
            mydiv += '<option value="layerdesc">layerdesc</option>\n';
            mydiv += '<option value="layername">layername</option>\n';
            mydiv += '<option value="linkuri">linkuri</option>\n';
            mydiv += '<option value="name">name</option>\n';
            mydiv += '<option value="region">region</option>\n';
            mydiv += '<option value="screentip">screentip</option>\n';
            mydiv += '<option value="viewcontext">viewcontext</option>\n';
            mydiv += '<option value="visibility">visibility</option>\n';
	    mydiv += '</select>\n';
	  mydiv += '<input type="text" name="regex" size="20"></input>\n';
	  mydiv += '<input type="button" value="Submit" onclick="processAttr(attr.value, regex.value)"></input>\n';
        mydiv += '</form>\n';
	var t =  document.getElementById('attinput');
	t.innerHTML = mydiv;
      } catch (e) {
        alert("loadCGM error " + e);
      }
    } 

    function processAttr(att, val) {
      try {
	o = '<p>Searching APS for attribute '+att + ' containing '+val+'</p>\n';
	// Create a list of nodes and print out the attribute
	// This part is not really needed it is mostly here as 
	// a sanity check.
	nl = listNodes(pic.firstChild);
	o+='<p>List of all nodes in the DOM tree.  A "" implies normally means the attribute was not specified.</p><ul>';
	for(i=0; i< nl.length; i++){
	  o+='<li>'+nl[i].apsId+' ('+att+'="'+nl[i].getAppStructureAttr(att)+'")</li>';
	}
	o+='</ul>';

	// Now we just run through the list and remove nodes that do not match
	res = new Array();
	for(i=0; i<nl.length;i++) {
	  attVal = nl[i].getAppStructureAttr(att);
	  if(attVal.match(val)) {
	    res.push(nl[i]);
	  }
	}

	if( res.length < 1) {
	  o += '<p>No nodes found matching that regular expression</p>\n';
	} else {
	  o+= '<p>The following nodes match the regular expression</p><ul>';
	  for(i=0; i< res.length; i++){
	    o+='<li>'+res[i].apsId+' ('+att+'="'+res[i].getAppStructureAttr(att)+'")</li>';
	  }
	  o+='</ul>';
	}
	var t = document.getElementById('attout');
	t.innerHTML = o;
      } catch(e) {
	alert("processAttr error " + e);
      } 
    }

// These are helper functions that I found on the web 
// http://www.ibm.com/developerworks/xml/library/x-matters41.html
// 
// They are needed because you need to walk the tree to 
// create a list of all of the nodes in the tree.

// return next node in document order
function nextNode(node) {
    if (!node) return null;
    if (node.firstChild){
        return node.firstChild;
    } else {
        return nextWide(node);
    }
}
// helper function for nextNode()
function nextWide(node) {
    if (!node) return null;
    if (node.nextSibling) {
        return node.nextSibling;
    } else {
        return nextWide(node.parentNode);
    }
}

// return an WebCGMNodeList of all nodes, starting at startNode and
// continuing through the rest of the DOM tree
function listNodes(startNode) {
    var node = startNode;
    var list = new Array();
    while(node) {
        list[list.length] =node;
        node = nextNode(node);
    }
    return list;
}

  </script>
</head>

<body>
<h1>WebCGM 2.0 regex example</h1>
<table>
  <tr>
    <td id="image">Select a CGM image...</td>
  </tr>
</table>
<br>
<input size="60" type="file" name="cgmfile" onChange="loadCGM(this.value)"/>
<div id="attinput">
</div>
<div id="attout">
</div>
</body>
</html>

View this example as HTML-CGM (WebCGM-DOM-enabled browsers only.)