viewing source for "expand-comments-events.js"
last commit
commit ec9726ece091495bad03d1d5096e468fbba6ca06
Date: Thu Mar 22 13:42:47 2007 +0000
source code
001: /* Expand Comments version 1.3.1
002: * Copyright 2006 Andrew Rader
003: *
004: * This file is part of Expand Comments
005: *
006: * Expand Comments is free software; you can redistribute it and/or modify
007: * it under the terms of the GNU General Public License as published by
008: * the Free Software Foundation; either version 2 of the License, or
009: * (at your option) any later version.
010:
011: * Expand Comments is distributed in the hope that it will be useful,
012: * but WITHOUT ANY WARRANTY; without even the implied warranty of
013: * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
014: * GNU General Public License for more details.
015: *
016: * You should have received a copy of the GNU General Public License
017: * along with Expand Comments; if not, write to the Free Software
018: * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
019: */
020:
021: /*
022: * Called when the link is clicked, handles show/hide stuff
023: */
024: function expandCollapseComments( src ) {
025: srcId = src.id;
026: appendDiv = document.getElementById( srcId.replace( "expComLink-", "expComDiv-" ) );
027: postID = srcId.replace( "expComLink-", "" );
028:
029: /* If we need to download the comments */
030: if( src.getAttribute( "rel" ) == "get" ) {
031: loadingDiv = document.getElementById( srcId.replace( "expComLink-", "expComLoading-" ) );
032: loadingDiv.style.display = "";
033: url = "?expcom&id=" + srcId.replace( "expComLink-", "" );
034: makeAjaxRequest( 'handleExpandReturn', true, url, postID );
035: src.setAttribute( "rel", "hide" );
036: } else {
037: /* otherwise, just show/hide the div */
038: if( src.getAttribute( "rel" ) == "hide" ) {
039: /* Hide the div */
040: appendDiv.style.display = "none";
041: src.setAttribute( "rel", "show" );
042: if( expcom_exp.indexOf( '$count' ) != -1 ) {
043: var divs = appendDiv.getElementsByTagName('div');
044: var count = 0;
045: for( i = 0; i < divs.length; i++ ) {
046: if( divs[i].id.indexOf( 'expComComment-' ) == 0 ) {
047: count++;
048: }
049: }
050: src.innerHTML = expcom_exp.replace( '$count', count );
051: }
052: else {
053: src.innerHTML = expcom_exp;
054: }
055: } else {
056: /* Show the div */
057: appendDiv.style.display = "";
058: src.setAttribute( "rel", "hide" );
059: src.innerHTML = expcom_col;
060: }
061: }
062: return false;
063: }
064:
065: /*
066: * Called from the bottom collapse link
067: */
068: function collapse( src ) {
069: srcID = src.id;
070: appendDiv = document.getElementById( srcID.replace( "expCollLink-", "expComDiv-" ) );
071: expColLink = document.getElementById( srcID.replace( "expCollLink-", "expComLink-" ) );
072:
073: appendDiv.style.display = "none";
074: expColLink.setAttribute( "rel", "show" );
075: if( expcom_exp.indexOf( '$count' ) != -1 ) {
076: var divs = appendDiv.getElementsByTagName('div');
077: var count = 0;
078: for( i = 0; i < divs.length; i++ ) {
079: if( divs[i].id.indexOf( 'expComComment-' ) == 0 ) {
080: count++;
081: }
082: }
083: expColLink.innerHTML = expcom_exp.replace( '$count', count );
084: }
085: else {
086: expColLink.innerHTML = expcom_exp;
087: }
088:
089: window.location.hash = srcID.replace( "expCollLink-", "expComComments-" );
090: return false;
091: }
092:
093: /*
094: * Called from the form to submit a comment using AJAX
095: */
096: function submitCommentForm( submitUrl, form, postID ) {
097: getUrl = "/?expcom&id=" + postID;
098:
099: /* Clear the error */
100: var err = document.getElementById( "expcom_ajax_error" );
101: if(err) err.parentNode.removeChild(err);
102:
103: params = "";
104: for( var i = 0; i < form.elements.length; i++ ) {
105: switch( form.elements[i].name ) {
106: case "author":
107: if( form.elements[i].value == "" ) {
108: alertBadForm( form.elements[i], "You must enter a Name" );
109: return;
110: }
111: params += ( "author=" + form.elements[i].value + "&" );
112: break;
113: case "email":
114: if( form.elements[i].value == "" ) {
115: alertBadForm( form.elements[i], "You must enter an Email" );
116: return;
117: }
118: var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
119: if( !filter.test( form.elements[i].value ) ) {
120: alertBadForm( form.elements[i], "You must enter a Valid Email" );
121: return;
122: }
123: params += ( "email=" + form.elements[i].value + "&" );
124: break;
125: case "url":
126: params += ( "url=" + form.elements[i].value + "&" );
127: break;
128: case "comment":
129: if( form.elements[i].value == "" ) {
130: alertBadForm( form.elements[i], "You must enter a Comment" );
131: return;
132: }
133: params += ( "comment=" + form.elements[i].value + "&" );
134: break;
135: case "comment_post_ID":
136: params += ( "comment_post_ID=" + form.elements[i].value + "&" );
137: break;
138: }
139: }
140:
141: submit = null;
142: inputs = form.getElementsByTagName("input");
143: for( var i = 0; i < inputs.length; i++ ) {
144: if( inputs[i].type == "submit" ) {
145: submit = inputs[i];
146: break;
147: }
148: }
149:
150: textarea = form.getElementsByTagName("textarea")[0];
151:
152: params = params.substr(0,(params.length - 1));
153: makeAjaxPost('handlePostReturn', true, submitUrl, params, getUrl, submit, textarea, postID);
154:
155: if( textarea != null ) {
156: textarea.disabled = true;
157: }
158:
159: if( submit != null ) {
160: submit.disabled = true;
161: }
162:
163: }
164:
165: /*
166: * insertComment will insert a comment to the list of comments
167: * before the beforeElement
168: */
169: function insertComment( entry, appendDiv, beforeElement, showEffect ) {
170: /* Create the container for this single comment */
171: comment = document.createElement( "div" );
172:
173: commentIDNode = entry.getElementsByTagName("comment_ID");
174: if( commentIDNode.length >0 && commentIDNode[0].firstChild ) {
175: comment.id = "expComComment-" + commentIDNode[0].firstChild.data;
176: }
177:
178: postAuthorNode = entry.getElementsByTagName("post_author");
179: if( postAuthorNode.length > 0 && postAuthorNode[0].firstChild
180: && postAuthorNode[0].firstChild.data == 1 ) {
181: comment.className = expcom_comtext_author_class;
182: }
183: else if( i % 2 == 0 ) {
184: comment.className = expcom_comtext_even_class;
185: }
186: else {
187: comment.className = expcom_comtext_odd_class;
188: }
189:
190: /* Create the Author & Link */
191: authLinkNode = entry.getElementsByTagName("comment_author_url");
192: if( authLinkNode.length > 0 && authLinkNode[0].firstChild ) {
193: authLink = authLinkNode[0].firstChild.data;
194: authCite = document.createElement( "cite" );
195: authCite.innerHTML = authLink;
196: authCite.className = expcom_authclass;
197:
198: comment.appendChild( authCite );
199: }
200:
201: says = document.createTextNode( " " + expcom_says + ": " );
202: comment.appendChild( says );
203:
204: approvedNode = entry.getElementsByTagName("comment_approved");
205: if( approvedNode.length > 0 && approvedNode[0].firstChild ) {
206: approved = approvedNode[0].firstChild.data;
207: /* Is this approved? */
208: if( approved == "0" ) {
209: appr = document.createElement( "em" );
210: appr.innerHTML = "Your comment is awaiting moderation.";
211: comment.appendChild( appr );
212: }
213: }
214:
215: br = document.createElement( "br" );
216: comment.appendChild(br);
217:
218: /* Now the Date */
219: small = document.createElement( "small" );
220: small.className = expcom_dateclass;
221:
222: linkNode = entry.getElementsByTagName("comment_link");
223: if( linkNode.length > 0 && linkNode[0].firstChild ) {
224: link = document.createElement( "a" );
225: link.href = linkNode[0].firstChild.data;
226: dateNode = entries[i].getElementsByTagName("comment_date");
227: if( dateNode.length > 0 && dateNode[0].firstChild ) {
228: theDate = dateNode[0].firstChild.data;
229: }
230: else {
231: dateNode = entries[i].getElementsByTagName("comment_date_gmt");
232: if( dateNode.length > 0 && dateNode[0].firstChild ) {
233: theDate = dateNode[0].firstChild.data;
234: }
235: else {
236: theDate = "";
237: }
238: }
239: timeNode = entry.getElementsByTagName( "comment_time" );
240: if( timeNode.length > 0 && timeNode[0].firstChild ) {
241: theTime = " at "+timeNode[0].firstChild.data;
242: }
243: else {
244: theTime = "";
245: }
246:
247: link.innerHTML = theDate + theTime;
248:
249: link.title = "";
250: small.appendChild( link );
251: }
252:
253: /* Can we edit this comment? */
254: canEdit = entry.getElementsByTagName("comment_edit");
255: if( canEdit.length > 0 && canEdit[0].firstChild ) {
256: space = document.createTextNode( " " );
257: small.appendChild( space );
258:
259: edit = document.createElement("a");
260: edit.href = canEdit[0].firstChild.data;
261: edit.innerHTML = "edit";
262: small.appendChild( edit );
263: }
264:
265: comment.appendChild( small );
266:
267: /* Now the Comment Body */
268: entryNode = entry.getElementsByTagName( "comment_content" );
269: if( entryNode.length > 0 && entryNode[0].firstChild ) {
270: text = document.createElement( "div" );
271: text.className = expcom_comcontentclass;
272:
273: text.innerHTML = entryNode[0].firstChild.data;
274: comment.appendChild( text );
275: }
276:
277: /* Insert the comment block */
278: if( showEffect ) {
279: fadeEffect = new fx.Opacity( comment, {duration: 1000} );
280: fadeEffect.setOpacity( 0 );
281:
282: appendDiv.insertBefore( comment, beforeElement );
283:
284: fadeEffect.custom(0,1);
285: }
286: else {
287: appendDiv.insertBefore( comment, beforeElement );
288: }
289: }
290:
291: /*
292: * removeComment - given the id number of the comment and post,
293: * this will remove the comment from the DOM
294: */
295: function removeComment( commentID, postID ) {
296: commentsDiv = document.getElementById( "expComDiv-" + postID );
297: comment = document.getElementById( "expComComment-" + commentID );
298: commentsDiv.removeChild( comment );
299: }
300:
301: /*
302: * handleExpandReturn - called after the expand link is pressed and the
303: * AJAX function has finished
304: * This will insert all of the comments into the div
305: */
306: function handleExpandReturn( retVal, postID ) {
307: /* The XML Doc */
308: xmlDoc = retVal.documentElement;
309:
310: if( postID >= 0 ) {
311: appendDiv = document.getElementById( "expComDiv-" + postID );
312:
313: collapseLinkDiv = document.getElementById( "expCollLinkDiv-" + postID );
314:
315: /* Loop through the entries from the XML */
316: entries = xmlDoc.getElementsByTagName( "comment" );
317: for( i = 0; i < entries.length; i++ ) {
318: insertComment( entries[i], appendDiv, collapseLinkDiv, false );
319: }
320:
321: appendDiv.style.display = "";
322: }
323:
324: newcommentform = document.getElementById(appendDiv.id.replace("expComDiv-","expcom-newform-"));
325: if( newcommentform ) {
326: newcommentform.style.display = "";
327: }
328:
329: loadingDiv = document.getElementById( "expComLoading-" + postID );
330: loadingDiv.style.display = "none";
331:
332: appendLink = document.getElementById(appendDiv.id.replace("expComDiv-","expComLink-"));
333: appendLink.innerHTML = expcom_col;
334:
335: if( expcom_jump ) {
336: window.location.hash = "expComComments-" + postID;
337: }
338: }
339:
340: /*
341: * handePostReturn - this is called when the post request has completed.
342: * Once the comment has been submitted, it will update the comments
343: */
344: function handlePostReturn( retVal, getUrl, submit, textarea, postID ) {
345: makeAjaxRequest( 'handleCommentSubmitted', true, getUrl, submit, textarea, postID );
346: }
347:
348: /*
349: * handleCommentSubmitted - Now that the comment is submitted,
350: * update the comment list, and disable the form items
351: * This will insert / remove comments based on what currently exists
352: * versus what is returned from the server
353: */
354: function handleCommentSubmitted( retVal, submit, textarea, postID ) {
355: xmlDoc = retVal.documentElement;
356:
357: commentsDiv = document.getElementById( "expComDiv-" + postID );
358:
359: /* Create an array of the comment elements */
360: commentIDs = new Array();
361:
362: /* And fill the array */
363: subDivs = commentsDiv.getElementsByTagName( "div" );
364: for( i = 0; i < subDivs.length; i++ ) {
365: if( subDivs[i].id.indexOf( "expComComment-" ) == 0 ) {
366: commentIDs.push( subDivs[i].id.replace("expComComment-", "") );
367: }
368: }
369:
370: /* Loop through the entries from the XML */
371: entries = xmlDoc.getElementsByTagName( "comment" );
372: for( i = 0; i < entries.length; i++ ) {
373: entry = entries[i];
374: entryIDNode = entry.getElementsByTagName( "comment_ID" );
375: if( entryIDNode.length > 0 && entryIDNode[0].firstChild ) {
376: entryID = entryIDNode[0].firstChild.data;
377: matched = false;
378: for( k = 0; k < commentIDs.length; k++ ) {
379: if( commentIDs[k] == entryID ) {
380: commentIDs.splice(k ,1);
381: matched = true;
382: break;
383: }
384: }
385: if( !matched ) {
386: /* This is a new comment, so we must add it. First find the element
387: * That will go after this comment, then insert the new comment
388: */
389: insertBeforeID = null;
390: for( probe = commentIDs.length - 1; probe >= 0; probe++ ) {
391: if( commentIDs[probe] < entryID ) {
392: break;
393: }
394:
395: insertBeforeID = commentIDs[probe];
396: }
397:
398: if( insertBeforeID != null ) {
399: insertBeforeElement = document.getElementById( "expComComment-" + insertBeforeID );
400: }
401: else {
402: insertBeforeElement = document.getElementById( "expCollLinkDiv-" + postID );
403: }
404:
405: insertComment( entry, commentsDiv, insertBeforeElement, expcom_moo_fx );
406: }
407: }
408: }
409:
410: /* Now if there are any comments left, it means they were removed
411: * by the server, so lets remove them from the list
412: */
413:
414: for( r = 0; r < commentIDs.length; r++ ) {
415: removeComment( commentIDs[r], postID );
416: }
417:
418: refreshEvenOdd( postID );
419:
420: disableForm( textarea, submit, 15 );
421: }
422:
423: /*
424: * disableForm - disable the textarea and submit items for the number
425: * of seconds
426: */
427: function disableForm( textarea, submit, seconds ) {
428: if( textarea != null ) {
429: if( seconds > 0 ) {
430: textarea.value = "You must wait " + seconds + " seconds";
431: }
432: else {
433: textarea.value = "";
434: textarea.disabled = false;
435: }
436: }
437:
438: if( seconds == 0 && submit != null ) {
439: submit.disabled = false;
440: }
441:
442: seconds--;
443: secs = seconds + "";
444: if( seconds >= 0 ) {
445: setTimeout( 'disableForm( textarea, submit, secs )', 1000 );
446: }
447: }
448:
449: /*
450: * refreshEvenOdd - this goes through all of the comments in a post
451: * and re-calculates the even/odd class name
452: */
453: function refreshEvenOdd( postID ) {
454: commentsDiv = document.getElementById( "expComDiv-" + postID );
455:
456: divs = commentsDiv.getElementsByTagName( "div" );
457:
458: counter = 0;
459: for( i = 0; i < divs.length; i++ ) {
460: if( divs[i].id.indexOf( "expComComment-" ) == 0 ) {
461: counter++;
462: if( divs[i].className != expcom_comtext_author_class ) {
463: if( counter % 2 == 0 ) {
464: divs[i].className = expcom_comtext_odd_class;
465: }
466: else {
467: divs[i].className = expcom_comtext_even_class;
468: }
469: }
470: }
471: }
472: }
473:
474: /*
475: * alertBadForm - modify the form to show that it is malformed
476: */
477: function alertBadForm( el, msg ) {
478: var error = document.createElement( "div" );
479: error.id = "expcom_ajax_error";
480: error.style.color = "#f08080";
481: var errMsg = document.createTextNode( msg );
482: error.appendChild( errMsg );
483: el.parentNode.insertBefore( error,el );
484: }