Simple AJAX Quote in Drupal 6

I’ve been upgrading the forum of Computer Science in Syria for a week now.

The forum uses Drupal, and it ran a beta version of Drupal 4, and I upgraded it to the latest Drupal version now.

I wanted to have AJAX quoting in the forum, but I wanted it to be simple without lots of JavaScript loaded. So as usual I got pissed off and decided to create my own code to do it.

The code was very simple, knowing that the Quote link will get you to a page where the textarea has the quoted text, and knowing that Drupal 6 has jQuery loaded in it

I added the following code to /misc/drupal.js file:

$('a.quote, li.quote a').click(function () {
	$(this).after($('&nbsp;<img style="width: 16px; height: 16px;" class="quoting" src="/misc/quoting.gif" alt="loading" />'));
	$.ajax({
		url: $(this).attr('href'),
		cache: false,
		success: function(html){
			$('img.quoting').remove();
			var changed = false;
			if ($('#wysiwyg-toggle-edit-comment').text() == Drupal.settings.wysiwyg.disable) {
				$('#wysiwyg-toggle-edit-comment').click();
				changed = true;
			}
			$('#edit-comment').val($('#edit-comment').val() + ($('#edit-comment').val() == '' ? '' : '\n') + $(html).children().find('#edit-comment').val());
			var $target = $('#edit-comment');
			$target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');
			if ($target.length) {
					var targetOffset = $target.offset().top;
					$('html,body').animate({scrollTop: targetOffset}, 1000);
			}
			if (changed)
				$('#wysiwyg-toggle-edit-comment').click();
			$('#edit-comment').scrollTop($('#edit-comment')[0].scrollHeight);
		}
	});
	return false;
});

You can see that I used this image to be displayed while loading the quote into the textarea because it matches the colors of the forum style.

The process is too simple:

1. @line 02: Display a loading image.
2. @line 03: Request the quoting page which is located in the href attribute of the quote link.
3. @line 07: Remove the image.
4. @lines 08 ~ 12: Checking if the HTML editor is enabled, and disabling it so I can assign the value directly to the textarea.
5. @line 13: Assigning the value of the textarea in the quote page to the textarea in this page.
6. @lines 14 ~ 19: Scrolling the page’s vertical scroll to reach the textarea.
7. @lines 20 ~ 21: Re-enabling the editor if I disabled it.
8. @line 22: Scrolling the textarea’s vertical scroll to reach the end of the text.
9. @line 25: Returning false to the browser so it doesn’t redirect the page to the quoting page.

You see? it is as simple as this

I’ll soon post some other modifications that made the forum more simple