IntenseDebate Comment System

Looking for a few examples to get you started? Look no further!

Quick Links:

• YouTube
• AddToAny Share Button for Posts
• AddToAny Share Button for Comments
• Hyves Tip
• After the Deadline: Spell check for Comments
• Facebook Share

YouTube

<pre>var id_youtube_plugin = {};
id_youtube_plugin.youtube_disabled_edit_ids = []; /* IntenseDebate commentid's that should have edit functionality disabled (contain youtube embeds) */
id_youtube_plugin.youtube_posted_from = 0; /* Which field should the poll embed code be inserted in (Reply or New Comment) */

/* add the YouTube button to the interface */
id_youtube_plugin.id_add_youtube_button = function() {
     id_add_plugin_button("javascript: id_youtube_plugin.id_show_youtube_embed(0)", "javascript: id_youtube_plugin.id_show_youtube_embed(1)", "www.youtube.com/favicon.ico", "Add a YouTube Video", "YouTube", "Embed video");

     id_youtube_plugin.id_youtube_disable_edit_buttons();
};

/* display the popup for the url of the video to embed */
id_youtube_plugin.id_show_youtube_embed = function(posted_from) {
     /* keep track of if it was for a reply or a new comment */
     id_youtube_plugin.youtube_posted_from = posted_from;

     var link2 = $newEl('a');
     link2.class="javascript: id_youtube_plugin.id_add_youtube_embed_code();";
     IDReplaceHtml(link2, "&lt;span&gt;&lt;/span&gt;&lt;span class='idc-r'&gt;Embed Video&lt;/span&gt;");
     link2.className="idc-btn_s idc-disablestyles";
     link2.style.cssFloat = 'right';

     showMsgBox('Embed a YouTube Video', '&lt;p&gt;Enter the video URL to embed below:&lt;/p&gt;&lt;input type="text" id="txtYouTubeURL"/&gt;', 0, null, link2);
};

id_youtube_plugin.id_add_youtube_embed_code = function() {
     /* Grab the url and identify the target textbox */
     var vidUrl = $id('txtYouTubeURL').value;

     /* make sure we add the embed code to the right textbox ( a reply or a new comment) */
     if(id_youtube_plugin.youtube_posted_from == 0)
          var textBox = $id('IDCommentNewThreadText');
     else
          var textBox = $id('txtComment');

     /* Check for valid match */
     var regex=/http:\/\/([a-zA-Z0-9]+\.)?youtube\.com\/watch\?v=(.*)/ig;
     var m=regex.exec(vidUrl);

     /* If there is a match */
     if(m &amp;&amp; m.length&gt;2) {
          /* If no comment text has been entered yet be sure to clear the default stuff */
          if(textBox.value=='Enter text right here!') {
               textBox.value = '';
               textBox.style.color = 'black';
          }

          /* Add the embed code to the textbox */
          textBox.value += " + " " + vidUrl + " youtube]";

          /* Hide the popup box */
          hideMsgBox();

          /* reset the regex */
          regex.lastIndex=0;

          /* Give focus to the text box */
          textBox.focus();
     }
     else
          /* Failed to match the url */
          alert('Unable to parse that url');
};

/* Disable the edit button for any comments that have a video */
id_youtube_plugin.id_youtube_disable_edit_buttons = function() {
     for(objElem in id_youtube_plugin.youtube_disabled_edit_ids) {
          if($id('IDCommentPostReplyLinkEdit'+id_youtube_plugin.youtube_disabled_edit_ids[objElem]))
          $id('IDCommentPostReplyLinkEdit'+id_youtube_plugin.youtube_disabled_edit_ids[objElem]).style.display = 'none';
     }
};

