VideoGallery: Difference between revisions

← Older edit Newer edit →

VisualWikitext

Revision as of 01:29, 3 June 2025

Template:Documentation

Video Gallery Template

This template displays the video gallery system for Dune Awakening using external data.

IMPORTANT: This template has NO INDENTATION to prevent MediaWiki from wrapping content in pre tags.

Changes in this version

Removed search functionality
Added scrollable content wrapper
Reduced header size by 30%
Reduced container height by 200px
Fixed horizontal tab layout

Usage

Simply add {{VideoGallery}} to any page where you want the video gallery to appear.

Features

Smaller header section
Six tabs: Featured, Leveling, Crafting, Building, PvE, PvP
Scrollable content area for video sections
Videos grouped by purpose within each category
Embedded YouTube player with video notes
Responsive design

Dependencies

Template:VideoGallery/styles.css - Styling
Gadget-VideoGallerySystem.js - JavaScript functionality
External Data extension - For database queries

Database

This template pulls data from the `data_videos` table using the external data extension.

Purpose Categories

Videos are grouped by the "purpose" field:

Featured: New Player Guide, Essential Guides
Leveling: Leveling 1-20, Leveling 21-40, Leveling 41-60
Crafting: Basic Crafting, Advanced Crafting
Building: Base Building
PvE: Boss Guides
PvP: PVP Strategy

@@ Line 34: / Line 34: @@
 |where=purpose='New Player Guide' AND visibility='public'
 |order by=published_at DESC
+|table=vg_newplayer
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_newplayer |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 59: / Line 61: @@
 |where=purpose='Essential Guides' AND visibility='public'
 |order by=published_at DESC
+|table=vg_essential
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_essential |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 87: / Line 91: @@
 |where=purpose='Leveling 1-20' AND primary_tag='Leveling' AND visibility='public'
 |order by=published_at DESC
+|table=vg_lvl_1_20
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_lvl_1_20 |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 112: / Line 118: @@
 |where=purpose='Leveling 21-40' AND primary_tag='Leveling' AND visibility='public'
 |order by=published_at DESC
+|table=vg_lvl_21_40
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_lvl_21_40 |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 137: / Line 145: @@
 |where=purpose='Leveling 41-60' AND primary_tag='Leveling' AND visibility='public'
 |order by=published_at DESC
+|table=vg_lvl_41_60
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_lvl_41_60 |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 165: / Line 175: @@
 |where=purpose='Basic Crafting' AND primary_tag='Crafting' AND visibility='public'
 |order by=published_at DESC
+|table=vg_craft_basic
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_craft_basic |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 190: / Line 202: @@
 |where=purpose='Advanced Crafting' AND primary_tag='Crafting' AND visibility='public'
 |order by=published_at DESC
+|table=vg_craft_adv
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_craft_adv |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 218: / Line 232: @@
 |where=purpose='Base Building' AND primary_tag='Building' AND visibility='public'
 |order by=published_at DESC
+|table=vg_build_base
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_build_base |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 246: / Line 262: @@
 |where=purpose='Boss Guides' AND primary_tag='PvE' AND visibility='public'
 |order by=published_at DESC
+|table=vg_pve_boss
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_pve_boss |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 274: / Line 292: @@
 |where=purpose='PVP Strategy' AND primary_tag='PvP' AND visibility='public'
 |order by=published_at DESC
+|table=vg_pvp_strategy
 }}
-{{#for_external_table:|<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
+{{#for_external_table: vg_pvp_strategy |
+<div class="video-card" data-video-id="{{{video_id}}}" data-youtube-id="{{{youtube_id}}}" data-title="{{{title}}}" data-channel="{{{channel_title}}}" data-channel-id="{{{channel_id}}}" data-author="{{{author|}}}" data-published="{{{published_at}}}" data-duration="{{{duration_sec}}}" data-purpose="{{{purpose|}}}" data-primary-tag="{{{primary_tag}}}" data-secondary-tag="{{{secondary_tag|}}}" data-description="{{{description|}}}" data-notes="{{{video_notes|}}}" data-internal-link="{{{video_internal_link|}}}">
 <div class="video-thumbnail" style="background-image: url('https://img.youtube.com/vi/{{{youtube_id}}}/mqdefault.jpg');">
 {{#if:{{{duration_sec|}}}|<span class="video-duration">{{#expr: floor({{{duration_sec}}} / 60)}}:{{#ifexpr: ({{{duration_sec}}} mod 60) < 10|0}}{{#expr: {{{duration_sec}}} mod 60}}</span>|}}
@@ Line 298: / Line 318: @@
 </div>
 </div>
-</includeonly><noinclude>
+</includeonly>
+<noinclude>
 {{Documentation}}
 == Video Gallery Template ==

Template