Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save francisrod01/55d870dab73b20f6e882ee4265c37526 to your computer and use it in GitHub Desktop.
Save francisrod01/55d870dab73b20f6e882ee4265c37526 to your computer and use it in GitHub Desktop.
ng-demos modular using stateProvider
(function() {
'use strict';
angular
.module('blocks.router')
// .provider('routehelperConfig', routehelperConfig)
// .provider('routehelperConfig', routehelperProvider)
.provider('routerHelper', routerHelperProvider);
// .factory('routehelper', routehelper);
// routehelper.$inject = ['$location', '$rootScope', '$route', 'logger', 'routehelperConfig'];
// Must configure via the routehelperConfigProvider
/*function routehelperConfig() {
/ * jshint validthis:true * /
this.config = {
// These are the properties we need to set
// $routeProvider: undefined
// docTitle: ''
// resolveAlways: {ready: function(){ } }
};
this.$get = function() {
return {
config: this.config
};
};
}*/
routerHelperProvider.$inject = [
'$locationProvider', '$stateProvider', '$routeProvider', '$urlRouterProvider'
];
/* @ngInject */
function routerHelperProvider($locationProvider, $stateProvider, $routeProvider, $urlRouterProvider) {
/* jshint validthis: true */
this.config = {
routeProvider: $routeProvider
};
/* jshint validthis: true */
this.$get = RouterHelper;
$locationProvider.html5Mode(true);
RouterHelper.$inject = ['$state', '$rootScope'];
/* @ngInject */
function RouterHelper($state, $rootScope) {
var hasOtherwise = false;
var service = {
configureStates: _configureStates,
getStates: _getStates
};
init();
return service;
//////////////
function _configureStates(states, otherwisePath) {
states.forEach(function(state) {
$stateProvider.state(state.state, state.config);
});
if (otherwisePath && !hasOtherwise) {
hasOtherwise = true;
$urlRouterProvider.otherwise(otherwisePath);
}
}
function _getStates() {
return $state.get();
}
function init() {
// handleRoutingErrors();
updateDocTitle();
}
function updateDocTitle() {
$rootScope.$on('$routeChangeSuccess',
function(event, current, previous) {
routeCounts.changes++;
handlingRouteChangeError = false;
var title = routerHelperProvider.config.docTitle + ' ' + (current.title || '');
$rootScope.title = title; // data bind to <title>
}
);
}
}
}
/*function routehelper($location, $rootScope, $route, logger, routehelperConfig) {
var handlingRouteChangeError = false;
var routeCounts = {
errors: 0,
changes: 0
};
var routes = [];
var $routeProvider = routehelperConfig.config.$routeProvider;
var service = {
configureRoutes: configureRoutes,
getRoutes: getRoutes,
routeCounts: routeCounts
};
// init();
return service;
///////////////
function configureRoutes(routes) {
routes.forEach(function(route) {
route.config.resolve =
angular.extend(route.config.resolve || {}, routehelperConfig.config.resolveAlways);
$routeProvider.when(route.url, route.config);
});
$routeProvider.otherwise({redirectTo: '/'});
}
function handleRoutingErrors() {
// Route cancellation:
// On routing error, go to the dashboard.
// Provide an exit clause if it tries to do it twice.
$rootScope.$on('$routeChangeError',
function(event, current, previous, rejection) {
if (handlingRouteChangeError) {
return;
}
routeCounts.errors++;
handlingRouteChangeError = true;
var destination = (current && (current.title || current.name || current.loadedTemplateUrl)) ||
'unknown target';
var msg = 'Error routing to ' + destination + '. ' + (rejection.msg || '');
logger.warning(msg, [current]);
$location.path('/');
}
);
}
function init() {
handleRoutingErrors();
updateDocTitle();
}
function getRoutes() {
for (var prop in $route.routes) {
if ($route.routes.hasOwnProperty(prop)) {
var route = $route.routes[prop];
var isRoute = !!route.title;
if (isRoute) {
routes.push(route);
}
}
}
return routes;
}
function updateDocTitle() {
$rootScope.$on('$routeChangeSuccess',
function(event, current, previous) {
routeCounts.changes++;
handlingRouteChangeError = false;
var title = routehelperConfig.config.docTitle + ' ' + (current.title || '');
$rootScope.title = title; // data bind to <title>
}
);
}
}*/
})();
(function() {
'use strict';
var core = angular.module('app.core');
core.config(toastrConfig);
/* @ngInject */
function toastrConfig(toastr) {
toastr.options.timeOut = 4000;
toastr.options.positionClass = 'toast-bottom-right';
}
var config = {
appErrorPrefix: '[NG-1.3 Error] ', //Configure the exceptionHandler decorator
appTitle: 'Angular 1.3 Demo',
imageBasePath: '/content/images/photos/',
unknownPersonImageSource: 'unknown_person.jpg',
version: '1.0.0'
};
core.value('config', config);
core.config(configure);
core.inject = ['$routeProvider'];
/* @ngInject */
function configure ($logProvider, $routeProvider, routerHelperProvider, exceptionHandlerProvider) {
// turn debugging off/on (no info or warn)
if ($logProvider.debugEnabled) {
$logProvider.debugEnabled(true);
}
// Configure the common route provider
routerHelperProvider.config.routeProvider = $routeProvider;
routerHelperProvider.config.docTitle = 'NG-1.3: ';
var resolveAlways = { /* @ngInject */
ready: function(dataservice) {
return dataservice.ready();
}
// ready: ['dataservice', function (dataservice) {
// return dataservice.ready();
// }]
};
routerHelperProvider.config.resolveAlways = resolveAlways;
// Configure the common exception handler
exceptionHandlerProvider.configure(config.appErrorPrefix);
}
})();
(function() {
'use strict';
angular
.module('app.dashboard')
.run(appRun);
/* @ngInject */
function appRun(routerHelper) {
// routerHelper.configureRoutes(getRoutes());
routerHelper.configureStates(getStates());
}
/*function getRoutes() {
return [
{
url: '/dashboard',
config: {
templateUrl: 'app/dashboard/dashboard.html',
controller: 'Dashboard',
controllerAs: 'vm',
title: 'dashboard',
settings: {
nav: 1,
content: '<i class="fa fa-dashboard"></i> Dashboard'
}
}
}
];
}*/
function getStates() {
return [
{
state: 'dashboard',
config: {
url: '/dashboard',
templateUrl: 'app/dashboard/dashboard.html',
controller: 'Dashboard',
controllerAs: 'vm',
title: 'dashboard',
settings: {
nav: 1,
content: '<i class="fa fa-dashboard"></i> Dashboard'
}
}
}
];
}
})();
<section class="mainbar" id="dashboard-view">
<section class="matter">
<div class="container">
<div class="row">
<div class="widget wblue">
<div data-cc-widget-header="data-cc-widget-header" title="{{vm.title}}"></div>
<div class="widget-content user">
<div class="list-group"><a class="list-group-item" ng-href="#/bind-once">
<Bind>Once </Bind><code ng-non-bindable="ng-non-bindable">{{::modelName}}</code></a><a class="list-group-item" ng-href="#/btc">
<Bind>to Controller </Bind><code ng-non-bindable="ng-non-bindable">{ bindToController: true }</code></a><a class="list-group-item" ng-href="#/model-options">
<Model>Options </Model><code ng-non-bindable="ng-non-bindable">ng-model-options=\"{ debounce: 2000, updateOn: 'blur' }\"</code></a><a class="list-group-item" ng-href="#/q">
<q>Constructor </q><code ng-non-bindable="ng-non-bindable">return $q(function(resolve, reject) { ... }).then(resolved).catch(rejected);</code></a><a class="list-group-item" ng-href="#/ng-hint">
<ngHint> </ngHint><code ng-non-bindable="ng-non-bindable">ng-app=\"app\" ng-hint-exclude=\"dom\"</code></a><a class="list-group-item" ng-href="#/ng-aria">
<ngAria> </ngAria><code ng-non-bindable="ng-non-bindable">...</code></a><a class="list-group-item" ng-href="#/ng-messages">
<ngMessages> </ngMessages><code ng-non-bindable="ng-non-bindable">...</code></a></div>
</div>
</div>
</div>
</div>
</section>
</section>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment