basic video tile
This commit is contained in:
parent
e8f6da345c
commit
237a5742cf
8
css/index.css
Normal file
8
css/index.css
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
.mediatile{
|
||||||
|
background-color: aqua;
|
||||||
|
height: 40mm;
|
||||||
|
width: 40mm;
|
||||||
|
margin: 3mm;
|
||||||
|
float: left;
|
||||||
|
font-size: 10pt;
|
||||||
|
}
|
17
index.html
17
index.html
@ -1,10 +1,25 @@
|
|||||||
|
<!--
|
||||||
|
-- index.html - https://heili.eu
|
||||||
|
-- Licensed under the MIT license - http://opensource.org/licenses/MIT
|
||||||
|
-- E-mail: lukas.heiligenbrunner@gmail.com
|
||||||
|
-- Copyright (c) 2020 Lukas Heiligenbrunner
|
||||||
|
-->
|
||||||
<!DOCTYPE html>
|
<!DOCTYPE html>
|
||||||
<html lang="en">
|
<html lang="en">
|
||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Title</title>
|
<title>HomeMediaCenter</title>
|
||||||
|
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/index.css">
|
||||||
|
|
||||||
|
<script src="js/BaseRequest.js"></script>
|
||||||
|
<script src="js/index.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
<div class="mediawrapper">
|
||||||
|
<div class="mediatile">vid1</div>
|
||||||
|
<div class="mediatile">vid2</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
33
js/BaseRequest.js
Normal file
33
js/BaseRequest.js
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
class Req {
|
||||||
|
static post(url, data, callback) {
|
||||||
|
const xhttp = new XMLHttpRequest();
|
||||||
|
xhttp.open("POST",url,true);
|
||||||
|
xhttp.onload = function(){
|
||||||
|
if (this.readyState == 4 && this.status == 200) {
|
||||||
|
callback(JSON.parse(xhttp.responseText));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
xhttp.onerror = function () {
|
||||||
|
console.log("error")
|
||||||
|
};
|
||||||
|
xhttp.send(data);
|
||||||
|
}
|
||||||
|
|
||||||
|
static get(url, callback) {
|
||||||
|
const xhttp = new XMLHttpRequest();
|
||||||
|
xhttp.onreadystatechange = function(){
|
||||||
|
if (this.readyState == 4 && this.status == 200) {
|
||||||
|
callback(JSON.parse(xhttp.responseText));
|
||||||
|
}else{
|
||||||
|
console.log("err")
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
xhttp.open("GET",url,true);
|
||||||
|
xhttp.send();
|
||||||
|
}
|
||||||
|
|
||||||
|
static ready(callback){
|
||||||
|
document.addEventListener('DOMContentLoaded', callback);
|
||||||
|
}
|
||||||
|
}
|
9
js/index.js
Normal file
9
js/index.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
Req.ready((event) => {
|
||||||
|
Req.post("php/movie.php", "action=getMovies", function (dta) {
|
||||||
|
console.log(dta);
|
||||||
|
// for (const ii in dta.movies) {
|
||||||
|
// document.getElementsByClassName("mediawrapper").item(0).insertAdjacentHTML('beforeend', `
|
||||||
|
// <div class="mediatile">${dta.movies[ii].title}</div>`);
|
||||||
|
// }
|
||||||
|
});
|
||||||
|
});
|
6
php/movie.php
Normal file
6
php/movie.php
Normal file
@ -0,0 +1,6 @@
|
|||||||
|
<?php
|
||||||
|
if(isset($_POST['action'])){
|
||||||
|
echo("{'data':[{'url':'./vid.mp4'}]}");
|
||||||
|
}else{
|
||||||
|
echo("{'data':'$_POST[0]'}");
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user