Template:HLSVideo - Revision history

Magent: Add semantic link to Release:{cid} for backlink tracking from Release pages (via update-page on MediaWiki MCP Server)

2026-03-08T15:38:42Z

Add semantic link to Release:{cid} for backlink tracking from Release pages (via update-page on MediaWiki MCP Server)

← Older revision		Revision as of 15:38, 8 March 2026
Line 16:		Line 16:
	* '''thumb''' - Optional. If present, uses thumbnail styling with border		* '''thumb''' - Optional. If present, uses thumbnail styling with border
	* '''caption''' - Optional. Caption text shown below the video		* '''caption''' - Optional. Caption text shown below the video

			=== Semantic tagging ===
			This template automatically creates a hidden link to the corresponding <code>Release:</code> page for the CID, enabling reverse lookups from Release pages to see where videos are used.

	=== Examples ===		=== Examples ===
Line 24:		Line 27:
	{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB\|thumb\|align=right\|width=300px\|caption=Example video}}		{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB\|thumb\|align=right\|width=300px\|caption=Example video}}
	<div style="clear:both;"></div>		<div style="clear:both;"></div>
	</noinclude><includeonly>{{#if:{{{thumb\|}}}\|<div class="thumb t{{{align\|right}}}" style="width:{{{width\|300px}}};{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}"><div class="thumbinner" style="width:100%;"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div class="thumbcaption">{{{caption}}}</div>\|}}</div></div>\|<div style="{{#ifeq:{{{align\|}}}\|right\|float:right;margin-left:1em;\|}}{{#ifeq:{{{align\|}}}\|left\|float:left;margin-right:1em;\|}}{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}width:{{{width\|100%}}};max-width:{{{max-width\|800px}}};"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div style="text-align:center;font-size:0.9em;color:#666;padding:0.3em;">{{{caption}}}</div>\|}}</div>}}</includeonly>		</noinclude><includeonly>{{#if:{{{thumb\|}}}\|<div class="thumb t{{{align\|right}}}" style="width:{{{width\|300px}}};{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}"><div class="thumbinner" style="width:100%;"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div class="thumbcaption">{{{caption}}}</div>\|}}</div></div>\|<div style="{{#ifeq:{{{align\|}}}\|right\|float:right;margin-left:1em;\|}}{{#ifeq:{{{align\|}}}\|left\|float:left;margin-right:1em;\|}}{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}width:{{{width\|100%}}};max-width:{{{max-width\|800px}}};"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div style="text-align:center;font-size:0.9em;color:#666;padding:0.3em;">{{{caption}}}</div>\|}}</div>}}<span style="display:none;">[[Release:{{{cid}}}]]</span></includeonly>

Magent: Add alignment and caption support (via update-page on MediaWiki MCP Server)

2026-02-20T03:35:21Z

Add alignment and caption support (via update-page on MediaWiki MCP Server)

← Older revision		Revision as of 03:35, 20 February 2026
Line 5:		Line 5:
	=== Usage ===		=== Usage ===
	<pre>{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}</pre>		<pre>{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}</pre>

			With thumbnail style and caption:
			<pre>{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB\|thumb\|align=right\|width=300px\|caption=My video description}}</pre>

	=== Parameters ===		=== Parameters ===
	* '''cid''' - Required. The IPFS CID containing the HLS directory (must have master.m3u8)		* '''cid''' - Required. The IPFS CID containing the HLS directory (must have master.m3u8)
	* '''width''' - Optional. Video width (default: 100%)		* '''width''' - Optional. Video width (default: 100%, or 300px if thumb)
	* '''max-width''' - Optional. Maximum width (default: 800px)		* '''max-width''' - Optional. Maximum width (default: 800px)
			* '''align''' - Optional. Alignment: left, right, center, none (default: none)
			* '''thumb''' - Optional. If present, uses thumbnail styling with border
			* '''caption''' - Optional. Caption text shown below the video

	=== ~~Example~~ ===		=== Examples ===
			'''Basic:'''
	{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}		{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}
	</noinclude><includeonly><div class="hls-video-player" data-cid="{{{cid}}}" data-width="{{{width\|100%}}}" data-max-width="{{{max-width\|800px}}}"></div></includeonly>
			'''Thumbnail aligned right with caption:'''
			{{HLSVideo\|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB\|thumb\|align=right\|width=300px\|caption=Example video}}
			<div style="clear:both;"></div>
			</noinclude><includeonly>{{#if:{{{thumb\|}}}\|<div class="thumb t{{{align\|right}}}" style="width:{{{width\|300px}}};{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}"><div class="thumbinner" style="width:100%;"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div class="thumbcaption">{{{caption}}}</div>\|}}</div></div>\|<div style="{{#ifeq:{{{align\|}}}\|right\|float:right;margin-left:1em;\|}}{{#ifeq:{{{align\|}}}\|left\|float:left;margin-right:1em;\|}}{{#ifeq:{{{align\|}}}\|center\|margin-left:auto;margin-right:auto;\|}}width:{{{width\|100%}}};max-width:{{{max-width\|800px}}};"><div class="hls-video-player" data-cid="{{{cid}}}" data-width="100%" data-max-width="{{{max-width\|800px}}}"></div>{{#if:{{{caption\|}}}\|<div style="text-align:center;font-size:0.9em;color:#666;padding:0.3em;">{{{caption}}}</div>\|}}</div>}}</includeonly>

Magent: Simplify template to use Common.js gadget instead of inline scripts (via update-page on MediaWiki MCP Server)

2026-02-19T23:07:19Z

Simplify template to use Common.js gadget instead of inline scripts (via update-page on MediaWiki MCP Server)

@@ Line 9: / Line 9: @@
 * '''cid''' - Required. The IPFS CID containing the HLS directory (must have master.m3u8)
 * '''width''' - Optional. Video width (default: 100%)
-* '''height''' - Optional. Video height (default: auto)
+* '''max-width''' - Optional. Maximum width (default: 800px)
 === Example ===
 {{HLSVideo|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}
-</noinclude><includeonly><div class="hls-video-container" style="width: {{{width|100%}}}; max-width: 800px;">
+</noinclude><includeonly><div class="hls-video-player" data-cid="{{{cid}}}" data-width="{{{width|100%}}}" data-max-width="{{{max-width|800px}}}"></div></includeonly>

Magent: Create HLS video player template for IPFS-hosted videos (via create-page on MediaWiki MCP Server)

2026-02-19T22:51:13Z

Create HLS video player template for IPFS-hosted videos (via create-page on MediaWiki MCP Server)

New page

<noinclude>
== HLS Video Player ==
Embeds an HLS video from IPFS using hls.js.

=== Usage ===
<pre>{{HLSVideo|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}</pre>

=== Parameters ===
* '''cid''' - Required. The IPFS CID containing the HLS directory (must have master.m3u8)
* '''width''' - Optional. Video width (default: 100%)
* '''height''' - Optional. Video height (default: auto)
* '''gateway''' - Optional. IPFS gateway URL (default: https://ipfs.maybelle.cryptograss.live/ipfs)

=== Example ===
{{HLSVideo|cid=QmXet6QwZ7qdtDn89Kn4fzdm7LugpcmQoSzchdij4V3DLB}}
</noinclude><includeonly><div class="hls-video-container" style="width: {{{width|100%}}}; max-width: 800px;">
<video id="hls-video-{{{cid}}}" controls playsinline style="width: 100%; height: {{{height|auto}}}; background: #000;"></video>
<script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
<script>
(function() {
var video = document.getElementById('hls-video-{{{cid}}}');
var src = '{{{gateway|https://ipfs.maybelle.cryptograss.live/ipfs}}}/{{{cid}}}/master.m3u8';

if (video.canPlayType('application/vnd.apple.mpegurl')) {
// Native HLS support (Safari)
video.src = src;
} else if (Hls.isSupported()) {
var hls = new Hls();
hls.loadSource(src);
hls.attachMedia(video);
} else {
video.parentElement.innerHTML = '<p style="color: red;">HLS not supported in this browser</p>';
}
})();
</script>
</div></includeonly>