Click a link to create a vCard |
Click a link to create a vCard |
Gardy |
Oct 15 2009, 09:27 AM
Post
#1
|
Group: Members Posts: 5 Joined: 8-January 09 Member No.: 7,501 |
Hey all,
I have a list of Contacts displayed on my site that is compiled from an external JS fils (Haven't ventured in to SQL yet). I am trying to make it so that a user is able to click a link next to the user and have all of there information saved to a vCard that can be saved to MS Outlook. I think this is possible from other documentation that i have read, but I have fallen flat on my face in trying to achieve this. If any body is able to offer any tip's i'd really appriciate it. Thanks. Below is the code I am using to produce the Contact List, just incase any body needs it. I have highlighted red where the vCard link currently is. CODE /* **** ------------------------------------------------------------------------ GLOBAL VARIABLES ------------------------------------------------------------------------ **** */ var i = 0; // Dummy count var j = 0; // Dummy count var ContactNow // Whether or not the 'Contact Now' form is displayed var ContactByPost // Whether or not the 'Contact by Post' form is displayed /* **** ------------------------------------------------------------------------ CONTACT COUNT - So list is displayed correctly (Normal then alt, normal then alt) ------------------------------------------------------------------------ **** */ var inum; var dnum; /* **** ------------------------------------------------------------------------ QUERIES START HERE ------------------------------------------------------------------------ **** */ // Sets the variables ContactNow = "False" ContactByPost = "False" document.write ('<div class="post_title">'); document.write ('<h1 class="left">External Contacts - Displaying '+ContactList.length+' results</h1>'); document.write ('<div class="post_date right">'+lastUpdated+'</div>'); document.write ('<div class="clearer"> </div>'); document.write ('</div>'); document.write ('<div class="post_body nicelist">'); document.write ('<ol>'); j = 0; for (i in ContactList) { ContactNow = "False" ContactByPost = "False" j=j+1 dnum = j/2; inum = (Math.round(dnum)); if (dnum == inum) { document.write ('<li class="alt">'); } else { document.write ('<li class="">'); } // Avatar document.write ('<div class="staffdirectory left">'); // Avatar defined in profile if ((typeof ContactList[i][4]) != "undefined" && ContactList[i][4] != "") { document.write ('<a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;"><img alt="" src="'+ContactList[i][4]+'" height="32" width="32" /></a>'); } else // Avatar not defined, so default avatar defined here { document.write ('<a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;"><img alt="" src="img/People/Avatars/sample-avatar.jpg" height="32" width="32" /></a>'); } document.write ('</div>'); // Name - *Company (*Position) document.write ('<div class="staffdirectory">'); // No Company, so position automatically not shown even if it exists if ((typeof ContactList[i][1].comp) == "undefined" || ContactList[i][1].comp == "") { document.write ('<span class="name_staffdirectory"><a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;">'+ContactList[i][0]+'</a></span>'); } // Company (with URL) and Position else if (((typeof ContactList[i][1].url) != "undefined" && ContactList[i][1].url != "") && ((typeof ContactList[i][1].job) != "undefined" && ContactList[i][1].job != "")) { document.write ('<span class="name_staffdirectory"><a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;">'+ContactList[i][0]+'</a> - <a class="news_link" href="mailto:'+ContactList[i][1].url+'">'+ContactList[i][1].comp+'</a> ('+ContactList[i][1].job+')</span>'); } // Company (no URL) and Position else if (((typeof ContactList[i][1].url) == "undefined" || ContactList[i][1].url == "") && ((typeof ContactList[i][1].job) != "undefined" && ContactList[i][1].job != "")) { document.write ('<span class="name_staffdirectory"><a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;">'+ContactList[i][0]+'</a> - '+ContactList[i][1].comp+' ('+ContactList[i][1].job+')</span>'); } // Company (with URL) without Position else if (((typeof ContactList[i][1].url) != "undefined" && ContactList[i][1].url != "") && ((typeof ContactList[i][1].job) == "undefined" || ContactList[i][1].job == "")) { document.write ('<span class="name_staffdirectory"><a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;">'+ContactList[i][0]+'</a> - <a class="news_link" href="mailto:'+ContactList[i][1].url+'">'+ContactList[i][1].comp+'</a></span>'); } // Company (no URL) without Position else if (((typeof ContactList[i][1].url) == "undefined" || ContactList[i][1].url == "") && ((typeof ContactList[i][1].job) == "undefined" || ContactList[i][1].job == "")) { document.write ('<span class="name_staffdirectory"><a onmouseover="window.status=\'Click to see the profile of '+ContactList[i][0]+'\';return true" onmouseout="window.status=\'\';return true" href="staff_profile.html" onClick="this.href+=\'?person='+ContactList[i][0]+'\';return true;">'+ContactList[i][0]+'</a> - '+ContactList[i][1].comp+'</span>'); } // Email link // Has email address if ((typeof ContactList[i][2].email) != "undefined" && ContactList[i][2].email != "") { document.write ('<div class="contact_details"><a onmouseover="window.status=\'Click to email '+ContactList[i][0].split(" ", 1)+'\';return true" onmouseout="window.status=\'\';return true" href="mailto:'+ContactList[i][2].email+'">Click to e-mail '+ContactList[i][0].split(" ", 1)+'</a></div>'); } // No email address else { document.write ('<div class="contact_details">No email address available for '+ContactList[i][0].split(" ", 1)+'</div>'); } document.write ('</div>'); // Contact Details // Contact now - Does not show the heading if all elements are empty or undefined if (((typeof ContactList[i][2].office) != "undefined" && ContactList[i][2].email != "") || ((typeof ContactList[i][2].mob) != "undefined" && ContactList[i][2].mob != "") || ((typeof ContactList[i][2].off) != "undefined" && ContactList[i][2].off != "") || ((typeof ContactList[i][2].ext) != "undefined" && ContactList[i][2].ext != "") || ((typeof ContactList[i][2].ddi) != "undefined" && ContactList[i][2].ddi != "") || ((typeof ContactList[i][2].fax) != "undefined" && ContactList[i][2].fax != "")) { ContactNow = "True" document.write ('<div class="profile_contact left"><h2>Contact '+ContactList[i][0].split(" ", 1)+' now</h2>'); document.write ('<table class="contact_details">'); // E-mail address (email) if ((typeof ContactList[i][2].email) != "undefined" && ContactList[i][2].email != "") { document.write ('<tr><td class="method"><a class="header email"><span class="type">E-mail</span>: </a></td><td><span class="value">'+ContactList[i][2].email+'</span></a></td></tr>'); } // Mobile (mob) if ((typeof ContactList[i][2].mob) != "undefined" && ContactList[i][2].mob != "") { document.write ('<tr><td class="method"><a class="header tel"><span class="type">Mobile</span>: </a></td><td><span class="value">'+ContactList[i][2].mob+'</span></td></tr>'); } // Office (off) if ((typeof ContactList[i][2].off) != "undefined" && ContactList[i][2].off != "") { document.write ('<tr><td class="method"><a class="header tel"><span class="type">Office</span>: </a></td><td><span class="value">'+ContactList[i][2].off+'</span></td></tr>'); } // Extension (ext) if ((typeof ContactList[i][2].ext) != "undefined" && ContactList[i][2].ext != "") { document.write ('<tr><td class="method"><a class="header tel"><span class="type">Extension</span>: </a></td><td><span class="value">'+ContactList[i][2].ext+'</span></td></tr>'); } // Direct Dail (ddi) if ((typeof ContactList[i][2].ddi) != "undefined" && ContactList[i][2].ddi != "") { document.write ('<tr><td class="method"><a class="header tel"><span class="type">Direct Dial</span>: </a></td><td><span class="value">'+ContactList[i][2].ddi+'</span></td></tr>'); } // Fax (fax) if ((typeof ContactList[i][2].fax) != "undefined" && ContactList[i][2].fax != "") { document.write ('<tr><td class="method"><a class="header tel"><span class="type">Fax</span>: </a></td><td><span class="value">'+ContactList[i][2].fax+'</span></td></tr>'); } document.write ('</table>'); document.write ('</div>'); } // Contact by Post - Does not show the heading if all elements are empty or undefined if (((typeof ContactList[i][1].comp) != "undefined" && ContactList[i][1].comp != "") || ((typeof ContactList[i][1].job) != "undefined" && ContactList[i][1].job != "") || ((typeof ContactList[i][3].add1) != "undefined" && ContactList[i][3].add1 != "") || ((typeof ContactList[i][3].add2) != "undefined" && ContactList[i][3].add2 != "") || ((typeof ContactList[i][3].add3) != "undefined" && ContactList[i][3].add3 != "") || ((typeof ContactList[i][3].add4) != "undefined" && ContactList[i][3].add4 != "") || ((typeof ContactList[i][3].add5) != "undefined" && ContactList[i][3].add5 != "") || ((typeof ContactList[i][3].add6) != "undefined" && ContactList[i][3].add6 != "")) { ContactByPost = "True" document.write ('<div class="profile_contact left">'); document.write ('<h2>Contact '+ContactList[i][0].split(" ", 1)+' by post</h2>'); document.write ('<table class="contact_details">'); document.write ('<div class="org">'); // Company Name if ((typeof ContactList[i][1].comp) != "undefined" && ContactList[i][1].comp != "") { document.write ('<tr><td class="method"><a class="header">Company: </a></td><td><div class="organization-name">'+ContactList[i][1].comp+'</div></td></tr>'); } // Position if ((typeof ContactList[i][1].job) != "undefined" && ContactList[i][1].job != "") { document.write ('<tr><td class="method"><a class="header">Position: </a></td><td><div class="organization-unit">'+ContactList[i][1].job+'</div></td></tr>'); } document.write ('</div>'); // Address 1 if ((typeof ContactList[i][3].add1) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<div class="adr">'); document.write ('<tr><td class="method"><a class="header">Address: </a></td><td><span class="street-address">'+ContactList[i][3].add1+'</span></tr></td>'); // Address 2 if ((typeof ContactList[i][3].add2) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<tr><td></td><td><span class="locality">'+ContactList[i][3].add2+'</span></tr></td>'); } // Address 3 if ((typeof ContactList[i][3].add3) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<tr><td></td><td><span class="region">'+ContactList[i][3].add3+'</span></tr></td>'); } // Address 4 if ((typeof ContactList[i][3].add4) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<tr><td></td><td><span class="postal-code">'+ContactList[i][3].add4+'</span></tr></td>'); } // Address 5 if ((typeof ContactList[i][3].add5) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<tr><td></td><td><span class="postal-code">'+ContactList[i][3].add5+'</span></tr></td>'); } // Address 6 if ((typeof ContactList[i][3].add6) != "undefined" && ContactList[i][3].add6 != "") { document.write ('<tr><td></td><td><span class="postal-code">'+ContactList[i][3].add6+'</span></tr></td>'); } document.write ('</div>'); } document.write ('</table>'); document.write ('</div>'); } // Add Contact Card - Will not display if both 'Contact Now' and 'Contact by Post' are hidden [color=#FF0000] if (ContactByPost == "True" && ContactNow == "True") { document.write ('<div class="profile_contact vcard">'); document.write ('<h2>Add '+ContactList[i][0].split(" ", 1)+'</h2>'); document.write ('<table class="contact_details">'); document.write ('<tr><td><a href="http://feeds.technorati.com/contact/http://dynedrewnett" title="Download vCard"><img src="img/vcard_icon.gif" /></a></td></tr>'); document.write ('<tr><td><a href="http://feeds.technorati.com/contact/http://dynedrewnett" title="Download vCard">Click to add '+ContactList[i][0].split(" ", 1)+' to your Address Book</a></td></tr>'); document.write ('</table>'); document.write ('</div>');[/color] } document.write ('<div class="clearer"> </div>'); document.write ('</li>'); } document.write ('</ol>'); document.write ('</div>'); if (dnum != inum ) { document.write ('<div class="post_bottom"></div>'); } else { document.write ('<div class="post_bottom_alt"></div>'); } |
Darin McGrew |
Oct 15 2009, 12:57 PM
Post
#2
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
I've moved this to the client-side scripting forum, since it is about JavaScript.
|
Gardy |
Oct 16 2009, 04:09 AM
Post
#3
|
Group: Members Posts: 5 Joined: 8-January 09 Member No.: 7,501 |
|
Lo-Fi Version | Time is now: 26th April 2024 - 05:46 AM |