{"version":3,"sources":["CloneMain/images/logo1.png","CloneMain/images/iftixor.jpg","CloneMain/Search.js","CloneMain/images/functions.png","CloneMain/api/URL.js","CloneMain/VideoSec.js","CloneMain/SideVideos.js","CloneMain/ListVideo.js","App.js","index.js"],"names":["Search","onSubmit","useState","searchTerm","setSearchTerm","className","href","src","logo","alt","type","fullWidth","placeholder","value","onChange","event","target","onKeyPress","key","profile","axios","create","baseURL","VideoSec","video","videoId","id","snippet","title","channelTitle","description","videoSrc","frameBorder","allowFullScreen","SideVideos","onVideoSelect","onClick","thumbnails","medium","url","style","marginRight","ListVideo","videos","videoLists","map","App","setVideos","selectedVideos","setSelectedVideos","a","URL","get","params","part","maxResults","q","data","items","console","log","ReactDOM","render","StrictMode","document","getElementById"],"mappings":"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","file":"static/js/main.4cab0b3a.chunk.js","sourcesContent":["export default __webpack_public_path__ + \"static/media/logo1.26f20157.png\";","export default __webpack_public_path__ + \"static/media/iftixor.5cd4d63a.jpg\";","import React, { useState } from 'react'\r\nimport logo from './images/logo1.png'\r\nimport functions from './images/functions.png'\r\nimport profile from './images/iftixor.jpg'\r\n\r\nconst Search = ({ onSubmit }) => {\r\n\r\n    const [searchTerm, setSearchTerm] = useState(\"\");\r\n    const handleChange = (event) => setSearchTerm(event.target.value);\r\n\r\n    const keyPress = (event) => {\r\n        if (event.key === \"Enter\") {\r\n            onSubmit(searchTerm)\r\n        }\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <div className=\"header fixed-top\">\r\n                <a href=\"/\" className=\"brand\">\r\n                    <img src={logo} alt=\"brand\" className=\"logoBrand\" />\r\n                </a>\r\n                <input\r\n                    type=\"text\"\r\n                    fullWidth\r\n                    placeholder=\"Search...\"\r\n                    value={searchTerm}\r\n                    onChange={handleChange}\r\n                    onKeyPress={keyPress}\r\n                />\r\n                <div className=\"icons\">\r\n                    <img\r\n                        src={functions}\r\n                        alt=\"functions\"\r\n                        className=\"functions\"\r\n                    />\r\n                    <a href=\"https://www.youtube.com/channel/UC5nGXRhjYyCffFRgXFQSBtg\" className=\"profile\">\r\n                        <img src={profile} alt=\"profile\" className=\"profile\" />\r\n                    </a>\r\n                </div>\r\n\r\n            </div>\r\n        </>\r\n    )\r\n}\r\n\r\nexport default Search;","export default \"data:image/png;base64,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\"","import axios from 'axios'\r\n\r\nexport default axios.create({\r\n    baseURL: 'https://www.googleapis.com/youtube/v3'\r\n})","import React from 'react'\r\n\r\nconst VideoSec = ({ video: { id: { videoId }, snippet: { title, channelTitle, description } } }) => {\r\n\r\n    if (!videoId) return <p className=\"noResult\">No Results</p>;\r\n    const videoSrc = `https://www.youtube.com/embed/${videoId}`;\r\n\r\n    return (\r\n        <>\r\n            <div className=\"videoIframe\">\r\n                <iframe\r\n                    frameBorder=\"0\"\r\n                    allowFullScreen\r\n                    title=\"Video player\"\r\n                    src={videoSrc}\r\n                />\r\n            </div>\r\n            <div className=\"videoInfo\">\r\n                <h1 className=\"titleVideo\">{title}</h1>\r\n                <h3 className=\"channelTitle\">{channelTitle}</h3>\r\n                <p className=\"descriptionVideo\">{description}</p>\r\n            </div>\r\n        </>\r\n    )\r\n}\r\n\r\nexport default VideoSec\r\n","import React from 'react'\r\n\r\nconst SideVideos = ({ video, onVideoSelect }) => {\r\n    return (\r\n        <div>\r\n            <div className=\"videoItems\" onClick={() => onVideoSelect(video)}>\r\n                <img src={video.snippet.thumbnails.medium.url} alt=\"overlay\" style={{ marginRight: \"20px\" }} />\r\n                <div className=\"titleVideo\">\r\n                    <b>{video.snippet.title}</b>\r\n                </div>\r\n            </div>\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default SideVideos\r\n","import React from 'react'\r\nimport SideVideos from './SideVideos'\r\n\r\nconst ListVideo = ({ videos, onVideoSelect }) => {\r\n\r\n    const videoLists = videos.map(video => (\r\n        <SideVideos\r\n            onVideoSelect={onVideoSelect}\r\n            key={video.id.videoId}\r\n            video={video}\r\n        />\r\n    ))\r\n\r\n    return (\r\n        <div>\r\n            {videoLists}\r\n        </div>\r\n    )\r\n}\r\n\r\nexport default ListVideo\r\n","import React, { useState } from 'react'\r\nimport Search from './CloneMain/Search'\r\nimport URL from './CloneMain/api/URL'\r\nimport './Design.css'\r\nimport VideoSec from './CloneMain/VideoSec'\r\nimport ListVideo from './CloneMain/ListVideo'\r\n\r\nconst App = () => {\r\n\r\n    const [videos, setVideos] = useState([]);\r\n    const [selectedVideos, setSelectedVideos] = useState({ id: {}, snippet: {} });\r\n\r\n    async function videoSubmit(searchTerm) {\r\n        const { data: { items: videos } } = await URL.get(\"search\", {\r\n            params: {\r\n                part: \"snippet\",\r\n                maxResults: 5,\r\n                key: \"AIzaSyB2ho4f1-R5Or3YYPSEijmu4v-k3NltIss\",\r\n                q: searchTerm\r\n            }\r\n        })\r\n\r\n        console.log(videos);\r\n        setVideos(videos);\r\n        setSelectedVideos(videos[0]);\r\n    }\r\n\r\n    return (\r\n        <>\r\n            <div className=\"searchSec\">\r\n                <Search onSubmit={videoSubmit} />\r\n            </div>\r\n            <div className=\"videoMain\">\r\n                <div className=\"videoSec\">\r\n                    <VideoSec video={selectedVideos} />\r\n                </div>\r\n                <div className=\"videoLists\">\r\n                    <ListVideo videos={videos} onVideoSelect={setSelectedVideos} />\r\n                </div>\r\n            </div>\r\n        </>\r\n    )\r\n}\r\n\r\nexport default App\r\n","import React from 'react';\nimport ReactDOM from 'react-dom';\nimport 'bootstrap/dist/css/bootstrap.min.css'\nimport App from './App';\n\nReactDOM.render(\n  <React.StrictMode>\n    <App />\n  </React.StrictMode>,\n  document.getElementById('root')\n);"],"sourceRoot":""}