user page tooltip improvements #1992

Author: DeinFreund

Zero-K.info/Views/Shared/UserDetail.cshtml

@@ -90,9 +90,9 @@
         <h1 class="username">
             @if (Model.Country != "??")
             {
-                <img src='/img/flags/@(Model.Country).png' class='flag' height='11' width='16' alt='@Model.Country' />
+                <img nicetitle="Your last known login location. <br /> <br />Contact the administrators if you would like it not to be shown publicly." src='/img/flags/@(Model.Country).png' class='flag' height='11' width='16' alt='@Model.Country' />
             }
-            @Model.Name <img src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png" class="icon16" alt="rank" />
+            @Model.Name <img nicetitle="Your combined rank/level icon. <br /><br />Rank is represented by the icon's color. Ranks range from red to purple, grey represents inactive players or players below red. The profile background adjusts based on rank. <br /><br />Level is represented by the icon's shape. It ranges from a single chevron for level 0 to a star for level 100+." src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png" class="icon16" alt="rank" />
         </h1>
 
         <div id="usr_info" style="background-image: url('@Ratings.Ranks.GetRankBackgroundImagePath(Model)')">
@@ -108,18 +108,24 @@
                         <table>
                             <tr>
                                 <td>
-                                    <div class="avatarbg">
+                                    <div class="avatarbg" nicetitle="Your avatar was chosen randomly upon registering">
                                         @Html.AccountAvatar(Model)
                                     </div>
                                 </td>
                             </tr>
                             <tr>
                                 <td>
-                                    <div class="avatarbg">
-                                        <!-- @Html.AccountAvatar(Model) -->
-                                        @if (Model.Clan != null) { @Html.PrintClan(Model.Clan, true, true); }
-                                        else if (Model.Faction != null) { @Html.PrintFaction(Model.Faction, true); }
-                                    </div>
+                                    <a @if (Model.Clan == null && Model.Faction == null) { 
+                                            @:href ="/Clans"
+                                        }>
+                                        <div class="avatarbg" @if (Model.Clan == null && Model.Faction == null) { 
+                                            @:nicetitle="Click to find a clan!"
+                                        }>
+                                            <!-- @Html.AccountAvatar(Model) -->
+                                            @if (Model.Clan != null) { @Html.PrintClan(Model.Clan, true, true); }
+                                            else if (Model.Faction != null) { @Html.PrintFaction(Model.Faction, true); }
+                                        </div>
+                                    </a>
                                 </td>
                             </tr>
                         </table>
@@ -132,7 +138,7 @@
                     int chev = 0;
                     int bars = 0;
                         <div id="badge">
-                            <div id="levelrank" title="This is a graphical representation of your level. Play more games to increase your level!">
+                            <div id="levelrank" title="This is a graphical representation of your exact level. <br /> <br />Play more games to increase your level!">
                                 <!--<div id="velvet"><img src="../../img/ranks/level-elo/velvetbacking.jpg" width="100%" height="100%" /></div>-->
                                 <div id="badge-center">
                                     @if (Model.Level > 125)
@@ -176,7 +182,7 @@
 
                 <br class="clearfloat" />
                 @{ double ratio = Model.GetLevelUpRatio(); }
-                <div title='Your level: <img src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png"  class="icon16" alt="rank" /> Level @(Model.Level) <br /> Progress to next level: @((int)(ratio*100))% <br />XP remaining for level @(Model.Level + 1): @(Account.GetXpForLevel(Model.Level + 1) - Model.Xp)<br />Play more games to increase your level!'>
+                <div title='Your level: <img src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png"  class="icon16" alt="rank" /> Level @(Model.Level) <br /> <br /> Your progress to the next level: @((int)(ratio*100))% <br /> <br />XP remaining for level @(Model.Level + 1): @(Account.GetXpForLevel(Model.Level + 1) - Model.Xp)<br /> <br />Play more games to increase your level!'>
 
                     <div class="progress_wrapper_left">
                         <div class="progress_text"> Level @Model.Level </div>
@@ -193,7 +199,7 @@
                 </div>
                 <br class="clearfloat" />
                 @{ ratio = Ratings.Ranks.GetRankProgress(Model); }
-                <div title='Your rank: <img src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png"  class="icon16" alt="rank" /> @(Ratings.Ranks.RankNames[Model.Rank]) <br /> Your progress to next rank: @((int)Math.Round(ratio*100))%<br />Win more games to improve your rank!'>
+                <div title='Your rank: <img src="/img/ranks/@(Model.GetIconLevel())_@(Model.Rank).png"  class="icon16" alt="rank" /> @(Ratings.Ranks.RankNames[Model.Rank]) <br /> <br /> Your progress to the next rank: @((int)Math.Round(ratio*100))%<br /> <br />Win more games to improve your rank!'>
                     <div class="progress_wrapper_left">
                         <div class="progress_text"> @Ratings.Ranks.RankNames[Model.Rank] </div>
                         <div class="progress_begin"></div>