import Auth from '/imports/ui/services/auth'; import logger from '/imports/startup/client/logger'; import { partition } from '/imports/utils/array-utils'; import update from 'immutability-helper'; import { v4 as uuid } from 'uuid'; import { uniqueId } from '/imports/utils/string-utils'; import { notify } from '/imports/ui/services/notification'; import apolloContextHolder from '/imports/ui/core/graphql/apolloContextHolder/apolloContextHolder'; import { getPresentationUploadToken } from './queries'; import { requestPresentationUploadTokenMutation } from './mutation'; import useMeeting from '/imports/ui/core/hooks/useMeeting'; const TOKEN_TIMEOUT = 5000; const POD_ID = 'DEFAULT_PRESENTATION_POD'; // fetch doesn't support progress. So we use xhr which support progress. const futch = (url, opts = {}, onProgress) => new Promise((res, rej) => { const xhr = new XMLHttpRequest(); xhr.open(opts.method || 'get', url); Object.keys(opts.headers || {}) .forEach((k) => xhr.setRequestHeader(k, opts.headers[k])); xhr.onload = (e) => { if (e.target.status !== 200) { return rej(new Error({ code: e.target.status, message: e.target.statusText })); } return res(e.target.responseText); }; xhr.onerror = rej; if (xhr.upload && onProgress) { xhr.upload.addEventListener('progress', onProgress, false); } xhr.send(opts.body); }); const requestPresentationUploadToken = ( temporaryPresentationId, meetingId, filename, ) => new Promise((resolve, reject) => { const client = apolloContextHolder.getClient(); client.mutate({ mutation: requestPresentationUploadTokenMutation, variables: { podId: POD_ID, filename, uploadTemporaryId: temporaryPresentationId, }, }); const timeout = setTimeout(() => { reject(new Error({ code: 408, message: 'requestPresentationUploadToken timeout' })); }, TOKEN_TIMEOUT); const getData = (n = 0) => { if (n > 10) return; let recursiveTimeout = null; client.query({ query: getPresentationUploadToken, variables: { uploadTemporaryId: temporaryPresentationId, }, fetchPolicy: 'network-only', }).then((result) => { if (result.data.pres_presentation_uploadToken.length > 0) { clearTimeout(recursiveTimeout); clearTimeout(timeout); resolve(result.data.pres_presentation_uploadToken[0].uploadToken); } }); recursiveTimeout = setTimeout(() => { getData(n + 1); }, 1000); }; setTimeout(getData, 100); }); const uploadAndConvertPresentation = ( file, downloadable, meetingId, endpoint, onUpload, onProgress, onConversion, current, ) => { if (!file) return Promise.resolve(); const temporaryPresentationId = uniqueId(uuid()); const data = new FormData(); data.append('fileUpload', file); data.append('conference', meetingId); data.append('room', meetingId); data.append('temporaryPresentationId', temporaryPresentationId); // TODO: Currently the uploader is not related to a POD so the id is fixed to the default data.append('pod_id', POD_ID); data.append('is_downloadable', downloadable); data.append('current', current); const opts = { method: 'POST', body: data, }; return requestPresentationUploadToken(temporaryPresentationId, meetingId, file.name) .then((token) => ( futch(endpoint.replace('upload', `${token}/upload`), opts, onProgress) )) // Trap the error so we can have parallel upload .catch((error) => { logger.debug({ logCode: 'presentation_uploader_service', extraInfo: { error, }, }, 'Generic presentation upload exception catcher'); onUpload({ error: true, done: true, status: error.code }); return Promise.resolve(); }); }; const uploadAndConvertPresentations = ( presentationsToUpload, meetingId, uploadEndpoint, ) => Promise.all(presentationsToUpload.map((p) => uploadAndConvertPresentation( p.file, p.downloadable, meetingId, uploadEndpoint, p.onUpload, p.onProgress, p.onConversion, p.current, ))); const removePresentations = ( presentationsToRemove, removePresentation, ) => Promise.all(presentationsToRemove.map((p) => removePresentation(p.presentationId))); const persistPresentationChanges = ( oldState, newState, uploadEndpoint, setPresentation, removePresentation, ) => { const presentationsToUpload = newState.filter((p) => !p.uploadCompleted); const presentationsToRemove = oldState.filter((p) => !newState.find((u) => { return u.presentationId === p.presentationId })); let currentPresentation = newState.find((p) => p.current); return uploadAndConvertPresentations(presentationsToUpload, Auth.meetingID, uploadEndpoint) .then((presentations) => { if (!presentations.length && !currentPresentation) return Promise.resolve(); // Update the presentation with their new ids presentations.forEach((p, i) => { if (p === undefined) return; presentationsToUpload[i].onDone(p.presentationId); }); return Promise.resolve(presentations); }) .then((presentations) => { if (currentPresentation === undefined) { setPresentation(''); return Promise.resolve(); } // If its a newly uploaded presentation we need to get it from promise result if (currentPresentation?.uploadInProgress) { const currentIndex = presentationsToUpload.findIndex((p) => p === currentPresentation); currentPresentation = presentations[currentIndex]; } // skip setting as current if error happened if (currentPresentation?.conversion?.error) { return Promise.resolve(); } return setPresentation(currentPresentation?.presentationId); }) .then(removePresentations.bind(null, presentationsToRemove, removePresentation)); }; const handleSavePresentation = ( presentations = [], isFromPresentationUploaderInterface = true, newPres = {}, currentPresentations = [], setPresentation, removePresentation, isPresentationEnabled, ) => { if (!isPresentationEnabled) { return null; } const PRESENTATION_CONFIG = window.meetingClientSettings.public.presentation; if (!isFromPresentationUploaderInterface) { if (presentations.length === 0) { presentations = [...currentPresentations]; } presentations = presentations.map((p) => update(p, { current: { $set: false, }, })); newPres.current = true; presentations.push(newPres); } return persistPresentationChanges( currentPresentations, presentations, PRESENTATION_CONFIG.uploadEndpoint, setPresentation, removePresentation, ); }; const useExternalUploadData = () => { const { data: meeting } = useMeeting((m) => ({ presentationUploadExternalDescription: m.presentationUploadExternalDescription, presentationUploadExternalUrl: m.presentationUploadExternalUrl, })); const { presentationUploadExternalDescription, presentationUploadExternalUrl, } = meeting || {}; return { presentationUploadExternalDescription, presentationUploadExternalUrl, }; }; function handleFiledrop(files, files2, that, intl, intlMessages) { if (that) { const { fileValidMimeTypes } = that.props; const { toUploadCount } = that.state; const validMimes = fileValidMimeTypes.map((fileValid) => fileValid.mime); const validExtentions = fileValidMimeTypes.map((fileValid) => fileValid.extension); const [accepted, rejected] = partition( files.concat(files2), (f) => ( validMimes.includes(f.type) || validExtentions.includes(`.${f.name.split('.').pop()}`) ), ); const presentationsToUpload = accepted.map((file) => { const id = uniqueId(file.name); return { file, downloadable: false, // by default new presentations are set not to be downloadable isRemovable: true, presentationId: id, name: file.name, current: false, conversion: { done: false, error: false }, upload: { done: false, error: false, progress: 0 }, exportation: { error: false }, onProgress: (event) => { if (!event.lengthComputable) { that.deepMergeUpdateFileKey(id, 'upload', { progress: 100, done: true, }); return; } that.deepMergeUpdateFileKey(id, 'upload', { progress: (event.loaded / event.total) * 100, done: event.loaded === event.total, }); }, onConversion: (conversion) => { that.deepMergeUpdateFileKey(id, 'conversion', conversion); }, onUpload: (upload) => { that.deepMergeUpdateFileKey(id, 'upload', upload); }, onDone: (newId) => { that.updateFileKey(id, 'id', newId); }, }; }); that.setState(({ presentations }) => ({ presentations: presentations.concat(presentationsToUpload), toUploadCount: (toUploadCount + presentationsToUpload.length), }), () => { // after the state is set (files have been dropped), // make the first of the new presentations current if (presentationsToUpload && presentationsToUpload.length) { that.handleCurrentChange(presentationsToUpload[0].presentationId); } }); if (rejected.length > 0) { notify(intl.formatMessage(intlMessages.rejectedError), 'error'); } } } export default { handleSavePresentation, persistPresentationChanges, requestPresentationUploadToken, uploadAndConvertPresentation, handleFiledrop, useExternalUploadData, };