My Flash app: Part 2
[ Posted by Dan on December 01, 2003 | 1 Comments ]

This is the first beta of my 'Learning Flash ActionScripting' project. As mentioned before, the purpose is to learn how Flash can be used from thru programmatic interfaces to make applications and do bare minimum work on the Flash stage. In particular this project uses the XML() object, event listeners and employs built-in components. The subject of the application is Edgar Lee Masters collection of poems titled "Spoon River Anthology" first published in 1916. The structure of the anthology lends itself nicely to being encoded as XML for representation in arbitrary ways. Each poem is a self contained entity, but may refer to one or more other poems in the anthology. With over 200 poems, reading them by reference can be difficult, which can deprive the reader of a fundamental aspect of the anthology.

I used the version of the anthology located at The Gutenberg Project and massaged it into the XML doc located here. There is still a lot of work to do on the XML in terms of references. As I said before, many poems reference each other, and I need to put that metadata into the XML. So far I have only covered part of the first poem in the anthology, and that looks like this...

	<poem title="The Hill" refs="Fiddler Jones, Edith Conant, Elmer Karr">
		<![CDATA[
			<p>
			[actual poem snipped]
			</p>
		]]>
	</poem>

When a poem with references is selected, it's text is pushed into a textarea for reading, and any references are loaded into list box. you can click on those referenced poems and read them. As of this version (I'm calling it beta 1) the reference list gets blanked out when you click on a reference poem, and the original poem name remains selected in the main list. I may change this to keep the reference list up, with the poem name selected, and then load that reference poem into a tabbed interface. So, my basic point is that the UI and interactions design is not even close to perfect. But it's worth looking at as it currently stands. The ActionScript that runs everything is after the app.

_global.style.setStyle("fontFamily", "Verdana");
_global.style.setStyle("fontSize", "10");
_global.style.setStyle("themeColor","haloOrange")
// make a TextArea, give it a name and a z-index
createClassObject(mx.controls.TextArea, "sraPoem", 12);
sraPoem._x = 200;
sraPoem._y = 25;
sraPoem.html = true;
sraPoem.wordWrap = true;
sraPoem.vScrollPolicy = "on";
sraPoem.setSize(400,360);
sraPoem.setStyle("marginLeft", "3");

// make a List box, give it a name and a z-index
createClassObject(mx.controls.List, "sraNames", 11);
// Put the list box somewhere
sraNames._x = 20;
sraNames._y = 25;
sraNames.setSize(160,250);

// make a List box, give it a name and a z-index
createClassObject(mx.controls.List, "sraRefs", 10);
// Put the list box somewhere
sraRefs._x = 20;
sraRefs._y = 295;
sraRefs.setSize(160,90);


// Load a CSS file for any changes to _global.style that we might want...
var myStyle = new TextField.StyleSheet();
myStyle.load("/sra_reader/styles.css");
myStyle.onLoad = function(loaded) {
	if (loaded) {
		//trace("yes");
		sraPoem.styleSheet = myStyle;
		} else {
		sraPoem.text = "The CSS failed to load";
	}
}

poemName = "Spoon River Anthology";

menuXml = new XML();
menuXml.ignoreWhite = true;
menuXml.load("/sra_reader/spoon_river_anthology.xml");
menuXml.onLoad = function() {
	
	// menuitem is an array of the XML "poem" nodes
	menuItem = this.firstChild.childNodes;
	
	// for each poem node, add an item to the sraName list box and the index
	// of that node for use elsewhere (whenever "this.selectedItem.data" is used)
	for (var i=0; i<menuItem.length; i++) {
		sraNames.addItem(menuItem[i].attributes.title, i);
	}
	
	// Both list boxes get a listener function for the 'change' event
	sraNames.addEventListener("change", changer);
	sraRefs.addEventListener("change", changer);
	
	function changer(evt) {
		// change the dynamic text box to show the name of the selected poem
		poemName = this.selectedItem.label;
		// change the text of the TextArea to a white space cleansed string
		sraPoem.text = killWhiteSpace(menuItem[this.selectedItem.data].firstChild.nodeValue);
		// Remove any list of items that may be in the "references" list box
		sraRefs.removeAll();
		
		// check to see if there are any refs list in the XML poem object
		if (menuItem[this.selectedItem.data].attributes.refs) {
			// If there are refs, plit them into an array....
			refsArray = menuItem[this.selectedItem.data].attributes.refs.split(", ");
			
			// and pump each item in that array into the sraRefs list box
			for (var k=0; k<refsArray.length; k++) { 
				sraRefs.addItem(refsArray[k], findMenuItemLocation(refsArray[k]));
			}
			
		}
		
	}
	
	// This function gets used to find the XML poem array index title that matches
	// the lookup string (which is a poem name). We cant's use this.selectedItem.data
	// because the "this" object reference changes when the 'changer' listener is called
	// by sraRefs which only has a subset of the XML poem array. It's a heavy solution. :(
	function findMenuItemLocation(lookup) {
		for (var i=0; i<menuItem.length; i++) {
			if (menuItem[i].attributes.title == lookup) { return i; }
			}
	}
	
	
	// This function kills any characters in the passed in string
	// that are considered to be white space. White space is defined
	// as anything *below* ASCII/Unicode character code 32.
	// We want code 32 because that's a space, and we want words separated, right?	
	function killWhiteSpace(theData) {
		var myNewString:String = '';
		var j:Number;
		  for(j = 0; j < theData.length; j++) {
			  if(theData.charCodeAt(j) > 31) {
				  myNewString += theData.charAt(j);
				  }
		  }
		 return myNewString;
	}
}

 

		For the record, "Shockwave Flash 6.0 r79" does not show this correctly. -Posted by Dan on December 1, 2003 05:55 PM

Comment posting has been turned off because I don't have enough time and will to deal with the constant comment spamming. I'm very sorry and will fix this sometime soon (soon = before 2004 ends).