I have made a really simple app using guidebox api with guidebox node library. My code is working completely fine when I run the app inside browser but when I try to package it with node-webkit/nw.js it doesn't return any results or show anything.
What have I done till now? I tried to use the sdk version of nw.js to debug the app. The only thing I could find in console was this and I didn't understand a bit of it. Why it is showing like this. Also, why there is an error in routes ?
chrome-extension//...something/searchContent/search=fun
guidebox.js // client side script
$('#searchTerm').on('submit', function(e) { // search movies
e.preventDefault();
$('#searchResults').empty();
var query = $('#inputField').val();
$.ajax({
type: 'GET',
data: { search: query },
url: '/searchContent',
success: function(data) {
for (var i = 0; i < data.results.length; i++) {
var source = data.results[i].poster_120x171;
var img = $('<img id="dynamic">'); //Equivalent: $(document.createElement('img'))
img.attr('src', source);
img.appendTo('#searchResults');
}
console.log(data);
}
});
});
$('#getMoviesButton').on('click', function() { // get latest movies
$('#movieResults').empty();
$.ajax({
type: "GET",
url: "/getMovies",
dataType: 'JSON',
success: function(data) {
for (var i = 0; i < data.results.length; i++) {
var source = data.results[i].poster_120x171;
var img = $('<img id="dynamic">'); //Equivalent: $(document.createElement('img'))
img.attr('src', source);
img.appendTo('#movieResults');
}
}
});
});
app.js // server side
`
// init project
var express = require('express'),
path = require('path'),
app = express(),
Guidebox = require('guidebox')('ca49220ce9cfc67411c43a9074c99353579ef6de', 'JP'),
__dirname = "";
// we've started you off with Express,
// but feel free to use whatever libs or frameworks you'd like through `package.json`.
// http://expressjs.com/en/starter/static-files.html
app.use(express.static(path.join(__dirname, '../GuideBox')));
// http://expressjs.com/en/starter/basic-routing.html
app.get("/", function(request, response) {
// response.sendFile(__dirname + '/views/index.html');
response.sendFile('index.html', { root: path.join(__dirname, '../GuideBox') });
});
app.get("/searchContent", function(req, res) {
var searchQuery = req.query.search;
console.log(searchQuery);
Guidebox.search.movies({ field: 'title', query: searchQuery })
.then(function(data) {
res.send(data);
});
});
app.get("/getMovies", function(req, res) {
Guidebox.movies.list()
.then(function(data) {
res.send(data);
})
.catch(function(e) {
console.log(e);
});
});
app.listen(3030);
console.log("my server is running...");
`
index.html // front end ui
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Guide Box Demo</title>
<link rel="stylesheet" href="css/custom.css">
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
</head>
<body>
<div>
<h1>GUIDEBOX DEMO</h1>
</div>
<div id="col-one" class="widthClass">
<form id="searchTerm">
<input type="text" id="inputField" name="search" placeholder="search content here... " maxlength="120">
<button type="submit" id="searchButton"><b>SEARCH</b></button>
</form>
<br>
<br>
<br>
<div>
SEARCH RESULTS:
<br>
<div id="searchResults"></div>
</div>
</div>
<div id="col-two" class="widthClass">
<button type="submit" id="getMoviesButton" value="MOVIES"><b>GET MOVIES</b></button>
<br>
<br>
<br>
<div>
MOVIES RESULTS:
<div id="movieResults"></div>
</div>
</div>
<script type="text/javascript" src="js/guideBox.js"></script>
</body>
</html>
via Ryder
No comments:
Post a Comment