refactor(js): mainCtrl removed

src/app/app.js

@@ -4,7 +4,7 @@ var blurAdminApp = angular.module('BlurAdmin', [
   'ui.sortable',
   'ngRoute',
   'ngTouch',
-  'BlurAdmin.layout',
+  'BlurAdmin.theme',
   'BlurAdmin.dashboard',
   'BlurAdmin.buttonsPage',
   'BlurAdmin.chartsPage',
@@ -19,20 +19,6 @@ var blurAdminApp = angular.module('BlurAdmin', [
   'toastr',
   'smart-table',
   'ui.slimscroll'
-]).config(['$routeProvider', 'toastrConfig', function ($routeProvider, toastrConfig) {
+]).config(['$routeProvider', function ($routeProvider) {
   $routeProvider.otherwise({redirectTo: '/dashboard'});
-
-  angular.extend(toastrConfig, {
-    closeButton: true,
-    closeHtml: '<button>&times;</button>',
-    timeOut: 5000,
-    autoDismiss: false,
-    containerId: 'toast-container',
-    maxOpened: 0,
-    newestOnTop: true,
-    positionClass: 'toast-top-right',
-    preventDuplicates: false,
-    preventOpenDuplicates: false,
-    target: 'body'
-  });
 }]);

src/app/common/controllers/mainCtrl.js

@@ -1,13 +0,0 @@
-'use strict';
-
-blurAdminApp.controller('mainCtrl', ['$scope', '$timeout', function ($scope, $timeout) {
-  $timeout(function () {
-    $scope.finishLoading = true;
-  }, 1000);
-
-  $timeout(function () {
-    pageLoaded = true;
-  }, 4000);
-
-  $scope.isMenuCollapsed = window.innerWidth <= resWidthCollapseSidebar;
-}]);

src/app/common/directives/zoomIn.js

@@ -4,13 +4,13 @@
 
 'use strict';
 
-blurAdminApp.directive('zoomIn', ['$timeout', function ($timeout) {
+blurAdminApp.directive('zoomIn', ['$timeout', '$rootScope', function ($timeout, $rootScope) {
   return {
     restrict: 'A',
     link: function ($scope, elem) {
       var delay = 1000;
 
-      if (pageLoaded) {
+      if ($rootScope.$pageLoaded) {
         delay = 100;
       }
 

src/app/components/pageTop/pageTop.html

@@ -1,6 +1,6 @@
 <div class="page-top clearfix" scroll-position="scrolled" max-height="50" ng-class="{'scrolled': scrolled}">
   <a href="#/dashboard" class="al-logo clearfix"><span>Blur</span>Admin</a>
-  <a href class="collapse-menu-link ion-navicon" ng-click="isMenuCollapsed=!isMenuCollapsed"></a>
+  <a href class="collapse-menu-link ion-navicon" ng-click="$isMenuCollapsed=!$isMenuCollapsed"></a>
 
   <div class="search">
     <i class="ion-ios-search-strong" ng-click="startSearch()"></i>

src/app/components/sidebar/sidebar.js

@@ -4,10 +4,7 @@ blurAdminApp.directive('sidebar', function () {
   return {
     restrict: 'E',
     templateUrl: 'app/components/sidebar/sidebar.html',
-    scope: {
+    controller: ['$scope', '$element', '$window', '$timeout', '$location', '$rootScope', 'layoutSizes', function ($scope, $element, $window, $timeout, $location, $rootScope, layoutSizes) {
-      isMenuCollapsed: '='
-    },
-    controller: ['$scope', '$element', '$window', '$timeout', '$location', function ($scope, $element, $window, $timeout, $location) {
       $scope.menuItems = [
         {
           title: 'Dashboard',
@@ -133,14 +130,14 @@ blurAdminApp.directive('sidebar', function () {
       });
 
       $scope.menuExpand = function () {
-        $scope.isMenuCollapsed = false;
+        $rootScope.$isMenuCollapsed = false;
       };
 
       $scope.menuCollapse = function () {
-        $scope.isMenuCollapsed = true;
+        $rootScope.$isMenuCollapsed = true;
       };
 
-      $scope.$watch('isMenuCollapsed', function(newValue) {
+      $rootScope.$watch('$isMenuCollapsed', function(newValue) {
         if (!newValue && !$scope.selectElemTop) {
           changeSelectElemTopValue();
         }
@@ -148,10 +145,10 @@ blurAdminApp.directive('sidebar', function () {
 
       // watch window resize to change menu collapsed state if needed
       $(window).resize(function () {
-        var isMenuShouldCollapsed = $(window).width() <= resWidthCollapseSidebar;
+        var isMenuShouldCollapsed = $(window).width() <= layoutSizes.resWidthCollapseSidebar;
         if ($scope.isMenuShouldCollapsed !== isMenuShouldCollapsed) {
           $scope.$apply(function () {
-            $scope.isMenuCollapsed = isMenuShouldCollapsed;
+            $rootScope.$isMenuCollapsed = isMenuShouldCollapsed;
           });
         }
         $scope.isMenuShouldCollapsed = isMenuShouldCollapsed;
@@ -160,7 +157,7 @@ blurAdminApp.directive('sidebar', function () {
       $scope.toggleSubMenu = function ($event, item) {
         var submenu = $($event.currentTarget).next();
 
-        if ($scope.isMenuCollapsed) {
+        if (isMenuCollapsed.$isMenuCollapsed) {
           if (!item.slideRight) {
             $timeout(function () {
               item.slideRight = true;
@@ -193,8 +190,8 @@ blurAdminApp.directive('sidebar', function () {
       };
 
       $scope.collapseSidebarIfSmallRes = function () {
-        if (window.innerWidth <= resWidthCollapseSidebar) {
+        if (window.innerWidth <= layoutSizes.resWidthCollapseSidebar) {
-          $scope.isMenuCollapsed = true;
+          $rootScope.$isMenuCollapsed = true;
         }
       };
     }]

src/app/theme/amChartConfig.js

@@ -5,7 +5,7 @@
 (function () {
   'use strict';
 
-  angular.module('BlurAdmin.layout')
+  angular.module('BlurAdmin.theme')
       .config(amChartConfig);
 
   /** @ngInject */

src/app/theme/theme.constants.js

@@ -5,7 +5,7 @@
 (function () {
   'use strict';
 
-  angular.module('BlurAdmin.layout')
+  angular.module('BlurAdmin.theme')
       .constant('layoutColors', {
         primary:        '#41bee9',
         info:           '#5bc0de',

src/app/theme/theme.module.js

@@ -5,6 +5,8 @@
 (function () {
   'use strict';
 
-  angular.module('BlurAdmin.layout', []);
+  angular.module('BlurAdmin.theme', [
+    'toastr'
+  ]);
 
 })();

src/app/theme/theme.run.js

@@ -0,0 +1,24 @@
+/**
+ * @author v.lugovksy
+ * created on 15.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.theme')
+      .run(themeRun);
+
+  /** @ngInject */
+  function themeRun($timeout, $rootScope, layoutSizes) {
+    $timeout(function () {
+      $rootScope.$pageFinishedLoading = true;
+    }, 1000);
+
+    $timeout(function () {
+      $rootScope.$pageLoaded = true;
+    }, 4000);
+
+    $rootScope.$isMenuCollapsed = window.innerWidth <= layoutSizes.resWidthCollapseSidebar;
+  }
+
+})();

src/app/theme/toastrLibConfig.js

@@ -0,0 +1,27 @@
+/**
+ * @author v.lugovksy
+ * created on 15.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.theme')
+      .config(toastrLibConfig);
+
+  /** @ngInject */
+  function toastrLibConfig(toastrConfig) {
+    angular.extend(toastrConfig, {
+      closeButton: true,
+      closeHtml: '<button>&times;</button>',
+      timeOut: 5000,
+      autoDismiss: false,
+      containerId: 'toast-container',
+      maxOpened: 0,
+      newestOnTop: true,
+      positionClass: 'toast-top-right',
+      preventDuplicates: false,
+      preventOpenDuplicates: false,
+      target: 'body'
+    });
+  }
+})();

src/index.html

@@ -24,11 +24,11 @@
   <!-- endinject -->
   <!-- endbuild -->
 </head>
-<body ng-controller="mainCtrl">
+<body>
 
-<main ng-if="finishLoading" ng-class="{ 'menu-collapsed': isMenuCollapsed }">
+<main ng-if="$pageFinishedLoading" ng-class="{ 'menu-collapsed': $isMenuCollapsed }">
 
-  <sidebar is-menu-collapsed="isMenuCollapsed"></sidebar>
+  <sidebar></sidebar>
   <page-top></page-top>
 
   <div class="al-main">
@@ -54,7 +54,7 @@
   <back-top></back-top>
 </main>
 
-<div id="preloader" ng-show="!finishLoading">
+<div id="preloader" ng-show="!$pageFinishedLoading">
   <div></div>
 </div>