refactor to use bower

Author: btford

.bowerrc

@@ -0,0 +1,3 @@
+{
+  "directory": "public/bower_components"
+}

app.js

@@ -1,51 +1,64 @@
 
 /**
- * Module dependencies.
+ * Module dependencies
  */
 
 var express = require('express'),
   routes = require('./routes'),
-  socket = require('./routes/socket.js');
+  api = require('./routes/api'),
+  http = require('http'),
+  path = require('path');
 
 var app = module.exports = express();
 var server = require('http').createServer(app);
-
-// Hook Socket.io into Express
 var io = require('socket.io').listen(server);
 
-// Configuration
-
-app.configure(function(){
-  app.set('views', __dirname + '/views');
-  app.set('view engine', 'jade');
-  app.use(express.bodyParser());
-  app.use(express.methodOverride());
-  app.use(express.static(__dirname + '/public'));
-  app.use(app.router);
-});
+/**
+ * Configuration
+ */
 
-app.configure('development', function(){
-  app.use(express.errorHandler({ dumpExceptions: true, showStack: true }));
-});
+// all environments
+app.set('port', process.env.PORT || 3000);
+app.set('views', __dirname + '/views');
+app.set('view engine', 'jade');
+app.use(express.logger('dev'));
+app.use(express.bodyParser());
+app.use(express.methodOverride());
+app.use(express.static(path.join(__dirname, 'public')));
+app.use(app.router);
 
-app.configure('production', function(){
+// development only
+if (app.get('env') === 'development') {
   app.use(express.errorHandler());
-});
+}
+
+// production only
+if (app.get('env') === 'production') {
+  // TODO
+};
 
-// Routes
 
+/**
+ * Routes
+ */
+
+// serve index and view partials
 app.get('/', routes.index);
 app.get('/partials/:name', routes.partials);
 
+// JSON API
+app.get('/api/name', api.name);
+
 // redirect all others to the index (HTML5 history)
 app.get('*', routes.index);
 
 // Socket.io Communication
+io.sockets.on('connection', require('./routes/socket'));
 
-io.sockets.on('connection', socket);
-
-// Start server
+/**
+ * Start Server
+ */
 
-server.listen(3000, function(){
-  console.log("Express server listening on port %d in %s mode", this.address().port, app.settings.env);
+server.listen(app.get('port'), function () {
+  console.log('Express server listening on port ' + app.get('port'));
 });

bower.json

@@ -0,0 +1,13 @@
+{
+  "name": "application-name",
+  "version": "0.0.0",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "components"
+  ],
+  "dependencies": {
+    "angular": "~1.0.7",
+    "angular-socket-io": "~0.0.2"
+  }
+}

package.json

@@ -1,10 +1,10 @@
 {
-    "name": "application-name"
-  , "version": "0.0.1"
-  , "private": true
-  , "dependencies": {
-      "express": "3.0.0"
-    , "jade": ">= 0.0.1"
-    , "socket.io": ">= 0.9.6"
+  "name": "application-name",
+  "version": "0.0.0",
+  "private": true,
+  "dependencies": {
+    "socket.io": "~0.9.16",
+    "express": "~3.2.6",
+    "jade": "~0.31.2"
   }
-}
+}

public/bower_components/angular-socket-io/README.md

@@ -0,0 +1,11 @@
+# angular-socket-io
+Bower Component for using AngularJS with [Socket.IO](http://socket.io/), based on [this](http://briantford.com/blog/angular-socket-io.html).
+
+## Usage
+1. `bower install angular-socket-io`
+2. Made sure the Socket.IO client lib is loaded. It's often served at `/socket.io/socket.io.js`.
+3. Include the `socket.js` script provided by this component into your app.
+4. Add `btford.socket-io` as a module dependency to your app.
+
+## License
+MIT

public/bower_components/angular-socket-io/component.json

@@ -0,0 +1,17 @@
+{
+  "name": "angular-socket-io",
+  "version": "0.0.2",
+  "main": "socket.js",
+  "dependencies": {
+    "angular": "~1.0.5"
+  },
+  "gitHead": "95e01ea06d9921a916cf43d8080a0f4f4a2bcbb7",
+  "readme": "# angular-socket-io\nBower Component for using AngularJS with [Socket.IO](http://socket.io/), based on [this](http://briantford.com/blog/angular-socket-io.html).\n\n## Usage\n1. `bower install angular-socket-io`\n2. Made sure the Socket.IO client lib is loaded. It's often served at `/socket.io/socket.io.js`.\n3. Include the `socket.js` script provided by this component into your app.\n4. Add `btford.socket-io` as a module dependency to your app.\n\n## License\nMIT\n",
+  "readmeFilename": "README.md",
+  "_id": "[email protected]",
+  "description": "Bower Component for using AngularJS with [Socket.IO](http://socket.io/), based on [this](http://briantford.com/blog/angular-socket-io.html).",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/btford/angular-socket-io.git"
+  }
+}

public/bower_components/angular-socket-io/socket.js

@@ -0,0 +1,32 @@
+/*
+ * angular-socket-io v0.0.2
+ * (c) 2013 Brian Ford http://briantford.com
+ * License: MIT
+ */
+
+'use strict';
+
+angular.module('btford.socket-io', []).
+  factory('socket', function ($rootScope, $timeout) {
+    var socket = io.connect();
+    return {
+      on: function (eventName, callback) {
+        socket.on(eventName, function () {  
+          var args = arguments;
+          $timeout(function () {
+            callback.apply(socket, args);
+          }, 0);
+        });
+      },
+      emit: function (eventName, data, callback) {
+        socket.emit(eventName, data, function () {
+          var args = arguments;
+          $rootScope.$apply(function () {
+            if (callback) {
+              callback.apply(socket, args);
+            }
+          });
+        });
+      }
+    };
+  });

public/js/lib/angular/angular.js renamed to public/bower_components/angular/angular.js

@@ -0,0 +1,14 @@
+{
+  "name": "angular",
+  "version": "1.0.7",
+  "main": "./angular.js",
+  "dependencies": {},
+  "gitHead": "6c0e81da2073f3831e32ed486d5aabe17bfc915f",
+  "_id": "[email protected]",
+  "readme": "ERROR: No README.md file found!",
+  "description": "ERROR: No README.md file found!",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/angular/bower-angular.git"
+  }
+}

