82 lines
4.3 KiB
JavaScript
82 lines
4.3 KiB
JavaScript
import { React, useEffect, useState } from 'react'
|
||
import ContentBlock from './components/ContentBlock'
|
||
import { useParams } from 'react-router-dom'
|
||
import axios from 'axios'
|
||
|
||
export default function FilmPage() {
|
||
const params = useParams()
|
||
const [items, setItems] = useState({});
|
||
|
||
useEffect(() => {
|
||
fetch("http://localhost:8080/cinema/" + params.id)
|
||
.then(function (response) {
|
||
return response.json();
|
||
})
|
||
.then(function (data) {
|
||
console.info('Get film success');
|
||
setItems(data);
|
||
})
|
||
.catch(function (error) {
|
||
console.error('Error:', error);
|
||
throw "Can't get film";
|
||
});
|
||
}, []);
|
||
|
||
const content = (
|
||
<div>
|
||
<div className="container pt-4">
|
||
<div className="container d-block text-start">
|
||
<img className="row posterFilmPage img-fluid float-start me-3 mt-3" src={items.image} alt={items.name} align="left" />
|
||
<a className="col text-white fw-bold fs-2" onClick={() => window.location.reload()} style={{ cursor: "pointer" }}>{items.name}, 2020 г. </a>
|
||
<span className="col badge green-mark text-white fw-bold fs-5 mx-2 p-2">9.2</span>
|
||
<button className="col badge willSee text-white fw-bold fs-5 mx-2 p-2 border border-0">
|
||
Буду смотреть
|
||
</button>
|
||
</div>
|
||
<div className="container table text-start fs-4">
|
||
<div className="row text-white fw-bold fs-3">О фильме</div>
|
||
<div className="row">
|
||
<div className="col-xs-6 col-sm-3">Год производства</div>
|
||
<div className="col-xs-6 col-sm-3">1000</div>
|
||
</div>
|
||
<div className="row">
|
||
<div className="col-xs-6 col-sm-3">Страна</div>
|
||
<div className="col-xs-6 col-sm-3">Россия</div>
|
||
</div>
|
||
<div className="row">
|
||
<div className="col-xs-6 col-sm-3">Жанр</div>
|
||
<div className="col-xs-6 col-sm-3">Драма</div>
|
||
</div>
|
||
<div className="row">
|
||
<div className="col-xs-6 col-sm-3">Длительность</div>
|
||
<div className="col-xs-6 col-sm-3">189 мин. / 03:09</div>
|
||
</div>
|
||
<div className="row">
|
||
<div className="col-xs-6 col-sm-3">Возраст</div>
|
||
<div className="col-xs-6 col-sm-3">16+</div>
|
||
</div>
|
||
</div>
|
||
<h3 className="text-white fw-bold m-auto p-1 fs-3 text-start">Описание</h3>
|
||
<div className="description text-start fs-4">
|
||
Пол Эджкомб — начальник блока смертников в тюрьме «Холодная гора», каждыйиз узников которого однажды проходит «зеленую милю» по пути к месту казни. Пол повидал много заключённых
|
||
и надзирателей за время работы. Однако гигант Джон Коффи, обвинённый в страшном преступлении,
|
||
стал одним из самых необычных обитателей блока.
|
||
</div>
|
||
</div>
|
||
<hr className="border border-0 bg-black" />
|
||
<div className="container">
|
||
<h1 className="fs-1 fw-bold text-white ms-2 text-start">Трейлер</h1>
|
||
<nav className="ratio ratio-16x9">
|
||
<iframe className="p-2" src="https://www.youtube.com/embed/Ca3mUSDJlgM" title="YouTube video player" frameBorder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowFullScreen></iframe>
|
||
</nav>
|
||
</div>
|
||
</div>
|
||
);
|
||
|
||
return (
|
||
<div>
|
||
<ContentBlock valueBlock={content} title='Страница фильма' />
|
||
</div>
|
||
)
|
||
}
|