diff --git a/lib/roles/app.js b/lib/roles/app.js
index 17f1501d..cc9d4e79 100644
--- a/lib/roles/app.js
+++ b/lib/roles/app.js
@@ -107,14 +107,31 @@ module.exports = function(options) {
   app.use(validator())
 
   app.get('/', function(req, res) {
-    res.render('index', {
-      APPSTATE: {
+    res.render('index')
+  })
+
+  app.get('/api/v1/appstate.js', function(req, res) {
+    res.type('application/javascript')
+    res.send('var GLOBAL_APPSTATE = ' + JSON.stringify({
         config: {
           websocketUrl: options.websocketUrl
         }
-      , user: req.user
-      }
-    })
+        , user: req.user
+      })
+    )
+  })
+
+  app.get('/api/v1/angular-appstate.js', function(req, res) {
+    res.type('application/javascript')
+    res.send('angular.module("stf.app-state")' +
+      '.config(function(AppState){AppState.set(' +
+      JSON.stringify({
+        config: {
+          websocketUrl: options.websocketUrl
+        }
+        , user: req.user
+      }) +
+      ')})')
   })
 
   app.get('/api/v1/app/user', function(req, res) {
diff --git a/res/app/app.js b/res/app/app.js
index 2b1cfa7a..6b74a240 100644
--- a/res/app/app.js
+++ b/res/app/app.js
@@ -26,10 +26,9 @@ require.ensure([], function (require) {
         .otherwise({
           redirectTo: '/devices'
         })
-    }
-  )
+    })
+
     .config(function (hotkeysProvider) {
       hotkeysProvider.templateTitle = 'Keyboard Shortcuts:'
     })
-
 })
diff --git a/res/app/components/stf/app-state/app-state-provider.js b/res/app/components/stf/app-state/app-state-provider.js
new file mode 100644
index 00000000..285f1945
--- /dev/null
+++ b/res/app/components/stf/app-state/app-state-provider.js
@@ -0,0 +1,24 @@
+module.exports = function AppStateProvider() {
+  var values = {
+    config: {
+      websocketUrl: ''
+    },
+    user: {
+      settings: {}
+    }
+  }
+
+  /*globals GLOBAL_APPSTATE:false*/
+  if (GLOBAL_APPSTATE) {
+    values = angular.extend(values, GLOBAL_APPSTATE)
+  }
+
+  return {
+    set: function (constants) {
+      angular.extend(values, constants)
+    },
+    $get: function () {
+      return values
+    }
+  }
+}
diff --git a/res/app/components/stf/app-state/index.js b/res/app/components/stf/app-state/index.js
new file mode 100644
index 00000000..937801a6
--- /dev/null
+++ b/res/app/components/stf/app-state/index.js
@@ -0,0 +1,3 @@
+module.exports = angular.module('stf.app-state', [
+])
+  .provider('AppState', require('./app-state-provider.js'))
diff --git a/res/app/components/stf/socket/index.js b/res/app/components/stf/socket/index.js
index bdf30f74..fb4e95c7 100644
--- a/res/app/components/stf/socket/index.js
+++ b/res/app/components/stf/socket/index.js
@@ -1,5 +1,6 @@
 module.exports = angular.module('stf/socket', [
   //TODO: Refactor version update out to its own Ctrl
+  require('stf/app-state').name,
   require('stf/common-ui/modals/version-update').name
 ])
   .factory('socket', require('./socket-service'))
diff --git a/res/app/components/stf/socket/socket-service.js b/res/app/components/stf/socket/socket-service.js
index 26659dae..626176da 100644
--- a/res/app/components/stf/socket/socket-service.js
+++ b/res/app/components/stf/socket/socket-service.js
@@ -1,46 +1,42 @@
 var io = require('socket.io')
 
-module.exports = function SocketFactory($rootScope, VersionUpdateService) {
-  /*globals APPSTATE:false*/
-  //TODO: Refactor APPSTATE to AppStateConstant
-  var websocketUrl = APPSTATE && APPSTATE.config &&
-    APPSTATE.config.websocketUrl ? APPSTATE.config.websocketUrl : ''
+module.exports =
+  function SocketFactory($rootScope, VersionUpdateService, AppState) {
+    var websocketUrl = AppState.config.websocketUrl || ''
 
-  var socket = io(websocketUrl, {
-    reconnection: false
-  , transports: ['websocket']
-  })
+    var socket = io(websocketUrl, {
+      reconnection: false, transports: ['websocket']
+    })
 
-  socket.scoped = function($scope) {
-    var listeners = []
+    socket.scoped = function ($scope) {
+      var listeners = []
 
-    $scope.$on('$destroy', function() {
-      listeners.forEach(function(listener) {
-        socket.removeListener(listener.event, listener.handler)
+      $scope.$on('$destroy', function () {
+        listeners.forEach(function (listener) {
+          socket.removeListener(listener.event, listener.handler)
+        })
+      })
+
+      return {
+        on: function (event, handler) {
+          listeners.push({
+            event: event, handler: handler
+          })
+          socket.on(event, handler)
+          return this
+        }
+      }
+    }
+
+    socket.on('outdated', function () {
+      VersionUpdateService.open()
+    })
+
+    socket.on('socket.ip', function (ip) {
+      $rootScope.$apply(function () {
+        socket.ip = ip
       })
     })
 
-    return {
-      on: function(event, handler) {
-        listeners.push({
-          event: event
-        , handler: handler
-        })
-        socket.on(event, handler)
-        return this
-      }
-    }
+    return socket
   }
-
-  socket.on('outdated', function () {
-    VersionUpdateService.open()
-  })
-
-  socket.on('socket.ip', function(ip) {
-    $rootScope.$apply(function() {
-      socket.ip = ip
-    })
-  })
-
-  return socket
-}
diff --git a/res/app/components/stf/user/index.js b/res/app/components/stf/user/index.js
index 608db06c..d547328d 100644
--- a/res/app/components/stf/user/index.js
+++ b/res/app/components/stf/user/index.js
@@ -1,2 +1,4 @@
-module.exports = angular.module('stf/user', [])
-  .factory('UserService', require('./user-service'))
\ No newline at end of file
+module.exports = angular.module('stf/user', [
+  require('stf/app-state').name
+])
+  .factory('UserService', require('./user-service'))
diff --git a/res/app/components/stf/user/user-service.js b/res/app/components/stf/user/user-service.js
index 2d5a81b1..5c66d7c5 100644
--- a/res/app/components/stf/user/user-service.js
+++ b/res/app/components/stf/user/user-service.js
@@ -1,6 +1,5 @@
-module.exports = function UserServiceFactory() {
-  /*global APPSTATE:false*/
+module.exports = function UserServiceFactory(AppState) {
   var userService = {}
-  userService.currentUser = APPSTATE.user
+  userService.currentUser = AppState.user
   return userService
 }
diff --git a/res/app/views/index.jade b/res/app/views/index.jade
index c418a78f..e34d87fc 100644
--- a/res/app/views/index.jade
+++ b/res/app/views/index.jade
@@ -22,7 +22,7 @@ html
           div(growl)
           div(ng-view).fill-height
 
-    script(src='data:application/javascript;base64,#{new Buffer("var APPSTATE=" + JSON.stringify(APPSTATE)).toString("base64")}')
+    script(src='/api/v1/appstate.js')
     script(src='/static/app/build/entry/commons.entry.js')
     script(src='/static/app/build/entry/app.entry.js')
     script(src='/static/bower_components/stf-analytics/analytics.js')