public/js/lib/angular/angular.min.js renamed to public/bower_components/angular/angular.min.js

@@ -1,11 +1,29 @@
 'use strict';
 
-
 // Declare app level module which depends on filters, and services
-var app = angular.module('myApp', ['myApp.filters', 'myApp.services', 'myApp.directives']).
-  config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
-    $routeProvider.when('/view1', {templateUrl: 'partials/partial1', controller: MyCtrl1});
-    $routeProvider.when('/view2', {templateUrl: 'partials/partial2', controller: MyCtrl2});
-    $routeProvider.otherwise({redirectTo: '/view1'});
-    $locationProvider.html5Mode(true);
-  }]);
+
+angular.module('myApp', [
+  'myApp.controllers',
+  'myApp.filters',
+  'myApp.services',
+  'myApp.directives',
+
+  // 3rd party dependencies
+  'btford.socket-io'
+]).
+config(function ($routeProvider, $locationProvider) {
+  $routeProvider.
+    when('/view1', {
+      templateUrl: 'partials/partial1',
+      controller: 'MyCtrl1'
+    }).
+    when('/view2', {
+      templateUrl: 'partials/partial2',
+      controller: 'MyCtrl2'
+    }).
+    otherwise({
+      redirectTo: '/view1'
+    });
+
+  $locationProvider.html5Mode(true);
+});

public/bower_components/angular/bower.json

@@ -2,20 +2,17 @@
 
 /* Controllers */
 
-function AppCtrl($scope, socket) {
-  socket.on('send:name', function (data) {
-    $scope.name = data.name;
+angular.module('myApp.controllers', []).
+  controller('AppCtrl', function ($scope, socket) {
+    socket.on('send:name', function (data) {
+      $scope.name = data.name;
+    });
+  }).
+  controller('MyCtrl1', function ($scope, socket) {
+    socket.on('send:time', function (data) {
+      $scope.time = data.time;
+    });
+  }).
+  controller('MyCtrl2', function ($scope) {
+    // write Ctrl here
   });
-}
-
-function MyCtrl1($scope, socket) {
-  socket.on('send:time', function (data) {
-    $scope.time = data.time;
-  });
-}
-MyCtrl1.$inject = ['$scope', 'socket'];
-
-
-function MyCtrl2() {
-}
-MyCtrl2.$inject = [];

public/js/app.js

@@ -2,10 +2,9 @@
 
 /* Directives */
 
-
 angular.module('myApp.directives', []).
-  directive('appVersion', ['version', function(version) {
+  directive('appVersion', function (version) {
     return function(scope, elm, attrs) {
       elm.text(version);
     };
-  }]);
+  });

public/js/controllers.js

@@ -3,8 +3,8 @@
 /* Filters */
 
 angular.module('myApp.filters', []).
-  filter('interpolate', ['version', function(version) {
-    return function(text) {
+  filter('interpolate', function (version) {
+    return function (text) {
       return String(text).replace(/\%VERSION\%/mg, version);
     }
-  }]);
+  });