-
Notifications
You must be signed in to change notification settings - Fork 4
/
Copy pathpackage.json
79 lines (79 loc) · 18 KB
/
package.json
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
{
"name": "angular-state-router",
"version": "3.2.7",
"description": "An AngularJS state-based router designed for flexibility and ease of use.",
"keywords": [
"StateRouter",
"angular",
"AngularJS",
"state",
"state machine",
"fsm",
"finite state machine",
"asynchronous",
"lazy",
"loading",
"flexible",
"lightweight"
],
"main": "src/index.js",
"scripts": {
"watch": "gulp watch",
"example": "cd example && ./run",
"test": "./node_modules/karma/bin/karma start tests/karma.conf.js --single-run --browsers PhantomJS"
},
"repository": {
"type": "git",
"url": "git+https://github.com/henrytseng/angular-state-router.git"
},
"author": {
"name": "Henry Tseng",
"email": "[email protected]",
"url": "http://www.henrytseng.com/"
},
"license": "MIT",
"bugs": {
"url": "https://github.com/henrytseng/angular-state-router/issues"
},
"homepage": "https://github.com/henrytseng/angular-state-router#readme",
"devDependencies": {
"angular": "^1.8.2",
"angular-mocks": "~1.4.1",
"browserify": "^17.0.0",
"browserify-ngannotate": "~1.0.1",
"gulp": "^4.0.2",
"gulp-if": "^3.0.0",
"gulp-jshint": "^2.1.0",
"gulp-notify": "~2.2.0",
"gulp-plumber": "~1.0.1",
"gulp-sourcemaps": "~1.5.2",
"gulp-streamify": "0.0.5",
"gulp-uglify": "^3.0.2",
"gulp-watch": "~4.2.4",
"jasmine-core": "~2.3.4",
"jshint-stylish": "~2.0.1",
"karma": "^6.3.2",
"karma-browserify": "^8.0.0",
"karma-jasmine": "~0.3.6",
"karma-phantomjs-launcher": "^1.0.4",
"karma-spec-reporter": "~0.0.19",
"phantomjs": "~2.1.1",
"phantomjs-prebuilt": "~2.1.13",
"run-sequence": "~1.1.1",
"vinyl-buffer": "~1.0.0",
"vinyl-source-stream": "~1.1.0"
},
"dependencies": {
"jquery": "^3.6.0",
"socket.io": "^4.0.1"
},
"engines": {
"node": ">= 6.2.2"
},
"readme": "StateRouter\n===========\n\n[](https://travis-ci.org/henrytseng/angular-state-router) [](https://gitter.im/henrytseng/angular-state-router?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge) \n\nAn AngularJS state-based router designed for flexibility and ease of use. \n\n[StateRouter](https://www.npmjs.com/package/angular-state-router) is designed to be used in a modular integration with components:\n\n* [StateView](https://www.npmjs.com/package/angular-state-view)\n\t* Provides nested view management with template support\n* [StateLoadable](https://www.npmjs.com/package/angular-state-loadable)\n\t* A lightweight and flexible AngularJS lazy loading scheme.\n\nWhile not required, StateRouter was originally developed with Browserify. \n\n\n\nInstallation\n------------\n\nTo install in your project, simply install from npm \n\n\tnpm install angular-state-router --save\n\n\n\nExample\n-------\n\n[See an example here](http://henrytseng.github.io/angular-state-router). \n\n\nQuick Start\n-----------\n\nInclude the `state-router.min.js` script tag in your `.html`:\n\n\t<html ng-app=\"myApp\">\n\t <head>\n\t <script src=\"/node_modules/angular/angular.min.js\"></script>\n\t <script src=\"/node_modules/angular-state-router/dist/state-router.min.js\"></script>\n\t <script src=\"/js/app.js\"></script>\n\t </head>\n\t <body>\n\t ...\n\t </body>\n\t</html>\n\nIn `app.js` add `angular-state-router` as a dependency when your application module is instantiated. \n\nAnd **define** your states and optionally an **default initial location**\n\n\tangular.module('myApp', ['angular-state-router']);\n\t .config(function($stateProvider) {\n\n\t $stateProvider\n\n\t // Define states\n\t .state('landing', {\n\t url: '/'\n\t })\n\n\t .state('products.listing', {\n\t url: '/products', \n\t params: {\n\t \tcatalog: '1b'\n\t }\n\t })\n\n\t .state('products', {\n\t url: '/products/:id'\n\t })\n\n\t .state('account', {\n\t url: '/account'\n\t })\n\n\t // Set initialization location; optionally\n\t .init('landing');\n\n\t })\n\t \n\t .controller('MyController', function($state) {\n\t \n\t \t // Get the current state\n\t var current = $state.current();\n\t \n\t });\n\n\n\nStates\n------\n\nStateRouter is design for building applications that can be represented with a [finite-state machine model](https://en.wikipedia.org/wiki/Finite-state_machine) (FSM), a computational model. \n\nStates are represented through data objects with an associated dot-notation name. Child states inherit from parent states by default. \n\n### Definition\n\nStates must be first defined. This is usually done in the angular **configuration phase** with `$stateProvider` but *can* also be done later with `$state`. \n\n\tangular.module('myApp')\n\t .config(function($stateProvider) {\n\t \n\t $stateProvider\n\t .state('account', {\n\t url: '/accounts',\n\t params: { endpoint: '2998293e' }\n\t })\n\t \n\t .state('account.profile', {\n\t url: '/accounts/:id'\n\t })\n\t \n\t .state('account.transactions', {\n\t url: '/accounts/:id/transactions',\n\t inherit: false\n\t });\n\t });\n\nOnce a state is defined a transition to the state can be made.\n\n\tangular.module('myApp')\n\t .controller('MyController', function($scope, $state) {\n\n\t $scope.buttonClick = function() {\n\t \n\t // Update\n\t $state.change('products.catalogs.items.variations', { \n\t item: '423', \n\t catalog: 'e534', \n\t variation: '320902'\n\t });\n\t \n\t };\n\t \n\t });\n\n\n\n### Initialization\n\nInitialization occurs automatically when the application is kicked-started. \n\n`$location.url()` will be checked for an initial location during initialization, if $location.url() has not been set then an alternative default initial location is used if it exists. \n\nThe initialization process is as follows:\n\n1. Configuration Phase\n\t- Define states\n\t- Optionally define \"initial location\"\n2. Run Phase\n\t- Initialization, during application kick-started\n\t- Initial state set as `$location.url()`, if not empty\n\t- Initial state falls back to \"initial location\"\n\nAn initialization `$stateInit` event is broadcasted on `$rootScope`. \n\nTo listen to the init event:\n\n\tangular.module('myApp')\n\t .controller('MyController', function($rootScope) {\n\t \n\t $rootScope.$on('$stateInit', function() {\n\t \n\t \t// Responding code\n\t \n\t });\n\t \n\t });\n\n\n\n### Usage\n\nAfter states are defined a transition can be made\n\n\t// Change state\n\t$state.change('account.profile', { employee: 'e92792-2389' });\n\nState changes are *asynchronous* operations. \n\nCurrent states can be checked using the `active` method which accepts a state notation query\n\n\t<li ng-class=\"{'active': $state.active('company') }\"><a href=\"#\" sref=\"company\">Company</a></li>\n\nAnd in the same method a state can be triggered using the `sref` attribute. \n\n\t<a href=\"#\" sref=\"company\">Company</a>\n\nParameters can be sent similarly\n\n\t<a href=\"#\" sref=\"company({id:'Lorem ipsum'})\">Company</a>\n\n\n\n### Inheritance\n\nStates inherit from each other through a parent-child relationship by default; where `campus` is the parent of `campus.classrooms` state. \n\nA child state will inherit from it's each of its parents until a `inherit` value of `false` value is encountered. \n\nFor example, given this definition\n\n\tangular.module('myApp')\n\t .config(function($stateProvider) {\n\t \n\t $stateProvider\n\t .state('campus', {\n\t url: '/campus',\n\t params: { availability: false }\n\t })\n\t \n\t .state('campus.classrooms', {\n\t url: '/campus/rms/:id',\n\t params: { size: 30 }\n\t });\n\n\t });\n\nWe see that `campus.classrooms` will have a `params` value\n\n\t{ \n\t availability: false,\n\t size: 30\n\t}\n\nWhere `availability` is inherited from `campus`, its parent\n\n\n\nResolve\n-------\n\nStates that include a resolve property will resolve all promises and store results in the `locals` Object, where they can be accessed `$state.current().locals`. \n\n\tangular.module('myApp')\n\t .config(function($stateProvider) {\n\t \n\t $stateProvider\n\t .state('stories', {\n\t url: '/storyteller/stories',\n\t \n\t resolve: {\n\t story: function(StoryService) {\n\t return StoryService.get();\n\t }\n\t\n\t }\n\t });\n\t })\n\t .controller('StoryController', function($state) {\n\t console.log($state.current().locals);\n\t });\n\t\n`locals` is has with the following value at the completion of the state transition:\n\t\n\t{\n\t story: 'Lorem ipsum'\n\t}\n\n\n\nActions\n-------\n\nStates that include an action property will execute additional actions before a . \n\n\tangular.module('myApp')\n\t .config(function($stateProvider) {\n\t \n\t $stateProvider\n\t .state('auth.logout', {\n\t url: '/logout',\n actions: [\n function(Auth, $state) {\n Auth.logout().then(function() {\n $state.change('landing');\n });\n }\n ]\n\t });\n\t });\n\t\nStates may often require additional actions to be performed during transition. These actions typically do not expose data like `resolve` property but may execute other services. \n\n\n\nEvents\n------\n\nEvents are broadcast on the `$rootScope`. \n\n\n### $stateInit\n\nThis event is emitted when $state is initialized. If an initial state is specified `$stateInit` occurs after the current state is set. \n\n\n\n### $stateChangeBegin\n\n* `request` *Object* Requested data `{ name: 'nextState', params: {} }`\n\nThis event is emitted when a requested change to a valid state exists. \n\n\n\n### $stateChangeError\n\n* `request` *Object* Requested data `{ name: 'nextState', params: {} }`\n\nThis event is emitted whenever an error occurs. \n\n\n\n### $stateChangeErrorNotFound\n\n* `request` *Object* Requested data `{ name: 'nextState', params: {} }`\n\nThis event is emitted when a state cannot be found and no parent state(s) exist. \n\n\n\n### $stateChangeErrorResolve\n\nThis event is emitted when an error occurred during resolve. \n\n\n\n### $stateChangeEnd\n\n* `request` *Object* Requested data `{ name: 'nextState', params: {} }`\n\nThis event occurs when a valid state change successfully finishes. This event does not trigger when an error was encountered. Use the `'change'` event for all change requests. \n\n\n\n### $stateReload\n\nThis event is broadcasted when the current state is reloaded. \n\n\n\n### $stateChangeComplete\n\n* `error` *Object* Null if successful, `Error` object if error occurs\n* `request` *Object* Requested data `{ name: 'nextState', params: {} }`\n\nThis event occurs when a state change is finished. This event is always triggered on any change request. Also occurs *after* 'error' is emitted. \n\n\n\nAPI Services\n------------\n\n### $stateProvider\n\n`Configuration` phase setup of StateRouter. \n\n\n### $stateProvider#options(options)\n\n* @param {Object} options A data Object\n* @return {$stateProvider} Itself; chainable\n\nSet configuration data parameters for StateRouter\n\nAvailable options include\n\n * historyLength {Number} Defaults to 5\n * initialLocation {Object} An Object{name:String, params:Object} for initial state transition\n\nChainable. \n\n\n### $stateProvider#state\n\n* @param {String} name A unique identifier for the state; using state-notation\n* @param {Object} data A state definition data Object\n* @return {$stateProvider} Itself; chainable\n\nDefine or get a state. Chainable. \n\n\n### $stateProvider#init\n\n* @param {String} name A iniital state\n* @param {Object} params A data object of params\n* @return {$stateProvider} Itself; chainable\n\nSet initialization parameters; deferred to $ready()\n\n\n### $state\n\n`Run` phase access to StateRouter. \n\n\n### $state#options\n\n* @return {Object} A configured options\n\nGet options\n\n\n### $state#state\n\n* @param {String} name A unique identifier for the state; using state-notation\n* @param {Object} data A state definition data Object\n* @return {$state} Itself; chainable\n\nSet/get state. Reloads state if current state is affected by defined state (when redefining parent or current state)\n\n\n### $state#$use\n\n* @param {Function} handler A callback, function(request, next)\n* @param {Number} priority A number denoting priority\n* @return {$state} Itself; chainable\n\nInternal method to add middleware; called during state transition\n\n\n### $state#change\n\n* @param {String} name A unique identifier for the state; using dot-notation\n* @param {Object} [params] A parameters data object\n* @return {Promise} A promise fulfilled when state change complete\n\nRequest state transition, asynchronous operation\n\n\n### $state#reload\n\n* @return {Promise} A promise fulfilled when state change occurs\n\nReload the current state. \n\n\n\n### $state#$location\n\n* @param {String} url A url matching defind states\n* @param {Function} [callback] A callback, function(err)\n* @return {$state} Itself; chainable\n\nInternal method to change state based on $location.url(), asynchronous operation using internal methods, quiet fallback. \n\n\n### $state#current\n\n* @return {Object} A copy of current state\n\nRetrieve copy of current state\n\n\n### $state#active\n\n* @param {Mixed} query A string using state notation or a RegExp\n* @param {Object} params A parameters data object\n* @return {Boolean} A true if state is parent to current state\n\nCheck query against current state\n\n\n\nAPI Directives\n--------------\n\n### sref\n\n* sref {String} A defined state to transition to, using state name notation\n\nRequest a state transition when clicked.\n\n##### Example\n\t\nA state transition to `products.items` with parameters `{catalog:'1-aeff', item:'e32537'}`\n\t\n\t<a sref=\"products.items({catalog:'1-aeff', item:'e32537'})\">Product</a>\n\n\n\nState Notation\n--------------\n\nStates use dot-notation where state names are `/[a-zA-Z0-9_]*/` strings separated by dots `.` and are case sensitive. \n\nThe following are examples of valid unique state names:\n\n\tochestra1.trombone.position.6\n\tochestra1.clarinet\n\tochestra56.clarinet\n\tochestra1\n\n\n### Parameters\n\nData Objects can be included in an expression (not query) given by Object literal notation. Using name-value pairs of Boolean/Number/String/null.\n\nThey are expressed using parenthesis `()` surrounding the Object literal at the end of a state expression. \n\n\tochestra1.trombone.position.6({id:'49829f', color:329, custom:true})\n\n\n### Queries\n\nThe following are examples of state notation queries that would match the state `ochestra1.trombone.position.6`\n\n\tochestra1\n\tochestra1.trombone\n\tochestra1.trombone.position\n\tochestra1.trombone.position.6\n\n\n### Wildcards\n\nQueries can also use wildcards `*` to match any one state or `**` to match any pattern of states following or preceding. \n\nBoth of the following will match the state `catalog.index.list`\n\n\tcatalog.*.list\n\tcatalog.**\n\n\n\nURLs\n----\n\nURLs in state definitions take the form:\n\n\t$stateProvider.state('events.details', {\n\t url: '/events/:eventid',\n\t params: {\n\t eventid: 'init'\n\t }\n\t })\n\nWhere parameters are specified in URLs using variable names starting with a colon, e.g. - `:id`. And a default value can be specified using a `params` Object. \n\nTo retrieve the current state and its parameter values use (e.g. - for example finding the value of `eventid`):\n\n\t$state.current().params.eventid\n\n\n### Query String\n\nQuery string values are also set in the params object. \n\nGiven the URL `http://test.com/#/events/birthday_event?color=blue`\n\n\tassert(params).equal({\n\t\teventid: 'birthday_event',\n\t\tcolor: 'blue'\n\t});\n\n\n\nComponents\n----------\n\nComponents register themselves as middleware layers and respond to state changes. \n\n* [StateView](https://www.npmjs.com/package/angular-state-view)\n* [StateLoadable](https://www.npmjs.com/package/angular-state-loadable)\n\n### Building a Custom Component\n\nTo build your own components simply register your the middleware with the `$state.$use()` method. \n\n`$use` expects a function signature `function(request, next)` where `request` is data Object containing data for the current state transition and `next` is a completion callback. \n\n\tangular.module('myComponent', ['angular-state-router'])\n\n\t .factory(function($state) {\n\n\t // Register middleware layer\n\t $state.$use(function(request, next) {\n\t \n\t // ... Perform work\n\t \n\t // Asynchronous completion\n\t next();\n\n\t });\n\n\t });\n\nComponent operate asynchronously and `next` must be called. \n\n\nBrowserify\n----------\n\nTo use Browserify `require` the module directly. For example:\n\n\n\n\n\nContribute\n----------\n\nIf you've got ideas on how to make StateRouter better create an issue and mark an enhancement in Github. \n\nIf there are any unreported errors please let us know. We'd like StateRouter to give as much feedback as possible to eliminate common problems that may occur during development. \n\nTo get start programming, build\n\n\tnpm install\n\tgulp\n\nTo get started watch files for programming\n\n\tgulp watch\n\nTo host the example\n\n\tnpm run-script example\n\nThen using your browser visit [http://localhost:3000/index.html](http://localhost:3000/index.html)\n\n\n\nLicense\n-------\n\nCopyright (c) 2015 Henry Tseng\n\nReleased under the MIT license. See LICENSE for details.",
"readmeFilename": "README.md",
"gitHead": "34f90aab120cb73aac4866ba4e5daee54f1c6da9",
"_id": "[email protected]",
"_shasum": "44af545f9107769a87ee23f04f33c562018c85b1",
"_from": "angular-state-router@*"
}