function Flashcard (id, token)
		{	// Initialize the object.
			this.id		= id.replace(/[^a-zA-Z_0-9]/g, "");
			this.peer	= false;
			this.token	= token;

			// This method outputs the object.
			this.output = function ()
				{	// Output the component.
					document.write
						(	'<form id="' + this.id + '" action="#init" method="post">' +
								'<div class=\"container\">' + 
									'<h1>Flash Cards &mdash; Drag and Drop</h1>' + 
									'<div class="body">' + 
										'<div id="' + this.id + '_pane" class="pane manage_view">' + 
											'<ol class="tabs">' + 
												//'<li class="manage_on"><a id="' + this.id + '_manage_tab" href="#"><img src="/skins/default/images/flashcard/tab.gif" alt="Manage" /></a></li>' + 
												//'<li class="practice_off"><a id="' + this.id + '_practice_tab" href="#"><img src="/skins/default/images/flashcard/tab.gif" alt="Practice" /></a></li>' + 
												'<li class="manage_tab"><a id="' + this.id + '_manage_tab" href="#"><img src="/skins/default/images/flashcard/tab.gif" alt="Manage" /></a></li>' + 
												'<li class="practice_tab"><a id="' + this.id + '_practice_tab" href="#"><img src="/skins/default/images/flashcard/tab.gif" alt="Practice" /></a></li>' + 
											'</ol>' + 
											'<div class="view_manage">' + 
												'<dl id="' + this.id + '_select_list_view" style="display: none;">' +
													'<dt>&nbsp;<label for="' + this.id + '_add_to">Add To:</label></dt>' +
													'<dd>' + 
														'<div>&nbsp;<select id="' + this.id + '_add_to" value="-1" onchange="document.getElementById(\'' + this.id + '\').loadFlashCards(this.value);"></select></div>' + 													
														'<div>&nbsp;' + 
															'<a href="#" class="icon" onclick="document.getElementById(\'' + this.id + '\').showCreateListView(); return false;"><img src="/skins/default/images/flashcard/icon_add_item.gif" alt="Create" title="Create a new list" /></a>' +
															'<a href="#" class="icon" onclick="document.getElementById(\'' + this.id + '\').deleteCurrList(); return false;"><img src="/skins/default/images/flashcard/icon_remove_item.gif" alt="Delete" title="Delete this list" /></a>' +
															'<a href="#" class="icon" onclick="document.getElementById(\'' + this.id + '\').loadFlashcardLists(); return false;"><img src="/skins/default/images/flashcard/icon_refresh.gif" alt="Reload" title="Reload" /></a>' +															
														'</div>' + 
													'</dd>' +
												'</dl>' +
												'<dl id="' + this.id + '_create_list_view" style="display: block;">' +
													'<dt>&nbsp;<label for="' + this.id + '_create_list_title">Title:</label></dt>' +
													'<dd>' + 
														'<div>&nbsp;<input id="' + this.id + '_create_list_title" name="" type="input" autocomplete="off" class="new_title" /></div>' +
														'<div>&nbsp;' + 
															'<input type="image" src="/skins/default/images/flashcard/icon_next.gif" title="Create list" />' +
															'<input id="' + this.id + '_create_list_cancel_button" type="image" src="/skins/default/images/flashcard/icon_cancel.gif" title="Cancel" />' +
														'</div>' + 
													'</dd>' +
												'</dl>' +
												'<ol id="' + this.id + '_list"></ol>' + 
											'</div>' + 
											'<div id="' + this.id + '_practice_view" class="view_practice"></div>' + 
										'</div>' + 	
										'<h2>Instructions</h2>' + 
										'<ol>' + 
											'<li>1.) Register and sign in to LearnersDictionary.com.</li>' +
											'<li>2.) Give your new set of Flash Cards a title or select a set you have already created.  Click the arrow button to save the title of a new set of Flash Cards.</li>' + 
											'<li>3.) Drag words from your MyDictionary list and drop them here to add them to your Flash Cards.</li>' + 
											'<li>4.) Click "Practice" to begin using your Flash Cards.' +
										'</ol>' + 									
									'</div>' +
								'</div>' + 
							'</form>'							
						);

					// Initialize the peer.
					this.peer				= document.getElementById(this.id);
					this.peer.callback		= this;
					this.peer.token			= this.token;		
					
					// Clear the submit event.
					this.peer.onsubmit = function () { return false; };

					// Set up onclicks for various controls.
					var control		= document.getElementById(this.id + "_practice_tab");
					control.peer	= this.peer;
					control.onclick = 
						function () 
							{	this.peer.beginQuiz();
								return false;
							};
					control			= document.getElementById(this.id + "_manage_tab");
					control.peer	= this.peer;
					control.onclick = 
						function () 
							{	this.peer.showManageView();
								return false;
							};

					// This method asserts that the application has been initialized.
					this.peer.assertInit = function ()
						{	// The application is not initialized.
							if ( this.action.indexOf("#init") > 0 )
								{	// Clear the action.
									this.action = "";

									// Initialize the application.
									this.init();

									return false;
								} // if ( this.action.indexOf("#init") > 0 )

							// The application is initialized.
							else
								{	return true;
								}; // else
						}; // function assertInit ()

					// This method attempts to begin a quiz.
					this.peer.beginQuiz = function ()
						{	// Construct the AJAX url.
							var ajax_url = "/flashcard.php?action=quiz.start&list_id=" + encodeURIComponent(this.getListComponent().value);

							// Make the AJAX call.
							this.makeAjaxCall(ajax_url, {});
						}; // function beginQuiz ()

					// This method clears an Ajax transaction.
					this.peer.clearAjaxTransaction = function (transid)
						{	// Get the transaction.
							var transaction = this.transactions && this.transactions[transid] ? this.transactions[transid] : false;

							// Clear the transaction.
							if ( transaction )
								{	// Make sure the frame stops loading any content.
									transaction.frame.src = "";

									// Remove the frame from document.
									transaction.frame.parentNode.removeChild(transaction.frame);

									// Clear the transaction value.
									delete this.transactions[transid];
								}; // if ( transaction )
						}; // function clearAjaxTransaction (transid)

					// This method deletes the current list.
					this.peer.deleteCurrList = function ()
						{	// The user canceled out if the action.
							if ( !confirm("Are you sure you want to delete this list?") )
								{	return;
								}; // if ( !confirm("Are you sure you want to delete this list?") )

							// Get the list component.
							var list = this.getListComponent();

							// Delete the selected list.
							if ( list )
								{	// Get the selected index.
									var index = list.selectedIndex;

									// Get all the options.
									var the_options = list.getElementsByTagName("option");

									// Delete the list.
									if ( index >= 0 && index < the_options.length && the_options.item(index).value > 0 )
										{	this.deleteList(the_options.item(index).value);
										}; // if ( index >= 0 && index < the_options.length && the_options.item(index).value > 0 )
								}; // if ( list )
						}; // function deleteCurrList ()

					// This method deletes the specified list.
					this.peer.deleteList = function (list_id)
						{	// Construct the AJAX URL.
							var ajax_url = "/flashcard.php?action=list.remove&list_id=" + encodeURIComponent(list_id);

							// Make the AJAX call.
							this.makeAjaxCall(ajax_url, {});
						}; // function deleteList (list_id)

					// This method destroys the application.
					this.peer.destroy = function ()
						{	
						}; // function deleteList (list_id)

					// This method flips the card.
					this.peer.flipCard = function (src)
						{	// Get the quiz pane.
							var pane = document.getElementById(this.id + "_quiz_pane");

							// Save the current content.
							if ( pane && !pane.questionContent )
								{	pane.questionContent = pane.innerHTML;
								}; // if ( !pane.questionContent )

							// Show the answer.
							if ( src.shown == "question" )
								{	pane.className	= "answer";
									pane.innerHTML	= src.answer.replace(/&lt;/g, "<").replace(/&gt;/g, ">").replace(/&amp;/g, "&").replace(/^.*?(<!--|<div class="uro"|<div class="dro">)/, "<div>$1");		
									src.shown		= "answer";
								} // if ( src.shown = "question" )

							// Show the question.
							else
								{	pane.className	= "question";
									pane.innerHTML	= pane.questionContent;
									src.shown		= "question";
								}; // else
						}; // function flipCard (src)

					// This method returns the back of the card.
					this.peer.getCardBack = function ()
						{	var component = document.getElementById(this.id + "_back");

							return component;
						}; // function getCardBack ()

					// This method returns the front of the card.
					this.peer.getCardFront = function ()
						{	var component = document.getElementById(this.id + "_front");

							return component;
						}; // function getCardFront ()

					// This method returns the create list view.
					this.peer.getCreateListView = function ()
						{	// Get the component.
							var component = document.getElementById(this.id + "_create_list_view");

							return component;
						}; // function getCreateListView ()

					// This method returns the practice view.
					this.peer.getPracticeView = function ()
						{	// Get the component.
							var component = document.getElementById(this.id + "_practice_view");

							return component;
						}; // this.peer.getPracticeView = function ()

					// This method returns the create list view.
					this.peer.getSelectListView = function ()
						{	// Get the component.
							var component = document.getElementById(this.id + "_select_list_view");

							return component;
						}; // function getSelectListView ()

					// This method returns the list selection box.
					this.peer.getListComponent = function ()
						{	var component = document.getElementById(this.id + "_add_to");

							return component;
						}; // function getListComponent ()

					// This method returns the manage word list.
					this.peer.getManageList = function ()
						{	var component = document.getElementById(this.id + "_list");

							return component;
						}; // function getManageList ()

					// This method returns the specified transaction data.
					this.peer.getTransactionData = function (transid)
						{	// Get the transaction data.
							var data = this.transactions && this.transactions[transid] ? this.transactions[transid].data : new Array();

							return data;
						}; // function getTransactionData (transid)

					// This method returns the list item containing the specified word.
					this.peer.getWordItem = function (word)
						{	// Get the manage list.
							var list = this.getManageList();

							// Get all the items.
							var items = list.getElementsByTagName("li");

							// Search for the word.
							for ( var index = 0; index < items.length; index++ )
								{	// We found the item.
									if ( items.item(index).word && items.item(index).word == word )
										{	return items.item(index);
										}; // if ( items.item(index).word && items.item(index).word == word )
								}; // for ( var index = 0; index < items.length; index++ )

							return false;
						}; // function getWordItem (word)

					// This method initializes the application.
					this.peer.init = function ()
						{	// Load the flashcard lists.
							this.loadFlashcardLists();
						}; // function init ()

					// This method loads the flash card lists.
					this.peer.loadFlashcardLists = function ()
						{	// Construct the AJAX URL.
							var ajax_url = "/flashcard.php?action=list.all";

							// Make the AJAX call.
							this.makeAjaxCall(ajax_url, {});
						}; // function loadFlashcardLists ()

					// This method loads the flash cards for a given list.
					this.peer.loadFlashCards = function (list_id)
						{	// Load the list.
							if ( list_id > 0 )
								{	// Construct the AJAX URL.
									var ajax_url = "/flashcard.php?action=list.get&list_id=" + encodeURIComponent(list_id);

									// Make the AJAX call.
									this.makeAjaxCall(ajax_url, {});
								} // if ( list_id > 0 )

							// Create a new list.
							else 
								{	this.showCreateListView();
								}; // else 
						}; // function loadFlashCards (list_id)

					// This method makes an AJAX call.
					this.peer.makeAjaxCall = function (ajax_url, data)
						{	// Create a new IFRAME to process the AJAX call.
							var ajax_frame = document.createElement("iframe");

							// Create the transaction.
							var trans = { frame: ajax_frame, data: data };

							// Create the transaction hash if needed.
							this.transactions = this.transactions ? this.transactions : new Array();
						
							// Create a new transaction id.
							var transid = this.transactions.length;

							// Store the new transaction.
							this.transactions[transid] = trans;

							// Set its properties.
							ajax_frame.style.border		= "0";
							ajax_frame.style.display	= "block";							
							ajax_frame.style.height		= "0";
							ajax_frame.style.margin		= "0";
							ajax_frame.style.padding	= "0";
							ajax_frame.style.width		= "0";

							// Add the IFRAME to the document.
							document.getElementsByTagName("body").item(0).appendChild(ajax_frame);		
										
							// Make the AJAX call.
							ajax_frame.src = 
								ajax_url + ( ajax_url.indexOf("?") > 0 ? "&" : "?" ) + 
									"transid=" + encodeURIComponent(transid) +
									"&appid=" + encodeURIComponent(this.id) +
									"&token=" + encodeURIComponent(this.token);
						}; // function makeAjaxCall (ajax_url, data)

					// This method loads the next question.
					this.peer.nextQuestion = function ()
						{	// Construct the AJAX url.
							var ajax_url = "/flashcard.php?action=quiz.next&list_id=" + encodeURIComponent(this.getListComponent().value);

							// Make the AJAX call.
							this.makeAjaxCall(ajax_url, {});
						}; // function nextQuestion ()

					// This method handles all drop events.
					this.peer.onDragTargetDropped = function (drag_object)
						{	// Get the list id.
							var list_id = this.getListComponent();
							list_id		= list_id ? list_id.value : -1;

							// Make the AJAX call.
							if ( list_id > 0 )
								{	// Get the drag value.
									var value = drag_object && drag_object.getDragValue ? drag_object.getDragValue() : "";

									// Construct the Ajax URL.
									var ajax_url = 
										"/flashcard.php" +
											"?action=flashcard.add" +											
											"&list_id=" + encodeURIComponent(list_id) + 
											"&word=" + encodeURIComponent(value);

									// Make the AJAX call.
									this.makeAjaxCall(ajax_url, {});
								} // if ( list_id > 0 )

							// The user has to select a list first.
							else
								{	alert("You must select or create a list to add this word to first.");
								}; // else
						}; // function onDragTargetDropped (drag_object)

					// This method handles all error events.
					this.peer.onError = function (transid, message)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )
						
							// Display the error message.
							alert(message);
						
							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						};

					// This method handles all flashcard load events.
					this.peer.onQuestionLoaded = function (transid, type, question, answer)
						{	// Get the practice view.
							var view = this.getPracticeView();

							// Set its content.
							if ( view )
								{	// Clear the view.
									view.innerHTML = "";

									// Create the container to hold the question.
									var container = document.createElement("div");

									// Set its attributes.
									container.id		= this.id + "_quiz_pane";
									container.className = "question";

									// Create the question.
									var node = document.createElement("div");
									
									// Create a standard question.
									if ( type != "flashcard" )
										{	node.appendChild(document.createTextNode(question));
										} // if ( type != "flashcard" )

									// Create a flashcard.
									else
										{	// Get the word.
											var word		= question;

											// Get any homograph.
											var homograph	= word.indexOf("[") > 0 ? word.replace(/^[^\[]+\[/g, "") : "";
											homograph		= homograph.replace(/\][^$]*$/g, "");

											// Get any function label.
											var fl			= word.indexOf("(") > 0 ? word.replace(/^[^\(]+\(/g, "") : "";
											fl				= fl.replace(/\)[^$]*$/g, "");

											// Strip the homograph and function label.
											word = word.replace(/(\[|\()[^$]*$/g, "");

											node.appendChild(document.createTextNode(word));
											if ( homograph !== "" )
												{	var homograph_node = document.createElement("sup");
													homograph_node.appendChild(document.createTextNode(homograph));
													node.appendChild(homograph_node);
												}; // if ( homograph !== "" )
											node.appendChild(document.createElement("br"));
											node.appendChild(document.createTextNode(" (" + fl + ")"));
										}; // else
									
									// Append it.
									container.appendChild(node);

									// Add the container.
									view.appendChild(container);

									// Create a container for the anchors.
									container = document.createElement("div");

									// Set its attributes.
									container.className = "controls";

									container.innerHTML = 
										'<a href="#" onclick="this.peer.flipCard(this); return false;">Flip</a>' +
										'<a href="#" onclick="this.peer.nextQuestion(this); return false;">Next</a>';

									// Add the anchors.
									var elements				= container.getElementsByTagName("a");
									elements.item(0).peer		= this;
									elements.item(0).question	= question;
									elements.item(0).answer		= answer;
									elements.item(0).shown		= "question";
									elements.item(1).peer		= this;									

									// Add the container.
									view.appendChild(container);
								}; // if ( view )

							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						}; // function onQuestionLoaded (transid, type, question, answer)

					// This method handles all list add events.
					this.peer.onListAdded = function (transid, list_id, title)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )
						
							// Get the list.
							list = this.getListComponent();

							// Get the existing options.
							var all_options = list.getElementsByTagName("option");

							// Check for the list.
							for ( var index = 0; index < all_options.length; index++ )
								{	// Found the list; the user must have tried to add the thing twice.
									if ( all_options.item(index).value == list_id )
										{	// Select the option via the Internet Explorer way.
											if ( document.all != undefined )
												{	list.selectedIndex = index;
												} // if ( document.all != undefined )

											// Select the option via the standard way.
											else
												{	all_options.item(index).selected = true;
												}; // else				

											return;
										}; // if ( all_options.item(index).value == list_id )
								}; // for ( var index = 0; index < all_options.length; index++ )

							// Create the new list item.
							var option = document.createElement("option");
							
							// Set its attributes.
							option.value = list_id;

							// Add the text node to this option.
							option.appendChild(document.createTextNode(title));

							// Add it to the beginning of the list.
							if ( all_options.length > 0 )
								{	list.insertBefore(option, all_options.item(0));
								} // if ( all_options.length > 0 )

							// Add it to the end of the list.
							else
								{	list.appendChild(option);
								}; // else

							// Select the option via the Internet Explorer way.
							if ( document.all != undefined )
								{	list.selectedIndex = 0;
								} // if ( document.all != undefined )

							// Select the option via the standard way.
							else
								{	option.selected = true;
								}; // else							

							// Clear the transaction.
							this.clearAjaxTransaction(transid);

							// Show the select list view.
							this.showSelectListView();

							// Load the flash cards.
							this.loadFlashCards(list_id);
						}; // function onListAdded (transid, list_id, title)

					// This method handles all list remove events.
					this.peer.onListRemoved = function (transid, list_id)
						{	// Get the list component.
							var list = this.getListComponent();

							// Update the list.
							if ( list && list_id > 0 )
								{	// Get all the options.
									var the_options = list.getElementsByTagName("option");

									// The position of the specified list in the drop down.
									var listIndex = -1;

									// Find the list in the drop down.
									for ( var index = 0; index < the_options.length; index++ )
										{	// We found the index of this list in the drop down; therefore, break out of the loop here.
											if ( the_options.item(index).value == list_id )
												{	listIndex = index;
													break;
												}; // if ( the_options.item(index).value == list_id )
										}; // for ( var index = 0; index < the_options.length; index++ )

									// The list was found.
									if ( listIndex >= 0 )
										{	// Remove the option.
											list.removeChild(the_options.item(listIndex));

											// Get the index of the new list to select.
											var selectIndex = ( listIndex + 1 ) < the_options.length ? listIndex :  Math.max(0, listIndex - 1); 

											// Select the next option.
											if ( the_options.length >= 1 )
												{	// Select the option via the Internet Explorer way.
													if ( document.all != undefined )
														{	list.selectedIndex = selectIndex;
														} // if ( document.all != undefined )

													// Select the option via the standard way.
													else													
														{	the_options.item(selectIndex).selected = true;
														}; // else			

													// Load the new list's flash cards.
													this.loadFlashCards(the_options.item(selectIndex).value);
												} // if ( the_options.length > 1 )

											// Show the create list view.
											else
												{	this.showCreateListView();
												}; // else
										}; // if ( listIndex >= 0 )
								}; // if ( list && list_id > 0 )
						}; // function onListRemoved (transid, list_id)

					// This method handles all word add events.
					this.peer.onWordAdded = function (transid, list_id, word, fl)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )
								
							// Get the manage list.
							var list = this.getManageList();
						
							// Look for the word already in the list.
							var component = this.getWordItem(word);

							// Found the component; therefore, just move it to the top.
							if ( component )
								{	// Get the items.
									var items = list.getElementsByTagName("li");

									// Place the word at the top.
									if ( items.length > 1 && items.item(0) != component )
										{	var parent = component.parentNode;									
											parent.removeChild(component);
											parent.insertBefore(component, items.item(0));
										}; // if ( items.length > 1 && items.item(0) != component )

									return;
								}; // if ( component )
						
							// Create the new item.
							var item = document.createElement("li");	
							
							// Set its content.
							item.word = word;

							// Add the anchor to the item.
							item.innerHTML = 
								'<a href="#remove_word" onclick="document.getElementById(\'' + this.id + '\').removeWord(this.word, this); return false;">' + 
									'<img src="/skins/default/images/flashcard/icon_remove_item.gif" alt="Remove" title="Remove" />' + 
								'</a>';

							// Set the word value.
							item.getElementsByTagName("a").item(0).word = word;

							// Set its textual content.
							var homograph	= word.indexOf("[") > 0 ? word.replace(/^[^\[]+\[/g, "") : "";
							homograph		= homograph.replace(/\][^$]*$/g, "");
							word			= word.replace(/\[[^$]+$/g, "");
							item.appendChild(document.createTextNode(word));
							if ( homograph )
								{	var homograph_node = document.createElement("sup");
									homograph_node.appendChild(document.createTextNode(homograph));
									item.appendChild(homograph_node);
								}; // if ( homograph )
							item.appendChild(document.createTextNode(" (" + fl + ")"));

							// Get the existing items.
							var items = list.getElementsByTagName("li");

							// Add the word to the top.
							if ( items.length > 0 )
								{	list.insertBefore(item, items.item(0));
								} // if ( items.length > 0 )

							// Append the word.
							else
								{	list.appendChild(item);
								}; // else

							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						}; // function onWordAdded (transid, list_id, word, fl)

					// This method handles all word remove events.
					this.peer.onWordRemoved = function (transid, list_id, word)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )

							// Get the transaction info.
							var component = this.getTransactionData(transid).component;

							// Remove the component.
							if ( component )
								{	component.parentNode.parentNode.removeChild(component.parentNode);
								}; // if ( component )

							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						}; // function onWordRemoved (transid, list_id, word)

					// This method removes a word from the list.
					this.peer.removeWord = function (word, component)
						{	// Get the list id.
							var list_id = this.getListComponent();
							list_id		= list_id ? list_id.value : -1;

							// Generate the URL.
							var ajax_url = 
								"/flashcard.php" + 
									"?action=flashcard.remove" +
									"&list_id=" + encodeURIComponent(list_id) + 
									"&word=" + encodeURIComponent(word);

							// Make the AJAX call.
							this.makeAjaxCall(ajax_url, { word: word, component: component });
						}; // function removeWord (word, component)

					// This method sets the flash cards displayed on the application.
					this.peer.setFlashCards = function (transid, list_id, words)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )
							
							// Get the manage list.
							var list = this.getManageList();

							// Clear the lsit.
							list.innerHTML = "";

							// Add each word (in reverse order.)
							for ( var index = words.length - 1; index >= 0; index-- )
								{	this.onWordAdded(-1, list_id, words[index].word, words[index].fl);
								}; // for ( var index = words.length - 1; index >= 0; index-- )

							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						}; // function setFlashCards (transid, list_id, words)

					// This method sets the lists displayed in this application.
					this.peer.setFlashCardLists = function (transid, lists)
						{	// The application hasn't been initialized.
							if ( !this.assertInit() )
								{	return;
								}; // if ( !this.assertInit() )
						
							// Get the list.
							list = this.getListComponent();

							// Clear the existing data.
							list.innerHTML = "";

							// Construct the new data.
							for ( var index = 0; index < lists.length; index++ )
								{	// Create the next option.
									var option = document.createElement("option");

									// Set its attributes.
									option.value = lists[index].id;
									
									// Create the text node for this option.
									var text = document.createTextNode(lists[index].title); // + ( lists[index].id > 0 ? " (" + lists[index].arity + ")" : "" ));

									// Append it to the option.
									option.appendChild(text);

									// Append the option to the list.
									list.appendChild(option);
								}; // for ( var index = 0; index < lists.length; index++ )

							// Load the contents of the first list.
							if ( lists.length > 0 )
								{	this.showSelectListView();
									this.loadFlashCards(lists[0].id);
								} // if ( lists.length > 0 )
		
							// Display the create list view.
							else
								{	this.showCreateListView();
								}; // else

							// Clear the transaction.
							this.clearAjaxTransaction(transid);
						}; // function setFlashCardLists (transid, lists)

					// This method shows the create list form.
					this.peer.showCreateListView = function ()
						{	// Get the list title.
							var title	= document.getElementById(this.id + "_create_list_title");

							// Clear its value.
							title.value = "";

							// Get the list component.
							var list = this.getListComponent();

							// Get the number of lists displayed.
							var num_lists	= list ? list.getElementsByTagName("option") : false;
							num_lists		= num_lists ? num_lists.length : 0;

							// Get the cancel button.
							var button = document.getElementById(this.id + "_create_list_cancel_button");

							// Set its onclick event.
							button.peer		= this;
							button.onclick	= function () 
								{	// Get the list title.
									var title	= document.getElementById(this.peer.id + "_create_list_title");
									title		= title ? title.value : "";
									title		= title.replace(/\s+/g, " ");
									title		= title.replace(/^\s+|\s+$/, "");
								
									// Cancel out of the list creation process.
									if ( title == "" || confirm("Discard this list?") ) 			
										{	this.peer.showSelectListView(); 
										}; // if ( title != "" || confirm("Discard this list?") ) 			

									return false;									
								};

							// Hide or show the cancel button depending on whether already lists exist.
							button.style.display = num_lists > 0 ? "inline" : "none";
						
							// Set the onsubmit event handler.
							this.onsubmit = 
								function () 
									{	this.submitListCreationRequest(); 
										return false;
									};  

							// Get the create list view.
							var component = this.getCreateListView();

							// Show it.
							if ( component )
								{	component.style.display = "block";
								}; // if ( component )

							// Get the select list view.
							component = this.getSelectListView();

							// Hide it.
							if ( component )
								{	component.style.display = "none";
								}; // if ( component )

							// Clear the flash card list.
							this.setFlashCards(-1, -1, {});													
						}; // function showCreateListView ()

					// This method shows the manage view.
					this.peer.showManageView = function ()
						{	// Get the view pane.
							var pane = document.getElementById(this.id + "_pane");

							// Set its new CSS class.
							if ( pane )
								{	pane.className = "pane manage_view";
								}; // if ( pane )
						}; // function showManageView ()

					// This method shows the practice view.
					this.peer.showPracticeView = function ()
						{	// Get the view pane.
							var pane = document.getElementById(this.id + "_pane");

							// Set its new CSS class.
							if ( pane )
								{	pane.className = "pane practice_view";
								}; // if ( pane )
						}; // function showPracticeView ()

					// This method shows the select list form.
					this.peer.showSelectListView = function ()
						{	// Set the onsubmit event handler.
							this.onsubmit = function () { return false; };

							// Get the create list view.
							var component = this.getCreateListView();

							// Hide it.
							if ( component )
								{	component.style.display = "none";
								}; // if ( component )

							// Get the select list view.
							component = this.getSelectListView();

							// Show it.
							if ( component )
								{	component.style.display = "block";
								}; // if ( component )
						}; // function showSelectListView ()

					// This method submits a new list to be created.
					this.peer.submitListCreationRequest = function ()
						{	// Get the list title.
							var title	= document.getElementById(this.id + "_create_list_title");
							title		= title ? title.value : "";
							title		= title.replace(/\s+/g, " ");
							title		= title.replace(/^\s+|\s+$/, "");

							// The user provided a blank title.
							if ( title == "" )
								{	alert("You must enter a title for the new list.");
								} // if ( title == "" )

							// Create the new list.
							else
								{	// Construct the AJAX URL.
									var ajax_url = "/flashcard.php?action=list.add&title=" + encodeURIComponent(title);

									// Make the AJAX call.
									this.makeAjaxCall(ajax_url, {});
								}; // else
						}; // function submitListCreationRequest ()

				}; // function output ()

			return this;
		}; // function Flashcard (id)