Fixed it. I started an extra node which I connected to.
connect.js
// The actual grunt server settings
module.exports = function (grunt) {
'use strict';
return {
options: {
port: grunt.option('port') || 1337,
livereload: grunt.option('livereload') || 35729,
// Change this to '0.0.0.0' to access the server from outside
hostname: grunt.option('hostname') || '0.0.0.0'
},
livereload: {
options: {
open: true,
base: [
'.tmp',
'<%= config.app %>'
]
},
middleware: function (connect) {
return [
require('./server.js') // your server packaged as a nodejs module
]
}
},
dist: {
options: {
open: true,
base: '<%= config.dist %>',
livereload: false,
}
}
};
};
server.js (quickly implementation of Socket IO and MySQL):
var io = require('socket.io').listen(9001);
var mysql = require('mysql');
var connection = mysql.createConnection({
host : 'localhost',
user : 'root',
password : '****',
database : '****'
});
connection.connect();
connection.query('SELECT 1 + 1 AS solution', function(err, rows, fields) {
if (err) throw err
console.log("Connected to Database");
io.sockets.on('connection', function (socket) {
socket.emit('news', { hello: '22' });
socket.on('my other event', function (data) {
console.log(data);
console.log(rows);
});
});
});
connection.end();
index.html
<!DOCTYPE HTML>
<html>
<head>
<title>Narrowcasting</title>
<meta name="viewport" content="width=device-width, maximum-scale=1, user-scalable=no" />
<meta name="mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="stylesheet" type="text/css" href="lib/famous/core/famous.css" />
<!-- build:css(app/) css/app.css -->
<link rel="stylesheet" type="text/css" href="styles/app.css" />
<!-- bower:css -->
<!-- endbower -->
<!-- endbuild -->
<!-- build:js(app/) src/polyfills.js -->
<script type="text/javascript" src="lib/famous-polyfills/functionPrototypeBind.js"></script>
<script type="text/javascript" src="lib/famous-polyfills/classList.js"></script>
<script type="text/javascript" src="lib/famous-polyfills/requestAnimationFrame.js"></script>
<!-- endbuild -->
<!-- process:remove:dev -->
<script src="http://localhost:9001/socket.io/socket.io.js"></script>
<script type="text/javascript" src="src/main.js"></script>
<!-- /process -->
<!-- process:remove:dist -->
<script type="text/javascript" src="lib/requirejs/require.js" data-main="src/requireConfig"></script>
<!-- /process -->
</head>
<body></body>
</html>
main.js
define(function(require, exports, module) {
var socket = io.connect('http://localhost:9001');
socket.on('news', function(data) {
console.log(data);
socket.emit('my other event', { my: data });
});
});