(bug 16073) * Use onclick handler for expand/collapse in enhanced recentchanges.

* Hide the expandable content with JavaScript for better fallback if JS is disabled for whatever reason.
* Move enhancedchanges JS to separate file.
* Less cryptic id names.

diff --git a/RELEASE-NOTES b/RELEASE-NOTES
index 1d850d6..2735a65 100644 (file)
--- a/RELEASE-NOTES
+++ b/RELEASE-NOTES
@@ -283,6 +283,8 @@ The following extensions are migrated into MediaWiki 1.14:
 * (bug 14609) User's namespaces to be searched default not updated after adding new namespace
 * Purge form uses valid XHTML and (bug 8992) uses $wgRequest instead of $_SERVER
 * (bug 12764) Special:LonelyPages shows transcluded pages
+* (bug 16073) Enhanced RecentChanges uses onclick handler with better fallback if
+  JavaScript is disabled.
 
 === API changes in 1.14 ===
 

diff --git a/includes/ChangesList.php b/includes/ChangesList.php
index 41d2039..6e516d4 100644 (file)
--- a/includes/ChangesList.php
+++ b/includes/ChangesList.php
@@ -388,6 +388,23 @@ class OldChangesList extends ChangesList {
  * Generate a list of changes using an Enhanced system (use javascript).
  */
 class EnhancedChangesList extends ChangesList {
+
+       /**
+       *  Add the JavaScript file for enhanced changeslist
+       *  @ return string
+       */
+       public function beginRecentChangesList() {
+               global $wgStylePath, $wgStyleVersion;
+               $this->rc_cache = array();
+               $this->rcMoveIndex = 0;
+               $this->rcCacheIndex = 0;
+               $this->lastdate = '';
+               $this->rclistOpen = false;
+               $script = Xml::tags( 'script', array(
+                       'type' => 'text/javascript',
+                       'src' => $wgStylePath . "/common/enhancedchanges.js?$wgStyleVersion" ), '' );
+               return $script;
+       }
        /**
         * Format a line for enhanced recentchange (aka with javascript and block of lines).
         */
@@ -596,13 +613,12 @@ class EnhancedChangesList extends ChangesList {
 
                $users = ' <span class="changedby">[' . implode( $this->message['semicolon-separator'], $users ) . ']</span>';
 
-               # Arrow
-               $rci = 'RCI'.$this->rcCacheIndex;
-               $rcl = 'RCL'.$this->rcCacheIndex;
-               $rcm = 'RCM'.$this->rcCacheIndex;
-               $toggleLink = "javascript:toggleVisibility('$rci','$rcm','$rcl')";
-               $tl  = '<span id="'.$rcm.'"><a href="'.$toggleLink.'">' . $this->sideArrow() . '</a></span>';
-               $tl .= '<span id="'.$rcl.'" style="display:none"><a href="'.$toggleLink.'">' . $this->downArrow() . '</a></span>';
+               # ID for JS visibility toggle
+               $jsid = $this->rcCacheIndex;
+
+               $toggleLink = "onclick='toggleVisibility($jsid)'";
+               $tl  = "<span id='mw-rc-openarrow-$jsid' style='display:inline;' $toggleLink>" . $this->sideArrow() . "</span>";
+               $tl .= "<span id='mw-rc-closearrow-$jsid' style='display:none;' class='mw-rc-jshidden' $toggleLink>" . $this->downArrow() . "</span>";
                $r .= '<td valign="top" style="white-space: nowrap"><tt>'.$tl.'&nbsp;';
 
                # Main line
@@ -680,7 +696,7 @@ class EnhancedChangesList extends ChangesList {
                $r .= "</td></tr></table>\n";
 
                # Sub-entries
-               $r .= '<div id="'.$rci.'" style="display:none;"><table cellpadding="0" cellspacing="0"  border="0" style="background: none">';
+               $r .= '<div id="mw-rc-subentries-'.$jsid.'" class="mw-rc-jshidden"><table cellpadding="0" cellspacing="0"  border="0" style="background: none">';
                foreach( $block as $rcObj ) {
                        # Get rc_xxxx variables
                        // FIXME: Would be good to replace this extract() call with something that explicitly initializes local variables.

diff --git a/includes/DefaultSettings.php b/includes/DefaultSettings.php
index 3278219..e8b87ef 100644 (file)
--- a/includes/DefaultSettings.php
+++ b/includes/DefaultSettings.php
@@ -1385,7 +1385,7 @@ $wgCacheEpoch = '20030516000000';
  * to ensure that client-side caches don't keep obsolete copies of global
  * styles.
  */
-$wgStyleVersion = '182';
+$wgStyleVersion = '183';
 
 
 # Server-side caching:

diff --git a/skins/common/enhancedchanges.js b/skins/common/enhancedchanges.js
new file mode 100644 (file)
index 0000000..19b5d61
--- /dev/null
+++ b/skins/common/enhancedchanges.js
@@ -0,0 +1,33 @@
+/* 
+  JavaScript file for enhanced recentchanges
+ */
+ 
+/*
+  * onload hook to add the CSS to hide parts that should be collapsed
+  *
+  * We do this with JS so everything will be expanded by default
+  * if JS is disabled
+ */
+addOnloadHook(function () {
+       var css = ".mw-rc-jshidden { display:none; }";
+       appendCSS(css);
+});
+
+/*
+ * Switch an RC line between hidden/shown
+ * @param int idNumber : the id number of the RC group
+*/ 
+function toggleVisibility(idNumber) {
+       var openarrow = document.getElementById("mw-rc-openarrow-"+idNumber);
+       var closearrow = document.getElementById("mw-rc-closearrow-"+idNumber);
+       var subentries = document.getElementById("mw-rc-subentries-"+idNumber);
+       if (openarrow.style.display == 'inline') {
+               openarrow.style.display = 'none';
+               closearrow.style.display = 'inline';
+               subentries.style.display = 'block';
+       } else {
+               openarrow.style.display = 'inline';
+               closearrow.style.display = 'none';
+               subentries.style.display = 'none';
+       }
+}

diff --git a/skins/common/wikibits.js b/skins/common/wikibits.js
index 514714d..62ef574 100644 (file)
--- a/skins/common/wikibits.js
+++ b/skins/common/wikibits.js
@@ -104,22 +104,6 @@ if (wgBreakFrames) {
        }
 }
 
-// for enhanced RecentChanges
-function toggleVisibility(_levelId, _otherId, _linkId) {
-       var thisLevel = document.getElementById(_levelId);
-       var otherLevel = document.getElementById(_otherId);
-       var linkLevel = document.getElementById(_linkId);
-       if (thisLevel.style.display == 'none') {
-               thisLevel.style.display = 'block';
-               otherLevel.style.display = 'none';
-               linkLevel.style.display = 'inline';
-       } else {
-               thisLevel.style.display = 'none';
-               otherLevel.style.display = 'inline';
-               linkLevel.style.display = 'none';
-       }
-}
-
 function showTocToggle() {
        if (document.createTextNode) {
                // Uses DOM calls to avoid document.write + XHTML issues