jvdrean (SVN) wrote:

Author: jvdrean Date: 2010-01-19 16:37:08 +0100 (Tue, 19 Jan 2010) New Revision: 26234

Added: platform/skins/trunk/colibri/src/main/resources/colibri/noavatar.png platform/xwiki-applications/trunk/administration/src/main/resources/XWiki/XWikiUserPreferencesSheet.xml platform/xwiki-applications/trunk/administration/src/main/resources/XWiki/XWikiUserProfileSheet.xml Modified: enterprise/trunk/wiki/src/main/resources/Main/Dashboard.xml platform/core/trunk/xwiki-core/src/main/java/com/xpn/xwiki/XWiki.java platform/core/trunk/xwiki-core/src/main/resources/ApplicationResources.properties platform/skins/trunk/colibri/src/main/resources/colibri/changemyavatar.vm platform/skins/trunk/colibri/src/main/resources/colibri/colibri.css platform/skins/trunk/colibri/src/main/resources/colibri/passwd.vm platform/web/trunk/standard/src/main/webapp/templates/changemyavatar.vm platform/web/trunk/standard/src/main/webapp/templates/passwd.vm platform/xwiki-applications/trunk/administration/src/main/resources/XWiki/XWikiUserSheet.xml Log: XE-466 : User Profile UI Improvements XSCOLIBRI-178 : User Profile UI Improvements XWIKI-4767 : Add phone fields to the user profile

[snip]

+<code>Object.extend(XWiki, { + userprofile : { + + init : function() { + Event.observe($('avatar'), 'mouseover', XWiki.userprofile.toggleChangePhoto); + Event.observe($('avatar'), 'mouseout', XWiki.userprofile.toggleChangePhoto); + }, + + toggleChangePhoto : function() { + var changePhoto = $('avatarUpload'); + if (eltHasClass(changePhoto, 'hidden')) { + var photoCoords = Element.positionedOffset($('avatar')); + changePhoto.style.left = photoCoords[0] + "px"; + changePhoto.style.top = photoCoords[1] + "px"; + rmClass(changePhoto, 'hidden'); + } else { + addClass(changePhoto, 'hidden'); + } + },

We should not use eltHasClass, rmClass and addClass any more but Element#hasClassName Element#removeClassName and Element#addClassName from prototype instead.

+ + switchTab : function(tab) { + $("vertical-panes").select("div.vertical-pane").each(function(pane){ + if(!eltHasClass(pane,'hidden')) { + addClass(pane, 'hidden'); + } + }); + rmClass($(tab + 'Pane'), 'hidden'); + $("vertical-tabs").select("li.vertical-tab").each(function(tab){ + if(eltHasClass(tab, 'active')) { + rmClass(tab, 'active'); + } + }); + addClass($(tab + 'Tab'), 'active'); + } + } +}); + +Event.observe(window, 'load', function() { XWiki.userprofile.init() })

Here you can probably observe dom loading instead of window load. [snip]

+/* Tabs */ + +div#vertical-panes { + margin-top: 10px; +}

Can't the vertical panes system be independent of an ID ? (to allow several by page) Shouldn't those styles be separated from the user profile? Jerome.

+ +div#avatar { + float: left; + margin-right:10px; +} + +span#avatarUpload { + display:block; + width:$tabswidth; + position:absolute; + font-size: 10px; + font-weight: bold; + background-color: white; +} + +#vertical-tabs { + float:left; + width:$tabswidth; +} + +#vertical-tabs ul { + margin:0; + margin-top:5px; + padding:0; + border-right:0; + border-bottom:0; + border-left:0; +} + +#vertical-tabs ul li { + display: block; + list-style-type: none; + margin:0; + border: solid 1px transparent; + border-right: 0; +} + +#vertical-tabs ul li img { + float:left; + margin-right:4px; + vertical-align:middle; +} + +#vertical-tabs ul li span { + line-height:1.5em; +} + +#vertical-tabs ul li.active { + border: solid 1px $theme.menuBackgroundColor; + border-right: 0; +} + +#vertical-tabs ul li a { + padding: 3px 10px 3px 10px; + text-decoration: none; + display:block; + color:$theme.menuBackgroundColor; +} + +#vertical-tabs ul li.active a { + text-decoration: none; + left:1px; + background:$theme.pageContentBackgroundColor; + position:relative; + color: $theme.textColor; + padding-left: 9px; +} + +.vertical-pane { + margin-left:$tabswidth; + border-left: solid 1px $theme.menuBackgroundColor; + padding: 10px; + padding-top: 0; +} +</code> [snip]