refactor(basic structure): configure page states, generate sidebar from these states

pull/3/head
KostyaDanovsky 2016-01-12 18:30:32 +03:00
parent 180c37b809
commit bf74c51a6f
27 changed files with 290 additions and 271 deletions

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('alerts', {
.state('ui.alerts', {
url: '/alerts',
templateUrl: 'app/pages/alerts/alerts.html'
templateUrl: 'app/pages/alerts/alerts.html',
title: 'Modals',
sidebarMeta: {
order: 500,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('buttons', {
.state('ui.buttons', {
url: '/buttons',
templateUrl: 'app/pages/buttons/buttons.html',
controller: 'ButtonPageCtrl'
controller: 'ButtonPageCtrl',
title: 'Buttons',
sidebarMeta: {
order: 100,
},
});
}

View File

@ -13,7 +13,11 @@
$stateProvider
.state('charts.amCharts', {
url: '/amCharts',
templateUrl: 'app/pages/charts/amCharts/charts.html'
templateUrl: 'app/pages/charts/amCharts/charts.html',
title: 'amCharts',
sidebarMeta: {
order: 0,
},
});
}

View File

@ -13,7 +13,11 @@
$stateProvider
.state('charts.chartJs', {
url: '/chartJs',
templateUrl: 'app/pages/charts/chartJs/chartJs.html'
templateUrl: 'app/pages/charts/chartJs/chartJs.html',
title: 'Chart.js',
sidebarMeta: {
order: 200,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('charts.chartist', {
url: '/chartist',
templateUrl: 'app/pages/charts/chartist/chartist.html'
});
.state('charts.chartist', {
url: '/chartist',
templateUrl: 'app/pages/charts/chartist/chartist.html',
title: 'Chartist',
sidebarMeta: {
order: 100,
},
});
}
})();

View File

@ -19,7 +19,12 @@
.state('charts', {
url: '/charts',
abstract: true,
template: '<div ui-view></div>'
template: '<div ui-view></div>',
title: 'Charts',
sidebarMeta: {
icon: 'ion-stats-bars',
order: 100,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('charts.morris', {
url: '/morris',
templateUrl: 'app/pages/charts/morris/morris.html'
});
.state('charts.morris', {
url: '/morris',
templateUrl: 'app/pages/charts/morris/morris.html',
title: 'Morris',
sidebarMeta: {
order: 300,
}
});
}
})();

View File

@ -13,7 +13,12 @@
$stateProvider
.state('dashboard', {
url: '/dashboard',
templateUrl: 'app/pages/dashboard/dashboard.html'
templateUrl: 'app/pages/dashboard/dashboard.html',
title: 'Dashboard',
sidebarMeta: {
icon: 'ion-android-home',
order: 0,
},
});
}

View File

@ -11,21 +11,42 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('form-inputs', {
url: '/form-inputs',
templateUrl: 'app/pages/form/inputs/inputs.html'
.state('form', {
url: '/form',
template : '<ui-view></ui-view>',
abstract: true,
title: 'Form Elements',
sidebarMeta: {
icon: 'ion-compose',
order: 300,
},
})
.state('form-layouts', {
url: '/form-layouts',
templateUrl: 'app/pages/form/layouts/layouts.html'
.state('form.inputs', {
url: '/inputs',
templateUrl: 'app/pages/form/inputs/inputs.html',
title: 'Form Inputs',
sidebarMeta: {
order: 0,
},
})
.state('form-wizard',
.state('form.layouts', {
url: '/layouts',
templateUrl: 'app/pages/form/layouts/layouts.html',
title: 'Form Layouts',
sidebarMeta: {
order: 100,
},
})
.state('form.wizard',
{
url: '/form-wizard',
url: '/wizard',
templateUrl: 'app/pages/form/wizard/wizard.html',
controller: 'WizardCtrl',
controllerAs: 'vm'
})
controllerAs: 'vm',
title: 'Form Wizard',
sidebarMeta: {
order: 200,
},
});
}
})();

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('grid', {
.state('ui.grid', {
url: '/grid',
templateUrl: 'app/pages/grid/grid.html'
templateUrl: 'app/pages/grid/grid.html',
title: 'Grid',
sidebarMeta: {
order: 400,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('icons', {
.state('ui.icons', {
url: '/icons',
templateUrl: 'app/pages/icons/icons.html',
controller: 'IconsPageCtrl'
controller: 'IconsPageCtrl',
title: 'Icons',
sidebarMeta: {
order: 200,
},
});
}

View File

@ -11,24 +11,29 @@
/** @ngInject */
function routeConfig($stateProvider,$urlRouterProvider) {
$stateProvider
.state('mail', {
url: '/mail',
abstract: true,
templateUrl: 'app/pages/mail/mail.html',
controller: "MailTabCtrl",
controllerAs: "tabCtrl"
}).state('mail.label', {
url: '/:label',
templateUrl: 'app/pages/mail/list/mailList.html',
controller: "MailListCtrl",
controllerAs: "listCtrl"
}).state('mail.detail', {
url: '/:label/:id',
templateUrl: 'app/pages/mail/detail/mailDetail.html',
controller: "MailDetailCtrl",
controllerAs: "detailCtrl"
});
$urlRouterProvider.when('/mail','/mail/inbox');
.state('mail', {
url: '/mail',
abstract: true,
templateUrl: 'app/pages/mail/mail.html',
controller: "MailTabCtrl",
controllerAs: "tabCtrl",
title: 'Mail',
sidebarMeta: {
icon: 'ion-ios-email-outline',
order: 500,
},
}).state('mail.label', {
url: '/:label',
templateUrl: 'app/pages/mail/list/mailList.html',
controller: "MailListCtrl",
controllerAs: "listCtrl"
}).state('mail.detail', {
url: '/:label/:id',
templateUrl: 'app/pages/mail/detail/mailDetail.html',
controller: "MailDetailCtrl",
controllerAs: "detailCtrl"
});
$urlRouterProvider.when('/mail','/mail/inbox');
}
})();

View File

@ -14,27 +14,48 @@
.state('maps', {
url: '/maps',
templateUrl: 'app/pages/maps/maps.html',
abstract: true
abstract: true,
title: 'Maps',
sidebarMeta: {
icon: 'ion-ios-location-outline',
order: 600,
},
})
.state('maps.gmap', {
url: '/gmap',
templateUrl: 'app/pages/maps/google-maps/google-maps.html',
controller: 'GmapPageCtrl'
controller: 'GmapPageCtrl',
title: 'Google Maps',
sidebarMeta: {
order: 0,
},
})
.state('maps.leaflet', {
url: '/leaflet',
templateUrl: 'app/pages/maps/leaflet/leaflet.html',
controller: 'LeafletPageCtrl'
controller: 'LeafletPageCtrl',
title: 'Leaflet Maps',
sidebarMeta: {
order: 100,
},
})
.state('maps.bubble', {
url: '/bubble',
templateUrl: 'app/pages/maps/map-bubbles/map-bubbles.html',
controller: 'MapBubblePageCtrl'
controller: 'MapBubblePageCtrl',
title: 'Bubble Maps',
sidebarMeta: {
order: 200,
},
})
.state('maps.line', {
url: '/line',
templateUrl: 'app/pages/maps/map-lines/map-lines.html',
controller: 'MapLinesPageCtrl'
controller: 'MapLinesPageCtrl',
title: 'Line Maps',
sidebarMeta: {
order: 300,
},
});
}

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('modals', {
.state('ui.modals', {
url: '/modals',
templateUrl: 'app/pages/modals/modals.html'
templateUrl: 'app/pages/modals/modals.html',
title: 'Modals',
sidebarMeta: {
order: 300,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('notifications', {
.state('ui.notifications', {
url: '/notifications',
templateUrl: 'app/pages/notifications/notifications.html',
controller: 'NotificationsPageCtrl'
controller: 'NotificationsPageCtrl',
title: 'Notifications',
sidebarMeta: {
order: 700,
},
});
}

View File

@ -26,7 +26,8 @@
'BlurAdmin.pages.tables',
'BlurAdmin.pages.tree',
'BlurAdmin.pages.tabs',
'BlurAdmin.pages.typography'
'BlurAdmin.pages.typography',
'BlurAdmin.pages.ui',
])
.config(routeConfig);

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('panels', {
.state('ui.panels', {
url: '/panels',
templateUrl: 'app/pages/panels/panels.html',
controller: 'NotificationsPageCtrl'
controller: 'NotificationsPageCtrl',
title: 'Panels',
sidebarMeta: {
order: 1100,
},
});
}

View File

@ -14,7 +14,12 @@
.state('profile', {
url: '/profile',
templateUrl: 'app/pages/profile/profile.html',
controller: 'ProfilePageCtrl'
controller: 'ProfilePageCtrl',
title: 'User Profile',
sidebarMeta: {
icon: 'ion-person',
order: 700,
},
});
}

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('progressBars', {
.state('ui.progressBars', {
url: '/progressBars',
templateUrl: 'app/pages/progressBars/progressBars.html'
templateUrl: 'app/pages/progressBars/progressBars.html',
title: 'Progress Bars',
sidebarMeta: {
order: 600,
},
});
}

View File

@ -11,10 +11,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('slider', {
url: '/slider',
templateUrl: 'app/pages/slider/slider.html'
});
.state('ui.slider', {
url: '/slider',
templateUrl: 'app/pages/slider/slider.html',
title: 'Sliders',
sidebarMeta: {
order: 1000,
},
});
}
})();

View File

@ -11,19 +11,32 @@
/** @ngInject */
function routeConfig($stateProvider, $urlRouterProvider) {
$stateProvider
.state('tables', {
url: '/tables',
template : '<ui-view></ui-view>',
abstract: true,
controller: 'TablesPageCtrl'
}).state('tables.basic', {
url: '/basic',
templateUrl: 'app/pages/tables/basic/tables.html'
}).state('tables.smart', {
url: '/smart',
templateUrl: 'app/pages/tables/smart/tables.html'
});
$urlRouterProvider.when('/tables','/tables/basic');
.state('tables', {
url: '/tables',
template : '<ui-view></ui-view>',
abstract: true,
controller: 'TablesPageCtrl',
title: 'Tables',
sidebarMeta: {
icon: 'ion-grid',
order: 200,
},
}).state('tables.basic', {
url: '/basic',
templateUrl: 'app/pages/tables/basic/tables.html',
title: 'Basic Tables',
sidebarMeta: {
order: 0,
},
}).state('tables.smart', {
url: '/smart',
templateUrl: 'app/pages/tables/smart/tables.html',
title: 'Smart Tables',
sidebarMeta: {
order: 100,
},
});
$urlRouterProvider.when('/tables','/tables/basic');
}
})();

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('tabs', {
.state('ui.tabs', {
url: '/tabs',
templateUrl: 'app/pages/tabs/tabs.html'
templateUrl: 'app/pages/tabs/tabs.html',
title: 'Tabs and Accordions',
sidebarMeta: {
order: 800,
},
});
}

View File

@ -10,10 +10,14 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('tree', {
url: '/tree',
templateUrl: 'app/pages/tree/tree.html'
});
.state('ui.tree', {
url: '/tree',
templateUrl: 'app/pages/tree/tree.html',
title: 'Tree View',
sidebarMeta: {
order: 900,
},
});
}
})();

View File

@ -11,9 +11,13 @@
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('typography', {
.state('ui.typography', {
url: '/typography',
templateUrl: 'app/pages/typography/typography.html'
templateUrl: 'app/pages/typography/typography.html',
title: 'Typography',
sidebarMeta: {
order: 0,
},
});
}

View File

@ -0,0 +1,26 @@
/**
* @author k.danovsky
* created on 12.01.2016
*/
(function () {
'use strict';
angular.module('BlurAdmin.pages.ui', [])
.config(routeConfig);
/** @ngInject */
function routeConfig($stateProvider) {
$stateProvider
.state('ui', {
url: '/ui',
template : '<ui-view></ui-view>',
abstract: true,
title: 'UI Elements',
sidebarMeta: {
icon: 'ion-android-laptop',
order: 400,
},
});
}
})();

View File

@ -9,46 +9,13 @@
.directive('contentTop', contentTop);
/** @ngInject */
function contentTop($location) {
function contentTop($location, $state) {
return {
restrict: 'E',
templateUrl: 'app/theme/components/contentTop/contentTop.html',
link: function($scope) {
$scope.pages = {
'/dashboard': 'Dashboard',
'/page': 'Default Page',
'/404': 'Page Not Found',
'/buttons': 'Buttons',
'/charts/amCharts': 'amCharts',
'/charts/chartJs': 'Chart.js',
'/charts/chartist': 'Chartist.js',
'/charts/morris': 'Morris',
'/grid': 'Grid',
'/alerts': 'Alerts',
'/progressBars': 'Progress Bars',
'/notifications': 'Notifications',
'/icons': 'Icons',
'/login': 'Authentication',
'/maps': 'Maps',
'/mail': 'Mail Box',
'/modals': 'Modals',
'/profile': 'User Profile',
'/tables/basic': 'Basic Tables',
'/tables/smart': 'Smart Tables',
'/tree': 'Tree View',
'/slider': 'Sliders',
'/typography': 'Typography',
'/form-layouts': 'Form Layouts',
'/form-inputs': 'Form Inputs',
'/maps/gmap': 'Google Map',
'/maps/leaflet': 'Leaflet Map',
'/maps/line': 'Line Map',
'/maps/bubble': 'Bubble Map',
'/panels': 'Panels'
};
$scope.$watch(function () {
$scope.activePageTitle = $scope.pages[$location.$$url];
$scope.activePageTitle = $state.current.title;
});
}
};

View File

@ -9,153 +9,37 @@
.controller('SidebarCtrl', SidebarCtrl);
/** @ngInject */
function SidebarCtrl($scope, $timeout, $location, $rootScope, layoutSizes) {
$scope.menuItems = [
{
title: 'Dashboard',
icon: 'ion-android-home',
root: '#/dashboard'
},
{
icon: 'ion-stats-bars',
title: 'Charts',
subMenu: [
{
title: 'amCharts',
root: '#/charts/amCharts'
},
{
title: 'Chart.js',
root: '#/charts/chartJs'
},
{
title: 'Chartist',
root: '#/charts/chartist'
},
{
title: 'Morris',
root: '#/charts/morris'
}
]
},
{
title: 'Tables',
icon: 'ion-grid',
subMenu: [
{
title: "Basic Tables",
root: '#/tables/basic'
},
{
title: "Smart Tables",
root: '#/tables/smart'
}
]
},
{
title: 'Form Elements',
icon: 'ion-compose',
subMenu: [
{
title: 'Inputs',
root: '#/form-inputs'
},
{
title: 'Form Layouts',
root: '#/form-layouts'
},
{
title: 'Form Wizard',
root: '#/form-wizard'
}
]
},
{
title: 'UI Elements',
icon: 'ion-android-laptop',
subMenu: [
{
title: 'Typography',
root: '#/typography'
},
{
title: 'Buttons',
root: '#/buttons'
},
{
title: 'Icons',
root: '#/icons'
},
{
title: 'Modals',
root: '#/modals'
},
{
title: 'Grid',
root: '#/grid'
},
{
title: 'Alerts',
root: '#/alerts'
},
{
title: 'Progress Bars',
root: '#/progressBars'
},
{
title: 'Notifications',
root: '#/notifications'
},
{
title: 'Tabs and Accordions',
root: '#/tabs'
},
{
title: 'Tree View',
root: '#/tree'
},
{
title: 'Sliders',
root: '#/slider'
},
{
title: 'Panels',
root: '#/panels'
}
]
},
{
title: 'Mail',
icon: 'ion-ios-email-outline',
root: '#/mail/inbox'
},
{
title: 'Maps',
icon: 'ion-ios-location-outline',
subMenu: [
{
title: 'Google Maps',
root: '#/maps/gmap'
},
{
title: 'Leaflet',
root: '#/maps/leaflet'
},
{
title: 'Bubble Map',
root: '#/maps/bubble'
},
{
title: 'Line Map',
root: '#/maps/line'
}
]
},
{
title: 'User Profile',
icon: 'ion-person',
root: '#/profile'
},
function SidebarCtrl($scope, $timeout, $location, $rootScope, layoutSizes, $state) {
var states = $state.get().filter(function(s) {
return s.sidebarMeta;
})
.map(function(s) {
var meta = s.sidebarMeta;
return {
name: s.name,
title: s.title,
level: (s.name.match(/\./g) || []).length,
order: meta.order,
icon: meta.icon,
root: '#/' + s.name.replace('.', '/'),
};
})
.sort(function(a, b) {
return (a.level - b.level) * 100 + a.order - b.order;
});
var menuItems = states.filter(function(item) {
return item.level == 0;
});
menuItems.forEach(function(item) {
var children = states.filter(function(child) {
return child.level == 1 && child.name.indexOf(item.name) == 0;
});
item.subMenu = children.length ? children : null;
});
var staticMenuItems = [
{
title: 'Login Page',
icon: 'ion-log-out',
@ -185,6 +69,8 @@
}
];
$scope.menuItems = menuItems.concat(staticMenuItems);
function changeSelectElemTopValue() {
$timeout(function () {
var selectedItem = $('.al-sidebar-list-item.selected');