mirror of
https://github.com/mediacms-io/mediacms.git
synced 2025-12-08 05:02:30 -05:00
feat: Frontend Dependencies Upgrade +Fix Timestamps in videos
This commit is contained in:
Yiannis Christodoulou
committed by
GitHub
GitHub
parent
d1fda05fdc
commit
20f305e69e
28290
frontend/package-lock.json
generated
28290
frontend/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -14,34 +14,34 @@
|
||||
"cover 99.5%"
|
||||
],
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.14.5",
|
||||
"@babel/preset-env": "^7.14.5",
|
||||
"@babel/preset-react": "^7.14.5",
|
||||
"@types/react": "^17.0.11",
|
||||
"@types/react-dom": "^17.0.7",
|
||||
"autoprefixer": "^10.2.6",
|
||||
"babel-loader": "^8.2.2",
|
||||
"compass-mixins": "^0.12.10",
|
||||
"copy-webpack-plugin": "^9.0.0",
|
||||
"core-js": "^3.14.0",
|
||||
"css-loader": "^5.2.6",
|
||||
"dotenv": "^10.0.0",
|
||||
"ejs": "^3.1.6",
|
||||
"@babel/core": "^7.26.9",
|
||||
"@babel/preset-env": "^7.26.9",
|
||||
"@babel/preset-react": "^7.26.3",
|
||||
"@types/react": "^19.0.10",
|
||||
"@types/react-dom": "^19.0.4",
|
||||
"autoprefixer": "^10.4.21",
|
||||
"babel-loader": "^10.0.0",
|
||||
"compass-mixins": "^0.12.12",
|
||||
"copy-webpack-plugin": "^13.0.0",
|
||||
"core-js": "^3.41.0",
|
||||
"css-loader": "^7.1.2",
|
||||
"dotenv": "^16.4.7",
|
||||
"ejs": "^3.1.10",
|
||||
"ejs-compiled-loader": "^3.1.0",
|
||||
"mediacms-scripts": "file:packages/scripts",
|
||||
"postcss-loader": "^6.1.0",
|
||||
"prettier": "^2.3.1",
|
||||
"prop-types": "^15.7.2",
|
||||
"sass": "^1.34.1",
|
||||
"sass-loader": "^12.1.0",
|
||||
"ts-loader": "^9.2.3",
|
||||
"typescript": "^4.3.2",
|
||||
"postcss-loader": "^8.1.1",
|
||||
"prettier": "^3.5.3",
|
||||
"prop-types": "^15.8.1",
|
||||
"sass": "^1.85.1",
|
||||
"sass-loader": "^16.0.5",
|
||||
"ts-loader": "^9.5.2",
|
||||
"typescript": "^5.8.2",
|
||||
"url-loader": "^4.1.1",
|
||||
"webpack": "^5.38.1"
|
||||
"webpack": "^5.98.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"axios": "^0.21.1",
|
||||
"flux": "^4.0.1",
|
||||
"axios": "^1.8.2",
|
||||
"flux": "^4.0.4",
|
||||
"mediacms-player": "file:packages/player",
|
||||
"normalize.css": "^8.0.1",
|
||||
"react": "^17.0.2",
|
||||
@@ -49,10 +49,9 @@
|
||||
"react-mentions": "^4.3.1",
|
||||
"sortablejs": "^1.13.0",
|
||||
"timeago.js": "^4.0.2",
|
||||
"url-parse": "^1.5.1",
|
||||
"pdfjs-dist": "^3.4.120",
|
||||
"url-parse": "^1.5.10",
|
||||
"pdfjs-dist": "3.4.120",
|
||||
"@react-pdf-viewer/core": "^3.9.0",
|
||||
"@react-pdf-viewer/default-layout": "^3.12.0"
|
||||
|
||||
"@react-pdf-viewer/default-layout": "^3.9.0"
|
||||
}
|
||||
}
|
||||
|
||||
5124
frontend/packages/player/dist/mediacms-player.js
vendored
5124
frontend/packages/player/dist/mediacms-player.js
vendored
File diff suppressed because it is too large
Load Diff
20010
frontend/packages/player/package-lock.json
generated
20010
frontend/packages/player/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -47,7 +47,7 @@
|
||||
"css-loader": "^5.2.6",
|
||||
"global": "^4.4.0",
|
||||
"json-loader": "^0.5.7",
|
||||
"node-sass": "^6.0.0",
|
||||
"sass": "^1.85.1",
|
||||
"postcss": "^8.3.2",
|
||||
"rollup": "^2.51.2",
|
||||
"rollup-plugin-babel": "^4.3.3",
|
||||
|
||||
104
frontend/packages/scripts/dist/webpack-dev-env.js
vendored
104
frontend/packages/scripts/dist/webpack-dev-env.js
vendored
@@ -3,24 +3,28 @@
|
||||
Object.defineProperty(exports, '__esModule', { value: true });
|
||||
|
||||
var __assign = function() {
|
||||
__assign = Object.assign || function __assign(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
__assign = Object.assign || function __assign(t) {
|
||||
for (var s, i = 1, n = arguments.length; i < n; i++) {
|
||||
s = arguments[i];
|
||||
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
|
||||
}
|
||||
return t;
|
||||
};
|
||||
return __assign.apply(this, arguments);
|
||||
};
|
||||
function __spreadArray(to, from, pack) {
|
||||
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
||||
if (ar || !(i in from)) {
|
||||
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
||||
ar[i] = from[i];
|
||||
}
|
||||
}
|
||||
return to.concat(ar || from);
|
||||
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
|
||||
if (ar || !(i in from)) {
|
||||
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
|
||||
ar[i] = from[i];
|
||||
}
|
||||
}
|
||||
return to.concat(ar || Array.prototype.slice.call(from));
|
||||
}
|
||||
typeof SuppressedError === "function" ? SuppressedError : function (error, suppressed, message) {
|
||||
var e = new Error(message);
|
||||
return e.name = "SuppressedError", e.error = error, e.suppressed = suppressed, e;
|
||||
};
|
||||
|
||||
function bodySnippet(id) {
|
||||
return '<div id="' + id + '"></div>';
|
||||
@@ -139,44 +143,44 @@ var config$2 = {
|
||||
optimization: {
|
||||
runtimeChunk: false,
|
||||
/*splitChunks: {
|
||||
// minSize: 1000000,
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
},*/
|
||||
// minSize: 1000000,
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
},*/
|
||||
/*splitChunks: {
|
||||
// minSize: 1000000,
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_0,
|
||||
},*/
|
||||
// minSize: 1000000,
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_0,
|
||||
},*/
|
||||
/*splitChunks: {
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_1,
|
||||
},*/
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_1,
|
||||
},*/
|
||||
/*splitChunks: {
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_2,
|
||||
},*/
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_2,
|
||||
},*/
|
||||
/*splitChunks: {
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_3,
|
||||
},*/
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: chunksCacheGroups_3,
|
||||
},*/
|
||||
splitChunks: {
|
||||
chunks: 'all',
|
||||
automaticNameDelimiter: '-',
|
||||
cacheGroups: {
|
||||
vendors: {
|
||||
test: /[\\/]node_modules[\\/]/,
|
||||
name: "_commons",
|
||||
name: '_commons',
|
||||
priority: 1,
|
||||
chunks: "initial",
|
||||
chunks: 'initial',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
/*const chunksCacheGroups_0 = {
|
||||
@@ -241,13 +245,13 @@ var config$1 = {
|
||||
cacheGroups: {
|
||||
vendors: {
|
||||
test: /[\\/]node_modules[\\/]/,
|
||||
name: "_commons",
|
||||
name: '_commons',
|
||||
priority: 1,
|
||||
chunks: "initial",
|
||||
chunks: 'initial',
|
||||
},
|
||||
},
|
||||
},
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
@@ -307,7 +311,7 @@ function pagesConfig(pagesKeys) {
|
||||
head: {},
|
||||
body: {
|
||||
scripts: [],
|
||||
snippet: sitemapTemplate({ pages: __spreadArray(__spreadArray([], pagesKeys), Object.keys(pages)) }),
|
||||
snippet: sitemapTemplate({ pages: __spreadArray(__spreadArray([], pagesKeys, true), Object.keys(pages), true) }),
|
||||
},
|
||||
},
|
||||
window: {},
|
||||
@@ -649,7 +653,9 @@ function analyzer(analyzerOptions) {
|
||||
statsFilename: 'analyzer-stats.json',
|
||||
reportFilename: 'analyzer-report.html',
|
||||
};
|
||||
var compiler = 'dist' === options.env ? webpack$2(__assign(__assign({}, config$1), config)) : webpack$2(__assign(__assign({}, config$2), config));
|
||||
var compiler = 'dist' === options.env
|
||||
? webpack$2(__assign(__assign({}, config$1), config))
|
||||
: webpack$2(__assign(__assign({}, config$2), config));
|
||||
var analyzer = new BundleAnalyzerPlugin(analyzerConfig);
|
||||
analyzer.apply(compiler);
|
||||
compiler.run(function (err, stats) {
|
||||
@@ -697,7 +703,9 @@ function build(buildOptions) {
|
||||
throw Error('"postcssConfigFile" is not an absolute path');
|
||||
}
|
||||
var config = generateConfig(options.env, options.config);
|
||||
var compiler = 'dist' === options.env ? webpack$1(__assign(__assign({}, config$1), config)) : webpack$1(__assign(__assign({}, config$2), config));
|
||||
var compiler = 'dist' === options.env
|
||||
? webpack$1(__assign(__assign({}, config$1), config))
|
||||
: webpack$1(__assign(__assign({}, config$2), config));
|
||||
compiler.run(function (err, stats) {
|
||||
if (err)
|
||||
throw err;
|
||||
@@ -728,8 +736,8 @@ var config = {
|
||||
// devtool: 'source-map',
|
||||
// devtool: 'eval-cheap-source-map',
|
||||
optimization: {
|
||||
minimize: false
|
||||
}
|
||||
minimize: false,
|
||||
},
|
||||
};
|
||||
|
||||
function configFunc(contentBase) {
|
||||
@@ -739,7 +747,7 @@ function configFunc(contentBase) {
|
||||
},
|
||||
contentBase: contentBase,
|
||||
compress: true,
|
||||
hot: true
|
||||
hot: true,
|
||||
};
|
||||
}
|
||||
|
||||
|
||||
19334
frontend/packages/scripts/package-lock.json
generated
19334
frontend/packages/scripts/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -36,14 +36,15 @@
|
||||
"cross-spawn": "^7.0.3",
|
||||
"dotenv": "^10.0.0",
|
||||
"rimraf": "^3.0.2",
|
||||
"rollup": "^2.51.2",
|
||||
"rollup": "^2.79.1",
|
||||
"rollup-plugin-cleanup": "^3.2.1",
|
||||
"rollup-plugin-typescript2": "^0.30.0",
|
||||
"rollup-plugin-typescript2": "^0.34.1",
|
||||
"rollup-plugin-visualizer": "^5.5.0",
|
||||
"serialize-javascript": "^5.0.1",
|
||||
"source-map-loader": "^3.0.0",
|
||||
"ts-loader": "^9.2.3",
|
||||
"typescript": "^4.3.2"
|
||||
"tslib": "^2.6.2",
|
||||
"typescript": "^4.9.5"
|
||||
},
|
||||
"dependencies": {
|
||||
"@svgr/webpack": "^5.5.0",
|
||||
@@ -64,7 +65,6 @@
|
||||
"lodash.merge": "^4.6.2",
|
||||
"mini-css-extract-plugin": "^1.6.0",
|
||||
"node-polyfill-webpack-plugin": "^1.1.2",
|
||||
"node-sass": "^6.0.0",
|
||||
"postcss": "^8.3.2",
|
||||
"postcss-import": "^14.0.2",
|
||||
"postcss-loader": "^6.1.0",
|
||||
@@ -72,6 +72,7 @@
|
||||
"postcss-nested": "^5.0.5",
|
||||
"postcss-scss": "^3.0.5",
|
||||
"progress-bar-webpack-plugin": "^2.1.0",
|
||||
"sass": "^1.85.1",
|
||||
"sass-loader": "^12.1.0",
|
||||
"style-loader": "^2.0.0",
|
||||
"url-loader": "^4.1.1",
|
||||
|
||||
4644
frontend/packages/vjs-plugin-font-icons/package-lock.json
generated
4644
frontend/packages/vjs-plugin-font-icons/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -30,7 +30,7 @@
|
||||
"load-grunt-tasks": "^5.1.0",
|
||||
"lodash": "^4.17.21",
|
||||
"material-design-icons": "^3.0.1",
|
||||
"node-sass": "^6.0.0",
|
||||
"sass": "^1.85.1",
|
||||
"rimraf": "^3.0.2",
|
||||
"time-grunt": "^2.0.0",
|
||||
"webfonts-generator": "^0.4.0"
|
||||
|
||||
5953
frontend/packages/vjs-plugin/package-lock.json
generated
5953
frontend/packages/vjs-plugin/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@@ -42,7 +42,7 @@
|
||||
"core-js": "^3.14.0",
|
||||
"global": "^4.4.0",
|
||||
"minami": "^1.2.3",
|
||||
"node-sass": "^6.0.0",
|
||||
"sass": "^1.85.1",
|
||||
"postcss": "^8.3.2",
|
||||
"rimraf": "^3.0.2",
|
||||
"rollup": "^2.51.2",
|
||||
|
||||
@@ -3024,6 +3024,12 @@ function generatePlugin() {
|
||||
MediaCmsVjsPlugin.VERSION = VERSION;
|
||||
|
||||
videojs.registerPlugin('mediaCmsVjsPlugin', MediaCmsVjsPlugin);
|
||||
|
||||
if (typeof videojs.registerPlugin === 'function') {
|
||||
videojs.registerPlugin('mediaCmsVjsPlugin', MediaCmsVjsPlugin);
|
||||
} else {
|
||||
videojs.plugin('mediaCmsVjsPlugin', MediaCmsVjsPlugin);
|
||||
}
|
||||
|
||||
return MediaCmsVjsPlugin;
|
||||
}
|
||||
|
||||
@@ -7,9 +7,10 @@ interface MediaListRowProps {
|
||||
viewAllText?: string;
|
||||
className?: string;
|
||||
style?: { [key: string]: any };
|
||||
children?: React.ReactNode;
|
||||
}
|
||||
|
||||
export const MediaListRow: React.FC<MediaListRowProps> = (props) => {
|
||||
export const MediaListRow: React.FC<MediaListRowProps> = (props:any) => {
|
||||
return (
|
||||
<div className={(props.className ? props.className + ' ' : '') + 'media-list-row'} style={props.style}>
|
||||
{props.title ? (
|
||||
|
||||
@@ -11,7 +11,7 @@ import { replaceString } from '../../utils/helpers/';
|
||||
|
||||
import './videojs-markers.js';
|
||||
import './videojs.markers.css';
|
||||
import {enableMarkers, addMarker} from './videojs-markers_config.js'
|
||||
import { enableMarkers, addMarker } from './videojs-markers_config.js';
|
||||
import { translateString } from '../../utils/helpers/';
|
||||
|
||||
import './Comments.scss';
|
||||
@@ -39,7 +39,7 @@ function CommentForm(props) {
|
||||
? null
|
||||
: LinksContext._currentValue.signin +
|
||||
'?next=/' +
|
||||
window.location.href.replace(SiteContext._currentValue.url, '').replace(/^\//g, '')
|
||||
window.location.href.replace(SiteContext._currentValue.url, '').replace(/^\//g, ''),
|
||||
);
|
||||
|
||||
function onFocus() {
|
||||
@@ -50,12 +50,11 @@ function CommentForm(props) {
|
||||
setTextareaFocused(false);
|
||||
}
|
||||
|
||||
function onUsersLoad()
|
||||
{
|
||||
const userList =[...MediaPageStore.get('users')];
|
||||
const cleanList = []
|
||||
userList.forEach(user => {
|
||||
cleanList.push({id : user.username, display : user.name});
|
||||
function onUsersLoad() {
|
||||
const userList = [...MediaPageStore.get('users')];
|
||||
const cleanList = [];
|
||||
userList.forEach((user) => {
|
||||
cleanList.push({ id: user.username, display: user.name });
|
||||
});
|
||||
|
||||
setUsersList(cleanList);
|
||||
@@ -125,16 +124,14 @@ function CommentForm(props) {
|
||||
useEffect(() => {
|
||||
MediaPageStore.on('comment_submit', onCommentSubmit);
|
||||
MediaPageStore.on('comment_submit_fail', onCommentSubmitFail);
|
||||
if (MediaCMS.features.media.actions.comment_mention === true)
|
||||
{
|
||||
if (MediaCMS.features.media.actions.comment_mention === true) {
|
||||
MediaPageStore.on('users_load', onUsersLoad);
|
||||
}
|
||||
|
||||
return () => {
|
||||
MediaPageStore.removeListener('comment_submit', onCommentSubmit);
|
||||
MediaPageStore.removeListener('comment_submit_fail', onCommentSubmitFail);
|
||||
if (MediaCMS.features.media.actions.comment_mention === true)
|
||||
{
|
||||
if (MediaCMS.features.media.actions.comment_mention === true) {
|
||||
MediaPageStore.removeListener('users_load', onUsersLoad);
|
||||
}
|
||||
};
|
||||
@@ -146,33 +143,31 @@ function CommentForm(props) {
|
||||
<UserThumbnail />
|
||||
<div className="form">
|
||||
<div className={'form-textarea-wrap' + (textareaFocused ? ' focused' : '')}>
|
||||
{ MediaCMS.features.media.actions.comment_mention ?
|
||||
{MediaCMS.features.media.actions.comment_mention ? (
|
||||
<MentionsInput
|
||||
inputRef={textareaRef}
|
||||
className="form-textarea"
|
||||
rows="1"
|
||||
placeholder={translateString('Add a ') + commentsText.single + '...'}
|
||||
placeholder={'Add a ' + commentsText.single + '...'}
|
||||
value={value}
|
||||
onChange={onChangeWithMention}
|
||||
onFocus={onFocus}
|
||||
onBlur={onBlur}>
|
||||
<Mention
|
||||
data={userList}
|
||||
markup="@(___id___)[___display___]"
|
||||
/>
|
||||
onBlur={onBlur}
|
||||
>
|
||||
<Mention data={userList} markup="@(___id___)[___display___]" />
|
||||
</MentionsInput>
|
||||
:
|
||||
) : (
|
||||
<textarea
|
||||
ref={textareaRef}
|
||||
className="form-textarea"
|
||||
rows="1"
|
||||
placeholder={translateString('Add a ') + commentsText.single + '...'}
|
||||
placeholder={'Add a ' + commentsText.single + '...'}
|
||||
value={value}
|
||||
onChange={onChange}
|
||||
onFocus={onFocus}
|
||||
onBlur={onBlur}
|
||||
></textarea>
|
||||
}
|
||||
)}
|
||||
</div>
|
||||
<div className="form-buttons">
|
||||
<button className={'' === value.trim() ? 'disabled' : ''} onClick={submitComment}>
|
||||
@@ -239,7 +234,9 @@ function CommentActions(props) {
|
||||
{MemberContext._currentValue.can.deleteComment ? (
|
||||
<div className="comment-action remove-comment">
|
||||
<PopupTrigger contentRef={popupContentRef}>
|
||||
<button>{translateString('DELETE')} {commentsText.uppercaseSingle}</button>
|
||||
<button>
|
||||
{translateString('DELETE')} {commentsText.uppercaseSingle}
|
||||
</button>
|
||||
</PopupTrigger>
|
||||
|
||||
<PopupContent contentRef={popupContentRef}>
|
||||
@@ -425,7 +422,7 @@ export default function CommentsList(props) {
|
||||
const [mediaId, setMediaId] = useState(MediaPageStore.get('media-id'));
|
||||
|
||||
const [comments, setComments] = useState(
|
||||
MemberContext._currentValue.can.readComment ? MediaPageStore.get('media-comments') : []
|
||||
MemberContext._currentValue.can.readComment ? MediaPageStore.get('media-comments') : [],
|
||||
);
|
||||
|
||||
const [displayComments, setDisplayComments] = useState(false);
|
||||
@@ -433,67 +430,66 @@ export default function CommentsList(props) {
|
||||
function onCommentsLoad() {
|
||||
const retrievedComments = [...MediaPageStore.get('media-comments')];
|
||||
|
||||
retrievedComments.forEach((comment) => {
|
||||
comment.text = setTimestampAnchors(comment.text);
|
||||
});
|
||||
|
||||
displayCommentsRelatedAlert();
|
||||
setComments([...retrievedComments]);
|
||||
|
||||
// TODO: this code is breaking, beed ti debug, until then removing the extra
|
||||
// functionality related with video/timestamp/user mentions
|
||||
// const video = videojs('vjs_video_3');
|
||||
|
||||
// if (MediaCMS.features.media.actions.timestampTimebar)
|
||||
//{
|
||||
// enableMarkers(video);
|
||||
//}
|
||||
|
||||
//if (MediaCMS.features.media.actions.comment_mention === true)
|
||||
//{
|
||||
// retrievedComments.forEach(comment => {
|
||||
// comment.text = setMentions(comment.text);
|
||||
// });
|
||||
//}
|
||||
|
||||
// TODO: this code is breaking
|
||||
// video.one('loadedmetadata', () => {
|
||||
// retrievedComments.forEach(comment => {
|
||||
// comment.text = setTimestampAnchorsAndMarkers(comment.text, video);
|
||||
// });
|
||||
|
||||
// displayCommentsRelatedAlert();
|
||||
// setComments([...retrievedComments]);
|
||||
//});
|
||||
//setComments([...retrievedComments]);
|
||||
}
|
||||
|
||||
function setMentions(text)
|
||||
{
|
||||
let sanitizedComment = text.split('@(_').join("<a href=\"/user/");
|
||||
sanitizedComment = sanitizedComment.split('_)[_').join("\">");
|
||||
return sanitizedComment.split('_]').join("</a>");
|
||||
}
|
||||
|
||||
function setTimestampAnchorsAndMarkers(text, videoPlayer)
|
||||
{
|
||||
function wrapTimestampWithAnchor(match, string)
|
||||
{
|
||||
let split = match.split(':'), s = 0, m = 1;
|
||||
function setTimestampAnchors(text) {
|
||||
function wrapTimestampWithAnchor(match, string) {
|
||||
let split = match.split(':'),
|
||||
s = 0,
|
||||
m = 1;
|
||||
let searchParameters = new URLSearchParams(window.location.search);
|
||||
|
||||
while (split.length > 0)
|
||||
{
|
||||
s += m * parseInt(split.pop(), 10);
|
||||
m *= 60;
|
||||
}
|
||||
if (MediaCMS.features.media.actions.timestampTimebar)
|
||||
{
|
||||
addMarker(videoPlayer, s, text);
|
||||
while (split.length > 0) {
|
||||
s += m * parseInt(split.pop(), 10);
|
||||
m *= 60;
|
||||
}
|
||||
searchParameters.set('t', s);
|
||||
|
||||
searchParameters.set('t', s)
|
||||
const wrapped = "<a href=\"" + MediaPageStore.get('media-url').split('?')[0] + "?" + searchParameters + "\">" + match + "</a>";
|
||||
let mediaUrl = MediaPageStore.get('media-url').split('?')[0] + '?' + searchParameters;
|
||||
|
||||
const wrapped = '<a href="' + mediaUrl + '">' + match + '</a>';
|
||||
return wrapped;
|
||||
}
|
||||
|
||||
const timeRegex = new RegExp('((\\d)?\\d:)?(\\d)?\\d:\\d\\d', 'g');
|
||||
return text.replace(timeRegex , wrapTimestampWithAnchor);
|
||||
return text.replace(timeRegex, wrapTimestampWithAnchor);
|
||||
}
|
||||
|
||||
function setMentions(text) {
|
||||
let sanitizedComment = text.split('@(_').join('<a href="/user/');
|
||||
sanitizedComment = sanitizedComment.split('_)[_').join('">');
|
||||
return sanitizedComment.split('_]').join('</a>');
|
||||
}
|
||||
|
||||
function setTimestampAnchorsAndMarkers(text, videoPlayer) {
|
||||
function wrapTimestampWithAnchor(match, string) {
|
||||
let split = match.split(':'),
|
||||
s = 0,
|
||||
m = 1;
|
||||
let searchParameters = new URLSearchParams(window.location.search);
|
||||
|
||||
while (split.length > 0) {
|
||||
s += m * parseInt(split.pop(), 10);
|
||||
m *= 60;
|
||||
}
|
||||
if (MediaCMS.features.media.actions.timestampTimebar) {
|
||||
addMarker(videoPlayer, s, text);
|
||||
}
|
||||
|
||||
searchParameters.set('t', s);
|
||||
const wrapped =
|
||||
'<a href="' + MediaPageStore.get('media-url').split('?')[0] + '?' + searchParameters + '">' + match + '</a>';
|
||||
return wrapped;
|
||||
}
|
||||
|
||||
const timeRegex = new RegExp('((\\d)?\\d:)?(\\d)?\\d:\\d\\d', 'g');
|
||||
return text.replace(timeRegex, wrapTimestampWithAnchor);
|
||||
}
|
||||
|
||||
function onCommentSubmit(commentId) {
|
||||
@@ -506,7 +502,7 @@ export default function CommentsList(props) {
|
||||
// FIXME: Without delay creates conflict [ Uncaught Error: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch. ].
|
||||
setTimeout(
|
||||
() => PageActions.addNotification(commentsText.ucfirstSingle + ' submission failed', 'commentSubmitFail'),
|
||||
100
|
||||
100,
|
||||
);
|
||||
}
|
||||
|
||||
@@ -520,7 +516,7 @@ export default function CommentsList(props) {
|
||||
// FIXME: Without delay creates conflict [ Uncaught Error: Dispatch.dispatch(...): Cannot dispatch in the middle of a dispatch. ].
|
||||
setTimeout(
|
||||
() => PageActions.addNotification(commentsText.ucfirstSingle + ' removal failed', 'commentDeleteFail'),
|
||||
100
|
||||
100,
|
||||
);
|
||||
}
|
||||
|
||||
@@ -528,7 +524,7 @@ export default function CommentsList(props) {
|
||||
setDisplayComments(
|
||||
comments.length &&
|
||||
MemberContext._currentValue.can.readComment &&
|
||||
(MediaPageStore.get('media-data').enable_comments || MemberContext._currentValue.can.editMedia)
|
||||
(MediaPageStore.get('media-data').enable_comments || MemberContext._currentValue.can.editMedia),
|
||||
);
|
||||
}, [comments]);
|
||||
|
||||
|
||||
@@ -520,6 +520,6 @@
|
||||
};
|
||||
}
|
||||
|
||||
_video2.default.plugin('markers', registerVideoJsMarkersPlugin);
|
||||
videojs.registerPlugin('markers', registerVideoJsMarkersPlugin);
|
||||
});
|
||||
//# sourceMappingURL=videojs-markers.js.map
|
||||
|
||||
@@ -14,7 +14,7 @@ function metafield(arr) {
|
||||
let sep;
|
||||
let ret = [];
|
||||
|
||||
if (arr.length) {
|
||||
if (arr && arr.length) {
|
||||
i = 0;
|
||||
sep = 1 < arr.length ? ', ' : '';
|
||||
while (i < arr.length) {
|
||||
@@ -50,7 +50,9 @@ function MediaAuthorBanner(props) {
|
||||
</a>
|
||||
</span>
|
||||
{PageStore.get('config-media-item').displayPublishDate && props.published ? (
|
||||
<span className="author-banner-date">{translateString("Published on")} {replaceString(publishedOnDate(new Date(props.published)))}</span>
|
||||
<span className="author-banner-date">
|
||||
{translateString('Published on')} {replaceString(publishedOnDate(new Date(props.published)))}
|
||||
</span>
|
||||
) : null}
|
||||
</div>
|
||||
</div>
|
||||
@@ -78,8 +80,8 @@ function EditMediaButton(props) {
|
||||
}
|
||||
|
||||
return (
|
||||
<a href={link} rel="nofollow" title={translateString("Edit media")} className="edit-media">
|
||||
{translateString("EDIT MEDIA")}
|
||||
<a href={link} rel="nofollow" title={translateString('Edit media')} className="edit-media">
|
||||
{translateString('EDIT MEDIA')}
|
||||
</a>
|
||||
);
|
||||
}
|
||||
@@ -92,8 +94,8 @@ function EditSubtitleButton(props) {
|
||||
}
|
||||
|
||||
return (
|
||||
<a href={link} rel="nofollow" title={translateString("Edit subtitle")} className="edit-subtitle">
|
||||
{translateString("EDIT SUBTITLE")}
|
||||
<a href={link} rel="nofollow" title={translateString('Edit subtitle')} className="edit-subtitle">
|
||||
{translateString('EDIT SUBTITLE')}
|
||||
</a>
|
||||
);
|
||||
}
|
||||
@@ -173,6 +175,28 @@ export default function ViewerInfoContent(props) {
|
||||
const authorLink = formatInnerLink(props.author.url, SiteContext._currentValue.url);
|
||||
const authorThumb = formatInnerLink(props.author.thumb, SiteContext._currentValue.url);
|
||||
|
||||
function setTimestampAnchors(text) {
|
||||
function wrapTimestampWithAnchor(match, string) {
|
||||
let split = match.split(':'),
|
||||
s = 0,
|
||||
m = 1;
|
||||
let searchParameters = new URLSearchParams(window.location.search);
|
||||
|
||||
while (split.length > 0) {
|
||||
s += m * parseInt(split.pop(), 10);
|
||||
m *= 60;
|
||||
}
|
||||
searchParameters.set('t', s);
|
||||
|
||||
const wrapped =
|
||||
'<a href="' + MediaPageStore.get('media-url').split('?')[0] + '?' + searchParameters + '">' + match + '</a>';
|
||||
return wrapped;
|
||||
}
|
||||
|
||||
const timeRegex = new RegExp('((\\d)?\\d:)?(\\d)?\\d:\\d\\d', 'g');
|
||||
return text.replace(timeRegex, wrapTimestampWithAnchor);
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="media-info-content">
|
||||
{void 0 === PageStore.get('config-media-item').displayAuthor ||
|
||||
@@ -185,11 +209,10 @@ export default function ViewerInfoContent(props) {
|
||||
<div className="media-content-banner-inner">
|
||||
{hasSummary ? <div className="media-content-summary">{summary}</div> : null}
|
||||
{(!hasSummary || isContentVisible) && description ? (
|
||||
PageStore.get('config-options').pages.media.htmlInDescription ? (
|
||||
<div className="media-content-description" dangerouslySetInnerHTML={{ __html: description }}></div>
|
||||
) : (
|
||||
<div className="media-content-description">{description}</div>
|
||||
)
|
||||
<div
|
||||
className="media-content-description"
|
||||
dangerouslySetInnerHTML={{ __html: setTimestampAnchors(description) }}
|
||||
></div>
|
||||
) : null}
|
||||
{hasSummary ? (
|
||||
<button className="load-more" onClick={onClickLoadMore}>
|
||||
@@ -197,7 +220,11 @@ export default function ViewerInfoContent(props) {
|
||||
</button>
|
||||
) : null}
|
||||
{tagsContent.length ? (
|
||||
<MediaMetaField value={tagsContent} title={1 < tagsContent.length ? translateString('Tags') : translateString('Tag')} id="tags" />
|
||||
<MediaMetaField
|
||||
value={tagsContent}
|
||||
title={1 < tagsContent.length ? translateString('Tags') : translateString('Tag')}
|
||||
id="tags"
|
||||
/>
|
||||
) : null}
|
||||
{categoriesContent.length ? (
|
||||
<MediaMetaField
|
||||
@@ -217,7 +244,7 @@ export default function ViewerInfoContent(props) {
|
||||
) : null}
|
||||
|
||||
<PopupTrigger contentRef={popupContentRef}>
|
||||
<button className="remove-media">{translateString("DELETE MEDIA")}</button>
|
||||
<button className="remove-media">{translateString('DELETE MEDIA')}</button>
|
||||
</PopupTrigger>
|
||||
|
||||
<PopupContent contentRef={popupContentRef}>
|
||||
|
||||
@@ -589,27 +589,46 @@ function findGetParameter(parameterName) {
|
||||
return result;
|
||||
}
|
||||
|
||||
function handleCanvas(canvasElem) {
|
||||
const Player = videojs(canvasElem);
|
||||
function handleCanvas(videoElem) { // Make sure it's a video element
|
||||
|
||||
if (!videoElem || !videoElem.tagName || videoElem.tagName.toLowerCase() !== 'video') {
|
||||
console.error('Invalid video element:', videoElem);
|
||||
return;
|
||||
}
|
||||
|
||||
const Player = videojs(videoElem);
|
||||
Player.playsinline(true);
|
||||
// TODO: Make them work only in embedded player...?
|
||||
if (findGetParameter('muted') == 1) {
|
||||
Player.muted(true);
|
||||
}
|
||||
if (findGetParameter('time') >= 0) {
|
||||
Player.currentTime(findGetParameter('time'));
|
||||
}
|
||||
if (findGetParameter('autoplay') == 1) {
|
||||
Player.play();
|
||||
}
|
||||
|
||||
Player.on('loadedmetadata', function () {
|
||||
const muted = parseInt(findGetParameter('muted'));
|
||||
const autoplay = parseInt(findGetParameter('autoplay'));
|
||||
const timestamp = parseInt(findGetParameter('t'));
|
||||
|
||||
if (muted == 1) {
|
||||
Player.muted(true);
|
||||
}
|
||||
|
||||
if (timestamp >= 0 && timestamp < Player.duration()) {
|
||||
// Start the video from the given time
|
||||
Player.currentTime(timestamp);
|
||||
} else if (timestamp >= 0 && timestamp >= Player.duration()) {
|
||||
// Restart the video if the given time is greater than the duration
|
||||
Player.play();
|
||||
}
|
||||
if (autoplay === 1) {
|
||||
Player.play();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const observer = new MutationObserver(function (mutations, me) {
|
||||
const canvas = document.querySelector('.video-js.vjs-mediacms video');
|
||||
if (canvas) {
|
||||
handleCanvas(canvas);
|
||||
me.disconnect();
|
||||
return;
|
||||
const observer = new MutationObserver((mutations, me) => {
|
||||
const playerContainer = document.querySelector('.video-js.vjs-mediacms');
|
||||
if (playerContainer) {
|
||||
const video = playerContainer.querySelector('video');
|
||||
if (video) {
|
||||
handleCanvas(video);
|
||||
me.disconnect();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
@@ -192,12 +192,14 @@ export function VideoPlayer(props) {
|
||||
document.addEventListener('visibilitychange', initPlayer);
|
||||
}
|
||||
|
||||
player && player.player.one('loadedmetadata', () => {
|
||||
/*
|
||||
// We don't need this because we have a custom function in frontend/src/static/js/components/media-viewer/VideoViewer/index.js:617
|
||||
player && player.player.one('loadedmetadata', () => {
|
||||
const urlParams = new URLSearchParams(window.location.search);
|
||||
const paramT = Number(urlParams.get('t'));
|
||||
const timestamp = !isNaN(paramT) ? paramT : 0;
|
||||
player.player.currentTime(timestamp);
|
||||
});
|
||||
}); */
|
||||
|
||||
return () => {
|
||||
unsetPlayer();
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import axios, { get as axiosGet, post as axiosPost, put as axiosPut } from 'axios';
|
||||
import axios from 'axios';
|
||||
|
||||
export async function getRequest(url, sync, callback, errorCallback) {
|
||||
const requestConfig = {
|
||||
@@ -44,11 +44,11 @@ export async function getRequest(url, sync, callback, errorCallback) {
|
||||
}
|
||||
|
||||
if (sync) {
|
||||
await axiosGet(url, requestConfig)
|
||||
await axios.get(url, requestConfig)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
} else {
|
||||
axiosGet(url, requestConfig)
|
||||
axios.get(url, requestConfig)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
}
|
||||
@@ -70,11 +70,11 @@ export async function postRequest(url, postData, configData, sync, callback, err
|
||||
}
|
||||
|
||||
if (sync) {
|
||||
await axiosPost(url, postData, configData || null)
|
||||
await axios.post(url, postData, configData || null)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
} else {
|
||||
axiosPost(url, postData, configData || null)
|
||||
axios.post(url, postData, configData || null)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
}
|
||||
@@ -96,11 +96,11 @@ export async function putRequest(url, putData, configData, sync, callback, error
|
||||
}
|
||||
|
||||
if (sync) {
|
||||
await axiosPut(url, putData, configData || null)
|
||||
await axios.put(url, putData, configData || null)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
} else {
|
||||
axiosPut(url, putData, configData || null)
|
||||
axios.put(url, putData, configData || null)
|
||||
.then(responseHandler)
|
||||
.catch(errorHandler || null);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user