Files
jiapu/dist/public/js/media-display.js
T

2 lines
5.0 KiB
JavaScript

(function(o,d){if(typeof module=="object"&&module.exports){module.exports=d(o);return}o.MediaDisplay=d(o),o.document&&o.document.addEventListener("DOMContentLoaded",function(){o.MediaDisplay.init(o.document)})})(typeof globalThis!="undefined"?globalThis:window,function(o){"use strict";function d(a){return a==null?"":String(a)}function l(a){return d(a).replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function b(a){var e;return a==null||a===""||typeof a=="number"&&!Number.isSafeInteger(a)?"":(e=String(a).trim(),/^[1-9][0-9]*$/.test(e)?e:"")}function f(a){var e;try{e=new URL(d(a).trim())}catch(i){return""}return e.protocol==="https:"||e.protocol==="http:"?e.href:""}function c(a){var e=a||{},i=f(e.accessUrl),r=b(e.fileId),t,n;return!i||e.fileId!==void 0&&e.fileId!==null&&e.fileId!==""&&!r?null:(n={fileId:r,fileName:d(e.fileName).trim(),mediaType:d(e.mediaType).trim().toLowerCase(),accessUrl:i,expiresAt:d(e.expiresAt).trim()},t=Number(e.fileSize),e.fileSize!==void 0&&e.fileSize!==null&&e.fileSize!==""&&Number.isSafeInteger(t)&&t>=0&&(n.fileSize=t),n.fileId||delete n.fileId,n.fileName||delete n.fileName,n.mediaType||delete n.mediaType,n.expiresAt||delete n.expiresAt,n)}function m(a){return Array.isArray(a)?a.map(c).filter(Boolean):[]}function u(a,e){var i=d(e).split(/\s+/).filter(function(r){return/^[a-zA-Z][a-zA-Z0-9_-]*$/.test(r)});return[a].concat(i).join(" ")}function p(a,e){var i=c(a),r=e||{},t,n,s;return i?(t=d(r.alt||i.fileName||"图片").trim(),n=r.eager===!0?"eager":"lazy",s=d(r.caption).trim(),'<figure class="'+l(u("media-frame",r.className))+'" data-media-kind="image"><button class="media-preview" type="button" data-media-preview-url="'+l(i.accessUrl)+'" data-media-preview-alt="'+l(t)+'"><img src="'+l(i.accessUrl)+'" alt="'+l(t)+'" loading="'+n+'" decoding="async" /></button><span class="media-fallback" hidden>图片暂时无法显示</span>'+(s?"<figcaption>"+l(s)+"</figcaption>":"")+"</figure>"):""}function y(a,e){var i=c(a),r=e||{},t=d(r.name||"用户").trim()||"用户",n=Array.from(t)[0]||"家",s=u("media-avatar",r.className);return i?'<span class="'+l(s)+'"><img src="'+l(i.accessUrl)+'" alt="'+l(t+"的头像")+'" loading="lazy" decoding="async" /><span class="media-avatar-fallback" aria-hidden="true">'+l(n)+"</span></span>":'<span class="'+l(s)+'" aria-label="'+l(t+"的头像")+'">'+l(n)+"</span>"}function g(a,e){var i=c(a),r=e||{},t=c(r.posterFile),n;return i?(n=d(r.title||i.fileName||"家族视频").trim(),'<figure class="'+l(u("media-frame media-video",r.className))+'" data-media-kind="video"><video controls preload="metadata" src="'+l(i.accessUrl)+'"'+(t?' poster="'+l(t.accessUrl)+'"':"")+' aria-label="'+l(n)+'"></video><span class="media-fallback" hidden>视频暂时无法播放</span>'+(r.caption?"<figcaption>"+l(r.caption)+"</figcaption>":"")+"</figure>"):""}function A(a){var e=d(a&&a.mediaType).toLowerCase();return e.indexOf("image/")===0?"image":e.indexOf("video/")===0?"video":"file"}function w(a){var e=a.fileName||"附件";return'<a class="media-download" href="'+l(a.accessUrl)+'" target="_blank" rel="noopener noreferrer" download>下载 '+l(e)+"</a>"}function N(a,e){var i=m(a),r=e||{},t=d(r.label||"媒体附件").trim(),n;return i.length?(n=i.map(function(s){var v=A(s);return v==="image"?p(s,{alt:s.fileName||t}):v==="video"?g(s,{title:s.fileName||t}):w(s)}).join(""),'<div class="'+l(u("media-gallery",r.className))+'" role="group" aria-label="'+l(t)+'">'+n+"</div>"):""}function z(a){var e=a.querySelector("[data-media-preview-dialog]"),i;return e||(e=a.createElement("dialog"),e.className="media-dialog",e.setAttribute("data-media-preview-dialog",""),e.setAttribute("aria-label","图片预览"),e.innerHTML='<button class="media-dialog-close" type="button" aria-label="关闭图片预览">关闭</button><img alt="" data-media-dialog-image />',a.body.appendChild(e),i=e.querySelector(".media-dialog-close"),i.addEventListener("click",function(){typeof e.close=="function"?e.close():e.removeAttribute("open")}),e.addEventListener("click",function(r){r.target===e&&(typeof e.close=="function"?e.close():e.removeAttribute("open"))}),e)}function h(a){!a||a.documentElement.getAttribute("data-media-display-ready")==="true"||(a.documentElement.setAttribute("data-media-display-ready","true"),a.addEventListener("error",function(e){var i=e.target,r,t;!i||!/^(IMG|VIDEO)$/.test(i.tagName)||(r=i.closest&&i.closest(".media-frame, .media-avatar"),r&&(r.classList.add("is-media-error"),i.hidden=!0,t=r.querySelector(".media-fallback, .media-avatar-fallback"),t&&(t.hidden=!1)))},!0),a.addEventListener("click",function(e){var i=e.target.closest&&e.target.closest("[data-media-preview-url]"),r,t,n;i&&(n=f(i.getAttribute("data-media-preview-url")),n&&(r=z(a),t=r.querySelector("[data-media-dialog-image]"),t.src=n,t.alt=i.getAttribute("data-media-preview-alt")||"图片预览",typeof r.showModal=="function"?r.showModal():r.setAttribute("open","")))}))}return{normalizeFileAccess:c,normalizeFileList:m,renderImage:p,renderAvatar:y,renderVideo:g,renderGallery:N,init:h}});