@stokr/components-library
Version:
STOKR - Components Library
124 lines (121 loc) • 7.52 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.ImagesCarousel = ImagesCarousel;
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _Slider = _interopRequireDefault(require("../Slider/Slider"));
var _Slider2 = require("../Slider/Slider.styles");
var _CaptialRaisedSummary = _interopRequireDefault(require("../CapitalRaisedSummary/CaptialRaisedSummary"));
var _Grid = require("../Grid/Grid.styles");
var _InvestmentStat = _interopRequireDefault(require("../InvestmentStat/InvestmentStat"));
var _parseBlockContent = _interopRequireDefault(require("../../utils/parseBlockContent"));
var _ProjectContext = require("context/Project/ProjectContext");
var _video = require("../video");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function ImagesCarousel(params) {
const [shouldRenderPage, setShouldRenderPage] = (0, _react.useState)(false);
const [carouselItems, setCarouselItems] = (0, _react.useState)([]);
// const [venture, setVenture] = useState({})
let {
project
} = (0, _react.useContext)(_ProjectContext.ProjectContext);
const [isVideoOpen, setIsVideoOpen] = (0, _react.useState)(false);
const [videoUri, setVideoUri] = (0, _react.useState)('');
(0, _react.useEffect)(() => {
const carouselFiles = generateCarouselItems(project.blocks.media);
setCarouselItems(carouselFiles);
setShouldRenderPage(true);
}, []);
const generateCarouselItems = media => {
const mediaParsed = (0, _parseBlockContent.default)(media);
const carouselFiles = [];
const tempObj = {};
// Find only carousel items
Object.keys(mediaParsed).forEach(key => {
if (key.includes('carouselFiles')) {
const index = key.split('carouselFiles_')[1].split('_')[0];
// Group video and its thumbnail
if (key.includes('videoThumbnail')) {
tempObj[index] = _objectSpread(_objectSpread({}, tempObj[index]), {}, {
videoThumbnail: mediaParsed[key]
});
} else {
tempObj[index] = _objectSpread(_objectSpread({}, tempObj[index]), mediaParsed[key]);
}
}
});
Object.keys(tempObj).forEach(key => {
carouselFiles.push(tempObj[key]);
});
return carouselFiles;
};
const openVideo = videoUri => {
setIsVideoOpen(true);
setVideoUri(videoUri);
};
const closeVideo = () => {
setIsVideoOpen(false);
setVideoUri();
};
return shouldRenderPage ? /*#__PURE__*/_react.default.createElement(_Grid.Row, null, /*#__PURE__*/_react.default.createElement(_video.Video, {
src: videoUri,
isVideoOpen: true,
noPlayButton: true,
play: isVideoOpen,
onClose: closeVideo
}), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
part: 2,
full: 3
}, /*#__PURE__*/_react.default.createElement(_Slider.default, {
dots: true
}, carouselItems.map(item => {
if (item.type === 'image') {
return /*#__PURE__*/_react.default.createElement(_Slider2.ImageSlideWrapper, {
key: item.uri
}, /*#__PURE__*/_react.default.createElement(_Slider2.ImageSlide, {
src: item.uri,
alt: ""
}));
} else if (item.type === 'video') {
return /*#__PURE__*/_react.default.createElement(_Slider2.ImageSlideWrapper, {
key: item.uri
}, /*#__PURE__*/_react.default.createElement(_Slider2.ImageSlide, {
src: item.videoThumbnail.uri,
alt: ""
}), /*#__PURE__*/_react.default.createElement(_video.PlayButton, {
onClick: () => openVideo(item.uri)
}, /*#__PURE__*/_react.default.createElement("img", {
alt: "Play video",
src: require('../video/img/play-btn.svg')
})));
}
})), /*#__PURE__*/_react.default.createElement(_CaptialRaisedSummary.default, {
capital: project.totalSold,
multiProgressBar: project.multiProgressBar
})), /*#__PURE__*/_react.default.createElement(_Grid.Column, {
part: 1,
full: 3
}, /*#__PURE__*/_react.default.createElement(_InvestmentStat.default, {
content: project.sharePercentage,
title: project.name === 'aquarius' ? 'Target return' : project.shareType,
tooltip: project.name === 'aquarius' ? 'The target yield per annum in accordance with the Offering Memorandum. Please read carefully the Offering Memorandum before investing' : project.name === 'mazzanti' ? 'The Securities represent the right to 50% of the sale proceeds for the sale of 1 (one) Millecavalli R car (minus any taxes).' : project.name === 'blockstream-mining' ? 'The percentage represents all Bitcoins mined over a period of 36 months in accordance with the Terms and Conditions. Please carefully read the Terms and Conditions before investing.' : "The percentage of the venture\u2019s future ".concat(project.name === 'infinite-fleet' ? 'profits' : 'revenues', " to be distributed in accordance with the Offering Terms. Please carefully read the Offering Terms and Offering Document\n before investing."),
borderTop: true
}), /*#__PURE__*/_react.default.createElement(_InvestmentStat.default, {
content: project.name === 'aquarius' ? 'OPEN-ENDED' : project.name === 'infinite-fleet' ? 'TBD' : project.daysLeft,
title: project.name === 'aquarius' ? 'fund typ' : project.daysLeftText,
borderTop: true
}), /*#__PURE__*/_react.default.createElement(_InvestmentStat.default, {
content: project.name === 'aquarius' ? 'PROFESSIONAL' : project.investmentCount.toString(),
title: "Investors",
primaryBg: true
}))) : '';
}
var _default = exports.default = ImagesCarousel;