Trillium University

This Membership List System is presented by
Nisqually Pauli's 2nd Index , also as a working example of HTML, CSS, JavaScript, XML, XSL, & DTD coding.

Members List

Scroll down if interested in the code used in this system.

members

Member Writer

This is the member writer (JavaScript) form.
Enter your membership information and it will generate the XML code for you to copy and paste to a text file you will name as your_member_name.xml and have completed your first XML Membership List page. Send us a copy so we might put a memberships on file here with our thanks.
After copying the text to your clipboard, open your favorite text editor (Notepad, Wordpad, SynEdit, CodeMax or ?) and PASTE . Now save this file with an extension of xml. (That just means the filename should end in ".xml" instead of ".txt" or ".htm".)

There are three documents required for the member page system.
The DTD, the XSL style sheet, and the actual XML member file

This is the code for the DTD

The DTD is responsible for defining the marking up. Note that this file may have been updated since writing the html code needed for their presentation here so some actual features may be missing from the code below. The actual DTD is here but you will need to right click, save it and open it with a text editor to view it instead of simply clicking on the link.


 <!ELEMENT club 
 (member | renter)>

 <!ELEMENT member 
 (memberid, spaceid, lastname, firstname, spaceaddress, 
   mailingaddressid, city, state, postalcode, phone, 
   cellphone, email, comment)>
 <!ELEMENT memberid (#PCDATA)>
 <!ELEMENT spaceid (#PCDATA)>
 <!ELEMENT lastname (#PCDATA)>
 <!ELEMENT firstname (#PCDATA)>
 <!ELEMENT spaceaddress (#PCDATA)>
 <!ELEMENT mailingaddressid (#PCDATA)>
 <!ELEMENT city (#PCDATA)>
 <!ELEMENT state (#PCDATA)>
 <!ELEMENT postalcode (#PCDATA)>
 <!ELEMENT phone (#PCDATA)>
 <!ELEMENT cellphone (#PCDATA)>
 <!ELEMENT email (#PCDATA)>
 <!ELEMENT comment (#PCDATA)>

 <!ELEMENT renter 
 (renterid, spaceid, lastname, firstname, spaceaddress, 
   mailingaddressid, city, state, postalcode, phone, 
   cellphone, email, comment)>
 <!ELEMENT renterid (#PCDATA)>
 <!ELEMENT spaceid (#PCDATA)>
 <!ELEMENT lastname (#PCDATA)>
 <!ELEMENT firstname (#PCDATA)>
 <!ELEMENT spaceaddress (#PCDATA)>
 <!ELEMENT mailingaddressid (#PCDATA)>
 <!ELEMENT city (#PCDATA)>
 <!ELEMENT state (#PCDATA)>
 <!ELEMENT postalcode (#PCDATA)>
 <!ELEMENT phone (#PCDATA)>
 <!ELEMENT cellphone (#PCDATA)>
 <!ELEMENT email (#PCDATA)>
 <!ELEMENT comment (#PCDATA)>

This is the code for the XSL style sheet

The style sheet is responsible for marking up the member files (XML files in general) into what looks like a regular web page. It includes a lot of html and anything which is common to all the member pages. Note that these files (here) in general may have been updated since writing the html code needed for their presentation here so some actual features may be missing from the code below. Click here to view the actual style sheet.


<?xml version="1.0"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/TR/WD-xsl">

<xsl:template match="/">
   <xsl:apply-templates />
</xsl:template>

<xsl:template match="/">
<html>
 <head>
  <title>Memberships List</title>
<style type="text/css">
body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12pt; background-color: #ffffb0;}
a:active { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; color: #FF00FF; text-decoration: none}
a:hover { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; color: #000033; text-decoration: none}
a:link { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; color: #0000FF; text-decoration: none}
a:visited { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11pt; color: #999999; text-decoration: none}
h3: {font-size: 1.5em}
</style>
 </head>
   <body>
     <xsl:apply-templates />
   </body>
</html>
</xsl:template>
<xsl:template match="member">

<a href="../../index.html"><img src="../../images/tu.gif" border="0" /> INDEX</a>

<table width="100%" border="1">

<tr>
<td><b>Member ID:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="memberid" /></span>
</td>
</tr>

<tr>
<td><b>Member Name:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="firstname" /></span>
 <span style="font-size: 1.2em"><xsl:value-of select="lastname" /></span>
</td>
</tr>



<tr>
<td><b>Space ID:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="spaceid" /></span>
</td>
</tr>

<tr>
<td><b>Space Address:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="spaceaddress" /></span>
</td>
</tr>

<tr>
<td><b>Mailing Address:</b></td>
<td colspan="2">
<span style="font-size: 1.2em"><xsl:value-of select="mailingaddressid" /></span>



<br/>
<span style="font-size: 1.2em"><xsl:value-of select="city" /></span>, 
<span style="font-size: 1.2em"><xsl:value-of select="state" /></span> 
<span style="font-size: 1.2em"><xsl:value-of select="postalcode" /></span>
</td>
</tr>



<tr>
<td><b>phone:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="phone" /></span>
</td>
</tr>

<tr>
<td><b>email:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="email" /></span>
</td>
</tr>

<tr>
<td><b>cellphone:</b></td>
<td colspan="2"><span style="font-size: 1.2em"><xsl:value-of select="cellphone" /></span>
</td>
</tr>
</table>



<xsl:apply-templates />
</xsl:template>








<xsl:template match="comment">
<p>
  <b>Comments:</b>
   <xsl:value-of/><br/>
</p>
</xsl:template>


</xsl:stylesheet>

This is the code for the memberships in XML



<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE member SYSTEM "../../member.dtd">
<?xml-stylesheet type="text/xsl" href="../../style/member.xsl" ?>
<!-- Created at Trillium University using XML MemberWriter for MML (Member Markup Language) from home.comcast.net/~nisquallypauli -->
<member>
	<memberid>000-000-000</memberid>
	<spaceid>0000-0</spaceid>
	<lastname>flintstone</lastname>
	<firstname>fred</firstname>
	<spaceaddress>space no. 000</spaceaddress>
	<mailingaddressid>999 ancient ave</mailingaddressid>
	<city>rockville</city>
	<state>WA</state>
	<postalcode>09880</postalcode>
	<phone>rocky 55 1212</phone>
	<cellphone>01-0</cellphone>
	<email>fred@flint.com</email>
	<comment>Caution, dog bites</comment>
</member>

The code for the memberships in XML is written from the following JavaScript file "memberwriter.js" in the "scripts" directory



function writexmlmemberblock (memberid,spaceid, lastname, firstname, spaceaddress, mailingaddressid, city, state, postalcode, phone, cellphone, email, comment, codeblock)
{ 

var memberid;
var spaceid;
var lastname;
var firstname;
var spaceaddress;
var mailingaddressid;
var city;
var state;
var postalcode;
var phone;
var cellphone;
var email;
var comment;
var codeblock;

var header = '<?xml version="1.0" encoding="UTF-8"?>' + '\n' + '<!DOCTYPE member SYSTEM "../../member.dtd">' + '\n' + '<?xml-stylesheet type="text/xsl" href="../../style/member.xsl" ?>' + '\n' + '<!-- Created at Trillium University using XML MemberWriter for MML (Member Markup Language) from home.comcast.net/~nisquallypauli -->' + '\n' + '\n';
var tag1start = "<member>"+ "\n";
var tag1end = "</member>" ;
var tag2start = "\t" + "<memberid>";
var tag2end = "</memberid>"+ "\n";
var tag3start = "\t" + "<spaceid>";
var tag3end = "</spaceid>"+ "\n";
var tag4start = "\t" + "<lastname>";
var tag4end = "</lastname>"+ "\n";
var tag5start = "\t" + "<firstname>";
var tag5end = "</firstname>"+ "\n";
var tag6start = "\t" + "<spaceaddress>";
var tag6end = "</spaceaddress>"+ "\n";

var tag7start = "\t" +"<mailingaddressid>"
var tag7end = "</mailingaddressid>"+ "\n";

var tag8astart = "\t" +"<city>"
var tag8aend = "</city>"+ "\n";
var tag8start = "\t" +"<state>"
var tag8end = "</state>"+ "\n";

var tag9start = "\t" +"<postalcode>"
var tag9end = "</postalcode>"+ "\n";

var tag10start = "\t" +"<phone>"
var tag10end = "</phone>"+ "\n";

var tag11start = "\t" +"<cellphone>"
var tag11end = "</cellphone>"+ "\n";

var tag12start = "\t" +"<email>"
var tag12end = "</email>"+ "\n";

var tag13start = "\t" +"<comment>"
var tag13end = "</comment>"+ "\n";

var codeblock =
header
 + tag1start    
 + tag2start 
 + memberid.value 
 + tag2end   
 + tag3start
 + spaceid.value
 + tag3end   
 + tag4start
 + lastname.value 
 + tag4end   
 + tag5start
 + firstname.value 
 + tag5end   
 + tag6start
 + spaceaddress.value 
 + tag6end   
 + tag7start
 + mailingaddressid.value 
 + tag7end   
 + tag8astart
 + city.value
 + tag8aend
 + tag8start
 + state.value
 + tag8end
 + tag9start
 + postalcode.value
 + tag9end
 + tag10start
 + phone.value
 + tag10end
 + tag11start
 + cellphone.value
 + tag11end
 + tag12start
 + email.value
 + tag12end
 + tag13start
 + comment.value
 + tag13end
 + tag1end;

document.memberform.codeblock.value = codeblock;
return true;
}

function clearForm(form)
	{
	document.bgColor="#ffffff";
       }
function CopyToClipboard() {
	var tempval=eval("memberform.codeblock");
	therange=tempval.createTextRange();
	therange.execCommand("Copy");
	window.status="XML code block copied to clipboard.";
	setTimeout("window.status=''",8000);
}

This is a simple, yet functional example of XML.
To fully understand the relationship between documents, it may be helpful to understand the directory structure being used (any could work, but this is how it is done here, and if you use a different directory structure, you may need to make many subtle changes through the documents to correct the links.)

All of this is contained in the directory paulixample and the full address of THIS page is Not referenced yet(example http:/)

Within this directory is to also be found "favicon.ico", and the directories: "/dtd", "/images", "/members;/, ", "/script", and "/style".

In addition, "members;" also has directories in it for categories of allmembers. It is within these directories that the XML members files reside. Typical of these would be: http://fjd1.com/paulixample/allmembers/member000.xml

Within "/dtd" is the file: "member.dtd"

Within "/script" is the script on this page "memberwriter.js" used to write XML member documents (above.)

Within "/style" are: "member.css" and "member.xsl"

Images for everything are contained in "/images".

Note: This is the developement of a membership xml data base - NisqP PRB