feat(panels): add panels page

src/app/pages/dashboard/dashboard.html

@@ -1,30 +1,26 @@
 <dashboard-pie-chart></dashboard-pie-chart>
 
 <div class="row">
-  <div class="col-md-7 col-sm-12">
-    <blur-panel title="Acquisition Channels" class-container="medium-panel">
-      <traffic-chart></traffic-chart>
-    </blur-panel>
+  <div class="col-md-7 col-sm-12"
+       ba-panel ba-panel-title="Acquisition Channels" ba-panel-class="medium-panel">
+    <traffic-chart></traffic-chart>
   </div>
-  <div class="col-md-5 col-sm-12">
-    <blur-panel title="Users by Country" class-container="medium-panel">
-      <dashboard-map></dashboard-map>
-    </blur-panel>
+  <div class="col-md-5 col-sm-12"
+       ba-panel ba-panel-title="Users by Country" ba-panel-class="medium-panel">
+    <dashboard-map></dashboard-map>
   </div>
 </div>
 
 <div class="row">
   <div class="col-lg-8 col-md-7 col-sm-12 col-xs-12">
     <div class="row">
-      <div class="col-lg-7 col-md-12 col-sm-7 col-xs-12">
-        <blur-panel title="Revenue" class-container="medium-panel">
-          <dashboard-line-chart></dashboard-line-chart>
-        </blur-panel>
+      <div class="col-lg-7 col-md-12 col-sm-7 col-xs-12"
+           ba-panel ba-panel-title="Revenue" ba-panel-class="medium-panel">
+        <dashboard-line-chart></dashboard-line-chart>
       </div>
-      <div class="col-lg-5 col-md-12 col-sm-5 col-xs-12">
-        <blur-panel class-container="popular-app medium-panel">
-          <popular-app></popular-app>
-        </blur-panel>
+      <div class="col-lg-5 col-md-12 col-sm-5 col-xs-12"
+           ba-panel ba-panel-class="popular-app medium-panel">
+        <popular-app></popular-app>
       </div>
     </div>
   </div>

src/app/pages/pages.module.js

@@ -19,6 +19,7 @@
     'BlurAdmin.pages.maps',
     'BlurAdmin.pages.modals',
     'BlurAdmin.pages.notifications',
+    'BlurAdmin.pages.panels',
     'BlurAdmin.pages.profile',
     'BlurAdmin.pages.progressBars',
     'BlurAdmin.pages.slider',

src/app/pages/panels/panels.module.js

@@ -0,0 +1,21 @@
+/**
+ * @author v.lugovsky
+ * created on 23.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.pages.panels', [])
+      .config(routeConfig);
+
+  /** @ngInject */
+  function routeConfig($stateProvider) {
+    $stateProvider
+        .state('panels', {
+          url: '/panels',
+          templateUrl: 'app/pages/panels/panels.html',
+          controller: 'NotificationsPageCtrl'
+        });
+  }
+
+})();

src/app/theme/components/baPanel/baPanel.directive.js

@@ -0,0 +1,26 @@
+/**
+ * @author v.lugovsky
+ * created on 23.12.2015
+ */
+(function () {
+  'use strict';
+
+  /**
+   * Includes basic panel layout inside of current element.
+   */
+  angular.module('BlurAdmin.theme')
+      .directive('baPanel', baPanel);
+
+  /** @ngInject */
+  function baPanel(baPanel) {
+    return angular.extend({}, baPanel, {
+      template: function(el, attrs) {
+        var res = '<div class="panel panel-default invisible ' + (attrs.baPanelClass || '') + '" zoom-in>';
+        res += baPanel.template(el, attrs);
+        res += '</div>';
+        return res;
+      }
+    });
+  }
+
+})();

src/app/theme/components/baPanel/baPanel.service.js

@@ -0,0 +1,30 @@
+/**
+ * @author v.lugovsky
+ * created on 23.12.2015
+ */
+(function () {
+  'use strict';
+
+  angular.module('BlurAdmin.theme')
+      .factory('baPanel', baPanel);
+
+  /** @ngInject */
+  function baPanel() {
+
+    /** Base baPanel directive */
+    return {
+      restrict: 'A',
+      transclude: true,
+      template: function(elem, attrs) {
+        var res = '<div class="panel-body"><div class="panel-content" ng-transclude></div></div>';
+        if (attrs.baPanelTitle) {
+          var titleTpl = '<div class="panel-heading clearfix"><h3 class="panel-title">' + attrs.baPanelTitle + '</h3></div>';
+          res = titleTpl + res; // title should be before
+        }
+
+        return res;
+      }
+    };
+  }
+
+})();

src/app/theme/components/baPanel/baPanelSelf.directive.js

@@ -0,0 +1,26 @@
+/**
+ * @author v.lugovsky
+ * created on 23.12.2015
+ */
+(function () {
+  'use strict';
+
+  /**
+   * Represents current element as panel, adding all necessary classes.
+   */
+  angular.module('BlurAdmin.theme')
+      .directive('baPanelSelf', baPanelSelf);
+
+  /** @ngInject */
+  function baPanelSelf(baPanel) {
+    return angular.extend({}, baPanel, {
+      link: function(scope, el, attrs) {
+        el.addClass('panel panel-default');
+        if (attrs.baPanelClass) {
+          el.addClass(attrs.baPanelClass);
+        }
+      }
+    });
+  }
+
+})();

src/app/theme/components/baPanel/blurPanel.directive.js

@@ -17,7 +17,7 @@
         title: '@',
         classContainer: '@'
       },
-      templateUrl: 'app/theme/components/blurPanel/blurPanel.html'
+      templateUrl: 'app/theme/components/baPanel/blurPanel.html'
     };
   }