gifv support?

This commit is contained in:
anarch3 2022-11-18 17:08:26 -05:00
parent cfb29c8598
commit f4acf57fde
5 changed files with 59 additions and 2 deletions

View file

@ -90,3 +90,27 @@ div.nonmedia p {
label {
text-align: center;
}
.video {
position: relative;
}
.video .overlay {
position: absolute;
top: 0%;
left: 70%;
transform: translateY(0%) translateX(70%);
z-index: 1;
border-radius: 25px;
border: 2px solid #73AD21;
padding: 5px;
background-color: #eee;
}
.video .overlay a {
color: #73AD21;
font-size: 12px;
font-weight: 400;
line-height: 20px;
text-align: center;
}

View file

@ -9,6 +9,15 @@ function copyURI(evt) {
});
}
function copyA(evt) {
evt.preventDefault();
navigator.clipboard.writeText(absolutePath(evt.target.getAttribute('href'))).then(() => {
console.log("copied");
}, () => {
console.log("failed");
});
}
function copyPath(evt) {
navigator.clipboard.writeText(absolutePath(evt)).then(() => {
console.log("copied");

View file

@ -103,6 +103,11 @@ router.get('/', function (req, res, next) {
res.render('index', { user: req.user });
});
router.get('/gifv/:file', function (req, res, next) {
let url = req.protocol + '://' + req.get('host') + '/uploads/' + req.params.file;
return res.render('gifv', { url: url });
});
router.post('/', upload.array('fileupload'), function(req, res, next) {
if (!req.files || Object.keys(req.files).length === 0) {
console.log(req)
@ -138,7 +143,6 @@ router.post('/sharex', [checkAuth, upload.array('fileupload')], function(req, re
}
});
router.post('/:id(\\d+)/delete', function(req, res, next) {
db.all('SELECT path FROM media WHERE id = ?', [ req.params.id ], function(err, path) {
if (err) { return next(err); }

14
views/gifv.ejs Normal file
View file

@ -0,0 +1,14 @@
<!DOCTYPE html>
<html>
<head>
<meta property="og:type" content="video.other">
<meta property="twitter:player" content="<%= url %>">
<meta property="og:video:type" content="text/html">
<!--<meta property="og:video:width" content="<%# width %>">
<meta property="og:video:height" content="<%# height %>">
<meta name="twitter:image" content="<%# thumbnail %>">-->
</head>
<body>
<video autoplay loop muted playsinline class="image" src="<%= url %>" width="100%"></video>
</body>
</html>

View file

@ -49,7 +49,13 @@ return string.slice((string.lastIndexOf(".") - 2 >>> 0) + 2);
<form action="<%= file.url %>" method="post">
<div class="view">
<% if (extension(file.path) == ".mp4" || extension(file.path) == ".mov" || extension(file.path) == "webp") { %>
<video autoplay loop muted playsinline class="image" src="/uploads/<%=file.path %>" width="100%" onclick="copyURI(event)"></video>
<div class="video">
<video class="image" autoplay loop muted playsinline>
<source src="/uploads/<%= file.path %>">
</video>
<div class="overlay">
<a href="/gifv/<%=file.path %>" onclick="copyA(event)">Copy as GIFv</a>
</div>
<% } else if (extension(file.path) == ".jpg" || extension(file.path) == ".jpeg" || extension(file.path) == ".png" || extension(file.path) == ".gif" || extension(file.path) == ".webp" ) { %>
<img class="image" src="/uploads/<%=file.path %>" width="100%" onclick="copyURI(event)">
<% } else {%> <!-- non-media file -->