Proyectos de Subversion LeadersLinked - SPA

Rev

Rev 3669 | Rev 3694 | Ir a la última revisión | Mostrar el archivo completo | | | Autoría | Ultima modificación | Ver Log |

Rev 3669 Rev 3670
Línea 47... Línea 47...
47 
 
 47 
 
48 
const FILE_TYPES = {
 48 
const FILE_TYPES = {
49 
  image: 'image/jpeg, image/png, image/jpg',
 49 
  image: 'image/jpeg, image/png, image/jpg',
50 
  file: 'application/pdf, application/vnd.openxmlformats-officedocument.presentationml.presentation',
 50 
  file: 'application/pdf, application/vnd.openxmlformats-officedocument.presentationml.presentation',
51 
  video: 'video/mp4, video/mpeg, video/webm, video/quicktime',
 51 
  video: 'video/mp4, video/mpeg, video/webm, video/quicktime',
52 
  all: 'image/jpeg, image/png, image/jpg, application/pdf, application/vnd.openxmlformats-officedocument.presentationml.presentation, video/mp4, video/mpeg, video/webm, video/quicktime'
 52 
  audio: 'audio/mpeg, audio/mp3, audio/wav, audio/ogg'
Línea 53... Línea 53...
53 
};
 53 
};
54 
 
 54 
 
55 
export function FilePicker({
 55 
export function FilePicker({
Línea 59... Línea 59...
59 
  description = 'Arrastra el archivo aqui, o haga click para seleccionar',
 59 
  description = 'Arrastra el archivo aqui, o haga click para seleccionar',
60 
  defaultFiles = null,
 60 
  defaultFiles = null,
61 
  onChange = () => {}
 61 
  onChange = () => {}
62 
}) {
 62 
}) {
63 
  const [errors, setErrors] = useState([]);
 63 
  const [errors, setErrors] = useState([]);
64 
  const [files, setFiles] = useState([]);
 64 
  const [previews, setPreviews] = useState([]);
Línea 65... Línea 65...
65 
 
 65 
 
- 
 
 66 
  const onDrop = useCallback((acceptedFiles, fileRejections) => {
- 
 
 67 
    const previews = acceptedFiles.map((file) => URL.createObjectURL(file));
66 
  const onDrop = useCallback((acceptedFiles, fileRejections) => {
 68 
    const files = multiple ? acceptedFiles : acceptedFiles[0];
67 
    onChange(acceptedFiles);
 69 
    setPreviews(previews);
68 
    setFiles(acceptedFiles);
 70 
    onChange(files);
69 
    if (fileRejections.length > 0) {
 71 
    if (fileRejections.length > 0) {
70 
      setErrors(fileRejections.map((file) => file.errors[0].message));
 72 
      setErrors(fileRejections.map((file) => file.errors[0].message));
71 
    } else {
 73 
    } else {
72 
      setErrors([]);
 74 
      setErrors([]);
Línea 79... Línea 81...
79 
    maxFiles,
 81 
    maxFiles,
80 
    onDrop
 82 
    onDrop
81 
  });
 83 
  });
Línea 82... Línea 84...
82 
 
 84 
 
83 
  const removeFile = () => {
 85 
  const removeFile = () => {
84 
    setFiles([]);
 86 
    setPreviews([]);
85 
    setErrors([]);
 87 
    setErrors([]);
Línea 86... Línea 88...
86 
  };
 88 
  };
87 
 
 - 
 
88 
  const filePreviewTest = (file) => {
 - 
 
89 
    const preview = URL.createObjectURL(file);
 - 
 
90 
    const type = file.type.split('/')[0];
 89 
 
91 
 
 90 
  const filePreviewTest = (preview) => {
92 
    switch (type) {
 91 
    switch (type) {
93 
      case 'image':
 92 
      case 'image':
94 
        return <img src={preview} />;
 93 
        return <img src={preview} />;
95 
      case 'video':
 - 
 
96 
        return <video src={preview} width='400' height='300' controls muted />;
 - 
 
97 
      case 'application':
 94 
      case 'video':
98 
        return <object data={preview} type={file.type} width='400' height='200' />;
 95 
        return <video src={preview} width='400' height='300' controls muted />;
99 
      case 'file':
 96 
      case 'file':
100 
        return <object data={preview} type={file.type} width='400' height='200' />;
 97 
        return <object data={preview} type='application/pdf' width='400' height='200' />;
101 
      case 'audio':
 - 
 
102 
        return <audio src={preview} controls muted />;
 98 
      case 'audio':
103 
 
 99 
        return <audio src={preview} controls muted />;
104 
      default:
 100 
      default:
105 
        break;
 101 
        break;
Línea 106... Línea 102...
106 
    }
 102 
    }
107 
  };
 103 
  };
108 
 
 104 
 
Línea 109... Línea 105...
109 
  useEffect(() => {
 105 
  useEffect(() => {
110 
    if (defaultFiles) setFiles(defaultFiles);
 106 
    if (defaultFiles) setPreviews(defaultFiles);
111 
  }, [defaultFiles]);
 107 
  }, [defaultFiles]);
112 
 
 108 
 
113 
  if (files.length) {
 109 
  if (previews.length) {
114 
    return (
 110 
    return (
115 
      <PreviewContainer>
 111 
      <PreviewContainer>
116 
        {files.map((file) => filePreviewTest(file))}
 112 
        {previews.map((preview) => filePreviewTest(preview))}
117 
        <CloseButton onClick={removeFile}>
 113 
        <CloseButton onClick={removeFile}>