March
---
2003




Email web application

This unfinished prototype was developed out of frustration of existing web based clients that would have to refresh on every mouse click to retrieve any tupe of data from the mail server. I was wondering if I could provide a pleasant user experience with an email client that emulates, let's say Microsoft Outlook or Mozilla Thunderbird.


(scaled down to fit....click for full size)

Here is the XML file that populates this app. email.xml and here is the Actionscript code:

aspx.cs code

//Controls for the main buttons----------------------------------------
Arr_button_email=new Array(
	"inbox",
	"sent",
	"contact",
	"notes",
	"deleted");

for(i=0;i<Arr_button_email.length;++i){
  this["button_email_"+Arr_button_email[i]].onRollOver=
	function(){buttonhighlight(this,2);}
  this["button_email_"+Arr_button_email[i]].onRollOut=
	function(){buttonhighlight(this,1);}
  this["button_email_"+Arr_button_email[i]].useHandCursor 
	= false;
}

//Controls for the top buttons----------------------------------------
Arr_button_top=new Array(
	"new",
	"delete",
	"reply",
	"replytoall",
	"forward",
	"sendreceive",
	"find",
	"help");

for(i=0;i<Arr_button_top.length;++i){
  this["button_top_"+Arr_button_top[i]].onRollOver=
	function(){buttonhighlight_top(this, 2);}
  this["button_top_"+Arr_button_top[i]].onRollOut=
	function(){buttonhighlight_top(this, 1);}
  this["button_top_"+Arr_button_top[i]].useHandCursor = 
	false;
}

//Places the highlight on the button and turns off or on---------------
function buttonhighlight(icon, status){
  button_highlight_clip._y = icon._y;
  button_highlight_clip.gotoAndStop(status);
}

function buttonhighlight_top(icon, status){
  button_highlight_top_clip._x = icon._x;
  button_highlight_top_clip.gotoAndStop(status);
}
//-------------------------------------------------------------------
objXML = new XML();
objXML.ignoreWhite=true; 
objXML.onLoad = createlist;
objXML.load("email.xml");

function createlist(){ 
  for(i=0;i<objXML.firstChild.childNodes.length;++i){
    list.listitem.duplicateMovieClip("listitem"+i, 100+i) 

    //positions the items underneath eachother
    list["listitem"+i]._y = (i*(list["listitem"+i]._height));
    //populates the items with data from XML
    list["listitem"+i].list_top_importance.text=
		objXML.firstChild.childNodes[i].attributes.priority;
    list["listitem"+i].list_top_attachment.text=
		objXML.firstChild.childNodes[i].attributes.attach;
    list["listitem"+i].list_top_from.text=
		objXML.firstChild.childNodes[i].attributes.from;
    list["listitem"+i].list_top_received.text=
		objXML.firstChild.childNodes[i].attributes.received;

    //embeds the ID of the email header and 
    triggers a function with this.ID
    list["listitem"+i].highlighter.ID = 
		objXML.firstChild.childNodes[i].attributes.id
    list["listitem"+i].highlighter.onRelease = 
		function(){getContent(this.ID)};
  }

  list.listitem._visible = 0;
  toplistscroll.setScrollContent(list);
  bottomlistscroll.setScrollContent(bottomcontent);
}

function getContent(ID){
  //header information
  header_from.text = objXML[ID].attributes.from;
  header_subject.text = objXML[ID].attributes.subject;
  header_to.text = objXML[ID].attributes.to;
  header_cc.text = objXML[ID].attributes.cc;

  bottomcontent.htmlText = objXML[ID].firstChild.attributes.body;
}

//Common methods--------------------------------------------------
MovieClip.prototype.alert = function(msg){
  var loc = this._url.substr(0,4);
  if(loc == "file"){
    trace(msg);
  }else{
    getURL("javascript:alert('" + msg + "')");
  }
}

Skills: C#, Flash MX.