New tabbed preferences UI

diff --git a/includes/SpecialPreferences.php b/includes/SpecialPreferences.php
index 465f69c..1a56bc5 100644 (file)
--- a/includes/SpecialPreferences.php
+++ b/includes/SpecialPreferences.php
@@ -434,17 +434,16 @@ class PreferencesForm {
                $wgOut->setRobotpolicy( 'noindex,nofollow' );
 
                if ( $this->mSuccess || 'success' == $status ) {
-                       $wgOut->addWikitext( '<span class="preferences-save-success">'. wfMsg( 'savedprefs' ) . "</span>\n----" );
+                       $wgOut->addWikitext( '<div class="preferences-save-success"><strong>'. wfMsg( 'savedprefs' ) . '</strong></div>' );
                } else  if ( 'error' == $status ) {
-                       $wgOut->addWikitext( "<span class='error'>" . $message  . "</span>\n----" );
+                       $wgOut->addWikitext( '<div class="error"><strong>' . $message  . '</strong></div>' );
                } else if ( '' != $status ) {
                        $wgOut->addWikitext( $message . "\n----" );
                }
                $uname = $wgUser->getName();
                $uid = $wgUser->getID();
 
-               $wgOut->addWikiText( wfMsg( 'prefslogintext', $uname, $uid ) );
-               $wgOut->addWikiText( wfMsg('clearyourcache'));
+               $wgOut->addWikiText( '<div class="preferences-login">' . wfMsg( 'prefslogintext', $uname, $uid ) . '</div>' );
 
                $qbs = $wgLang->getQuickbarSettings();
                $skinNames = $wgLang->getSkinNames();
@@ -499,7 +498,8 @@ class PreferencesForm {
 
                # </FIXME>
 
-               $wgOut->addHTML( "<form id='preferences' name='preferences' action=\"$action\" method='post'>" );
+               $wgOut->addHTML( "<form action=\"$action\" method='post'>" );
+               $wgOut->addHTML( "<div id='preferences'>" );
 
                # User data
                #
@@ -606,7 +606,7 @@ class PreferencesForm {
                         if ($wgEnableUserEmail) {
                                $emf = wfMsg( 'emailflag' );
                                 $wgOut->addHTML(
-                                "<div><label><input type='checkbox' $emfc value=\"1\" name=\"wpEmailFlag\" />$emf</label></div>" );
+                                "<div><input type='checkbox' $emfc value='1' name='wpEmailFlag' id='wpEmailFlag' /> <label for='wpEmailFlag'>$emf</label></div>" );
                         }
 
                        $wgOut->addHTML( '</fieldset>' );
@@ -700,7 +700,7 @@ class PreferencesForm {
                        foreach($dateopts as $key => $option) {
                                ($key == $this->mDate) ? $checked = ' checked="checked"' : $checked = '';
                                $wgOut->addHTML( "<div><label><input type='radio' name=\"wpDate\" ".
-                                       "value=\"$key\"$checked />$option</label></div>\n" );
+                                       "value=\"$key\"$checked /> $option</label></div>\n" );
                        }
                        $wgOut->addHTML( "</fieldset>\n\n");
                }
@@ -803,7 +803,7 @@ class PreferencesForm {
                $wgOut->addHTML( "
        <div id='prefsubmit'>
        <div>
-               <input type='submit' name='wpSaveprefs' value=\"" . wfMsg( 'saveprefs' ) . "\" accesskey=\"".
+               <input type='submit' name='wpSaveprefs' class='btnSavePrefs' value=\"" . wfMsg( 'saveprefs' ) . "\" accesskey=\"".
                wfMsg('accesskey-save')."\" title=\"[alt-".wfMsg('accesskey-save')."]\" />
                <input type='submit' name='wpReset' value=\"" . wfMsg( 'resetprefs' ) . "\" />
        </div>
@@ -811,7 +811,10 @@ class PreferencesForm {
        </div>
 
        <input type='hidden' name='wpEditToken' value='{$token}' />
-       </form>\n" );
+       </div></form>\n" );
+
+       $wgOut->addWikiText( wfMsg('clearyourcache') );
+
        }
 }
 ?>

diff --git a/languages/Language.php b/languages/Language.php
index 2ca27d5..92e78da 100644 (file)
--- a/languages/Language.php
+++ b/languages/Language.php
@@ -849,8 +849,7 @@ $2 List redirects   Search for $3 $9",
 'preferences'  => 'Preferences',
 'prefsnologin' => 'Not logged in',
 'prefsnologintext'     => "You must be [[Special:Userlogin|logged in]] to set user preferences.",
-'prefslogintext' => "You are logged in as \"$1\".
-Your internal ID number is $2.
+'prefslogintext' => "You are logged in as \"$1\". Your internal ID number is $2.
 
 See [[Project:User preferences help]] for help deciphering the options.",
 'prefsreset'   => 'Preferences have been reset from storage.',
@@ -871,7 +870,7 @@ See [[Project:User preferences help]] for help deciphering the options.",
 'prefs-personal' => 'User data',
 'prefs-rc' => 'Recent changes & stubs',
 'prefs-misc' => 'Misc',
-'saveprefs'            => 'Save',
+'saveprefs'            => 'Save Preferences',
 'resetprefs'   => 'Reset',
 'oldpassword'  => 'Old password',
 'newpassword'  => 'New password',
@@ -892,7 +891,7 @@ See [[Project:User preferences help]] for help deciphering the options.",
 'timezoneoffset' => 'Offset¹',
 'servertime'   => 'Server time',
 'guesstimezone' => 'Fill in from browser',
-'emailflag'            => 'Disable e-mail from other users',
+'emailflag'            => 'Disable email from other users',
 'defaultns'            => 'Search in these namespaces by default:',
 'default'              => 'default',
 'files'                        => 'Files',

diff --git a/skins/common/wikibits.js b/skins/common/wikibits.js
index 7ee99f7..f324e89 100644 (file)
--- a/skins/common/wikibits.js
+++ b/skins/common/wikibits.js
@@ -108,7 +108,7 @@ function diffcheck() {
 // XXX: needs testing on IE/Mac and safari
 // more comments to follow
 function tabbedprefs() {
-    prefform = document.getElementById('preferences');
+    var prefform = document.getElementById('preferences');
     if(!prefform || !document.createElement) return;
     if(prefform.nodeName.toLowerCase() == 'a') return; // Occasional IE problem
     prefform.className = prefform.className + 'jsprefs';
@@ -116,12 +116,13 @@ function tabbedprefs() {
     children = prefform.childNodes;
     var seci = 0;
     for(i=0;i<children.length;i++) {
-        if(children[i].nodeName.toLowerCase().indexOf('fieldset') != -1) {
+        if(children[i].nodeName.toLowerCase() == 'fieldset') {
             children[i].id = 'prefsection-' + seci;
             children[i].className = 'prefsection';
             if(is_opera || is_khtml) children[i].className = 'prefsection operaprefsection';
             legends = children[i].getElementsByTagName('legend');
             sections[seci] = new Object();
+            legends[0].className = 'mainLegend';
             if(legends[0] && legends[0].firstChild.nodeValue)
                 sections[seci].text = legends[0].firstChild.nodeValue;
             else
@@ -146,7 +147,7 @@ function tabbedprefs() {
         li.appendChild(a);
         toc.appendChild(li);
     }
-    prefform.insertBefore(toc, children[0]);
+    prefform.parentNode.insertBefore(toc, prefform.parentNode.childNodes[0]);
     document.getElementById('prefsubmit').id = 'prefcontrol';
 }
 function uncoversection() {
@@ -200,7 +201,7 @@ function fetchTimezone() {
 }
 
 function guessTimezone(box) {
-       document.preferences.wpHourDiff.value = fetchTimezone();
+       document.getElementsByName("wpHourDiff")[0].value = fetchTimezone();
 }
 
 function showTocToggle() {

diff --git a/skins/monobook/main.css b/skins/monobook/main.css
index c5a6367..5098ab4 100644 (file)
--- a/skins/monobook/main.css
+++ b/skins/monobook/main.css
@@ -911,33 +911,91 @@ head:first-child+body #footer li { white-space: nowrap; }
 
 /* js pref toc */
 #preftoc {
-    float: left;
-    margin: 1em;
-    width: 13em;
+    margin: 0;
+    width: 100%;
 }
 #preftoc li {
-    border: 1px solid white;
+    margin: 1px -2px 1px 2px;
+    float: left;
+    padding: 2px 0 3px 0;
+    background: ThreeDFace;
+    border: 1px solid;
+    border-color:      ThreeDHighlight ThreeDDarkShadow ThreeDDarkShadow ThreeDHighlight;
+    border-bottom: 0;
+    position: relative;
+    white-space: nowrap;
+    list-style-type: none;
+    list-style-image: none;
 }
 #preftoc li.selected {
-    background-color: #f9f9f9;
-    border: 1px dashed #aaa;
+    font-weight: bold;
+    background-color: #F9F9F9;
+    border: 1px solid #aaa;
+    border-bottom: none;
+    cursor: default;
+    z-index: 3;
+    padding: 2px 6px 5px 7px;
+    margin: 1px -3px -2px 0px;
+    position: relative;
+    top: -1px;
+}
+#preftoc > li.selected {
+    top: 0;
 }
 #preftoc a,
 #preftoc a:active {
     display: block;
-    color: #0014a6;
+    color: #000;
+    padding: 0 .7em;
+    position: relative;
+}
+#preftoc li.selected a {
+    cursor: default;
+    text-decoration: none;
 }
 #prefcontrol {
-    clear: both;
-    float: left;
-    margin-top: 1em;
+    padding-top: 2em;
+}
+#preferences {
+    margin: 0;
+    border: 1px solid #aaa;
+    clear: left;
+    padding: 1.5em;
+    background-color: #F9F9F9;
+}
+.prefsection {
+    border: none;
+    padding: 0;
+    margin: 0;
+}
+.prefsection table, .prefsection legend {
+    background-color: #F9F9F9;
+}
+.mainLegend {
+    display: none;
 }
 div.prefsectiontip {
     font-size: 95%;
-    margin-top: 1em;
+    margin-top: 0;
+    background-color: #FFC1C1;
+    padding: .2em .7em;
+}
+.btnSavePrefs {
+    font-weight: bold;
+}
+
+.preferences-save-success {
+    border: 2px solid green;
+    color: #000;
+    padding: .5em 1.2em;
+    background-color: #ddffdd;
+    float: left;
+    margin-bottom: 1em;
 }
-fieldset.operaprefsection {
-    margin-left: 15em;
+
+.preferences-login {
+    clear: both;
+    margin-bottom: 1.5em;
 }
 
 /*