commentedit: Improve compatibility with browsers

Intended to finally address make jQuery upgrade possible, see s9y/Serendipity#687 (comment)
s9y · Jan 18, 2025 · e49b123 · e49b123
1 parent cc27053
commit e49b123
Show file tree

Hide file tree

Showing 3 changed files with 64 additions and 59 deletions.
diff --git a/serendipity_event_commentedit/ChangeLog b/serendipity_event_commentedit/ChangeLog
@@ -1,3 +1,7 @@
+0.2.5
+    * Improve browser compatibility by outputting JavaScript in html body
+    * Fix error when trying to utf8 encode language constants
+
 0.2.4
     * Hotfixes for PHP 8 (surrim)
 

diff --git a/serendipity_event_commentedit/serendipity_event_commentedit.js b/serendipity_event_commentedit/serendipity_event_commentedit.js
@@ -4,63 +4,69 @@ var runs = 0;
 var timer = null;
 jQuery.noConflict();
 function makeEditable(commentNumber, entryid) {
-    runs++;
     //we have to prevent this function to be executed twice, but the
     //serendipity_event calling this function is executed twice
-    if (runs==2) {
-        getLanguage();
-        var commentID = 'serendipity_comment_' + commentNumber;
-        var base = cebase + 'commentedit';
-        var loadbase = base + '_load';
-        var formatted_comment = '';
-        if (getRemainingTime() != 0 ) {
-            jQuery("#"+commentID+" > .serendipity_commentBody").editable(
-                 base, {
-                 submitdata : { 'cid': commentNumber,
-                             'entry_id': entryid },
-                 name : 'comment',
-                 type    : 'textarea',
-                 tooltip   : language.edittooltip,
-                 submit  : language.editsubmit,
-                 cancel: language.editcancel,
-                 onblur : 'ignore',
-                 rows   : 5,
-                 loadurl: loadbase,
-                 loadtype: 'POST',
-                 loaddata: { 'cid': commentNumber,
-                             'entry_id': entryid }
-            });
-            markEditable(commentID);
-            msRemainingTime = getRemainingTime() * 1000;
-            timeoutFunction = "makeUneditable('"+commentID+"')"
-            window.setTimeout(timeoutFunction, msRemainingTime)      
-        }
+
+    getLanguage();
+    var commentIDSelector = 'serendipity_comment_' + commentNumber;
+    var commentID2k11Selector = 'c' + commentNumber;
+    var base = cebase + 'commentedit';
+    var loadbase = base + '_load';
+    var formatted_comment = '';
+    if (getRemainingTime() != 0 ) {
+        jQuery("#"+commentIDSelector+" > .serendipity_commentBody,#"+commentID2k11Selector+" > .serendipity_commentBody").editable(
+             base, {
+             submitdata : { 'cid': commentNumber,
+                         'entry_id': entryid },
+             name : 'comment',
+             type    : 'textarea',
+             tooltip   : language.edittooltip,
+             submit  : language.editsubmit,
+             cancel: language.editcancel,
+             onblur : 'ignore',
+             rows   : 5,
+             loadurl: loadbase,
+             loadtype: 'POST',
+             loaddata: { 'cid': commentNumber,
+                         'entry_id': entryid }
+        });
+        markEditable(commentNumber);
+        msRemainingTime = getRemainingTime() * 1000;
+        timeoutFunction = "makeUneditable('"+commentNumber+"')"
+        window.setTimeout(timeoutFunction, msRemainingTime)      
     }
+
 }
 
-function makeUneditable(commentID) {
-    var $source = jQuery("#"+commentID+" > .serendipity_comment_source").clone();
-    var text = jQuery("#"+commentID+" > .serendipity_commentBody > * > *:input:first").val();
+function makeUneditable(commentNumber) {
+    var commentIDSelector = 'serendipity_comment_' + commentNumber;
+    var commentID2k11Selector = 'c' + commentNumber;
+
+    var $source = jQuery("#"+commentIDSelector+" > .serendipity_comment_source,#"+commentID2k11Selector+" > footer").clone();
+    var text = jQuery("#"+commentIDSelector+" > .serendipity_commentBody > * > *:input:first,#"+commentID2k11Selector+" > .serendipity_commentBody > * > *:input:first").val();
     //text is undefined if currently the editarea wasn't displayed
     if(typeof text == 'undefined') {
-        text = jQuery("#"+commentID+" > .serendipity_commentBody").html();
+        text = jQuery("#"+commentIDSelector+" > .serendipity_commentBody,#"+commentID2k11Selector+" > .serendipity_commentBody").html();
     }
-    jQuery("#"+commentID+" > .serendipity_commentBody").fadeOut('slow').remove();
-    jQuery("#"+commentID).html('<div class="serendipity_commentBody">'+text+'</div>');
-    jQuery("#"+commentID).append($source);
+    jQuery("#"+commentIDSelector+" > .serendipity_commentBody,#"+commentID2k11Selector+" > .serendipity_commentBody").fadeOut('slow').remove();
+    jQuery("#"+commentIDSelector+",#"+commentID2k11Selector).html('<div class="serendipity_commentBody">'+text+'</div>');
+    jQuery("#"+commentIDSelector+",#"+commentID2k11Selector).append($source);
     jQuery('#commentedit').fadeOut('slow').remove()
 }
 
-function markEditable(commentID) {
+function markEditable(commentNumber) {
     var timeLeft = getRemainingTime();
-    jQuery("#"+commentID+" > .serendipity_comment_source").append(
+    var commentIDSelector = 'serendipity_comment_' + commentNumber;
+    var commentID2k11Selector = 'c' + commentNumber;
+
+    jQuery("#"+commentIDSelector+" > .serendipity_comment_source,#"+commentID2k11Selector+" > footer").append(
                                     '(<a id="commentedit">'+language.editlink+'<a>)'
                                     );
     jQuery('#commentedit').click(function() {
-        jQuery("#"+commentID+" > .serendipity_commentBody").click();
+        jQuery("#"+commentIDSelector+" > .serendipity_commentBody,#"+commentID2k11Selector+" > .serendipity_commentBody").click();
     });
     jQuery('#commentedit').css("cursor", "pointer");
-    jQuery("#"+commentID+" > .serendipity_comment_source").append(
+    jQuery("#"+commentIDSelector+" > .serendipity_comment_source,#"+commentID2k11Selector+" > footer").append(
                 '<div id="commentedit_timer">'+language.edittimer+': <span class="commentedit_timer">'+timeLeft+'</span></div>'
                 );
     //Pass timer to updateTime to get rid of performance-critical dom-traversing

diff --git a/serendipity_event_commentedit/serendipity_event_commentedit.php b/serendipity_event_commentedit/serendipity_event_commentedit.php
@@ -24,10 +24,10 @@ function introspect(&$propbag)
             'serendipity' => '1.5',
             'php'         => '5.2.0'
         ));
-        $propbag->add('version',       '0.2.4');
+        $propbag->add('version',       '0.2.5');
         $propbag->add('event_hooks',   array(
         	'frontend_saveComment_finish'               => true,
-        	'fetchcomments'                           => true,
+        	'frontend_display'                           => true,
         	'frontend_header'                            => true,
         	'external_plugin'                            => true
         ));
@@ -151,7 +151,7 @@ function event_hook($event, &$bag, &$eventData, $addData = null) {
                                             'editcancel' => ABORT_NOW
                                             );
                             //For json to work, the strings has to be utf8-encoded
-                            echo json_encode(array_map(utf8_encode, $language));
+                            echo json_encode(array_map('utf8_encode', $language));
                             break;
                     }
                     return true;
@@ -164,28 +164,23 @@ function event_hook($event, &$bag, &$eventData, $addData = null) {
                     return true;
                     break;
 
-                case 'fetchcomments':
+                case 'frontend_display':
                     $postBase = false;
                     $cids = array();
-                    foreach($eventData as $comment) {
-                        if ($this->get_cached_commentid($timeout) == $comment['id']) {
-                            //we now know that the comment is from the
-                            //user and created within the last minutes, 
-                            //so add comment_id
-                            $cids[] = $comment['id'];
-                            $postBase = true;
-                        }
+                    if (! (isset($addData['from']) && $addData['from'] = 'functions_entries:printComments')) {
+                        break;
                     }
-
-                    if ($postBase) {
+                    $comment = $eventData;
+                    if ($this->get_cached_commentid($timeout) == $comment['id']) {
+                        $postBase = true;
+
                         //cebase is used for the POST of the edited
                         //comment to the external_plugin-call
                         echo '<script>var cebase = "'. $serendipity['baseURL'] .'index.php?/plugin/";</script>';
-
-                        foreach($cids as $cid) {
-                            //add edit-ability:
-                            echo '<script>makeEditable(' . $comment['id'] . ','. $eventData['0']['entry_id'] .') </script>' . "\n";
-                        }
+                        echo '<script>jQuery(document).ready(function() {
+                            makeEditable(' . $comment['id'] . ','. $comment['entry_id'] .')
+                            });</script>' . "\n";
+
                     }
                     return true;
                     break;