presskit.ejs 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184
  1. <% var content = get_page(site.posts, page.target_id) %>
  2. <% if (content == undefined) content = page; %>
  3. <main role="main" class="presskit">
  4. <section class="py-5 text-center container">
  5. <div class="row py-lg-5">
  6. <div class="col-10 mx-auto">
  7. <h1><%- content.title %> <small class="fw-light">Presskit</small></h1>
  8. <p class="lead text-muted"><%- content.description %></p>
  9. <a class="btn-steam" href="https://store.steampowered.com/app/1481070/Max_Raider/">
  10. <!-- <img src="images/button-steam.png"> -->
  11. </a>
  12. </div>
  13. </div>
  14. </section>
  15. <% if(content.trailer != undefined) { %>
  16. <div class="album py-5 bg-light">
  17. <div class="container container-large">
  18. <div class="row justify-content-center">
  19. <div class="col-lg-10" style="text-align: center;">
  20. <div class="ratio ratio-16x9">
  21. <iframe class="video-player" src="<%- content.trailer %>" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  22. </div>
  23. </div>
  24. </div>
  25. </div>
  26. </div>
  27. <% } %>
  28. <% if(content.developer != undefined) { %>
  29. <div class="container" style="margin-top: 80px;">
  30. <div class="row justify-content-center">
  31. <div class="col-lg-10">
  32. <dl class="row">
  33. <h2 class="text-center space-bottom">Fact Sheet</h2>
  34. <% if(content.developer != undefined && content.developer_url != undefined) { %>
  35. <dt class="col-sm-3">Developer</dt>
  36. <dd class="col-sm-9"><a href="<%- content.developer_url %>"><%- content.developer %></a></dd>
  37. <% } %>
  38. <% if(content.publisher != undefined && content.publisher_url != undefined) { %>
  39. <dt class="col-sm-3">Publisher</dt>
  40. <dd class="col-sm-9"><a href="<%- content.publisher_url %>"><%- content.publisher %></a></dd>
  41. <% } %>
  42. <% if(content.genre != undefined) { %>
  43. <dt class="col-sm-3">Genre</dt>
  44. <dd class="col-sm-9"><%- content.genre %></dd>
  45. <% } %>
  46. <% if(content.tags != undefined) { %>
  47. <dt class="col-sm-3">Tags</dt>
  48. <dd class="col-sm-9">
  49. <%- list_tags(content.tags, {style: false, separator: ', ', show_count: false}) %>
  50. </dd>
  51. %>
  52. <% } %>
  53. <% if(content.platforms != undefined) { %>
  54. <dt class="col-sm-3">Platforms</dt>
  55. <dd class="col-sm-9"><%- content.platforms %></dd>
  56. <% } %>
  57. <% if(content.release != undefined && content.released != undefined) { %>
  58. <dt class="col-sm-3">
  59. <% if(content.released) { %>
  60. Released
  61. <% } else { %>
  62. Release date
  63. <% } %>
  64. </dt>
  65. <dd class="col-sm-9"><%- content.release %></dd>
  66. <% } %>
  67. <% if(content.game_modes != undefined) { %>
  68. <dt class="col-sm-3">Game Modes</dt>
  69. <dd class="col-sm-9"><%- content.game_modes %></dd>
  70. <% } %>
  71. <% if(content.email != undefined) { %>
  72. <dt class="col-sm-3">Email</dt>
  73. <dd class="col-sm-9"><%- content.email %></dd>
  74. <% } %>
  75. <% if(content.twitter_dev != undefined) { %>
  76. <dt class="col-sm-3">Twitter (dev): </dt>
  77. <dd class="col-sm-9">
  78. <a href="http://twitter.com/<%- content.twitter_dev %>">@<%- content.twitter_dev %></a>
  79. </dd>
  80. <% } %>
  81. </dl>
  82. </div>
  83. </div>
  84. </div>
  85. <% } %>
  86. <section class="container" style="margin-bottom: 80px;">
  87. <div class="row">
  88. <div class="col-10 mx-auto presskit-content">
  89. <%- page.content %>
  90. </a>
  91. </div>
  92. </div>
  93. </section>
  94. <% if(content.media != undefined) { %>
  95. <% if(content.media.screenshots != undefined) { %>
  96. <div class="album py-3 bg-light" style="margin-bottom: 80px;">
  97. <div class="container-fluid content">
  98. <div class="row">
  99. <div class="col-12">
  100. <h2>Screenshots</h2>
  101. </div>
  102. </div>
  103. <div class="row py-5 row-cols-1 row-cols-sm-2 row-cols-md-3 g-3 space-bottom">
  104. <% var screenshot_count = (Math.round(content.media.screenshots.list.length/3)*3) %>
  105. <% for(var i = 0; i < screenshot_count; i++) { %>
  106. <div class="col">
  107. <div class="card shadow-sm">
  108. <a href="<%- content.media.screenshots.list[i] %>" target="_BLANK">
  109. <img src="<%- content.media.screenshots.list[i] %>" class="img-fluid">
  110. </a>
  111. </div>
  112. </div>
  113. <% }; %>
  114. </div>
  115. </div>
  116. </div>
  117. <% } %>
  118. <% } %>
  119. <section class="container" style="margin-bottom: 80px;">
  120. <div class="row">
  121. <div class="col-12" style="padding-bottom: 20px;">
  122. <h2>Media</h2>
  123. </div>
  124. </div>
  125. <div class="row">
  126. <% for (const [key, value] of Object.entries(content.media)) { %>
  127. <% var media = content.media[key]; %>
  128. <% if(media.hide_media == undefined || media.hide_media == false) { %>
  129. <% var c = 'col-md-8'; %>
  130. <% if (media.media_type != 'image' && media.media_type != 'ai') c = 'col-md-12' %>
  131. <div class="card mb-3 col-12">
  132. <div class="row g-0">
  133. <div class="<%- c %>">
  134. <div class="card-body">
  135. <h5 class="card-title">
  136. <a target="_BLANK" href="<%- media.path %>"
  137. v-on:click="mixpanelTrack('Media Download', { media_name: '<%- media.name %>', media_type: '<%- media.media_type %>', link : '<%- media.path %>', parent: '<%- page.title %>'})">
  138. <%- media.name %>
  139. </a>
  140. </h5>
  141. <p class="card-text" style="margin-bottom: 12px;">
  142. <%- media.description %>
  143. </p>
  144. <p class="card-text" >
  145. <span class="text-muted">
  146. <i class="far fa-file-image"></i>
  147. </span>
  148. <small class="text-muted" style="padding-left: 10px;">
  149. <%- media.file_size %>
  150. </small>
  151. <% if(media.image_size != undefined) { %>
  152. <small class="text-muted" style="padding-left: 10px;">
  153. <%- media.image_size %>
  154. </small>
  155. <% } %>
  156. </p>
  157. </div>
  158. </div>
  159. <% if(media.media_type == 'image' || media.media_type == 'ai') { %>
  160. <div class="col-md-4 image-box">
  161. <a target="_BLANK" href="<%- media.path %>"
  162. v-on:click="mixpanelTrack('Media Download', { media_name: '<%- media.name %>', media_type: '<%- media.media_type %>', link : '<%- media.path %>', parent: '<%- page.title %>'})">
  163. <% if(media.preview_path == undefined) { %>
  164. <img src="<%- media.path %>" class="img-fluid" alt="...">
  165. <% } else { %>
  166. <img src="<%- media.preview_path %>" class="img-fluid" alt="...">
  167. <% } %>
  168. </a>
  169. </div>
  170. <% } %>
  171. </div>
  172. </div>
  173. <% } %>
  174. <% } %>
  175. </div>
  176. </div>
  177. </section>
  178. </main>