Recently I have been trying to build a really simple chat app using sailsjs, the app has only 3 pages, each page has different sets of reference data that will feed twitter typeahead js, what I intend to do is like this:
var socket = io.connect('http://localhost:1337');
$(document).ready(function () {
var $modalLayer = $(JST['assets/templates/generic/modal.html']({}));
$modalLayer.appendTo("body").modal('show');
socket.on('connect', function () {
socket.request('/chat/references', {}, function (data) {
console.log(data);
bindTypeAhead(data);
$modalLayer.modal('hide');
});
});
For different page I have different logic, so need to be separated into different javascript files.
What I have tried were:
- using tag in pagea.ejs and pageb.ejs
- using <%- block('localScripts', 'SCRIPT_TAG') %>
Both approaches made the script come before all the javascript injections defined in pipeline.js, thus socket.io becomes undefined.
Some solutions I found on stackoverflow I read was to move the javascript injections to "<head>", but I think this is a hacky way to go, I dont really want to break sailsjs convention.
Could anybody have a nice way of doing it?
Many thanks.
The sails I'm using is versioned 0.10.5.