source: KernelRecordsMVC.Web/Views/Release/Details.cshtml@ 595d2e5

main
Last change on this file since 595d2e5 was 595d2e5, checked in by mmilevski <markomilevski3@…>, 4 weeks ago

Various UI bugfixes.
  • Property mode set to 100644
File size: 13.4 KB
Line 
1@using KernelRecordsMVC.Domain.Enums
2@model KernelRecordsMVC.Models.Release
3
4@{
5 ViewData["Title"] = Model.Title;
6
7 var isAlbum = Model.Album != null;
8 var isSingle = Model.SingleRelease != null;
9
10 var releaseType =
11 isAlbum ? "ALBUM" :
12 isSingle ? "SINGLE" :
13 "RELEASE";
14
15 var artists = string.Join(
16 ", ",
17 Model.ReleaseArtists
18 .OrderBy(x => x.ReleaseOrdinal)
19 .Select(x => x.Artist.ArtistName)
20 );
21}
22
23<div class="release-details-page">
24
25 <div class="release-hero">
26
27 <div class="release-hero-cover">
28
29 @if (!string.IsNullOrWhiteSpace(Model.CoverPhoto))
30 {
31 <img src="@Model.CoverPhoto"
32 alt="@Model.Title" />
33 }
34 else
35 {
36 <div class="release-no-cover">
37 <span>♪</span>
38 </div>
39 }
40
41 </div>
42
43
44 <div class="release-hero-info">
45
46 <span class="page-eyebrow">
47 @releaseType
48 </span>
49
50 <h1>
51 @Model.Title
52 </h1>
53
54 <p class="release-artists-main">
55 @artists
56 </p>
57
58
59 <div class="release-facts">
60
61 <div>
62
63 <span>Genre</span>
64
65 <strong>
66 @Model.Genre
67 </strong>
68
69 </div>
70
71
72 <div>
73
74 <span>Released</span>
75
76 <strong>
77 @Model.ReleaseDate.ToString("MMM dd, yyyy")
78 </strong>
79
80 </div>
81
82
83 <div>
84
85 <span>Label</span>
86
87 <strong>
88 @(string.IsNullOrWhiteSpace(Model.RecordLabel)
89 ? "Independent"
90 : Model.RecordLabel)
91 </strong>
92
93 </div>
94
95 </div>
96
97
98 <div class="artist-section">
99
100 <span class="section-label">
101 ARTISTS
102 </span>
103
104 <div class="release-artists">
105
106 @foreach (var artist in Model.ReleaseArtists
107 .OrderBy(x => x.ReleaseOrdinal))
108 {
109 <a asp-controller="Artist"
110 asp-action="Details"
111 asp-route-id="@artist.ArtistId"
112 class="artist-tag">
113
114 @artist.Artist.ArtistName
115
116 @if (artist.Type.ToString() == "FEATURE")
117 {
118 <span class="artist-role">
119 Featured
120 </span>
121 }
122
123 </a>
124 }
125
126 </div>
127
128 </div>
129
130 </div>
131
132 </div>
133
134
135 <!-- =====================================================
136 PRODUCTS
137 ===================================================== -->
138
139 <section class="release-section">
140
141 <div class="section-heading">
142
143 <div>
144
145 <span class="section-label">
146 AVAILABLE FORMATS
147 </span>
148
149 <h2>
150 Choose your format
151 </h2>
152
153 </div>
154
155 <span class="track-count">
156 @Model.Products.Count product(s)
157 </span>
158
159 </div>
160
161
162 @if (!Model.Products.Any())
163 {
164 <div class="no-products">
165 No physical products are currently available.
166 </div>
167 }
168 else
169 {
170 <div class="product-grid">
171
172 @foreach (var product in Model.Products
173 .OrderBy(x => x.Format))
174 {
175 var latestModification =
176 product.ModificationProducts?
177 .Select(mp => mp.Modification)
178 .OrderByDescending(m => m.DateModified)
179 .ThenByDescending(m => m.ModificationId)
180 .FirstOrDefault();
181
182 var isDiscounted =
183 latestModification != null &&
184 latestModification.TypeOfModification ==
185 ModificationType.DISCOUNT &&
186 latestModification.Discount.HasValue &&
187 latestModification.Discount.Value > 0 &&
188 latestModification.Discount.Value < 100;
189
190 decimal? originalPrice = null;
191 decimal? discountPercentage = null;
192
193 if (isDiscounted)
194 {
195 discountPercentage =
196 latestModification!.Discount!.Value;
197
198 originalPrice =
199 Math.Round(
200 product.Price /
201 (1m -
202 discountPercentage.Value / 100m),
203 2,
204 MidpointRounding.AwayFromZero);
205 }
206
207
208 <div class="store-product-card">
209
210 <div class="product-card-top">
211
212 <span class="product-format">
213 @product.Format
214 </span>
215
216
217 @if (product.Stock > 0)
218 {
219 <span class="product-stock available">
220 In stock
221 </span>
222 }
223 else
224 {
225 <span class="product-stock unavailable">
226 Out of stock
227 </span>
228 }
229
230 </div>
231
232
233 <!-- PRICE -->
234
235 @if (isDiscounted &&
236 originalPrice.HasValue &&
237 discountPercentage.HasValue)
238 {
239 <div class="product-sale-price">
240
241 <div class="product-price-row">
242
243 <span class="product-original-price">
244 @originalPrice.Value.ToString("C")
245 </span>
246
247 <span class="product-current-price">
248 @product.Price.ToString("C")
249 </span>
250
251 </div>
252
253 <span class="product-discount-badge">
254 -@discountPercentage.Value.ToString("0.##")%
255 </span>
256
257 </div>
258 }
259 else
260 {
261 <div class="product-price">
262 @product.Price.ToString("C")
263 </div>
264 }
265
266
267 <p class="product-description">
268 @product.ProductDescription
269 </p>
270
271
272 @if (product.Stock > 0)
273 {
274 <div class="product-actions">
275
276 <!-- ADD TO CART -->
277
278 <a asp-controller="Order"
279 asp-action="AddProduct"
280 asp-route-id="@product.ProductId"
281 class="store-button primary">
282
283 Add to Cart
284
285 </a>
286
287
288 <!-- ADD TO WISHLIST -->
289
290 <form asp-controller="Wishlist"
291 asp-action="Add"
292 method="post">
293
294 @Html.AntiForgeryToken()
295
296 <input type="hidden"
297 name="productId"
298 value="@product.ProductId" />
299
300 <button type="submit"
301 class="store-button secondary">
302
303 ♡ Wishlist
304
305 </button>
306
307 </form>
308
309 </div>
310 }
311 else
312 {
313 <div class="product-actions">
314
315 <form asp-controller="Wishlist"
316 asp-action="Add"
317 method="post">
318
319 @Html.AntiForgeryToken()
320
321 <input type="hidden"
322 name="productId"
323 value="@product.ProductId" />
324
325 <button type="submit"
326 class="store-button secondary full">
327
328 ♡ Add to Wishlist
329
330 </button>
331
332 </form>
333
334 </div>
335 }
336
337 </div>
338 }
339
340 </div>
341 }
342
343 </section>
344
345
346 <!-- =====================================================
347 ALBUM
348 ===================================================== -->
349
350 @if (Model.Album != null)
351 {
352 <section class="release-section">
353
354 <div class="section-heading">
355
356 <div>
357
358 <span class="section-label">
359 ALBUM
360 </span>
361
362 <h2>
363 Track List
364 </h2>
365
366 </div>
367
368 <span class="track-count">
369 @Model.Album.AlbumSongs.Count tracks
370 </span>
371
372 </div>
373
374
375 @if (!Model.Album.AlbumSongs.Any())
376 {
377 <div class="no-products">
378 No tracks have been added to this album.
379 </div>
380 }
381 else
382 {
383 <ol class="track-list">
384
385 @{
386 var trackNumber = 1;
387 }
388
389
390 @foreach (var albumSong in Model.Album.AlbumSongs
391 .OrderBy(x => x.SongId))
392 {
393 <li class="track-row">
394
395 <span class="track-number">
396 @trackNumber.ToString("00")
397 </span>
398
399
400 <div class="track-main">
401
402 <strong>
403 @albumSong.Song.SongName
404 </strong>
405
406
407 @if (albumSong.Song.SongArtists != null &&
408 albumSong.Song.SongArtists.Any())
409 {
410 <div class="song-artists">
411
412 @string.Join(
413 ", ",
414 albumSong.Song.SongArtists
415 .OrderBy(x => x.SongOrdinal)
416 .Select(x =>
417 x.Artist.ArtistName)
418 )
419
420 </div>
421 }
422
423 </div>
424
425
426 <span class="track-duration">
427 @albumSong.Song.SongDuration
428 </span>
429
430 </li>
431
432 trackNumber++;
433 }
434
435 </ol>
436 }
437
438 </section>
439 }
440
441
442 <!-- =====================================================
443 SINGLE
444 ===================================================== -->
445
446 @if (Model.SingleRelease != null)
447 {
448 <section class="release-section">
449
450 <div class="section-heading">
451
452 <div>
453
454 <span class="section-label">
455 SINGLE
456 </span>
457
458 <h2>
459 Single Information
460 </h2>
461
462 </div>
463
464 </div>
465
466
467 <div class="single-info-card">
468
469 <div>
470
471 <span class="section-label">
472 RELEASE TYPE
473 </span>
474
475 <h2>
476 Single
477 </h2>
478
479 </div>
480
481
482 <div class="single-duration">
483
484 <span>
485 Duration
486 </span>
487
488 <strong>
489 @Model.SingleRelease.Duration
490 </strong>
491
492 </div>
493
494 </div>
495
496 </section>
497 }
498
499</div>
Note: See TracBrowser for help on using the repository browser.