diff --git a/api/videoload.php b/api/videoload.php index 7db426e..7796caf 100755 --- a/api/videoload.php +++ b/api/videoload.php @@ -53,6 +53,21 @@ if (isset($_POST['action'])) { } echo(json_encode($return)); + break; + case "getSearchKeyWord": + $search = $_POST['keyword']; + + $query = "SELECT movie_id,movie_name FROM videos + WHERE movie_name LIKE '%$search%' + ORDER BY likes DESC, create_date DESC, movie_name ASC"; + $result = $conn->query($query); + $rows = array(); + while ($r = mysqli_fetch_assoc($result)) { + array_push($rows, $r); + } + + echo(json_encode($rows)); + break; case "loadVideo": $query = "SELECT movie_name,movie_id,movie_url,thumbnail,poster,likes,quality,length FROM videos WHERE movie_id='" . $_POST['movieid'] . "'"; diff --git a/src/pages/HomePage/HomePage.css b/src/pages/HomePage/HomePage.css index af62c3d..d4450a5 100644 --- a/src/pages/HomePage/HomePage.css +++ b/src/pages/HomePage/HomePage.css @@ -7,3 +7,8 @@ float: left; width: 10%; } + +.searchform{ + margin-top: 25px; + float: right; +} diff --git a/src/pages/HomePage/HomePage.js b/src/pages/HomePage/HomePage.js index b0647d4..ff50106 100644 --- a/src/pages/HomePage/HomePage.js +++ b/src/pages/HomePage/HomePage.js @@ -24,6 +24,9 @@ class HomePage extends React.Component { }; } + /** keyword variable needed temporary store search keyword */ + keyword = ""; + componentDidMount() { // initial get of all videos this.fetchVideoData("all"); @@ -86,12 +89,52 @@ class HomePage extends React.Component { }); } + /** + * search for a keyword in db and update previews + * + * @param keyword The keyword to search for + */ + searchVideos(keyword) { + console.log("search called"); + + const updateRequest = new FormData(); + updateRequest.append('action', 'getSearchKeyWord'); + updateRequest.append('keyword', keyword); + + // fetch all videos available + fetch('/api/videoload.php', {method: 'POST', body: updateRequest}) + .then((response) => response.json() + .then((result) => { + this.setState({ + data: [] + }); + this.setState({ + data: result, + selectionnr: result.length + }); + })) + .catch(() => { + console.log("no connection to backend"); + }); + } + render() { return (