CopyBot/mediacms
1
0
Fork 0
mirror of https://github.com/mediacms-io/mediacms.git synced 2026-01-20 15:22:58 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat: add showUserAvatar option to video player and embed UI

Browse Source 
- Added 'showUserAvatar' parameter to control author avatar visibility in embed info overlay
- Implemented UI toggle in MediaShareEmbed for the 'showUserAvatar' option
- Propagated 'showUserAvatar' through EmbedPage, VideoViewer, and VideoJSEmbed
- Updated test iframe index with all 8 combinations of showTitle, showRelated, and showUserAvatar
This commit is contained in:
Yiannis Christodoulou
2026-01-07 12:54:43 +02:00
parent 54121df1ae
commit 4b06cabf93
9 changed files with 191 additions and 148 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
frontend/src/static/js/components/media-actions/MediaShareEmbed.jsx
View File

@@ -21,6 +21,7 @@ export function MediaShareEmbed(props) {
const [keepAspectRatio, setKeepAspectRatio] = useState(false);
const [showTitle, setShowTitle] = useState(false);
const [showRelated, setShowRelated] = useState(true);
const [showUserAvatar, setShowUserAvatar] = useState(true);
const [aspectRatio, setAspectRatio] = useState('16:9');
const [embedWidthValue, setEmbedWidthValue] = useState(embedVideoDimensions.width);
const [embedWidthUnit, setEmbedWidthUnit] = useState(embedVideoDimensions.widthUnit);
@@ -102,6 +103,10 @@ export function MediaShareEmbed(props) {
setShowRelated(!showRelated);
}
function onShowUserAvatarChange() {
setShowUserAvatar(!showUserAvatar);
}
function onAspectRatioChange() {
const newVal = aspectRatioValueRef.current.value;
@@ -147,8 +152,8 @@ export function MediaShareEmbed(props) {
<div className="media-embed-wrap">
<SiteConsumer>
{(site) => <>
{/* <VideoViewer key={`embed-${showTitle}-${showRelated}`} data={MediaPageStore.get('media-data')} siteUrl={site.url} inEmbed={true} showTitle={showTitle} showRelated={showRelated} /> */}
<iframe width="100%" height="480px" src={`${links.embed + MediaPageStore.get('media-id')}&showTitle=${showTitle ? '1' : '0'}&showRelated=${showRelated ? '1' : '0'}`} frameborder="0" allowfullscreen></iframe>
{/* <VideoViewer key={`embed-${showTitle}-${showRelated}-${showUserAvatar}`} data={MediaPageStore.get('media-data')} siteUrl={site.url} inEmbed={true} showTitle={showTitle} showRelated={showRelated} showUserAvatar={showUserAvatar} /> */}
<iframe width="100%" height="480px" src={`${links.embed + MediaPageStore.get('media-id')}&showTitle=${showTitle ? '1' : '0'}&showRelated=${showRelated ? '1' : '0'}&showUserAvatar=${showUserAvatar ? '1' : '0'}`} frameborder="0" allowfullscreen></iframe>
</>}
</SiteConsumer>
</div>
@@ -182,6 +187,7 @@ export function MediaShareEmbed(props) {
(links.embed.includes('?') ? '&' : '?') +
'showTitle=' + (showTitle ? '1' : '0') +
'&showRelated=' + (showRelated ? '1' : '0') +
'&showUserAvatar=' + (showUserAvatar ? '1' : '0') +
'" frameborder="0" allowfullscreen></iframe>'
}
></textarea>
@@ -210,6 +216,13 @@ export function MediaShareEmbed(props) {
</label>
</div>
<div className="options-group">
<label style={{ minHeight: '36px' }}>
<input type="checkbox" checked={showUserAvatar} onChange={onShowUserAvatarChange} />
Show user avatar
</label>
</div>
<div className="options-group">
<label style={{ minHeight: '36px' }}>
<input type="checkbox" checked={keepAspectRatio} onChange={onKeepAspectRatioChange} />