+| | | 1 | | @model TailSpin.SpaceGame.Web.Models.LeaderboardViewModel |
+| | | 2 | | @{ |
+| | 0 | 3 | | ViewData["Title"] = "Home Page"; |
+| | | 4 | | } |
+| | | 5 | | <section class="intro"> |
+| | | 6 | | <div class="container"> |
+| | | 7 | | <img class="title" src="/images/space-game-title.svg" alt="Space Game"> |
+| | | 8 | | <p>Welcome to the official Space Game site!</p> |
+| | | 9 | | </div> |
+| | | 10 | | </section> |
+| | | 11 | | <section class="download"> |
+| | | 12 | | <div class="image-cap"></div> |
+| | | 13 | | <div class="container"> |
+| | | 14 | | <a href="" class="btn btn-default btn-lg" data-toggle="modal" data-target="#pretend-modal">Download game</a> |
+| | | 15 | | </div> |
+| | | 16 | | </section> |
+| | | 17 | | |
+| | | 18 | | <!-- Screenshots --> |
+| | | 19 | | <section class="screens"> |
+| | | 20 | | <div class="container"> |
+| | | 21 | | <ul> |
+| | | 22 | | <li><a href="" data-toggle="modal" data-target=".pic-01"><img src="/images/space-game-placeholder.svg" alt=" |
+| | | 23 | | <li><a href="" data-toggle="modal" data-target=".pic-01"><img src="/images/space-game-placeholder.svg" alt=" |
+| | | 24 | | <li><a href="" data-toggle="modal" data-target=".pic-01"><img src="/images/space-game-placeholder.svg" alt=" |
+| | | 25 | | <li><a href="" data-toggle="modal" data-target=".pic-01"><img src="/images/space-game-placeholder.svg" alt=" |
+| | | 26 | | </ul> |
+| | | 27 | | </div> |
+| | | 28 | | </section> |
+| | | 29 | | |
+| | | 30 | | <!-- Leaderboard --> |
+| | | 31 | | <section class="leaderboard"> |
+| | | 32 | | <div class="container"> |
+| | | 33 | | <a name="leaderboard"></a> |
+| | | 34 | | <h2>Space leaders</h2> |
+| | | 35 | | <!-- Start Leaderboard table --> |
+| | | 36 | | <div class="row"> |
+| | | 37 | | <div class="col-sm-9 leader-scores"> |
+| | | 38 | | <div class="row high-score hidden-xs"> |
+| | | 39 | | <div class="col-sm-1"> |
+| | | 40 | | Rank |
+| | | 41 | | </div> |
+| | | 42 | | <div class="col-sm-4"> |
+| | | 43 | | Player |
+| | | 44 | | </div> |
+| | | 45 | | <div class="col-sm-2"> |
+| | | 46 | | Mode |
+| | | 47 | | </div> |
+| | | 48 | | <div class="col-sm-3"> |
+| | | 49 | | Galaxy |
+| | | 50 | | </div> |
+| | | 51 | | <div class="col-sm-2"> |
+| | | 52 | | Score |
+| | | 53 | | </div> |
+| | | 54 | | </div> |
+| | | 55 | | |
+| | | 56 | | @{ |
+| | 0 | 57 | | if (Model.Scores.Count() == 0) |
+| | | 58 | | { |
+| | | 59 | | <div class="row" style="margin-left: 5px; margin-top: 20px;">No scores match your selection.</di |
+| | | 60 | | } |
+| | | 61 | | |
+| | 0 | 62 | | int rank = ((Model.Page - 1) * Model.PageSize) + 1; |
+| | 0 | 63 | | foreach (var score in Model.Scores) |
+| | | 64 | | { |
+| | | 65 | | <div class="row high-score align-items-center"> |
+| | | 66 | | <div class="col-sm-1 score-data"> |
+| | | 67 | | @(rank++). |
+| | | 68 | | </div> |
+| | | 69 | | <div class="col-sm-4 score-data"> |
+| | | 70 | | <div style="text-align: left; margin-left: 100px;"> |
+| | | 71 | | <partial name="Profile" model="new ProfileViewModel { Profile = score.Profile, Rank |
+| | | 72 | | <a href="" data-toggle="modal" data-target="#profile-modal-@((rank - 1).ToString())" |
+| | | 73 | | <img class="avatar" src="@score.Profile.AvatarUrl" alt="@score.Profile.UserName" |
+| | | 74 | | <div class="score-data username"> |
+| | | 75 | | @score.Profile.UserName |
+| | | 76 | | </div> |
+| | | 77 | | </a> |
+| | | 78 | | </div> |
+| | | 79 | | </div> |
+| | | 80 | | <div class="col-sm-2 score-data"> |
+| | | 81 | | @score.Score.GameMode |
+| | | 82 | | </div> |
+| | | 83 | | <div class="col-sm-3 score-data"> |
+| | | 84 | | @score.Score.GameRegion |
+| | | 85 | | </div> |
+| | | 86 | | <div class="col-sm-2 score-data"> |
+| | | 87 | | @score.Score.HighScore.ToString("N0") |
+| | | 88 | | </div> |
+| | | 89 | | </div> |
+| | 0 | 90 | | } |
+| | | 91 | | } |
+| | | 92 | | <nav aria-label="..."> |
+| | | 93 | | <ul class="pagination"> |
+| | 0 | 94 | | @if (string.IsNullOrEmpty(Model.PrevLink)) |
+| | | 95 | | { |
+| | | 96 | | <li class="disabled"><span aria-hidden="true">«</span></li> |
+| | | 97 | | } |
+| | | 98 | | else |
+| | | 99 | | { |
+| | | 100 | | <li class=""><a href="@Model.PrevLink" aria-label="Previous"><span aria-hidden="true">« |
+| | | 101 | | } |
+| | | 102 | | @{ |
+| | 0 | 103 | | var totalPages = Model.TotalResults / Model.PageSize; |
+| | 0 | 104 | | if (Model.TotalResults % Model.PageSize != 0) |
+| | | 105 | | { |
+| | 0 | 106 | | totalPages++; |
+| | | 107 | | } |
+| | | 108 | | |
+| | 0 | 109 | | for (int i = 1; i <= totalPages; i++) |
+| | | 110 | | { |
+| | | 111 | | <li class="@(i == Model.Page ? "active" : null)"> |
+| | | 112 | | <a href="@($"/?page={i}&pageSize={@Model.PageSize}&mode={@Model.SelectedMode}®ion |
+| | | 113 | | @i |
+| | | 114 | | <span class="sr-only">(current)</span> |
+| | | 115 | | </a> |
+| | | 116 | | </li> |
+| | | 117 | | } |
+| | | 118 | | } |
+| | 0 | 119 | | @if (string.IsNullOrEmpty(Model.NextLink)) |
+| | | 120 | | { |
+| | | 121 | | <li class="disabled"><span aria-hidden="true">»</span></li> |
+| | | 122 | | } |
+| | | 123 | | else |
+| | | 124 | | { |
+| | | 125 | | <li class=""><a href="@Model.NextLink" aria-label="Next"><span aria-hidden="true">»</s |
+| | | 126 | | } |
+| | | 127 | | </ul> |
+| | | 128 | | </nav> |
+| | | 129 | | </div> |
+| | | 130 | | |
+| | | 131 | | <div class="col-sm-3"> |
+| | | 132 | | <div class="leader-nav hidden-xs"> |
+| | | 133 | | <div class="row nav-buttons"> |
+| | | 134 | | <h4>Mode</h4> |
+| | | 135 | | <ul> |
+| | 0 | 136 | | @if (string.IsNullOrEmpty(Model.SelectedMode)) |
+| | | 137 | | { |
+| | | 138 | | <li class="filter-active">All</li> |
+| | | 139 | | } |
+| | | 140 | | else |
+| | | 141 | | { |
+| | | 142 | | <li class="filter-button"> |
+| | | 143 | | <a class="" href="/?region=@Model.SelectedRegion#leaderboard">All</a> |
+| | | 144 | | </li> |
+| | | 145 | | } |
+| | | 146 | | @{ |
+| | 0 | 147 | | foreach (var mode in Model.GameModes) |
+| | | 148 | | { |
+| | 0 | 149 | | @if (mode.Equals(Model.SelectedMode)) |
+| | | 150 | | { |
+| | | 151 | | <li class="filter-active">@mode</li> |
+| | | 152 | | } |
+| | | 153 | | else |
+| | | 154 | | { |
+| | | 155 | | <li class="filter-button"><a href="/?mode=@mode®ion=@Model.SelectedRegion#lea |
+| | | 156 | | } |
+| | | 157 | | } |
+| | | 158 | | } |
+| | | 159 | | </ul> |
+| | | 160 | | </div> |
+| | | 161 | | |
+| | | 162 | | <div class="row nav-buttons"> |
+| | | 163 | | <h4>Galaxy</h4> |
+| | | 164 | | <ul> |
+| | 0 | 165 | | @if (string.IsNullOrEmpty(Model.SelectedRegion)) |
+| | | 166 | | { |
+| | | 167 | | <li class="filter-active">All</li> |
+| | | 168 | | } |
+| | | 169 | | else |
+| | | 170 | | { |
+| | | 171 | | <li class="filter-button"><a href="/?mode=@Model.SelectedMode#leaderboard">All</a></li> |
+| | | 172 | | } |
+| | | 173 | | |
+| | | 174 | | @{ |
+| | 0 | 175 | | foreach (var region in Model.GameRegions) |
+| | | 176 | | { |
+| | 0 | 177 | | @if (region.Equals(Model.SelectedRegion)) |
+| | | 178 | | { |
+| | | 179 | | <li class="filter-active">@region</li> |
+| | | 180 | | } |
+| | | 181 | | else |
+| | | 182 | | { |
+| | | 183 | | <li class="filter-button"><a href="/?mode=@Model.SelectedMode®ion=@region#lea |
+| | | 184 | | } |
+| | | 185 | | } |
+| | | 186 | | } |
+| | | 187 | | </ul> |
+| | | 188 | | </div> |
+| | | 189 | | </div> |
+| | | 190 | | </div> |
+| | | 191 | | </div> |
+| | | 192 | | <!-- End Leaderboard --> |
+| | | 193 | | </div> |
+| | | 194 | | </section> |
+| | | 195 | | |
+| | | 196 | | <!-- About section --> |
+| | | 197 | | <section class="about"> |
+| | | 198 | | <h2>More about Space Game</h2> |
+| | | 199 | | <p>Space Game is an example website for learning purposes. Check out <a href="https://aka.ms/mslearndevops/">Microso |
+| | | 200 | | </section> |
+| | | 201 | | <section class="social"> |
+| | | 202 | | <div class="container"> |
+| | | 203 | | <div class="share"> |
+| | | 204 | | <ul> |
+| | | 205 | | <li><a href="" data-toggle="modal" data-target=".social-media"><img src="/images/space-game-placeholder. |
+| | | 206 | | <li><a href="" data-toggle="modal" data-target=".social-media"><img src="/images/space-game-placeholder. |
+| | | 207 | | <li><a href="" data-toggle="modal" data-target=".social-media"><img src="/images/space-game-placeholder. |
+| | | 208 | | </ul> |
+| | | 209 | | </div> |
+| | | 210 | | </div> |
+| | | 211 | | <p>© @DateTime.Now.Year - TailSpin Toys</p> |
+| | | 212 | | </section> |
+| | | 213 | | |
+| | | 214 | | |
+| | | 215 | | <!-- Modals --> |
+| | | 216 | | <div class="modal fade" id="test-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> |
+| | | 217 | | <div class="modal-dialog" role="document"> |
+| | | 218 | | <div class="modal-content"> |
+| | | 219 | | <div class="modal-header no-border"> |
+| | | 220 | | <button type="button" class="close" data-dismiss="modal">×</button> |
+| | | 221 | | </div> |
+| | | 222 | | <div class="modal-body"> |
+| | | 223 | | modal |
+| | | 224 | | </div> |
+| | | 225 | | </div> |
+| | | 226 | | </div> |
+| | | 227 | | </div> |
+| | | 228 | | |
+| | | 229 | | <!-- Pic modals --> |
+| | | 230 | | <div class="modal fade pic-01" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> |
+| | | 231 | | <div class="modal-dialog" role="document"> |
+| | | 232 | | <div class="modal-content"> |
+| | | 233 | | <div class="modal-header no-border"> |
+| | | 234 | | <button type="button" class="close" data-dismiss="modal">×</button> |
+| | | 235 | | </div> |
+| | | 236 | | <div class="modal-body text-center"> |
+| | | 237 | | <img src="/images/space-game-placeholder.svg" width="100%" alt=""> |
+| | | 238 | | <p>Gamescreen example</p> |
+| | | 239 | | </div> |
+| | | 240 | | </div> |
+| | | 241 | | </div> |
+| | | 242 | | </div> |
+| | | 243 | | |
+| | | 244 | | <!-- Social --> |
+| | | 245 | | <div class="modal fade social-media" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> |
+| | | 246 | | <div class="modal-dialog" role="document"> |
+| | | 247 | | <div class="modal-content"> |
+| | | 248 | | <div class="modal-header no-border"> |
+| | | 249 | | <button type="button" class="close" data-dismiss="modal">×</button> |
+| | | 250 | | </div> |
+| | | 251 | | <div class="modal-body text-center"> |
+| | | 252 | | Social media example |
+| | | 253 | | </div> |
+| | | 254 | | </div> |
+| | | 255 | | </div> |
+| | | 256 | | </div> |
+| | | 257 | | |
+| | | 258 | | <!-- Dead end modal --> |
+| | | 259 | | <div class="modal fade" id="pretend-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> |
+| | | 260 | | <div class="modal-dialog" role="document"> |
+| | | 261 | | <div class="modal-content"> |
+| | | 262 | | <div class="modal-header no-border"> |
+| | | 263 | | <button type="button" class="close" data-dismiss="modal">×</button> |
+| | | 264 | | </div> |
+| | | 265 | | <div class="modal-body text-center"> |
+| | | 266 | | This link is for example purposes and goes nowhere. 😐 |
+| | | 267 | | </div> |
+| | | 268 | | </div> |
+| | | 269 | | </div> |
+| | | 270 | | </div> |
+
+