From 87f17385a29a2bc1094895fa3d6767748e05890a Mon Sep 17 00:00:00 2001
From: Tom Gilder <tomgilder@users.mediawiki.org>
Date: Tue, 11 Oct 2005 00:33:23 +0000
Subject: [PATCH] New tabbed preferences UI

---
 includes/SpecialPreferences.php | 21 +++++----
 languages/Language.php          |  7 ++-
 skins/common/wikibits.js        |  9 ++--
 skins/monobook/main.css         | 84 ++++++++++++++++++++++++++++-----
 4 files changed, 91 insertions(+), 30 deletions(-)

diff --git a/includes/SpecialPreferences.php b/includes/SpecialPreferences.php
index 465f69cd53..1a56bc51e2 100644
--- 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 2ca27d5135..92e78da550 100644
--- a/languages/Language.php
+++ b/languages/Language.php
@@ -849,8 +849,7 @@ $2 List redirects &nbsp; 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 7ee99f7831..f324e89907 100644
--- 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 c5a6367c6a..5098ab42df 100644
--- 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;
 }
 
 /*
-- 
2.20.1