Videos: Difference between revisions
From Dune Awakening DB
Created page with "{{#css:Template:VideoGallery/styles.css}} <div class="video-gallery-main-container"> <!-- Video Categories Section (60% width) --> <div class="video-categories"> <!-- Search Bar (Optional) --> <div class="video-search-bar"> <input type="text" class="video-search-input" placeholder="Search videos..."> <button class="video-search-button">Search</button> </div> <!-- Tab Navigation --> <div clas..." |
mNo edit summary |
||
| Line 1: | Line 1: | ||
{{ | {{TemplateStyles|Template:VideoGallery/styles.css}} | ||
<div class="video-gallery-main-container"> | <div class="video-gallery-main-container"> | ||
<!-- 60 % column – categories --> | |||
<div class="video-categories"> | |||
<!-- Search --> | |||
<div class="video-search-bar"> | |||
<input type="text" class="video-search-input" placeholder="Search videos…"> | |||
<button class="video-search-button">Search</button> | |||
</div> | |||
<!-- Tabs --> | |||
<div class="video-tabs-nav"> | |||
<button class="video-tab active" data-tab="featured">◆ Featured</button> | |||
<button class="video-tab" data-tab="leveling">⬆ Leveling</button> | |||
<button class="video-tab" data-tab="crafting">⚒ Crafting</button> | |||
<button class="video-tab" data-tab="building">⌂ Building</button> | |||
<button class="video-tab" data-tab="pve">⚔ PVE</button> | |||
<button class="video-tab" data-tab="pvp">⚔ PVP</button> | |||
</div> | |||
<!-- Tab panes --> | |||
<div class="video-tab-content active" data-content="featured"> | |||
{{#invoke:VideoGallery|renderVideos|category=featured}} | |||
</div> | </div> | ||
<div class="video-tab-content" data-content="leveling"> | |||
<!-- | {{#invoke:VideoGallery|renderVideos|category=leveling}} | ||
</div> | |||
<div class="video-tab-content" data-content="crafting"> | |||
{{#invoke:VideoGallery|renderVideos|category=crafting}} | |||
</div> | |||
<div class="video-tab-content" data-content="building"> | |||
{{#invoke:VideoGallery|renderVideos|category=building}} | |||
</div> | |||
<div class="video-tab-content" data-content="pve"> | |||
{{#invoke:VideoGallery|renderVideos|category=pve}} | |||
</div> | |||
<div class="video-tab-content" data-content="pvp"> | |||
{{#invoke:VideoGallery|renderVideos|category=pvp}} | |||
</div> | |||
</div> | |||
<!-- 40 % column – player --> | |||
<div class="video-player-panel" id="videoPlayerPanel"> | |||
<div class="no-video-selected"> | |||
<div class="placeholder-icon">▶</div> | |||
<p>Select a video to watch</p> | |||
</div> | </div> | ||
</div> | |||
</div> | </div> | ||
<!-- | <!-- JSON payload for JS --> | ||
<script type="application/json" id="video-gallery-data"> | <script type="application/json" id="video-gallery-data"> | ||
{{#invoke:VideoGallery|getVideoData}} | {{#invoke:VideoGallery|getVideoData}} | ||
</script> | </script> | ||
<!-- | <!-- Load the VideoGallery gadget --> | ||
{{# | {{#tag:script|mw.loader.load('ext.gadget.VideoGallery');}} | ||
Revision as of 23:28, 1 June 2025
<button class="video-tab active" data-tab="featured">◆ Featured</button>
<button class="video-tab" data-tab="leveling">⬆ Leveling</button>
<button class="video-tab" data-tab="crafting">⚒ Crafting</button>
<button class="video-tab" data-tab="building">⌂ Building</button>
<button class="video-tab" data-tab="pve">⚔ PVE</button>
<button class="video-tab" data-tab="pvp">⚔ PVP</button>
Script error: The function "renderVideos" does not exist.
Script error: The function "renderVideos" does not exist.
Script error: The function "renderVideos" does not exist.
Script error: The function "renderVideos" does not exist.
Script error: The function "renderVideos" does not exist.
Script error: The function "renderVideos" does not exist.
Select a video to watch
<script type="application/json" id="video-gallery-data"> Script error: The function "getVideoData" does not exist. </script>
<script>mw.loader.load('ext.gadget.VideoGallery');</script>