Last active
August 29, 2015 13:57
-
-
Save airtonix/9835196 to your computer and use it in GitHub Desktop.
Example angular application (in coffeescript) that seeks to highlight the potential usage of reversible routes with angular-route-segment
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
require [ | |
'angular', | |
'lodash' | |
], (angular, _) -> | |
angular.module "demo", [] | |
.config [ | |
'$locationProvider', | |
'RestangularProvider', | |
'$routeSegmentProvider', | |
'$routeProvider', | |
($locationProvider, RestangularProvider, $routeSegmentProvider, $routeProvider) -> | |
$locationProvider.hashPrefix("#!") | |
RestangularProvider.setBaseUrl 'http://fake.apiary.io/api/v1/' | |
RestangularProvider.setDefaultHttpFields 'cache', true | |
$routeSegmentProvider | |
.when '/', 'items' | |
.when '/create', 'items.create' | |
.when '/:guid', 'items.one' | |
.when '/:guid/edit', 'items.one.edit' | |
.when '/:guid/edit/photos', 'items.one.edit.photos' | |
.when '/:guid/edit/comments', 'items.one.edit.comments' | |
.when '/:guid/edit/links', 'items.one.edit.links' | |
.when '/:guid/share', 'items.one.share' | |
.when '/:guid/report', 'items.one.report' | |
.segment 'items', | |
templateUrl: '/js/items/templates/list.tpl.html' | |
controller: 'ItemListController' | |
.within() | |
.segment 'create', | |
templateUrl: '/js/items/templates/create.tpl.html' | |
controller: 'ItemCreateController' | |
.segment 'one', | |
templateUrl: '/js/items/templates/detail.tpl.html' | |
controller: 'ItemDetailController' | |
dependencies: ['guid'] | |
.within() | |
.segment 'edit', | |
templateUrl: '/js/items/templates/edit.tpl.html' | |
controller: 'ItemEditController' | |
dependencies: ['guid'] | |
.within() | |
.segment 'photos', | |
templateUrl: '/js/items/templates/edit.photos.tpl.html' | |
controller: 'ItemEditPhotosController' | |
dependencies: ['guid'] | |
.segment 'comments', | |
templateUrl: '/js/items/templates/edit.comments.tpl.html' | |
controller: 'ItemEditCommentsController' | |
dependencies: ['guid'] | |
.segment 'links', | |
templateUrl: '/js/items/templates/edit.links.tpl.html' | |
controller: 'ItemEditLinksController' | |
dependencies: ['guid'] | |
.up() | |
.segment 'share', | |
templateUrl: '/js/items/templates/share.tpl.html' | |
controller: 'ItemShareController' | |
dependencies: ['guid'] | |
.segment 'report', | |
templateUrl: '/js/items/templates/report.tpl.html' | |
controller: 'ItemReportController' | |
dependencies: ['guid'] | |
.root() | |
@ | |
] | |
.provider '$routeResolver', [ | |
'$routeSegmentProvider', | |
'$locationProvider', | |
($routeSegmentProvider, $locationProvider) -> | |
prefix = $locationProvider.hashPrefix() | |
this.$get = [ | |
'$route', | |
'$routeSegment', | |
($route, $routeSegment) -> | |
uncamel = (str, sep) -> | |
if not sep | |
sep = " " | |
str = str.replace /([A-Z])/g, sep+'$1' | |
str.toLowerCase() | |
camel = (str) -> | |
str.replace /([\:\-\_]+(.))/g, (index, separator, letter, offset) -> | |
if offset | |
return letter.toUpperCase() | |
else | |
return letter | |
service = | |
# find: ($nodes, name) -> | |
# bits = name.split '.' | |
# wantedBit = bits[0] | |
# wantMore = bits.length > 1 | |
# _.forEach $nodes, (node, key) -> | |
# if uncamel(key, "-") is wantedBit | |
# hasMore = node.children and node.children.length > 0 | |
# if wantMore and hasMore | |
# return service.find node.children, bits.join '.' | |
resolve: (name, params) -> | |
# Todo: resolve using `$routeSegmentProvider.segments` | |
# | |
if not name | |
return '' | |
route = _.find $route.routes, {segment: name} | |
if route | |
output = route.originalPath | |
if route.keys and params and _.isObject params | |
_.forEach route.keys, (key) -> | |
output = output.replace ":"+key.name, params[key.name] | |
return prefix + output | |
] | |
this | |
] | |
.controller 'ItemCreateController', [ | |
'$scope', | |
'$location', | |
'$routeResolver', | |
'Restangular', | |
($scope, $location, $routeResolver, Restangular) -> | |
# create a new item then redirect to its edit page | |
Restangular.all 'item' | |
.post().then (data) -> | |
url = $routeResolver.resolve 'item.one.edit.photos', [data.guid,] | |
$location.path url | |
] | |
.controller 'ItemListController', ['$scope', ($scope) -> ] | |
.controller 'ItemDetailController', ['$scope', ($scope) -> ] | |
.controller 'ItemEditController', ['$scope', ($scope) -> ] | |
.controller 'ItemEditPhotosController', ['$scope', ($scope) -> ] | |
.controller 'ItemEditCommentsController', ['$scope', ($scope) -> ] | |
.controller 'ItemEditLinksController', ['$scope', ($scope) -> ] | |
.controller 'ItemShareController', ['$scope', ($scope) -> ] | |
.controller 'ItemReportController', ['$scope', ($scope) -> ] |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment