73 lines
1.6 KiB
HTML
73 lines
1.6 KiB
HTML
|
<html>
|
||
|
|
<head>
|
||
|
|
<title>Bookstore (remember?!)</title>
|
||
|
|
<style>
|
||
|
|
/* CSS Styling */
|
||
|
|
#frame {
|
||
|
|
width: 100%;
|
||
|
|
}
|
||
|
|
#inputs {
|
||
|
|
width: 30em;
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
<!-- SCRIPTS -->
|
||
|
|
<!-- import handlebars -->
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/4.0.5/handlebars.min.js"></script>
|
||
|
|
<!-- import jquery -->
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<!-- HTML -->
|
||
|
|
<label>Bookstore (remember?!)</label>
|
||
|
|
<div id="frame">
|
||
|
|
|
||
|
|
<div id="inputs">
|
||
|
|
<input type="button" value="Get some books" onclick="get_books();"/>
|
||
|
|
<input id="nbr_books" type="number" value="2" min="1" max="5">
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!--
|
||
|
|
<div id="books">
|
||
|
|
<script id="books-template" type="text/x-handlebars-template">
|
||
|
|
{{#each this}}
|
||
|
|
{{/each}}
|
||
|
|
</script>
|
||
|
|
</div>
|
||
|
|
-->
|
||
|
|
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- SCRIPTS -->
|
||
|
|
<!-- import socket.io -->
|
||
|
|
<script src="/socket.io/socket.io.js"></script>
|
||
|
|
<script>
|
||
|
|
// connect to localhost on its port (see server.js -- 8088)
|
||
|
|
var socket = io().connect('http://localhost:8088');
|
||
|
|
|
||
|
|
// when connecting
|
||
|
|
socket.on('connect', function (data) {
|
||
|
|
console.log('connected');
|
||
|
|
});
|
||
|
|
|
||
|
|
// when receiving a custom message form the server
|
||
|
|
socket.on('all the books we have', function(msg) {
|
||
|
|
console.log('all the books: ' + msg);
|
||
|
|
});
|
||
|
|
|
||
|
|
/*
|
||
|
|
function compile_results_and_dispay(results) {
|
||
|
|
|
||
|
|
var template_script = $("#books-template").html();
|
||
|
|
|
||
|
|
var template = Handlebars.compile(template_script);
|
||
|
|
|
||
|
|
//$('.book').remove();
|
||
|
|
|
||
|
|
$('#books').append(template(results));
|
||
|
|
|
||
|
|
}
|
||
|
|
*/
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|