Making the logo configurable

client/configuration/config.js

@@ -1,5 +1,34 @@
 angular.module('config', [])
 
-.constant('ENV', {RequiresAuth:false,etcdHost:'127.0.0.1',etcdPort:'4001',hobknobHost:'localhost',hobknobPort:'3006',categories:[{id:0,name:'Simple Features',description:'Use when you want your feature to be either on or off'},{id:1,name:'Domain Features',description:'Use when you want your features to be toggled separately for different domains (e.g. com, couk, fr, ...)',values:['com','couk','de','fr']},{id:2,name:'Locale Features',description:'Use when you want your features to be toggled separately for different locales (e.g. en-GB, en-US, fr-FR, ...)',values:['en-GB','en-US','fr-FR','de-DE']}],plugin:{path:'../server/examplePlugin.js'},hooks:['server/exampleHook.js']})
-
-;
+.constant('ENV', {
+	RequiresAuth: false,
+	dataSource: 'etcd',
+	etcdHost: '127.0.0.1',
+	etcdPort: '4001',
+	hobknobHost: 'localhost',
+	hobknobPort: '3006',
+	loadBalancerFile: '/etc/lbstatus/hobknob',
+	categories: [{
+		id: 0,
+		name: 'Simple Features',
+		description: 'Use when you want your feature to be either on or off'
+	}, {
+		id: 1,
+		name: 'Domain Features',
+		description: 'Use when you want your features to be toggled separately for different domains (e.g. com, couk, fr, ...)',
+		values: ['com', 'couk', 'de', 'fr']
+	}, {
+		id: 2,
+		name: 'Locale Features',
+		description: 'Use when you want your features to be toggled separately for different locales (e.g. en-GB, en-US, fr-FR, ...)',
+		values: ['en-GB', 'en-US', 'fr-FR', 'de-DE']
+	}],
+	plugin: {
+		path: '../server/examplePlugin.js'
+	},
+	hooks: ['server/exampleHook.js'],
+	customization: {
+		logo: '/img/opentable-hr-mono.png',
+		title: 'Opentable Feature Toggles'
+	}
+});

client/js/app.js

@@ -26,6 +26,9 @@ featureToggleFrontend.config(function ($routeProvider, $locationProvider, $httpP
     $httpProvider.defaults.headers.post = {'Content-Type': 'application/json'};
 });
 
-featureToggleFrontend.run(function (editableOptions) {
+featureToggleFrontend.run(function ($rootScope, editableOptions, ENV) {
     editableOptions.theme = 'bs3';
+    $rootScope.$on('$routeChangeSuccess', function (event, current, previous) {
+        $rootScope.title = current.$$route.title || ENV.customization.title;
+    });
 });

client/js/controllers/loginController.js

@@ -1,6 +1,8 @@
 'use strict';
 
 featureToggleFrontend.controller('LoginController', ['$scope', '$window', 'ENV', function ($scope, $window, ENV) {
+    $scope.logo = ENV.customization.logo;
+
     if (ENV.RequiresAuth) {
         var authProvider = Object.keys(ENV.AuthProviders)[0];
 

client/js/controllers/sideBarController.js

@@ -1,10 +1,11 @@
 'use strict';
 
-featureToggleFrontend.controller('SideBarController', ['$scope', 'applicationService', 'authorisationService', '$location', 'focus', 'CurrentUser', function ($scope, applicationService, authorisationService, $location, focus, CurrentUser) {
+featureToggleFrontend.controller('SideBarController', ['$scope', 'applicationService', 'authorisationService', '$location', 'focus', 'CurrentUser', 'ENV', function ($scope, applicationService, authorisationService, $location, focus, CurrentUser, ENV) {
     $scope.applications = [];
     $scope.newApplicationName = '';
     $scope.adding = false;
     $scope.CurrentUser = CurrentUser;
+    $scope.logo = ENV.customization.logo;
 
     var loadApplications = function () {
         applicationService.getApplications(

client/views/login.pug

@@ -1,21 +1,21 @@
 doctype html
-html(lang='en')
+html(lang='en' ng-app='featureToggleFrontend' ng-cloak)
     head
         meta(name='viewport', content='width=device-width, initial-scale=1')
-        title Hobknob Dashboard
+        title(ng-bind="$root.title")
         link(href='/bower_components/bootstrap/dist/css/bootstrap.min.css', media='all', rel='stylesheet')
         link(href='/css/dashboard.css', media='all', rel='stylesheet')
         link(href='/css/toggleswitch.css', media='all', rel='stylesheet')
         link(href='/bower_components/bootstrap-social/bootstrap-social.css', media='all', rel='stylesheet')
         link(href='/bower_components/font-awesome/css/font-awesome.css', media='all', rel='stylesheet')
         script(src='/bower_components/jquery/dist/jquery.min.js')
-    body(ng-app='featureToggleFrontend' ng-cloak)
+    body
         #wrapper
             #sidebar-wrapper
                 ul.sidebar-nav(ng-controller="LoginController")
                     li.sidebar-brand
                         a.navbar-brand.logo(href='/')
-                            img(src='/img/opentable-hr-mono.png')
+                            img(ng-src='{{logo}}')
                         a(href='/auth/google',ng-if="authProvider == 'GoogleAuth'", id="loginwithgoogle").btn.btn-block.btn-social.btn-google-plus.sign-in
                             i.fa.fa-google-plus
                             | Sign in with Google

client/views/main.pug

@@ -1,8 +1,8 @@
 doctype html
-html(lang='en')
+html(lang='en' ng-app='featureToggleFrontend')
     head
         meta(name='viewport', content='width=device-width, initial-scale=1')
-        title Hobknob Dashboard
+        title(ng-bind="$root.title")
         link(href='/bower_components/bootstrap/dist/css/bootstrap.min.css', media='all', rel='stylesheet')
         link(href='/css/dashboard.css', media='all', rel='stylesheet')
         link(href='/bower_components/angular-xeditable/dist/css/xeditable.css' rel='stylesheet')
@@ -11,7 +11,7 @@ html(lang='en')
         script(src='/bower_components/jquery/dist/jquery.min.js')
         script(type="text/javascript").
             window.user = !{JSON.stringify(user || {}, null, 2)};
-    body(ng-app='featureToggleFrontend')
+    body
         #wrapper
             include ./sidebar.pug
             #page-content-wrapper

client/views/sidebar.pug

@@ -2,7 +2,7 @@
     ul.sidebar-nav
         li.sidebar-brand
             a.navbar-brand.logo(href='/')
-                img(src='/img/opentable-hr-mono.png')
+                img(ng-src='{{logo}}')
         li
             .profile
                 img.media-object.img-circle(ng-src='{{CurrentUser.getPicture()}}', alt='avatar')

config/default.json

@@ -2,7 +2,7 @@
     "RequiresAuth": false,
     "dataSource": "etcd",
     "etcdHost": "127.0.0.1",
-    "etcdPort": "4001",
+    "etcdPort": "2379",
     "hobknobHost": "localhost",
     "hobknobPort": "3006",
     "loadBalancerFile": "/etc/lbstatus/hobknob",
@@ -40,5 +40,9 @@
     },
     "hooks": [
       "server/exampleHook.js"
-    ]
+    ],
+    "customization": {
+        "logo": "/img/opentable-hr-mono.png",
+        "title": "Hobknob Dashboard"
+    }
 }