SuperSeriousBusiness/GoToSocial
1
1
Fork 0
mirror of https://github.com/superseriousbusiness/gotosocial synced 2025-06-05 21:59:39 +02:00
Code Issues Projects Releases Wiki Activity

[feature] Enable basic video support (mp4 only) (#1274)

Browse Source 
* [feature] basic video support

* fix missing semicolon

* replace text shadow with stacked icons

Co-authored-by: f0x <f0x@cthu.lu>
This commit is contained in:
tobi
2022-12-17 05:38:56 +01:00
committed by GitHub
parent 0f38e7c9b0
commit 2bbc64be43
39 changed files with 6276 additions and 93 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
web/source/css/status.css
View File

@ -232,6 +232,9 @@ main {
}
input.sensitive-checkbox:checked { /* Media is shown */
& ~ .video-play {
display: flex;
}
& ~ .sensitive {
.closed {
transition: 0.8s;
@ -256,6 +259,32 @@ main {
}
}
.video-play {
.icon-span {
align-self: center;
display: initial;
z-index: 4;
.icon {
color: $white1;
}
.icon-bg {
color: $gray1;
font-size: 1.1em;
}
}
display: none;
position: absolute;
height: 100%;
width: 100%;
justify-content: center;
align-items: center;
font-size: 7em;
pointer-events: none;
}
.sensitive {
position: absolute;
height: 100%;
@ -412,4 +441,4 @@ footer + div { /* something weird from the devstack.. */
grid-row: auto;
}
}
}
}

8
web/source/frontend/index.js
View File

@ -21,6 +21,7 @@
const Photoswipe = require("photoswipe/dist/umd/photoswipe.umd.min.js");
const PhotoswipeLightbox = require("photoswipe/dist/umd/photoswipe-lightbox.umd.min.js");
const PhotoswipeCaptionPlugin = require("photoswipe-dynamic-caption-plugin").default;
const PhotoswipeVideoPlugin = require("photoswipe-video-plugin").default;
let [_, _user, type, id] = window.location.pathname.split("/");
if (type == "statuses") {
@ -39,6 +40,7 @@ const lightbox = new PhotoswipeLightbox({
new PhotoswipeCaptionPlugin(lightbox, {
type: 'auto',
});
new PhotoswipeVideoPlugin(lightbox, {});
lightbox.init();
@ -46,14 +48,14 @@ Array.from(document.getElementsByClassName("spoiler-label")).forEach((label) =>
let checkbox = document.getElementById(label.htmlFor);
if (checkbox != undefined) {
function update() {
if(checkbox.checked) {
if (checkbox.checked) {
label.innerHTML = "Show more";
} else {
label.innerHTML = "Show less";
}
}
update();
label.addEventListener("click", () => {setTimeout(update, 1);});
label.addEventListener("click", () => { setTimeout(update, 1); });
}
});

1
web/source/package.json
View File

@ -22,6 +22,7 @@
"modern-normalize": "^1.1.0",
"photoswipe": "^5.3.3",
"photoswipe-dynamic-caption-plugin": "^1.2.7",
"photoswipe-video-plugin": "^1.0.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-error-boundary": "^3.1.4",

5
web/source/yarn.lock
View File

@ -4201,6 +4201,11 @@ photoswipe-dynamic-caption-plugin@^1.2.7:
resolved "https://registry.yarnpkg.com/photoswipe-dynamic-caption-plugin/-/photoswipe-dynamic-caption-plugin-1.2.7.tgz#53aa5059f1c4dccc8aa36196ff3e09baa5e537c2"
integrity sha512-5XXdXLf2381nwe7KqQvcyStiUBi9TitYXppUQTrzPwYAi4lZsmWNnNKMclM7I4QGlX6fXo42v3bgb6rlK9pY1Q==
photoswipe-video-plugin@^1.0.2:
version "1.0.2"
resolved "https://registry.yarnpkg.com/photoswipe-video-plugin/-/photoswipe-video-plugin-1.0.2.tgz#156b6a72ffa86e6c6e2b486e8ec5b48f6696941a"
integrity sha512-skNHaalLU7rptZ3zq4XfS5hPqSDD65ctvpf2X8buvC8BpOt6XKSIgRkLzTwgQOUm9yQ8kQ4mMget7CIqGcqtDg==
photoswipe@^5.3.3:
version "5.3.3"
resolved "https://registry.yarnpkg.com/photoswipe/-/photoswipe-5.3.3.tgz#86351a33502a3ab7d1e483127fe596b20054218a"