function CoopepNoteCardBack(sFormId, bHasMeta, bHasFonts, bHasIcons, bHasBackgrounds, bHasIconBackgrounds, bHasDesignHasPartnerLogo){

	//properties
	m_sFormId = sFormId;
	m_hasMeta = bHasMeta;
	m_has_Fonts = bHasFonts;
	m_has_icons = bHasIcons;
	m_has_Backgrounds = bHasBackgrounds;
	m_hasIconBackgrounds = bHasIconBackgrounds;
	m_HasDesignHasPartnerLogo = bHasDesignHasPartnerLogo;
	m_mainTextLines = 6;
	m_mainTextChars = 30;

	this.checkMainText = function (oEvent) {

		if(!oEvent) {oEvent=window.event;}

		var bCanProceed = true;
	  	var oInput = get('txtLine1');
		var sCheckText = oInput.value;

		//add the type charecter into the check text (enter key, or a normal char)
		if((oEvent.keyCode == 13 && oEvent.keyCode < 3000) || (oEvent.charCode >30 && oEvent.charCode < 3000)){
			var iCaretPosition = caretPosition(oInput);
			var sChar = String.fromCharCode(oEvent.keyCode);
			if(oEvent.keyCode  ==13){
				sChar = '\n';
			}

			sCheckText = sCheckText.substring(0, iCaretPosition) + sChar + sCheckText.substring(iCaretPosition +1, sCheckText.length);

			//new line count
			var aSplit = sCheckText.split('\n');

			var iLineCount = aSplit.length;

			//would any line breaks be added?
			for (var i=0; i < aSplit.length -1; i++) {
				if(aSplit[i].length > m_mainTextChars){
					iLineCount +=1;
				}
			}
			if(iLineCount > m_mainTextLines || (iLineCount == m_mainTextLines && aSplit[aSplit.length - 1].length > m_mainTextChars)){
				bCanProceed = false;
				oEvent.cancelBubble = true;
				oEvent.returnValue = false;
			}
		}

		return bCanProceed;
	}

	//sync free text line
	this.syncLine = function(sLine){
	  var oInput = get('txtLine' + sLine);
	  var oPreview = get('pLine' + sLine).childNodes[0];

	//if this is the main text area, make sure we dont have too many lines
	var aNewLines = new Array();
	if(oInput.id == 'txtLine1'){
		var aSplit = oInput.value.split('\n');
		for (var ii=0; ii < aSplit.length; ii++) {
			if(aSplit[ii].length > m_mainTextChars){
				//find wrap lines longer than 30 chars
				var aTempLines = stringToLines(aSplit[ii], m_mainTextChars);
				if(aTempLines.length >0){
					for (var iii=0; iii < aTempLines.length; iii++) {
						aNewLines[aNewLines.length] = aTempLines[iii];
					}
				}
			}else{
				aNewLines[aNewLines.length] = aSplit[ii];
			}
		}
		//grab the text
		sText = aNewLines.join('\n');
	}else{
		sText = oInput.value;
	}

	//Store value
	get('hidLine' + sLine).value = sText;

	//Change all spaces to &nbsp; and replace any dodgy chars
	while (sText.indexOf(' ') >= 0){
		sText = sText.replace(' ', '&nbsp;');
	}
	sText = sText.replace("<", "&#60;").replace(">", "&#62;").replace("/", "&#47;");

		//Change \n to br's;
		while (sText.indexOf('\n') >= 0){
			sText = sText.replace('\n', '<br/>');
		}

		//set text
	  	oPreview.innerHTML  = sText;
	}

	//sync all free text lines
	this.syncAllLines = function(){
		for (i=2; i<=5; i++) {
			if (m_hasMeta == false){
				this.syncLine(i);
			}else{
				if (get("ddlMetaToggle" + i).value =="freetext"){
					this.syncLine(i);
				}else{
					this.setMetaFullName(i);
				}
			}
		}
	}

	//toggle partner
	this.togglePartnerLogo = function(){
		var oChecked = get('chkPartnerLogo');
		if (oChecked.checked == true){
	        get('imgPartnerLogo').style.display = 'block';
			get('imgAvatarBack').className="partner";
	    }else{
	        get('imgPartnerLogo').style.display = 'none';
			get('imgAvatarBack').className="none";
		}

		//Check for background change
		this.refreshBackground();
	}


	this.changeFont = function(sFont){
		get("divNotecardPreview").className = sFont;
        aPreviewtext = document.getElementsByClassName('previewline');
        for (i=0; i < aPreviewtext.length; i++) {
          aPreviewtext[i].style.fontFamily = sFont;
        }
		this.syncAllLines();
	}

 	this.changeBackground = function (sBackground){

		//set selected in background picker
		var aIcons = document.getElementsByClassName('backgrounditem');
		for (var i=0; i < aIcons.length; i++) {
			aIcons[i].className ="backgrounditem";
		}

		//set selected in picker
		get("liBackground_" + sBackground).className = "backgrounditem selected";

		//special icon version?
		if (this.logoOrIconSelected() == false || m_hasIconBackgrounds != true){
			sStyle = "url('images/backgrounds/preview/" + sBackground + ".png')";
		}else{
			sStyle = "url('images/backgrounds/preview/" + sBackground + "_icon.png')";
		}

		//change background
		get('divPreviewBackColour').style.background = sStyle;

		//set the selected radio button manually (IE6 refuses to respect images vs label  z-order)
		get("radBackground_" + sBackground).checked = true;

	}

	this.refreshBackground = function(){

		if(m_hasIconBackgrounds == true){
			var sStyle = get('divPreviewBackColour').style.background;
			sStyle = sStyle.replace(/(.png|_icon.png)/,"@wildcard@");
			if (this.logoOrIconSelected() == true){
				sStyle = sStyle.replace("@wildcard@","_icon.png");
			}else{
				sStyle = sStyle.replace("@wildcard@",".png");
			}
			get('divPreviewBackColour').style.background = sStyle;
		}
	}

	this.logoOrIconSelected = function(){
		var bReturn = false
		if(get("chkPartnerLogo").checked == true){
			bReturn= true;
		}

		if(get("radIcon_none").checked == false){
			bReturn= true;
		}
		return bReturn;
	}

 	this.changeIcon = function (sIcon){

		//set selected in icon picker
		var aIcons = document.getElementsByClassName('iconitem');
		for (var i=0; i < aIcons.length; i++) {
			aIcons[i].className ="iconitem";
		}

		get("liIcon_" + sIcon).className = "iconitem selected";

		//change icon on the card preview
		if (sIcon == 'none'){
			get('imgAvatarBack').style.display="none"
		}else if(sIcon == 'buddy'){
			get('imgAvatarBack').style.display="inline"
			get('imgAvatarBack').src = get('hidBuddyUrl').value;
			get('imgAvatarBack').className = "partner buddy";
		}else{
			get('imgAvatarBack').style.display="inline"
			get('imgAvatarBack').src="images/icon/middle/" + sIcon + ".png";
			get('imgAvatarBack').className = "partner " +sIcon;
		}

		//set the selected radio button manually (IE6 refuses to respect images vs label  z-order)
		get("radIcon_" + sIcon).checked  = true;

		this.refreshBackground();
		this.checkAvalableSpace();
	}

	this.checkAvalableSpace = function(){

		var bAvatar = (get('radIcon_none').checked == false);

		if (bAvatar == true){
	        get('imgAvatarBack').style.display = 'block';
			get('divFootnote').className = 'small';
	    }else{
	        get('imgAvatarBack').style.display = 'none';
			get('divFootnote').className = '';
		}
	}


	this.inverseColour = function(){

		var sTextColour = "";
		var sBackgroundColour = "";
		if (get('chkInverseColour').checked == true){
			sTextColour = "#ffffff";
			sBackgroundColour = '#' + get('hidTextColour').value;;
		}else{
			sTextColour = '#' + get('hidTextColour').value;
			sBackgroundColour = "#ffffff";
		}

		aPreviewtext = document.getElementsByClassName('previewline');
		for (i=0; i < aPreviewtext.length; i++) {
			aPreviewtext[i].style.color = sTextColour;
		 }

		get("divPreviewBackColour").style.background = sBackgroundColour;
	}

	this.selectMeta = function(iLineNumber){

		var sMetaType = get('ddlMetaToggle' + iLineNumber).value;
		var oTextbox = get('txtLine' + iLineNumber);

		//If it's freetext or divider, reselect "free text"
		if (sMetaType=="freetext" || sMetaType == "div"){
			get('ddlMetaToggle' + iLineNumber).value = "freetext";

			//enable textbox
			oTextbox.disabled=false;
			oTextbox.className = "textbox preview";
			oTextbox.value="";
			this.syncLine(iLineNumber);
			setFocus(oTextbox.id);
		}else{

			//clear & disable textbox
			oTextbox.disabled=true;
			oTextbox.className = "textbox preview disabled";
			oTextbox.style.backgroundPosition = "-250px";

			//Set full meta name
			this.setMetaFullName(iLineNumber);

			//Get meta data
			var aMetaValues = eval("(" + unescape_from_input_element(get('hidJsonMeta').value) + ")");
			var sMetaValue =  aMetaValues[sMetaType];

			//set example in card preview
			get('pLine' + iLineNumber).childNodes[0].innerHTML = sMetaValue;

			//Set wildcard in textbox
			get('hidLine' + iLineNumber).value = sMetaValue;
		}
	}

	this.setMetaFullName = function(iLineNumber){
		var sNiceName = dropdownTextValue('ddlMetaToggle' + iLineNumber);
		get('txtLine' + iLineNumber).value=sNiceName + " will appear on each card";
	}

	//validate
	this.validate=function (){
		postBackForm(m_sFormId);
	}

	//Colour picked
	this.textColourPicked = function(sColour){

		var bInverse = false;
		if(document.getElementById('chkInverseColour')){
			if(get('chkInverseColour').checked == true){
				bInverse = true;
			}
		}

		if (bInverse != true){

			aPreviewtext = document.getElementsByClassName('previewline');
			for (i=0; i < aPreviewtext.length; i++) {
				aPreviewtext[i].style.color = "#" + sColour;
		        }

			//set colour selected
			var aColours = document.getElementsByClassName('colouritem');
			for (var i=0; i < aColours.length; i++) {
				aColours[i].className ="colouritem";
			}
		}else{
			//set colour selected
			var aColours = document.getElementsByClassName('colouritem');
			for (var i=0; i < aColours.length; i++) {
				aColours[i].className ="colouritem";
			}
			get("divPreviewBackColour").style.background = "#" + sColour;
		}

		//post the variables;
		get('hidTextColour').value = sColour;

		//set item in toolbar
		get('liColour_' + sColour).className = "colouritem selected";
	}

	//Constructor
	setFocus('txtLine1');
	this.syncAllLines();

}