You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

86 lines
2.6 KiB

import React, { useState, useEffect } from "react";
import { connect } from "react-redux";
import { publicApi } from "../../redux/actions";
import poster from "../../assets/images/poster.svg";
import Divider from "../../components/Divider";
import Season from "./components/Season";
function VideoDisplay({
product = {
type: "کتاب ها",
name: "ریاضی",
price: "145.000 تومان",
imageUrl: "https://dnvn.ir/api/v1/file/2105",
poster: poster,
grade: "پایه هفتم ابتدایی",
seasons: [
{
name: "فصل اول: مباحث جوشش مواد مذاب در مرکز زمین",
duration: "2:30:13",
units: [
{
name: "مقدمه جالب توجه نویسنده کتاب برای شما",
duration: "14:30",
download: true,
play: true,
},
{
name: "چگونگی ساخت نیروگاههای برقی ",
duration: "14:30",
download: false,
play: true,
},
{
name: "آیا گوگل از ما دزدی میکند ؟",
duration: "14:30",
download: true,
play: true,
},
],
},
],
},
headerOptions,
setHeaderOptions,
}) {
useEffect(() => {
setHeaderOptions(headerOptions);
}, []);
return (
<div className="w-full flex flex-col px-4">
<div className="w-full flex flex-col mb-6">
<div className="w-full flex flex-row flex-1 justify-between items-center overflow-hidden relative">
<video style={{ width: "100%", height: "calc(100vw * 9 / 16 - 16)" }} controls>
<source
src={`https://dnvn.ir/api/v1/file/20540`}
type="video/mp4"
/>
</video>
</div>
{/* <div className="flex flex-col flex-1 justify-between pr-2">
<div className="flex flex-col">
<strong className="mt-1 text-blue5F text-base dark:text-white">
{product.name}
</strong>
<span className="text-blueC0 text-xs mb-1 dark:text-greenBA">{product.grade}</span>
</div>
<Divider type={"vertical"} />
</div> */}
</div>
<div className="flex flex-col">
{product.seasons.map((season, index) => (
<Season season={season} key={index} />
))}
</div>
</div>
);
}
const mapStateToProps = (state) => ({});
const mapDispatchToProps = {
setHeaderOptions: publicApi.setHeaderOptions,
};
export default connect(mapStateToProps, mapDispatchToProps)(VideoDisplay);