import React, { useState } from 'react';
import PropTypes from 'prop-types';
import reduxLang from '../../middleware/lang';
import DVKownMore from './DVKownMore';
import DVLabel from './../AppContent/CIDetailView/DVLabel';
import { DefaultPlayer as Video } from 'react-html5video';
import { useSwipeable } from 'react-swipeable';
import Div100vh from 'react-div-100vh';
const DVBody = ({ item, isFirst, isLast, showNextItem, showPrevItem, participated,
sendParticipation, toggleParticipated, doYouKnowMoreURL, color, t }) => {
return
{item.history && }
};
DVBody.propTypes = {
item: PropTypes.object.isRequired,
isFirst: PropTypes.bool.isRequired,
isLast: PropTypes.bool.isRequired,
t: PropTypes.func.isRequired
};
export default reduxLang('DVBody')(DVBody);
const DetailMediaContainer = ({ item, isFirst, isLast, showNextItem, showPrevItem }) => {
const handlers = useSwipeable({
onSwipedLeft: !isLast ? showNextItem : undefined,
onSwipedRight: !isFirst ? showPrevItem : undefined
});
return (
{!isFirst &&
}
{item.video || item.youtube ? (
) : (
)}
{!isLast &&
}
);
};
DetailMediaContainer.propTypes = {
item: PropTypes.object.isRequired,
isFirst: PropTypes.bool.isRequired,
isLast: PropTypes.bool.isRequired,
showNextItem: PropTypes.func.isRequired,
showPrevItem: PropTypes.func.isRequired
};
const LeftNavButton = ({ handler }) => (
);
LeftNavButton.propTypes = {
handler: PropTypes.func.isRequired
};
const RightNavButton = ({ handler }) => (
);
RightNavButton.propTypes = {
handler: PropTypes.func.isRequired
};
function youtube_parser(url) {
var regExp = /^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/;
var match = url.match(regExp);
return match && match[7].length == 11 ? match[7] : false;
}
const DIVideo = ({ video, youtube }) => (
{!youtube ? (
) : (
)}
);
DIVideo.propTypes = {
video: PropTypes.string,
youtube: PropTypes.string
};
const DIImage = ({ item, alt = '' }) => {
const [open, setOpen] = useState(false);
const openFullScreen = () => {
setOpen(true);
// fix cut off part on Safari
document.getElementById('CIDetailView').style.overflow = 'visible';
};
const closeFullScreen = () => {
setOpen(false);
// revert Safari fix don when opening
document.getElementById('CIDetailView').style.overflow = '';
};
if (open) {
return ;
}
return (
);
};
DIImage.propTypes = {
item: PropTypes.object.isRequired
};
const FullScreenImage = ({ image, close }) => (
);
const DetailViewTags = ({ tags, label }) => (
{tags.map((tag, i) => (
))}
);
const DetailAttributeContainer = ({ name, content, phone = false }) => (
);
DetailAttributeContainer.propTypes = {
name: PropTypes.string.isRequired,
content: PropTypes.any.isRequired
};
const DAContent = ({ content }) => (
);
DAContent.propTypes = {
content: PropTypes.any.isRequired
};