Welcome

I'm Christian Cox, an Atlanta-based front-end web developer and occasional designer. Lately I'm focusing on web standards, mobile, and ActionScript development (if you can call that 'focus'). I get to work with PHP and some MySQL too, but not quite as often. Roll over the links below to get a description of the work I performed on each project, then click through to check them out.

Portfolio

Web Standards
Standard Press
Ventanas
Erica & Michael's Wedding
The Stacks
maybe.for.you.
ParkGrounds
Quickbooks Made Easy

Flash
Full Sail Pathfinder
Lifestream
Tronic Studio
FLASH Peril Map
FLASH Video Player
Capital Dateline Online
CDC Flu IQ Widget
Philips Van-Heusen Video Player
Philips Van-Heusen Map
Significant Federation Paparazzi Gallery
J&CO Creative
Firedog Jewelry Configurator
The Iron Spindle

 

Sponsored Links

Basecamp

Web Hosting By ICDSoft.com

Posts Tagged ‘MailChimp’

Subscribe list users to a MailChimp mailing list using Flash

Tuesday, January 13th, 2009

UPDATE:
While this code is still functional and useful for AS 2.0 projects, an updated MailChimp AS 3.0 sample is now available from kohactive!

Here’s some sample code you can use to connect your Flash signup form to the MailChimp API. I recently had a client with an existing MailChimp account ask to allow users to sign up for their newsletter through their website, which has a full Flash interface. Unfortunately I was not able to find much documentation out there about how to make this work, and it took me some hair pulling to get it sorted out. Finally, with the help of Jesse Peterson and the API team at MailChimp, we were able to get a working version that doesn’t require any additional PHP or other backend scripting. Here’s the AS:


// Edit your MailChimp specifics here.
// You shouldn't have to edit anything but these two variables
// unless you are collecting additional data.
_global.apiKey = "YOUR_MAILCHIMP_API_KEY";
_global.listID = "YOUR_MAILCHIMP_LIST_ID";

// set tab order for form usability
firstName_txt.tabIndex = 1;
lastName_txt.tabIndex = 2;
email_txt.tabIndex = 3;
submit_mc.tabIndex = 4;

// submission
submit_mc.onRelease = function()
{
   // show a loading message in case transmission is slow
   response_txt.text = "Sending…";

   // gather form data
   var firstName:String = firstName_txt.text;
   var lastName:String = lastName_txt.text;
   var email:String = email_txt.text;

   // check the email address
   // if it's valid…
   if(validEmail(email)){

      // disable the submit button while loading data
      submit_mc.enabled = false;

      // set up result xml
      var result_xml:XML = new XML();
      result_xml.ignoreWhite = true;
      result_xml.onLoad = function(success){

         // if the user is subscribed successfully, the result set
         // will look something like
         // <MCAPI type="boolean">1</MCAPI>
         // so you can reset the form and display
         // the confirmation message.
         if(result_xml.firstChild.firstChild.toString() == "1"){
            resetForm("Please check your email to confirm your subscription.");
         }

         // or else there was a data error,
         // so you need to parse the error code.
         else{

            // Convert the error string from XML data to a string,
            // then display it in the response text field.
            var resultCode = result_xml.firstChild.childNodes[0].childNodes[0].toString();
            _root.resetForm(resultCode);
         }
      }

      // Set up a send XML object, even though we're not
      // really sending anything in XML.
      // All your data will be encoded in the send_url variable.
      var send_xml:XML = new XML();
      send_xml.ignoreWhite = true;
      // Here's where your data is added.
      // For additional text fields, add additional merge_vars
      // array elements and append at the end.
      var send_url:String = "http://api.mailchimp.com/1.1/?output=xml";
      send_url += "&method=listSubscribe&apikey=" + apiKey;
      send_url += "&id=" + listID + "&email_address=" + email;
      send_url += "&merge_vars[FNAME]=" + firstName;
      send_url += "&merge_vars[LNAME]=" + lastName;
      // And here's how you send/load:
      send_xml.sendAndLoad(send_url, result_xml);

   }
   // or else there's an issue with the email address
   else{
      // show the email error.
      showErrors();
   }
}

// validate an email address
function validEmail(inputEmail:String):Boolean
{
   if (inputEmail.indexOf(" ")>0) {
   return false;
}
var emailArray:Array=inputEmail.split("@");
if (emailArray.length != 2 || emailArray[0].length == 0 || emailArray[1].length ==0) {
   return false;
}
var postArray:Array=emailArray[1].split(".");
if (postArray.length < 2) {
   return false;
}
for (var i:Number=0; i<postArray.length; i++){

   if (postArray[i].length < 1) {
      return false;
   }
}
var suffix=postArray[postArray.length-1];
if (suffix.length < 2 || suffix.length > 3) {
   return false;
}
   return true;
}

// delete all form elements and display a response message
function resetForm(pResponse){
   submit_mc.enabled = true;
   firstName_txt.text = "";
   lastName_txt.text = "";
   email_txt.text = "";
   response_txt.text = pResponse;
   Selection.setFocus("firstName_txt");
}

// select the email address and display an error message
function showErrors(){
   Selection.setFocus("email_txt");
   Selection.setSelection(0, email_txt.length);
   response_txt.text = "Invalid email address.";
   submit_mc.enabled = true;
}

Want to try it out? All you need to do to get it working is set up your MailChimp account and lists, then edit these variables:


_global.apiKey = "YOUR_MAILCHIMP_API_KEY";
_global.listID = "YOUR_MAILCHIMP_LIST_ID";

Then push your files online or test your SWF directly in the Flash Player (testing in a browser from your desktop may throw a Flash security error). You should be subscribing users in no time. Thanks again to the API team for working with me on this!