id_youtube_plugin.id_youtube_embed_replace = function(args) {
     var text = args['text'];

     //Check for valid match
     var youtube_regex=/\/ig;
     var m = youtube_regex.exec(text);

     //If there is a match
     if(m &amp;&amp; m.length&gt;1) {
          /* add the IntenseDebate commentid to the array of comments to disable editing for */
          id_youtube_plugin.youtube_disabled_edit_ids[id_youtube_plugin.youtube_disabled_edit_ids.length] = args['commentid'];

          /* reset the regex */
          youtube_regex.lastIndex=0;

          /* return the youtube div (where the video will go */
          return text.replace(youtube_regex, '&lt;div class="idc-video_youtube"&gt;&lt;object "480" "295"&gt;&lt;param name="movie" value="www.youtube.com/v/'+m[1]+'&amp;hl=en&amp;fs=1&amp;rel=0"&gt;&lt;/param&gt;&lt;param name="allowFullScreen" value="true"&gt;&lt;/param&gt;&lt;param name="allowscriptaccess" value="always"&gt;&lt;/param&gt;&lt;embed src="/img/spacer.gif"> 
AddToAny Share Button for Posts↑ Table of Contents ↑
<pre>
var id_addtoany_posts_plugin = {};


// Initiate AddToAny drop-down(s)
id_addtoany_posts_plugin.load_addtoany_js = function() {	
	/* AddToAny globals */
	a2a_linkname = document.title;
	a2a_linkurl = location.href;
	
	var s = document.createElement('script');
	s.src = "static.addtoany.com/menu/page.js";
	document.getElementsByTagName('head')[0].appendChild(s);
};


// Insert AddToAny button below each comment
id_addtoany_posts_plugin.insert_share_button = function() {
	var container = document.getElementById('idc-container');
	var button_cont = document.createElement("div"),
		button_link = document.createElement("a"),
		button_image = document.createElement("img");
	
	button_cont.style.display = "block";
	button_cont.style.margin = "15px 0";
	
	button_link.className = "a2a_dd";
	button_link.href = "www.addtoany.com/share_save";
	
	button_image.src = "static.addtoany.com/buttons/share_save_171_16.png";
	button_image.width = 171;
	button_image.height = 16;
	button_image.border = 0;
	
	button_link.appendChild(button_image);
	button_cont.appendChild(button_link);
	
	container.insertBefore( button_cont, container.firstChild );
	container.insertBefore( button_cont, container.firstChild );
	
	/* Initiate drop-down */
	id_addtoany_posts_plugin.load_addtoany_js();
};


// IntenseDebate Filters
id_add_action('idcomments_init', id_addtoany_posts_plugin.insert_share_button);
</pre>

AddToAny Share Button for Comments↑ Table of Contents ↑
<pre>
var id_addtoany_plugin = {};
id_addtoany_plugin.comment_ids = [];
id_addtoany_plugin.addtoany_script_loaded = false;

// Return comment IDs as they appear in DOM (modified getElementsByClass)
id_addtoany_plugin.get_comment_ids = function (className) {
	var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)");
	var elm = document.getElementById('idc-cover'); // Assumed idc-cover
	var elements = elm.getElementsByTagName('div'); // Assumed DIV
	var returnElements = [];
	var current;
	var length = elements.length;
	for(var i=0; i<length; i++){
		current = elements[i];
		if(testClass.test(current.className)){
			returnElements.push(current.id); // Set element ID
		}
	}
	return returnElements; // Return element IDs
}

// Detect external script onLoad
id_addtoany_plugin.load_external_js = function (src, test, callback) {
	var s = document.createElement('script');
	s.src = src;
	document.getElementsByTagName('head')[0].appendChild(s);
	
	var callbackTimer = setInterval(function() {
	var call = false;
	try {
	  call = test.call();
	} catch (e) {}
	
	if (call) {
	  clearInterval(callbackTimer);
	  callback.call();
	}
	}, 100);
};

// Initiate AddToAny drop-down(s)
id_addtoany_plugin.load_addtoany_js = function() {
	a2a_linkname = document.title; // AddToAny global
	var base_location = location.href.split('#')[0] + '#IDComment';
	
	// Additional drop-downs: set location, call a2a_init
	if ( id_addtoany_plugin.addtoany_script_loaded ) {
		var num_ids = id_addtoany_plugin.comment_ids.length;
		for(var i = 1; i < num_ids; i++) {
			a2a_linkurl = base_location + id_addtoany_plugin.comment_ids[i]; // AddToAny global
			a2a_init("page");
		}
	}
	// First drop-down, set location, load AddToAny script (which also calls a2a_init)
	else {
		// Set all comment IDs
		id_addtoany_plugin.comment_ids = id_addtoany_plugin.get_comment_ids('idc-c');
		
		id_addtoany_plugin.addtoany_script_loaded = true;
		a2a_linkurl = base_location + id_addtoany_plugin.comment_ids[0]; // AddToAny global
		id_addtoany_plugin.load_external_js('static.addtoany.com/menu/page.js',
			function(){ return (typeof window['a2apage_init'] != 'undefined') },
			function(){ id_addtoany_plugin.load_addtoany_js() }
		);
	}
};


// Insert AddToAny button below each comment
id_addtoany_plugin.insert_share_button = function(args) {
	var comment_text = args['text'],
		comment_id = args['commentid'];
	
	// Add the IntenseDebate commentid to the array of comment IDs
	//id_addtoany_plugin.comment_ids[id_addtoany_plugin.comment_ids.length] = comment_id;

	return comment_text+'&lt;div style="display:block;margin:6px 0 0"&gt;&lt;a class="a2a_dd" class="www.addtoany.com/share_save"&gt;&lt;img src="/img/spacer.gif"> 
Hyves Tip↑ Table of Contents ↑
<pre>
var id_hyvestip_posts_plugin = {};

id_hyvestip_posts_plugin.insert_hyves_button = function() {
	
// Declare values

	var container = document.getElementById('idc-container');
	var hyvesUrl = "www.hyves.nl/hyvesconnect/smartbutton?type=11&category=12&rating=5&body=";
	var hyvesCont = document.createElement("div");
	var hyvesLink = document.createElement("a");

// Set classname for container

	hyvesCont.className = "idc-hyves-tip";
	hyvesCont.style.height = "32px";
	hyvesCont.style.float = "right";

// Add location for link
// Set background and styles

	hyvesLink.href = hyvesUrl + document.location.href + "&title=" + document.title;
	hyvesLink.target = "blank";
	hyvesLink.innerHTML = "Plaats als tip op Hyves!";
	hyvesLink.style.background = 'url(cache.hyves-static.net/images/logo/app/icon_24.png) no-repeat left';
	hyvesLink.style.padding = "10px 0 10px 28px !important";

// hierarchy of elements

	hyvesCont.appendChild(hyvesLink);

	container.insertBefore( hyvesCont, container.firstChild );
};

// Insert to IntenseDebate

id_add_action('idcomments_init', id_hyvestip_posts_plugin.insert_hyves_button);
</pre>

After the Deadline - Spell check for Comments↑ Table of Contents ↑
<pre>
var id_AtD_plugin = {};

id_AtD_plugin.add_button = function()
{
   id_add_plugin_button('javascript:id_AtD_plugin.check_writing(0)', 'javascript:id_AtD_plugin.check_writing(1)', 'www.polishmywriting.com/atd_jquery/images/atdbuttontr.gif', 'Proofread Comment w/ After the Deadline', 'AtD', 'Check Spelling');
};

id_AtD_plugin.restore_edit_comment = function(button_selector, field_id)
{
   AtD.remove(field_id);

   var style = jQuery('#' + field_id).attr('style');
   jQuery('#' + field_id).replaceWith('&lt;textarea class="idc-text_noresize" id="' + field_id +'"&gt;' + jQuery('#' + field_id).html() + '&lt;/textarea&gt;');
   jQuery('#' + field_id).attr('style', style);

   jQuery(button_selector).text('Check Spelling');
};

id_AtD_plugin.check_writing = function(field)
{
   /* Choose your destiny: the main comment box or the reply comment box */

   var field_id, button_selector;

   if (field == 0)
   {
      field_id = 'IDCommentNewThreadText';
      button_selector = '#idc-plugin-buttons-new-thread > li > a > img[src="/img/spacer.gif"> 
Facebook-share↑ Table of Contents ↑
<pre>
function add_fb_share() {
var fb_link = document.createElement('a');
fb_link.href = 'www.facebook.com/share.php?u=' + window.location.href;
fb_link.className = 'fb_share_button';
fb_link.onclick = 'return fbs_click()';
fb_link.target = '_blank';
fb_link.style.textDecoration = 'none';
fb_link.innerHTML = 'Share';
fb_link.style.cssFloat = 'right';
document.getElementById('idc-container').insertBefore(fb_link, document.getElementById('idc-container').firstChild);
}

function fbs_click() {
u=location.href;
t=document.title;
window.open('www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,,');
return false;
}
id_add_action( 'idcomments_func_load', add_fb_share);
</pre>

Tags: Plugins API — 		Can't find your answer here?		
		Let us know.
Last modified: January 11, 2012 by Michael
			

Help us improve:

We're always looking to improve our documentation. If this page didn't answer your question or left you wanting more, let us know! We love hearing your feedback. For support, please use the forums or contact support form. Thanks!

You must be logged in to post a comment.