KevinMidboe/Node-Com-Handler
1
0
Fork 0
mirror of https://github.com/KevinMidboe/Node-Com-Handler.git synced 2025-10-29 17:50:27 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added a search bar and button

Browse Source
This commit is contained in:
Kevin Midboe
2017-02-08 19:28:52 +01:00
parent e74bbd0abf
commit 8c6e142dc4
1 changed files with 43 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
v1/searchDisplay.html
View File

@@ -4,54 +4,63 @@
<title>tmdb.org Search Displayer</title> <title>tmdb.org Search Displayer</title>
</head> </head>
<body> <body>
<input type='text' id='link_id'>
<input type='button' id='btnSearch' value='Search' onClick="search(this)"'>
<p id="display"></p> <p id="display"></p>
</body> </body>
<script type="text/javascript"> <script type="text/javascript">
function request(id){ var button = document.getElementById("btnSearch");
console.log(id);
button.onclick = function () {
var text = document.getElementById("link_id").value;
console.log(text);
queryTMDB(text);
} }
var data = "{}"; function queryTMDB(query) {
var data = "{}";
var xhr = new XMLHttpRequest(); var xhr = new XMLHttpRequest();
xhr.withCredentials = true; xhr.withCredentials = true;
xhr.addEventListener("readystatechange", function () { xhr.addEventListener("readystatechange", function () {
if (this.readyState === this.DONE) { if (this.readyState === this.DONE) {
var display = document.getElementById("display"); var display = document.getElementById("display");
var jsonObj = JSON.parse(this.responseText); var jsonObj = JSON.parse(this.responseText);
console.log(jsonObj.movies); console.log(jsonObj.movies);
Object.keys(jsonObj.movies).forEach(function(key) { Object.keys(jsonObj.movies).forEach(function(key) {
var id = jsonObj.movies[key].id; var id = jsonObj.movies[key].id;
var title = jsonObj.movies[key].title; var title = jsonObj.movies[key].title;
var poster_path = "http://image.tmdb.org/t/p/w500"+jsonObj.movies[key].poster_path; var poster_path = "http://image.tmdb.org/t/p/w500"+jsonObj.movies[key].poster_path;
var node = document.createElement("li"); // Create a <li> node var node = document.createElement("li"); // Create a <li> node
var imageNode = document.createElement('img'); var imageNode = document.createElement('img');
var textNode = document.createTextNode(title); // Create a text node var textNode = document.createTextNode(title); // Create a text node
var buttonNode = document.createElement("span"); var buttonNode = document.createElement("span");
var button2Node = document.createElement("span"); var button2Node = document.createElement("span");
buttonNode.innerHTML = '<button onclick="request('+ id +')">REQUEST</button>'; buttonNode.innerHTML = '<button onclick="request('+ id +')">REQUEST</button>';
button2Node.innerHTML = '<button onclick="request('+ id +')">FORCE REQUEST</button>'; button2Node.innerHTML = '<button onclick="request('+ id +')">FORCE REQUEST</button>';
imageNode.src = poster_path; imageNode.src = poster_path;
node.appendChild(textNode); // Append the text to <li> node.appendChild(textNode); // Append the text to <li>
node.appendChild(imageNode); node.appendChild(imageNode);
node.appendChild(buttonNode); node.appendChild(buttonNode);
node.appendChild(button2Node); node.appendChild(button2Node);
display.appendChild(node); display.appendChild(node);
}); });
} }
}); });
xhr.open("GET", "http://localhost:63590/api/v1/plex/request?query=star+wars"); xhr.open("GET", "http://localhost:63590/api/v1/plex/request?query="+query);
xhr.send(data); console.log(data);
xhr.send(data);
}
</script> </script>
</html> </html>