Improved compatibility between the Vector skin and addPortletLink() from wikibits.js:

 * Empty portlets are now present but hidden; adding an element to a portlet unhides it.
 * Drop-down menu portlets now have their own left border, so they'll look right even if there's no other portlet to the left of them.  (If there is, the borders should overlap.)
 * addPortletLink() now wraps its labels in <span> tags to be compatible with the Vector CSS for the "namespaces" and "views" portlets (bug 19531).

diff --git a/RELEASE-NOTES b/RELEASE-NOTES
index 91f5b36..d5bc368 100644 (file)
--- a/RELEASE-NOTES
+++ b/RELEASE-NOTES
@@ -474,6 +474,10 @@ this. Was used when mwEmbed was going to be an extension.
   any change, in addition to onkeyup.
 * Don't link to "edit this page" on MediaWiki:Noarticletext if user is not allowed
   to create page. Done via new message MediaWiki:Noarticletext-nopermission
+* Improved compatibility between the Vector skin and addPortletLink() from wikibits.js:
+  empty portlets are now present but hidden, adding an element to a portlet unhides it
+* (bug 19531) addPortletLink() now wraps inserted labels in a <span> element to be
+  compatible with the CSS for the Vector skin
 
 == API changes in 1.16 ==
 

diff --git a/skins/Vector.php b/skins/Vector.php
index 6461ec3..6dc4866 100644 (file)
--- a/skins/Vector.php
+++ b/skins/Vector.php
@@ -691,9 +691,8 @@ class VectorTemplate extends QuickTemplate {
                        echo "\n<!-- {$name} -->\n";
                        switch ( $element ) {
                                case 'NAMESPACES':
-                                       if ( count( $this->data[ 'namespace_urls' ] ) > 0 ) {
 ?>
-<div id="namespaces" class="vectorTabs">
+<div id="namespaces" class="vectorTabs<?php if ( count( $this->data['namespace_urls'] ) == 0 ) echo ' emptyPortlet'; ?>">
        <h5><?php $this->msg('namespaces') ?></h5>
        <ul <?php $this->html('userlangattributes') ?>>
                <?php foreach ($this->data['namespace_urls'] as $key => $link ): ?>
@@ -702,12 +701,10 @@ class VectorTemplate extends QuickTemplate {
        </ul>
 </div>
 <?php
-                                       }
                                break;
                                case 'VARIANTS':
-                                       if ( count( $this->data[ 'variant_urls' ] ) > 0 ) {
 ?>
-<div id="variants" class="vectorMenu">
+<div id="variants" class="vectorMenu<?php if ( count( $this->data['variant_urls'] ) == 0 ) echo ' emptyPortlet'; ?>">
        <h5><span><?php $this->msg('variants') ?></span><a href="#"></a></h5>
        <div class="menu">
                <ul <?php $this->html('userlangattributes') ?>>
@@ -718,12 +715,10 @@ class VectorTemplate extends QuickTemplate {
        </div>
 </div>
 <?php
-                                       }
                                break;
                                case 'VIEWS':
-                                       if ( count( $this->data[ 'view_urls' ] ) > 0 ) {
 ?>
-<div id="views" class="vectorTabs">
+<div id="views" class="vectorTabs<?php if ( count( $this->data['view_urls'] ) == 0 ) echo ' emptyPortlet'; ?>">
        <h5><?php $this->msg('views') ?></h5>
        <ul <?php $this->html('userlangattributes') ?>>
                <?php foreach ($this->data['view_urls'] as $key => $link ): ?>
@@ -732,12 +727,10 @@ class VectorTemplate extends QuickTemplate {
        </ul>
 </div>
 <?php
-                                       }
                                break;
                                case 'ACTIONS':
-                                       if ( count( $this->data[ 'action_urls' ] ) > 0 ) {
 ?>
-<div id="p-cactions" class="vectorMenu">
+<div id="p-cactions" class="vectorMenu<?php if ( count( $this->data['action_urls'] ) == 0 ) echo ' emptyPortlet'; ?>">
        <h5><span><?php $this->msg('actions') ?></span><a href="#"></a></h5>
        <div class="menu">
                <ul <?php $this->html('userlangattributes') ?>>
@@ -748,12 +741,10 @@ class VectorTemplate extends QuickTemplate {
        </div>
 </div>
 <?php
-                                       }
                                break;
                                case 'PERSONAL':
-                                       if ( count( $this->data['personal_urls'] ) > 0 ) {
 ?>
-<div id="p-personal">
+<div id="p-personal" class="<?php if ( count( $this->data['personal_urls'] ) == 0 ) echo ' emptyPortlet'; ?>">
        <h5><?php $this->msg('personaltools') ?></h5>
        <ul <?php $this->html('userlangattributes') ?>>
                <?php foreach($this->data['personal_urls'] as $key => $item): ?>
@@ -762,7 +753,6 @@ class VectorTemplate extends QuickTemplate {
        </ul>
 </div>
 <?php
-                                       }
                                break;
                                case 'SEARCH':
 ?>

diff --git a/skins/common/wikibits.js b/skins/common/wikibits.js
index ed58877..1097837 100644 (file)
--- a/skins/common/wikibits.js
+++ b/skins/common/wikibits.js
@@ -287,13 +287,19 @@ function updateTooltipAccessKeys( nodeList ) {
  * @return Node -- the DOM node of the new item (an LI element) or null
  */
 function addPortletLink(portlet, href, text, id, tooltip, accesskey, nextnode) {
-       var node = document.getElementById(portlet);
-       if ( !node ) return null;
-       node = node.getElementsByTagName( "ul" )[0];
+       var root = document.getElementById(portlet);
+       if ( !root ) return null;
+       var node = root.getElementsByTagName( "ul" )[0];
        if ( !node ) return null;
 
+       // unhide portlet if it was hidden before
+       root.className = root.className.replace( /(^| )emptyPortlet( |$)/, "$2" );
+
+       var span = document.createElement( "span" );
+       span.appendChild( document.createTextNode( text ) );
+
        var link = document.createElement( "a" );
-       link.appendChild( document.createTextNode( text ) );
+       link.appendChild( span );
        link.href = href;
 
        var item = document.createElement( "li" );

diff --git a/skins/vector/main-ltr.css b/skins/vector/main-ltr.css
index 71e76ae..ffed37e 100644 (file)
--- a/skins/vector/main-ltr.css
+++ b/skins/vector/main-ltr.css
@@ -62,6 +62,10 @@ body {
        margin: 0;
        padding: 0;
 }
+       /* Hide empty portlets */
+       div.emptyPortlet {
+               display: none;
+       }
        /* Personal */
        #p-personal {
                position: absolute;
@@ -204,8 +208,13 @@ body {
                direction: rtl;
        }
        /* @noflip */
-       div.vectorMenu h5 {
+       #head div.vectorMenu h5 {
                float: left;
+               background-image: url(images/tab-break.png);
+               background-position: bottom left;
+               background-repeat: no-repeat;
+               padding-left: 1px;
+               margin-left: -1px;
        }
        /* OVERRIDDEN BY COMPLIANT BROWSERS */
        div.vectorMenu h5 a {

diff --git a/skins/vector/main-rtl.css b/skins/vector/main-rtl.css
index 5e11262..3f0462b 100644 (file)
--- a/skins/vector/main-rtl.css
+++ b/skins/vector/main-rtl.css
@@ -62,6 +62,10 @@ body {
        margin: 0;
        padding: 0;
 }
+       /* Hide empty portlets */
+       div.emptyPortlet {
+               display: none;
+       }
        /* Personal */
        #p-personal {
                position: absolute;
@@ -204,8 +208,13 @@ body {
                direction: rtl;
        }
        /* @noflip */
-       div.vectorMenu h5 {
+       #head div.vectorMenu h5 {
                float: left;
+               background-image: url(images/tab-break.png);
+               background-position: bottom left;
+               background-repeat: no-repeat;
+               padding-left: 1px;
+               margin-left: -1px;
        }
        /* OVERRIDDEN BY COMPLIANT BROWSERS */
        div.vectorMenu h5 a {